<div class="content"> <div class="modal-header"> <h2 class="modal-title" i18n>Info</h2> <button type="button" class="close" (click)="close()" aria-label="Close"> <span class="oi oi-x" aria-hidden="true"></span> </button> </div> <div class="row"> <div class="col-2"> <span class="details-icon oi oi-image"></span> </div> <div class="col-10"> <div class="details-main dir-link" title="{{FullPath}}" [routerLink]="['/gallery', DirectoryPath]" [queryParams]="queryService.getParams()"> {{media.name}} </div> <div class="details-sub row"> <div class="col-4">{{media.metadata.size.width}} x {{media.metadata.size.height}}</div> <div class="col-4" *ngIf="isPhoto()">{{calcMpx()}}MP</div> <div class="col-4" *ngIf="media.metadata.fileSize">{{media.metadata.fileSize | fileSize}}</div> </div> </div> </div> <div class="row" *ngIf="media.metadata.creationDate"> <div class="col-2"> <span class="details-icon oi oi-calendar"></span> </div> <div class="col-10"> <div class="details-main"> {{ media.metadata.creationDate | date: (isThisYear() ? 'MMMM d' : 'longDate')}} </div> <div class="details-sub row"> <div class="col-12">{{ media.metadata.creationDate | date :'EEEE'}}, {{getTime()}}</div> </div> </div> </div> <div class="row" *ngIf="VideoData && (VideoData.duration || VideoData.bitRate)"> <div class="col-2"> <span class="details-icon oi oi-video"></span> </div> <div class="col-10"> <div class="details-main"> {{"Video"}} </div> <div class="details-sub row"> <div class="col-6" *ngIf="VideoData.duration"> <ng-container i18n>duration</ng-container> : {{VideoData.duration | duration}}</div> <div class="col-6" *ngIf="VideoData.bitRate"> <ng-container i18n>bit rate</ng-container> : {{VideoData.bitRate | fileSize}}/s </div> </div> </div> </div> <div class="row" *ngIf="CameraData"> <div class="col-2"> <span class="details-icon oi oi-camera-slr"></span> </div> <div class="col-10"> <div class="details-main"> {{CameraData.model || CameraData.make || "Camera"}} </div> <div class="details-sub row"> <div class="col-3" *ngIf="CameraData.ISO">ISO{{CameraData.ISO}}</div> <div class="col-3" *ngIf="CameraData.fStop">f/{{CameraData.fStop}}</div> <div class="col-3" *ngIf="CameraData.exposure"> {{toFraction(CameraData.exposure)}}s </div> <div class="col-3" *ngIf="CameraData.focalLength"> {{CameraData.focalLength}}mm </div> <div class="col-12" *ngIf="CameraData.lens">{{CameraData.lens}}</div> </div> </div> </div> <div class="row" *ngIf="hasPositionData()"> <div class="col-2"> <span class="details-icon oi oi-map-marker"></span> </div> <div class="col-10"> <div class="details-main"> {{getPositionText() || "Position"}} </div> <div class="details-sub row" *ngIf="hasGPS()"> <div class="col-12"> {{PositionData.GPSData.latitude.toFixed(3)}}, {{PositionData.GPSData.longitude.toFixed(3)}} </div> </div> </div> </div> <div id="map" *ngIf="hasGPS() && mapEnabled"> <yaga-map [zoom]="10" [lat]="PositionData.GPSData.latitude" [lng]="PositionData.GPSData.longitude"> <yaga-marker [lat]="PositionData.GPSData.latitude" [lng]="PositionData.GPSData.longitude"> </yaga-marker> <yaga-attribution-control prefix="" [attributions]="mapService.Attributions"> </yaga-attribution-control> <yaga-tile-layer [url]="mapService.MapLayer"></yaga-tile-layer> </yaga-map> </div> </div>