1
0
mirror of https://github.com/xuthus83/pigallery2.git synced 2024-11-03 21:04:03 +08:00
pigallery2/frontend/app/gallery/grid/photo/photo.grid.gallery.component.html
2017-07-16 17:15:42 +02:00

38 lines
1.5 KiB
HTML

<div #photoContainer class="photo-container" (mouseover)="mouseOver()" (mouseout)="mouseOut()">
<img #img [src]="thumbnail.Src" *ngIf="thumbnail.Available">
<gallery-grid-photo-loading
[animate]="thumbnail.loading"
*ngIf="!thumbnail.Available">
</gallery-grid-photo-loading>
<!--Info box -->
<div #info class="info"
*ngIf="infoBar.visible"
[style.margin-top.px]="infoBar.marginTop"
[style.background]="infoBar.background">
<div class="photo-name">{{gridPhoto.photo.name}}</div>
<div class="photo-position" *ngIf="gridPhoto.photo.metadata.positionData">
<span class="glyphicon glyphicon-map-marker"></span>
<ng-template [ngIf]="getPositionText()">
<a [routerLink]="['/search', getPositionText(), {type:SearchTypes[SearchTypes.position]}]"
*ngIf="searchEnabled">
{{getPositionText()}}
</a>
<span *ngIf="!searchEnabled">{{getPositionText()}}</span>
</ng-template>
</div>
<div class="photo-keywords" *ngIf="gridPhoto.photo.metadata.keywords && gridPhoto.photo.metadata.keywords.length">
<ng-template ngFor let-keyword [ngForOf]="gridPhoto.photo.metadata.keywords" let-last="last">
<a *ngIf="searchEnabled"
[routerLink]="['/search', keyword, {type: SearchTypes[SearchTypes.keyword]}]">#{{keyword}}</a>
<span *ngIf="!searchEnabled">#{{keyword}}</span>
<ng-template [ngIf]="!last">,</ng-template>
</ng-template>
</div>
</div>
</div>