mirror of
https://github.com/xuthus83/pigallery2.git
synced 2025-01-14 14:43:17 +08:00
Add config to enable video looping fixes #544
This commit is contained in:
parent
a4cdbc9b1c
commit
594fc2e8b7
@ -1,6 +1,6 @@
|
||||
<div id="controllers-container" #root>
|
||||
<div [class.dim-controls]="controllersDimmed" class="controls-caption"
|
||||
[class.controls-nodim]="captionAlwaysOn"
|
||||
[class.controls-nodim]="lightboxService.captionAlwaysOn"
|
||||
*ngIf="Title">{{Title}}</div>
|
||||
|
||||
<div [class.dim-controls]="controllersDimmed"
|
||||
@ -59,7 +59,7 @@
|
||||
i18n-switch-on-text
|
||||
[switch-handle-width]="100"
|
||||
[switch-label-width]="20"
|
||||
[(ngModel)]="captionAlwaysOn">
|
||||
[(ngModel)]="lightboxService.captionAlwaysOn">
|
||||
</bSwitch>
|
||||
</div>
|
||||
</li>
|
||||
@ -77,7 +77,27 @@
|
||||
i18n-switch-on-text
|
||||
[switch-handle-width]="100"
|
||||
[switch-label-width]="20"
|
||||
[(ngModel)]="facesAlwaysOn">
|
||||
[(ngModel)]="lightboxService.facesAlwaysOn">
|
||||
</bSwitch>
|
||||
</div>
|
||||
</li>
|
||||
<li
|
||||
*ngIf="activePhoto && activePhoto.gridMedia.isVideo()"
|
||||
role="menuitem ">
|
||||
<div class="dropdown-item d-flex justify-content-between">
|
||||
<span title="key: l" i18n-title i18n>Play videos</span>
|
||||
<bSwitch
|
||||
class="switch ps-2"
|
||||
name="faces-switch"
|
||||
switch-on-color="success"
|
||||
[switch-inverse]="true"
|
||||
switch-off-text="once"
|
||||
switch-on-text="loop"
|
||||
i18n-switch-off-text
|
||||
i18n-switch-on-text
|
||||
[switch-handle-width]="100"
|
||||
[switch-label-width]="20"
|
||||
[(ngModel)]="lightboxService.loopVideos">
|
||||
</bSwitch>
|
||||
</div>
|
||||
</li>
|
||||
@ -110,7 +130,7 @@
|
||||
*ngIf="facesEnabled && activePhoto && activePhoto.gridMedia.Photo.metadata.faces && activePhoto.gridMedia.Photo.metadata.faces.length > 0">
|
||||
<ng-container *ngIf="searchEnabled">
|
||||
<a
|
||||
[class.controls-nodim]="facesAlwaysOn"
|
||||
[class.controls-nodim]="lightboxService.facesAlwaysOn"
|
||||
class="face"
|
||||
[routerLink]="['/search', getPersonSearchQuery(face.name)]"
|
||||
[style.top.%]="face.box.top / activePhoto.gridMedia.Photo.metadata.size.height*100"
|
||||
@ -124,7 +144,7 @@
|
||||
</ng-container>
|
||||
<ng-container *ngIf="!searchEnabled">
|
||||
<div
|
||||
[class.dim-controls]="controllersDimmed && !facesAlwaysOn"
|
||||
[class.dim-controls]="controllersDimmed && !lightboxService.facesAlwaysOn"
|
||||
class="face"
|
||||
[style.top.%]="face.box.top / activePhoto.gridMedia.Photo.metadata.size.height*100"
|
||||
[style.left.%]="face.box.left / activePhoto.gridMedia.Photo.metadata.size.width*100"
|
||||
|
@ -24,6 +24,7 @@ import {
|
||||
TextSearchQueryMatchTypes,
|
||||
} from '../../../../../../common/entities/SearchQueryDTO';
|
||||
import {AuthenticationService} from '../../../../model/network/authentication.service';
|
||||
import {LightboxService} from '../lightbox.service';
|
||||
|
||||
export enum PlayBackStates {
|
||||
Paused = 1,
|
||||
@ -57,8 +58,7 @@ export class ControlsLightboxComponent implements OnDestroy, OnInit, OnChanges {
|
||||
public playBackState: PlayBackStates = PlayBackStates.Paused;
|
||||
public PlayBackStates = PlayBackStates;
|
||||
public controllersDimmed = false;
|
||||
public captionAlwaysOn = false;
|
||||
public facesAlwaysOn = false;
|
||||
|
||||
public controllersVisible = true;
|
||||
public drag = {x: 0, y: 0};
|
||||
public SearchQueryTypes = SearchQueryTypes;
|
||||
@ -71,6 +71,7 @@ export class ControlsLightboxComponent implements OnDestroy, OnInit, OnChanges {
|
||||
private prevZoom = 1;
|
||||
|
||||
constructor(
|
||||
public lightboxService: LightboxService,
|
||||
public fullScreenService: FullScreenService,
|
||||
private authService: AuthenticationService
|
||||
) {
|
||||
@ -78,6 +79,7 @@ export class ControlsLightboxComponent implements OnDestroy, OnInit, OnChanges {
|
||||
Config.Client.Search.enabled && this.authService.canSearch();
|
||||
}
|
||||
|
||||
|
||||
public get Zoom(): number {
|
||||
return this.zoom;
|
||||
}
|
||||
@ -240,15 +242,19 @@ export class ControlsLightboxComponent implements OnDestroy, OnInit, OnChanges {
|
||||
break;
|
||||
case 'c':
|
||||
case 'C':
|
||||
this.captionAlwaysOn = !this.captionAlwaysOn;
|
||||
this.lightboxService.captionAlwaysOn = !this.lightboxService.captionAlwaysOn;
|
||||
break;
|
||||
case 'a':
|
||||
case 'A':
|
||||
this.facesAlwaysOn = !this.facesAlwaysOn;
|
||||
this.lightboxService.facesAlwaysOn = !this.lightboxService.facesAlwaysOn;
|
||||
break;
|
||||
case 'l':
|
||||
case 'L':
|
||||
this.lightboxService.loopVideos = !this.lightboxService.loopVideos;
|
||||
break;
|
||||
case 'd':
|
||||
case 'D':
|
||||
if(event.shiftKey){
|
||||
if (event.shiftKey) {
|
||||
const link = document.createElement('a');
|
||||
link.setAttribute('type', 'hidden');
|
||||
link.href = this.activePhoto.gridMedia.getMediaPath();
|
||||
|
@ -18,6 +18,7 @@
|
||||
[style.width.%]="imageSize.width"
|
||||
[style.height.%]="imageSize.height"
|
||||
(loadstart)="onImageLoad()"
|
||||
[loop]="lightboxService.loopVideos"
|
||||
autoplay
|
||||
(error)="onImageError()"
|
||||
(timeupdate)="onVideoProgress()"
|
||||
|
@ -12,6 +12,7 @@ import {MediaDTOUtils} from '../../../../../../common/entities/MediaDTO';
|
||||
import {DomSanitizer, SafeStyle} from '@angular/platform-browser';
|
||||
import {SupportedFormats} from '../../../../../../common/SupportedFormats';
|
||||
import {Config} from '../../../../../../common/config/public/Config';
|
||||
import {LightboxService} from '../lightbox.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-gallery-lightbox-media',
|
||||
@ -48,7 +49,9 @@ export class GalleryLightboxMediaComponent implements OnChanges {
|
||||
private mediaLoaded = false;
|
||||
private videoProgress = 0;
|
||||
|
||||
constructor(public elementRef: ElementRef, private sanitizer: DomSanitizer) {
|
||||
constructor(public elementRef: ElementRef,
|
||||
public lightboxService: LightboxService,
|
||||
private sanitizer: DomSanitizer) {
|
||||
}
|
||||
|
||||
get ImageTransform(): SafeStyle {
|
||||
@ -128,7 +131,7 @@ export class GalleryLightboxMediaComponent implements OnChanges {
|
||||
this.prevGirdPhoto = this.gridMedia;
|
||||
this.thumbnailSrc = null;
|
||||
this.photo.src = null;
|
||||
this.nextImage.src = "";
|
||||
this.nextImage.src = '';
|
||||
this.mediaLoaded = false;
|
||||
this.imageLoadFinished = {
|
||||
this: false,
|
||||
|
Loading…
x
Reference in New Issue
Block a user