self-hosted/pigallery2
1
0
Fork 0
mirror of https://github.com/bpatrik/pigallery2.git synced 2025-01-10 04:07:35 +02:00
Code Issues Releases Activity

Reverting: Use tap instead of click for better IOS touch navigation #493

Browse Source 
Navigator fix solves the IOS issue
This commit is contained in:
Patrik J. Braun 2022-12-18 10:15:57 +01:00
parent 48a1900fc6
commit 2d72649ac6
1 changed files with 17 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/frontend/app/ui/gallery/lightbox/controls/controls.lightbox.gallery.component.html
View File

@ -6,15 +6,14 @@
<div [class.dim-controls]="controllersDimmed"
class="controls controls-top">
<div class="controls-background">
<div class="highlight control-button"
(tap)="toggleInfoPanel.emit()"
<div class="highlight control-button" (click)="toggleInfoPanel.emit()"
title="info key: i" i18n-title>
<span class="oi oi-info"></span>
</div>
<div *ngIf="fullScreenService.isFullScreenEnabled()"
class="highlight control-button"
(tap)="toggleFullScreen.emit()"
(click)="toggleFullScreen.emit()"
title="toggle fullscreen, key: f" i18n-title>
<span class="oi oi-fullscreen-exit">
</span>
@ -22,17 +21,16 @@
<div *ngIf="!fullScreenService.isFullScreenEnabled()"
class="highlight control-button"
(tap)="toggleFullScreen.emit(true)"
(click)="toggleFullScreen.emit(true)"
title="toggle fullscreen, key: f" i18n-title>
<span class="oi oi-fullscreen-enter">
</span>
</div>
<div class="btn-group" dropdown #dropdown="bs-dropdown" [insideClick]="true">
<button id="button-basic" type="button"
<div class="btn-group" dropdown [insideClick]="true">
<button id="button-basic" dropdownToggle type="button"
class="border-0 highlight control-button"
data-bs-auto-close="outside"
(tap)="dropdown.toggle(true)"
aria-controls="dropdown-basic">
<span class="oi oi-menu"></span>
</button>
@ -120,7 +118,7 @@
</div>
<div class="highlight control-button"
(tap)="closeLightbox()"
(click)="closeLightbox()"
title="close, key: Escape" i18n-title>
<span class="oi oi-x">
@ -133,9 +131,10 @@
(swipeleft)="zoom == 1 && nextPhoto.emit()"
(swiperight)="zoom == 1 && previousPhoto.emit()"
(swipeup)="zoom == 1 && closed.emit()"
(tap)="tap($event);mediaElement.playPause()"
(tap)="tap($event)"
(pan)="pan($any($event))"
(wheel)="wheel($event)">
(wheel)="wheel($event)"
(click)="mediaElement.playPause()">
<div class="faces-container"
[style.top.px]="photoFrameDim.height/2 + drag.y"
@ -177,23 +176,23 @@
<div [class.dim-controls]="controllersDimmed" class="navigation-arrow highlight"
*ngIf="navigation.hasPrev && zoom == 1" title="key: left arrow" id="leftArrow" i18n-title
(tap)="previousPhoto.emit()"><span
(click)="previousPhoto.emit()"><span
class="oi oi-chevron-left"></span></div>
<div [class.dim-controls]="controllersDimmed" class="navigation-arrow highlight"
*ngIf="navigation.hasNext && zoom == 1" title="key: right arrow" id="rightArrow" i18n-title
(tap)="nextPhoto.emit()"><span
(click)="nextPhoto.emit()"><span
class="oi oi-chevron-right"></span></div>
<div [class.dim-controls]="controllersDimmed" class="controls controls-zoom row" *ngIf="Zoom > 1">
<div class="col-1 col-md-4">
<span (tap)="zoomOut()" i18n-title title="Zoom out, key: '-'"
<span (click)="zoomOut()" i18n-title title="Zoom out, key: '-'"
class="oi oi-zoom-out float-end"></span>
</div>
<input type="range"
[(ngModel)]="Zoom" min="1" [max]="MAX_ZOOM" step="0.1"
value="1" class="col-10 col-md-4 zoom-progress">
<div class="col-1 col-md-4">
<span (tap)="zoomIn()" i18n-title title="Zoom in, key: '+'"
<span (click)="zoomIn()" i18n-title title="Zoom in, key: '+'"
class="oi oi-zoom-in float-left"></span>
</div>
</div>
@ -205,12 +204,12 @@
<span
*ngIf="playBackState == PlayBackStates.Play"
class="oi oi-media-pause highlight control-button button-active"
(tap)="pause()"
(click)="pause()"
title="pause"></span>
<span
*ngIf="playBackState == PlayBackStates.Paused"
class="oi oi-media-play highlight control-button"
(tap)="play()"
(click)="play()"
title="auto play"></span>
</div>
</div>
@ -223,12 +222,12 @@
<div class="controls controls-video row" *ngIf="activePhoto && activePhoto.gridMedia.isVideo()">
<span class="oi col-1"
[ngClass]="!mediaElement.Paused ? 'oi-media-pause':'oi-media-play'"
(tap)="mediaElement.playPause()"></span>
(click)="mediaElement.playPause()"></span>
<input type="range" [(ngModel)]="mediaElement.VideoProgress"
min="0" max="100" step="0.1" class="col video-progress">
<span class="oi col-1"
[ngClass]="mediaElement.Muted ? 'oi-volume-off':'oi-volume-high'"
(tap)="mediaElement.mute()"></span>
(click)="mediaElement.mute()"></span>
<input type="range"
[(ngModel)]="mediaElement.VideoVolume" min="0" max="1" step="0.1"
value="1" class="col-2 col-md-1 volume">