xuthus/pigallery2
1
0
Fork 0
mirror of https://github.com/xuthus83/pigallery2.git synced 2024-11-03 21:04:03 +08:00
Code Actions Projects Activity

fixing firefox scroll error

Browse Source
This commit is contained in:
Braun Patrik 2016-07-05 12:34:11 +02:00
parent d82c9eec93
commit a3a5e91145
3 changed files with 27 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
frontend/app/gallery/grid/grid.gallery.component.ts
View File

@ -40,6 +40,8 @@ export class GalleryGridComponent implements OnChanges,AfterViewInit {
private MIN_ROW_COUNT = 2; private MIN_ROW_COUNT = 2;
private MAX_ROW_COUNT = 5; private MAX_ROW_COUNT = 5;
onScrollFired = false;
constructor() { constructor() {
} }
@ -125,7 +127,7 @@ export class GalleryGridComponent implements OnChanges,AfterViewInit {
private renderedPhotoIndex:number = 0; private renderedPhotoIndex:number = 0;
private renderPhotos() { private renderPhotos() {
if (this.containerWidth == 0 || this.renderedPhotoIndex >= this.photos.length || !this.shouldRenderMore()) { if (this.containerWidth == 0 || this.renderedPhotoIndex >= this.photos.length || !this.shouldRenderMore()) {
return; return;
} }
@ -134,8 +136,11 @@ export class GalleryGridComponent implements OnChanges,AfterViewInit {
let renderedContentHeight = 0; let renderedContentHeight = 0;
while (this.renderedPhotoIndex < this.photos.length && this.shouldRenderMore(renderedContentHeight) === true) { while (this.renderedPhotoIndex < this.photos.length && this.shouldRenderMore(renderedContentHeight) === true) {
renderedContentHeight += this.renderARow(); let ret = this.renderARow();
if (ret === null) {
throw new Error("Gridphotos rendering failed");
}
renderedContentHeight += ret;
} }
} }
@ -148,27 +153,34 @@ export class GalleryGridComponent implements OnChanges,AfterViewInit {
*/ */
private shouldRenderMore(offset:number = 0):boolean { private shouldRenderMore(offset:number = 0):boolean {
return Config.Client.enableOnScrollRendering === false || return Config.Client.enableOnScrollRendering === false ||
document.body.scrollTop >= (document.body.clientHeight + offset - window.innerHeight) * 0.7 window.scrollY >= (document.body.clientHeight + offset - window.innerHeight) * 0.7
|| (document.body.clientHeight + offset) * 0.85 < window.innerHeight; || (document.body.clientHeight + offset) * 0.85 < window.innerHeight;
} }
@HostListener('window:scroll') @HostListener('window:scroll')
onScroll() { onScroll() {
this.renderPhotos(); if (!this.onScrollFired) {
window.requestAnimationFrame(() => {
this.renderPhotos();
if (Config.Client.enableOnScrollThumbnailPrioritising === true) { if (Config.Client.enableOnScrollThumbnailPrioritising === true) {
this.gridPhotoQL.toArray().forEach((pc:GalleryPhotoComponent) => { this.gridPhotoQL.toArray().forEach((pc:GalleryPhotoComponent) => {
pc.onScroll(); pc.onScroll();
});
}
this.onScrollFired = false;
}); });
this.onScrollFired = true;
} }
} }
public renderARow():number { public renderARow():number {
if (this.renderedPhotoIndex + 1 >= this.photos.length) { if (this.renderedPhotoIndex >= this.photos.length) {
return 0; return null;
} }
let maxRowHeight = window.innerHeight / this.MIN_ROW_COUNT; let maxRowHeight = window.innerHeight / this.MIN_ROW_COUNT;
let minRowHeight = window.innerHeight / this.MAX_ROW_COUNT; let minRowHeight = window.innerHeight / this.MAX_ROW_COUNT;

1
frontend/app/gallery/grid/photo/photo.grid.gallery.component.html
View File

@ -19,7 +19,6 @@
<span *ngIf="!searchEnabled">{{getPositionText()}}</span> <span *ngIf="!searchEnabled">{{getPositionText()}}</span>
</template> </template>
</div> </div>
{{gridPhoto.photo.metadata.creationDate | date:"yy-MM-dd HH:mm:ss"}}
<div class="photo-keywords"> <div class="photo-keywords">
<template ngFor let-keyword [ngForOf]="gridPhoto.photo.metadata.keywords" let-last="last"> <template ngFor let-keyword [ngForOf]="gridPhoto.photo.metadata.keywords" let-last="last">

8
frontend/app/gallery/lightbox/lightbox.gallery.component.ts
View File

@ -107,12 +107,12 @@ export class GalleryLightboxComponent {
} }
private getBodyScrollTop() { private getBodyScrollTop():number {
return this.dom.getProperty(this.dom.query('body'), 'scrollTop'); return window.scrollY;
} }
private setBodyScrollTop(value) { private setBodyScrollTop(value:number) {
return this.dom.setProperty(this.dom.query('body'), 'scrollTop', value); window.scrollTo(window.scrollX, value);
} }
private getScreenWidth() { private getScreenWidth() {