self-hosted/pigallery2
1
0
Fork 0
mirror of https://github.com/bpatrik/pigallery2.git synced 2025-02-03 13:22:05 +02:00
Code Issues Releases Activity

code improvement

Browse Source
This commit is contained in:
Patrik J. Braun 2018-05-03 19:17:08 -04:00
parent 3f10c670f5
commit b6b0902392
42 changed files with 209 additions and 219 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/app/admin/admin.component.html
View File

@ -35,23 +35,24 @@
[switch-on-text]="text.Simplified"
[switch-handle-width]="'100'"
[switch-label-width]="'20'"
i18n-
[(ngModel)]="simplifiedMode">
</bSwitch>
</div>
</div>
</div>
<settings-basic [simplifiedMode]="simplifiedMode"></settings-basic>
<settings-usermanager></settings-usermanager>
<settings-database [simplifiedMode]="simplifiedMode"></settings-database>
<settings-thumbnail #thumbnail [hidden]="!thumbnail.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></settings-thumbnail>
<settings-search #search [hidden]="!search.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></settings-search>
<settings-share #share [hidden]="!share.hasAvailableSettings" [simplifiedMode]="simplifiedMode"></settings-share>
<settings-map #map [hidden]="!map.hasAvailableSettings" [simplifiedMode]="simplifiedMode"></settings-map>
<settings-other #other [hidden]="!other.hasAvailableSettings" [simplifiedMode]="simplifiedMode"></settings-other>
<settings-indexing #other [hidden]="!other.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></settings-indexing>
<app-settings-basic [simplifiedMode]="simplifiedMode"></app-settings-basic>
<app-settings-usermanager></app-settings-usermanager>
<app-settings-database [simplifiedMode]="simplifiedMode"></app-settings-database>
<app-settings-thumbnail #thumbnail [hidden]="!thumbnail.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></app-settings-thumbnail>
<app-settings-search #search [hidden]="!search.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></app-settings-search>
<app-settings-share #share [hidden]="!share.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></app-settings-share>
<app-settings-map #map [hidden]="!map.hasAvailableSettings" [simplifiedMode]="simplifiedMode"></app-settings-map>
<app-settings-other #other [hidden]="!other.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></app-settings-other>
<app-settings-indexing #other [hidden]="!other.hasAvailableSettings"
[simplifiedMode]="simplifiedMode"></app-settings-indexing>
</div>
</app-frame>

2
frontend/app/admin/admin.component.ts
View File

@ -7,7 +7,7 @@ import {NavigationService} from '../model/navigation.service';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'admin',
selector: 'app-admin',
templateUrl: './admin.component.html',
styleUrls: ['./admin.component.css']
})

2
frontend/app/frame/frame.component.css
View File

@ -59,7 +59,7 @@ ng2-slim-loading-bar {
background-color: transparent;
}
language {
app-language {
display: block;
margin-right: 10px;
}

2
frontend/app/frame/frame.component.html
View File

@ -36,7 +36,7 @@
</a>
</li>
<li>
<language class="navbar-btn" isDark="true"></language>
<app-language class="navbar-btn" isDark="true"></app-language>
</li>
<li *ngIf="authenticationRequired">
<button class="btn btn-default navbar-btn"

2
frontend/app/gallery/directory/directory.gallery.component.ts
View File

@ -8,7 +8,7 @@ import {Thumbnail, ThumbnailManagerService} from '../thumnailManager.service';
import {ShareService} from '../share.service';
@Component({
selector: 'gallery-directory',
selector: 'app-gallery-directory',
templateUrl: './directory.gallery.component.html',
styleUrls: ['./directory.gallery.component.css'],
providers: [RouterLink],

4
frontend/app/gallery/gallery.component.css
View File

@ -1,4 +1,4 @@
gallery-map {
app-gallery-map {
margin-right: 0;
margin-left: auto;
display: block;
@ -11,7 +11,7 @@ gallery-map {
margin-left: 2px;
}
gallery-directory {
app-gallery-directory {
margin: 2px;
display: inline-block;
}

28
frontend/app/gallery/gallery.component.html
View File

@ -13,24 +13,25 @@
</p>
</li>
<li *ngIf="showSearchBar">
<gallery-search #search></gallery-search>
<app-gallery-search #search></app-gallery-search>
</li>
<li *ngIf="showShare">
<gallery-share></gallery-share>
<app-gallery-share></app-gallery-share>
</li>
</ng-container>
<div body class="container" style="width: 100%; padding:0" *ngIf="_galleryService.content.value.directory">
<gallery-navbar [directory]="_galleryService.content.value.directory"></gallery-navbar>
<app-gallery-navbar [directory]="_galleryService.content.value.directory"></app-gallery-navbar>
<div class="directories">
<gallery-directory *ngFor="let directory of directories"
[directory]="directory"></gallery-directory>
<app-gallery-directory *ngFor="let directory of directories"
[directory]="directory"></app-gallery-directory>
</div>
<gallery-map *ngIf="isPhotoWithLocation && mapEnabled"
[photos]="_galleryService.content.value.directory.photos"></gallery-map>
<gallery-grid [photos]="_galleryService.content.value.directory.photos" [lightbox]="lightbox"></gallery-grid>
<app-gallery-map *ngIf="isPhotoWithLocation && mapEnabled"
[photos]="_galleryService.content.value.directory.photos"></app-gallery-map>
<app-gallery-grid [photos]="_galleryService.content.value.directory.photos"
[lightbox]="lightbox"></app-gallery-grid>
</div>
<div body class="container" style="width: 100%; padding:0" *ngIf="_galleryService.content.value.searchResult">
@ -51,14 +52,15 @@
</li>
</ol>
<gallery-map *ngIf="isPhotoWithLocation && mapEnabled"
[photos]="_galleryService.content.value.searchResult.photos"></gallery-map>
<app-gallery-map *ngIf="isPhotoWithLocation && mapEnabled"
[photos]="_galleryService.content.value.searchResult.photos"></app-gallery-map>
<div class="directories">
<gallery-directory *ngFor="let directory of directories"
[directory]="directory"></gallery-directory>
<app-gallery-directory *ngFor="let directory of directories"
[directory]="directory"></app-gallery-directory>
</div>
<gallery-grid [photos]="_galleryService.content.value.searchResult.photos" [lightbox]="lightbox"></gallery-grid>
<app-gallery-grid [photos]="_galleryService.content.value.searchResult.photos"
[lightbox]="lightbox"></app-gallery-grid>
</div>
<div body class="container"

12
frontend/app/gallery/grid/GridRowBuilder.ts
View File

@ -4,7 +4,7 @@ export class GridRowBuilder {
private photoRow: Array<PhotoDTO> = [];
private photoIndex: number = 0; //index of the last pushed photo to the photoRow
private photoIndex = 0; // index of the last pushed photo to the photoRow
constructor(private photos: Array<PhotoDTO>,
@ -43,13 +43,13 @@ export class GridRowBuilder {
}
public adjustRowHeightBetween(minHeight: number, maxHeight: number) {
while (this.calcRowHeight() > maxHeight && this.addPhoto() === true) { //row too high -> add more images
while (this.calcRowHeight() > maxHeight && this.addPhoto() === true) { // row too high -> add more images
}
while (this.calcRowHeight() < minHeight && this.removePhoto() === true) { //roo too small -> remove images
while (this.calcRowHeight() < minHeight && this.removePhoto() === true) { // roo too small -> remove images
}
//keep at least one photo int thr row
// keep at least one photo int thr row
if (this.photoRow.length <= 0) {
this.addPhoto();
}
@ -58,9 +58,9 @@ export class GridRowBuilder {
public calcRowHeight(): number {
let width = 0;
for (let i = 0; i < this.photoRow.length; i++) {
width += ((this.photoRow[i].metadata.size.width) / (this.photoRow[i].metadata.size.height)); //summing up aspect ratios
width += ((this.photoRow[i].metadata.size.width) / (this.photoRow[i].metadata.size.height)); // summing up aspect ratios
}
let height = (this.containerWidth - this.photoRow.length * (this.photoMargin * 2) - 1) / width; //cant be equal -> width-1
const height = (this.containerWidth - this.photoRow.length * (this.photoMargin * 2) - 1) / width; // cant be equal -> width-1
return height + (this.photoMargin * 2);
};

2
frontend/app/gallery/grid/grid.gallery.component.css
View File

@ -4,7 +4,7 @@ div {
font-size: 0;
}
gallery-grid-photo {
app-gallery-grid-photo {
display: inline-block;
cursor: pointer;

4
frontend/app/gallery/grid/grid.gallery.component.html
View File

@ -1,5 +1,5 @@
<div #gridContainer>
<gallery-grid-photo
<app-gallery-grid-photo
*ngFor="let gridPhoto of photosToRender"
(click)="lightbox.show(gridPhoto.photo)"
[gridPhoto]="gridPhoto"
@ -8,5 +8,5 @@
[style.marginLeft.px]="IMAGE_MARGIN"
[style.marginRight.px]="IMAGE_MARGIN">
</gallery-grid-photo>
</app-gallery-grid-photo>
</div>

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

@ -20,7 +20,7 @@ import {OverlayService} from '../overlay.service';
import {Config} from '../../../../common/config/public/Config';
@Component({
selector: 'gallery-grid',
selector: 'app-gallery-grid',
templateUrl: './grid.gallery.component.html',
styleUrls: ['./grid.gallery.component.css'],
})
@ -33,7 +33,7 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
@Input() lightbox: GalleryLightboxComponent;
photosToRender: Array<GridPhoto> = [];
containerWidth: number = 0;
containerWidth = 0;
public IMAGE_MARGIN = 2;
private TARGET_COL_COUNT = 5;
@ -43,6 +43,8 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
private onScrollFired = false;
private scrollbarWidth = 0;
private helperTime = null;
isAfterViewInit = false;
private renderedPhotoIndex = 0;
constructor(private overlayService: OverlayService,
private changeDetector: ChangeDetectorRef) {
@ -74,16 +76,13 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
}
this.updateContainerWidth();
this.sortPhotos();
//render the same amount of images on resize
let renderedIndex = this.renderedPhotoIndex;
// render the same amount of images on resize
const renderedIndex = this.renderedPhotoIndex;
this.clearRenderedPhotos();
this.renderPhotos(renderedIndex);
}
isAfterViewInit: boolean = false;
ngAfterViewInit() {
this.lightbox.setGridPhotoQL(this.gridPhotoQL);
@ -97,13 +96,38 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
this.isAfterViewInit = true;
}
public renderARow(): number {
if (this.renderedPhotoIndex >= this.photos.length) {
return null;
}
private sortPhotos() {
//sort pohots by date
this.photos.sort((a: PhotoDTO, b: PhotoDTO) => {
return a.metadata.creationDate - b.metadata.creationDate;
let maxRowHeight = window.innerHeight / this.MIN_ROW_COUNT;
const minRowHeight = window.innerHeight / this.MAX_ROW_COUNT;
const photoRowBuilder = new GridRowBuilder(this.photos,
this.renderedPhotoIndex,
this.IMAGE_MARGIN,
this.containerWidth - this.overlayService.getPhantomScrollbarWidth()
);
photoRowBuilder.addPhotos(this.TARGET_COL_COUNT);
photoRowBuilder.adjustRowHeightBetween(minRowHeight, maxRowHeight);
// little trick: We don't want too big single images. But if a little extra height helps fit the row, its ok
if (photoRowBuilder.getPhotoRow().length > 1) {
maxRowHeight *= 1.2;
}
const rowHeight = Math.min(photoRowBuilder.calcRowHeight(), maxRowHeight);
const imageHeight = rowHeight - (this.IMAGE_MARGIN * 2);
photoRowBuilder.getPhotoRow().forEach((photo) => {
const imageWidth = imageHeight * (photo.metadata.size.width / photo.metadata.size.height);
this.photosToRender.push(new GridPhoto(photo, imageWidth, imageHeight, this.renderedPhotoIndex));
});
this.renderedPhotoIndex += photoRowBuilder.getPhotoRow().length;
return rowHeight;
}
private clearRenderedPhotos() {
@ -112,14 +136,22 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
this.changeDetector.detectChanges();
}
private sortPhotos() {
// sort pohots by date
this.photos.sort((a: PhotoDTO, b: PhotoDTO) => {
return a.metadata.creationDate - b.metadata.creationDate;
});
}
private mergeNewPhotos() {
//merge new data with old one
// merge new data with old one
let lastSameIndex = 0;
let lastRowId = null;
for (let i = 0; i < this.photos.length && i < this.photosToRender.length; i++) {
//thIf a photo changed the whole row has to be removed
if (this.photosToRender[i].rowId != lastRowId) {
// thIf a photo changed the whole row has to be removed
if (this.photosToRender[i].rowId !== lastRowId) {
lastSameIndex = i;
lastRowId = this.photosToRender[i].rowId;
}
@ -137,30 +169,6 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
}
private renderedPhotoIndex: number = 0;
private renderPhotos(numberOfPhotos: number = 0) {
if (this.containerWidth == 0 ||
this.renderedPhotoIndex >= this.photos.length ||
!this.shouldRenderMore()) {
return;
}
let renderedContentHeight = 0;
while (this.renderedPhotoIndex < this.photos.length &&
(this.shouldRenderMore(renderedContentHeight) === true ||
this.renderedPhotoIndex < numberOfPhotos)) {
let ret = this.renderARow();
if (ret === null) {
throw new Error('Grid photos rendering failed');
}
renderedContentHeight += ret;
}
}
/**
* Returns true, if scroll is >= 70% to render more images.
* Or of onscroll rendering is off: return always to render all the images at once
@ -192,37 +200,25 @@ export class GalleryGridComponent implements OnChanges, AfterViewInit, OnDestroy
}
}
public renderARow(): number {
if (this.renderedPhotoIndex >= this.photos.length) {
return null;
private renderPhotos(numberOfPhotos: number = 0) {
if (this.containerWidth === 0 ||
this.renderedPhotoIndex >= this.photos.length ||
!this.shouldRenderMore()) {
return;
}
let maxRowHeight = window.innerHeight / this.MIN_ROW_COUNT;
let minRowHeight = window.innerHeight / this.MAX_ROW_COUNT;
let renderedContentHeight = 0;
let photoRowBuilder = new GridRowBuilder(this.photos,
this.renderedPhotoIndex,
this.IMAGE_MARGIN,
this.containerWidth - this.overlayService.getPhantomScrollbarWidth()
);
photoRowBuilder.addPhotos(this.TARGET_COL_COUNT);
photoRowBuilder.adjustRowHeightBetween(minRowHeight, maxRowHeight);
if (photoRowBuilder.getPhotoRow().length > 1) { //little trick: We don't want too big single images. But if a little extra height helps fit the row, its ok
maxRowHeight *= 1.2;
while (this.renderedPhotoIndex < this.photos.length &&
(this.shouldRenderMore(renderedContentHeight) === true ||
this.renderedPhotoIndex < numberOfPhotos)) {
const ret = this.renderARow();
if (ret === null) {
throw new Error('Grid photos rendering failed');
}
renderedContentHeight += ret;
}
let rowHeight = Math.min(photoRowBuilder.calcRowHeight(), maxRowHeight);
let imageHeight = rowHeight - (this.IMAGE_MARGIN * 2);
photoRowBuilder.getPhotoRow().forEach((photo) => {
let imageWidth = imageHeight * (photo.metadata.size.width / photo.metadata.size.height);
this.photosToRender.push(new GridPhoto(photo, imageWidth, imageHeight, this.renderedPhotoIndex));
});
this.renderedPhotoIndex += photoRowBuilder.getPhotoRow().length;
return rowHeight;
}
private updateContainerWidth(): number {

2
frontend/app/gallery/grid/photo/loading/loading.photo.grid.gallery.component.ts
View File

@ -1,7 +1,7 @@
import {Component, Input} from '@angular/core';
@Component({
selector: 'gallery-grid-photo-loading',
selector: 'app-gallery-grid-photo-loading',
templateUrl: './loading.photo.grid.gallery.component.html',
styleUrls: ['./loading.photo.grid.gallery.component.css'],
})

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

@ -1,11 +1,11 @@
<div #photoContainer class="photo-container" (mouseover)="mouseOver()" (mouseout)="mouseOut()">
<img #img [src]="thumbnail.Src" *ngIf="thumbnail.Available">
<gallery-grid-photo-loading
<app-gallery-grid-photo-loading
[error]="thumbnail.Error"
[animate]="thumbnail.loading"
*ngIf="!thumbnail.Available">
</gallery-grid-photo-loading>
</app-gallery-grid-photo-loading>
<!--Info box -->
<div #info class="info"

22
frontend/app/gallery/grid/photo/photo.grid.gallery.component.ts
View File

@ -8,7 +8,7 @@ import {Config} from '../../../../../common/config/public/Config';
import {AnimationBuilder} from '@angular/animations';
@Component({
selector: 'gallery-grid-photo',
selector: 'app-gallery-grid-photo',
templateUrl: './photo.grid.gallery.component.html',
styleUrls: ['./photo.grid.gallery.component.css'],
providers: [RouterLink]
@ -20,18 +20,6 @@ export class GalleryPhotoComponent implements IRenderable, OnInit, OnDestroy {
@ViewChild('photoContainer') container: ElementRef;
thumbnail: Thumbnail;
/*
image = {
src: '',
show: false
};
loading = {
animate: false,
show: true
};
*/
infoBar = {
marginTop: 0,
visible: false,
@ -40,7 +28,7 @@ export class GalleryPhotoComponent implements IRenderable, OnInit, OnDestroy {
animationTimer = null;
SearchTypes: any = [];
searchEnabled: boolean = true;
searchEnabled = true;
wasInView: boolean = null;
@ -71,11 +59,11 @@ export class GalleryPhotoComponent implements IRenderable, OnInit, OnDestroy {
onScroll() {
if (this.thumbnail.Available == true) {
if (this.thumbnail.Available === true) {
return;
}
let isInView = this.isInView();
if (this.wasInView != isInView) {
const isInView = this.isInView();
if (this.wasInView !== isInView) {
this.wasInView = isInView;
this.thumbnail.Visible = isInView;
}

10
frontend/app/gallery/lightbox/infopanel/info-panel.lightbox.gallery.component.ts
View File

@ -3,7 +3,7 @@ import {PhotoDTO} from '../../../../../common/entities/PhotoDTO';
import {Config} from '../../../../../common/config/public/Config';
@Component({
selector: 'info-panel',
selector: 'app-info-panel',
styleUrls: ['./info-panel.lightbox.gallery.component.css'],
templateUrl: './info-panel.lightbox.gallery.component.html',
})
@ -21,7 +21,7 @@ export class InfoPanelLightboxComponent {
}
calcFileSize() {
let postFixes = ['B', 'KB', 'MB', 'GB', 'TB'];
const postFixes = ['B', 'KB', 'MB', 'GB', 'TB'];
let index = 0;
let size = this.photo.metadata.fileSize;
while (size > 1000 && index < postFixes.length - 1) {
@ -42,7 +42,7 @@ export class InfoPanelLightboxComponent {
getDate() {
const date = new Date(this.photo.metadata.creationDate);
let locale = 'en-us';
const locale = 'en-us';
return date.toLocaleString(locale, {month: 'long'}) + ' ' + date.getDate();
}
@ -53,7 +53,7 @@ export class InfoPanelLightboxComponent {
getDay() {
const date = new Date(this.photo.metadata.creationDate);
let locale = 'en-us';
const locale = 'en-us';
return date.toLocaleString(locale, {weekday: 'long'});
}
@ -76,7 +76,7 @@ export class InfoPanelLightboxComponent {
let str = this.photo.metadata.positionData.city ||
this.photo.metadata.positionData.state;
if (str.length != 0) {
if (str.length !== 0) {
str += ', ';
}
str += this.photo.metadata.positionData.country;

4
frontend/app/gallery/lightbox/lightbox.gallery.component.css
View File

@ -9,7 +9,7 @@
cursor: pointer;
}
gallery-lightbox-photo {
app-gallery-lightbox-photo {
overflow: hidden;
}
@ -120,7 +120,7 @@ gallery-lightbox-photo {
animation: blink 3s ease-in-out infinite;
}
info-panel {
app-info-panel {
z-index: 1100; /* Sit on top */
position: fixed;
height: 100vh;

22
frontend/app/gallery/lightbox/lightbox.gallery.component.html
View File

@ -5,11 +5,11 @@
</div>
<div class="lightbox" #lightbox>
<gallery-lightbox-photo [gridPhoto]="activePhoto ? activePhoto.gridPhoto : null"
[loadImage]="!animating"
[windowAspect]="getPhotoFrameWidth()/getPhotoFrameHeight()"
#photo>
</gallery-lightbox-photo>
<app-gallery-lightbox-photo [gridPhoto]="activePhoto ? activePhoto.gridPhoto : null"
[loadImage]="!animating"
[windowAspect]="getPhotoFrameWidth()/getPhotoFrameHeight()"
#photo>
</app-gallery-lightbox-photo>
</div>
<div
(swipeleft)="nextImage()" (swiperight)="prevImage()" (swipeup)="hide()"
@ -62,11 +62,11 @@
title="fast auto play"></span>
</div>
</div>
<info-panel *ngIf="activePhoto && infoPanelVisible"
id="info-panel"
[style.width.px]="infoPanelWidth"
[photo]="activePhoto.gridPhoto.photo"
(onClose)="hideInfoPanel()">
<app-info-panel *ngIf="activePhoto && infoPanelVisible"
id="info-panel"
[style.width.px]="infoPanelWidth"
[photo]="activePhoto.gridPhoto.photo"
(onClose)="hideInfoPanel()">
</info-panel>
</app-info-panel>
</div>

4
frontend/app/gallery/lightbox/photo/photo.lightbox.gallery.component.ts
View File

@ -2,7 +2,7 @@ import {Component, ElementRef, Input, OnChanges} from '@angular/core';
import {GridPhoto} from '../../grid/GridPhoto';
@Component({
selector: 'gallery-lightbox-photo',
selector: 'app-gallery-lightbox-photo',
styleUrls: ['./photo.lightbox.gallery.component.css'],
templateUrl: './photo.lightbox.gallery.component.html'
})
@ -51,7 +51,7 @@ export class GalleryLightboxPhotoComponent implements OnChanges {
}
public showThumbnail(): boolean {
return this.gridPhoto /*&& !this.imageLoaded*/ &&
return this.gridPhoto && !this.imageLoaded &&
(this.gridPhoto.isThumbnailAvailable() || this.gridPhoto.isReplacementThumbnailAvailable());
}

20
frontend/app/gallery/map/lightbox/lightbox.map.gallery.component.ts
View File

@ -8,7 +8,7 @@ import {IconPhoto} from '../../IconPhoto';
import {Photo} from '../../Photo';
@Component({
selector: 'gallery-map-lightbox',
selector: 'app-gallery-map-lightbox',
styleUrls: ['./lightbox.map.gallery.component.css'],
templateUrl: './lightbox.map.gallery.component.html',
})
@ -32,9 +32,9 @@ export class GalleryMapLightboxComponent implements OnChanges {
private thumbnailService: ThumbnailManagerService) {
}
//TODO: fix zooming
// TODO: fix zooming
ngOnChanges() {
if (this.visible == false) {
if (this.visible === false) {
return;
}
this.showImages();
@ -70,9 +70,9 @@ export class GalleryMapLightboxComponent implements OnChanges {
public hide() {
this.fullScreenService.exitFullScreen();
let to = this.startPosition;
const to = this.startPosition;
//iff target image out of screen -> scroll to there
// iff target image out of screen -> scroll to there
if (this.getBodyScrollTop() > to.top || this.getBodyScrollTop() + this.getScreenHeight() < to.top) {
this.setBodyScrollTop(to.top);
}
@ -113,7 +113,7 @@ export class GalleryMapLightboxComponent implements OnChanges {
}
};
if (iconTh.Available == true) {
if (iconTh.Available === true) {
obj.iconUrl = iconTh.Src;
} else {
iconTh.OnLoad = () => {
@ -163,12 +163,12 @@ export class GalleryMapLightboxComponent implements OnChanges {
//noinspection JSUnusedGlobalSymbols
@HostListener('window:keydown', ['$event'])
onKeyPress(e: KeyboardEvent) {
if (this.visible != true) {
if (this.visible !== true) {
return;
}
let event: KeyboardEvent = window.event ? <any>window.event : e;
const event: KeyboardEvent = window.event ? <any>window.event : e;
switch (event.keyCode) {
case 27: //escape
case 27: // escape
this.hide();
break;
}
@ -186,6 +186,6 @@ export interface MapPhoto {
width: number;
height: number;
thumbnail: Thumbnail;
}
};
}

2
frontend/app/gallery/map/map.gallery.component.html
View File

@ -1,5 +1,5 @@
<ng-template [ngIf]="mapPhotos.length>0">
<gallery-map-lightbox [photos]="photos"></gallery-map-lightbox>
<app-gallery-map-lightbox [photos]="photos"></app-gallery-map-lightbox>
<div id="map" #map>
<agm-map
(click)="click()"

4
frontend/app/gallery/map/map.gallery.component.ts
View File

@ -4,7 +4,7 @@ import {Dimension, IRenderable} from '../../model/IRenderable';
import {GalleryMapLightboxComponent} from './lightbox/lightbox.map.gallery.component';
@Component({
selector: 'gallery-map',
selector: 'app-gallery-map',
templateUrl: './map.gallery.component.html',
styleUrls: ['./map.gallery.component.css']
})
@ -17,7 +17,7 @@ export class GalleryMapComponent implements OnChanges, IRenderable {
mapCenter = {latitude: 0, longitude: 0};
@ViewChild('map') map: ElementRef;
//TODO: fix zooming
// TODO: fix zooming
ngOnChanges() {
this.mapPhotos = this.photos.filter(p => {
return p.metadata && p.metadata.positionData && p.metadata.positionData.GPSData &&

18
frontend/app/gallery/navigator/navigator.gallery.component.ts
View File

@ -7,7 +7,7 @@ import {ShareService} from '../share.service';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'gallery-navbar',
selector: 'app-gallery-navbar',
templateUrl: './navigator.gallery.component.html',
providers: [RouterLink],
})
@ -31,12 +31,12 @@ export class GalleryNavigatorComponent implements OnChanges {
return [];
}
let path = this.directory.path.replace(new RegExp('\\\\', 'g'), '/');
const path = this.directory.path.replace(new RegExp('\\\\', 'g'), '/');
let dirs = path.split('/');
const dirs = path.split('/');
dirs.push(this.directory.name);
//removing empty strings
// removing empty strings
for (let i = 0; i < dirs.length; i++) {
if (!dirs[i] || 0 === dirs[i].length || '.' === dirs[i]) {
dirs.splice(i, 1);
@ -45,19 +45,19 @@ export class GalleryNavigatorComponent implements OnChanges {
}
const user = this._authService.user.value;
let arr: NavigatorPath[] = [];
const arr: NavigatorPath[] = [];
//create root link
if (dirs.length == 0) {
// create root link
if (dirs.length === 0) {
arr.push({name: this.i18n('Images'), route: null});
} else {
arr.push({name: this.i18n('Images'), route: UserDTO.isPathAvailable('/', user.permissions) ? '/' : null});
}
//create rest navigation
// create rest navigation
dirs.forEach((name, index) => {
const route = dirs.slice(0, dirs.indexOf(name) + 1).join('/');
if (dirs.length - 1 == index) {
if (dirs.length - 1 === index) {
arr.push({name: name, route: null});
} else {
arr.push({name: name, route: UserDTO.isPathAvailable(route, user.permissions) ? route : null});

37
frontend/app/gallery/search/search.gallery.component.ts
View File

@ -1,4 +1,4 @@
import {Component} from '@angular/core';
import {Component, OnDestroy} from '@angular/core';
import {AutoCompleteService} from './autocomplete.service';
import {AutoCompleteItem, SearchTypes} from '../../../../common/entities/AutoCompleteItem';
import {ActivatedRoute, Params, RouterLink} from '@angular/router';
@ -6,23 +6,23 @@ import {GalleryService} from '../gallery.service';
import {Config} from '../../../../common/config/public/Config';
@Component({
selector: 'gallery-search',
selector: 'app-gallery-search',
templateUrl: './search.gallery.component.html',
styleUrls: ['./search.gallery.component.css'],
providers: [AutoCompleteService, RouterLink]
})
export class GallerySearchComponent {
export class GallerySearchComponent implements OnDestroy {
autoCompleteItems: Array<AutoCompleteRenderItem> = [];
public searchText: string = '';
public searchText = '';
private cache = {
lastAutocomplete: '',
lastInstantSearch: ''
};
SearchTypes: any = [];
private subscription = null;
mouseOverAutoComplete = false;
private readonly subscription = null;
constructor(private _autoCompleteService: AutoCompleteService,
private _galleryService: GalleryService,
@ -31,8 +31,8 @@ export class GallerySearchComponent {
this.SearchTypes = SearchTypes;
this.subscription = this._route.params.subscribe((params: Params) => {
let searchText = params['searchText'];
if (searchText && searchText != '') {
const searchText = params['searchText'];
if (searchText && searchText !== '') {
this.searchText = searchText;
}
});
@ -47,14 +47,14 @@ export class GallerySearchComponent {
onSearchChange(event: KeyboardEvent) {
let searchText = (<HTMLInputElement>event.target).value.trim();
const searchText = (<HTMLInputElement>event.target).value.trim();
if (Config.Client.Search.autocompleteEnabled && this.cache.lastAutocomplete != searchText) {
if (Config.Client.Search.autocompleteEnabled && this.cache.lastAutocomplete !== searchText) {
this.cache.lastAutocomplete = searchText;
this.autocomplete(searchText);
}
if (Config.Client.Search.instantSearchEnabled && this.cache.lastInstantSearch != searchText) {
if (Config.Client.Search.instantSearchEnabled && this.cache.lastInstantSearch !== searchText) {
this.cache.lastInstantSearch = searchText;
this._galleryService.instantSearch(searchText);
}
@ -72,14 +72,13 @@ export class GallerySearchComponent {
}
mouseOverAutoComplete: boolean = false;
public setMouseOverAutoComplete(value: boolean) {
this.mouseOverAutoComplete = value;
}
public onFocusLost() {
if (this.mouseOverAutoComplete == false) {
if (this.mouseOverAutoComplete === false) {
this.autoCompleteItems = [];
}
}
@ -96,7 +95,7 @@ export class GallerySearchComponent {
if (!Config.Client.Search.autocompleteEnabled) {
return;
}
if (searchText.trim() == '.') {
if (searchText.trim() === '.') {
return;
}
@ -117,7 +116,7 @@ export class GallerySearchComponent {
private showSuggestions(suggestions: Array<AutoCompleteItem>, searchText: string) {
this.emptyAutoComplete();
suggestions.forEach((item: AutoCompleteItem) => {
let renderItem = new AutoCompleteRenderItem(item.text, searchText, item.type);
const renderItem = new AutoCompleteRenderItem(item.text, searchText, item.type);
this.autoCompleteItems.push(renderItem);
});
}
@ -129,13 +128,13 @@ export class GallerySearchComponent {
}
class AutoCompleteRenderItem {
public preText: string = '';
public highLightText: string = '';
public postText: string = '';
public preText = '';
public highLightText = '';
public postText = '';
public type: SearchTypes;
constructor(public text: string, searchText: string, type: SearchTypes) {
let preIndex = text.toLowerCase().indexOf(searchText.toLowerCase());
const preIndex = text.toLowerCase().indexOf(searchText.toLowerCase());
if (preIndex > -1) {
this.preText = text.substring(0, preIndex);
this.highLightText = text.substring(preIndex, preIndex + searchText.length);

13
frontend/app/gallery/share/share.gallery.component.ts
View File

@ -12,15 +12,15 @@ import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'gallery-share',
selector: 'app-gallery-share',
templateUrl: './share.gallery.component.html',
styleUrls: ['./share.gallery.component.css'],
})
export class GalleryShareComponent implements OnInit, OnDestroy {
@ViewChild('shareModal') public childModal: ModalDirective;
enabled: boolean = true;
url: string = '';
enabled = true;
url = '';
input = {
includeSubfolders: true,
@ -30,7 +30,7 @@ export class GalleryShareComponent implements OnInit, OnDestroy {
},
password: ''
};
currentDir: string = '';
currentDir = '';
sharing: SharingDTO = null;
contentSubscription = null;
passwordProtection = false;
@ -62,7 +62,7 @@ export class GalleryShareComponent implements OnInit, OnDestroy {
}
calcValidity() {
switch (parseInt(this.input.valid.type.toString())) {
switch (parseInt(this.input.valid.type.toString(), 10)) {
case ValidityTypes.Minutes:
return this.input.valid.amount * 1000 * 60;
case ValidityTypes.Hours:
@ -80,7 +80,8 @@ export class GalleryShareComponent implements OnInit, OnDestroy {
return;
}
this.url = 'loading..';
this.sharing = await this._sharingService.updateSharing(this.currentDir, this.sharing.id, this.input.includeSubfolders, this.input.password, this.calcValidity());
this.sharing = await this._sharingService.updateSharing(this.currentDir,
this.sharing.id, this.input.includeSubfolders, this.input.password, this.calcValidity());
this.url = Config.Client.publicUrl + '/share/' + this.sharing.sharingKey;
}

2
frontend/app/language/language.component.ts
View File

@ -4,7 +4,7 @@ import {Cookie} from 'ng2-cookies';
import {CookieNames} from '../../../common/CookieNames';
@Component({
selector: 'language',
selector: 'app-language',
templateUrl: './language.component.html',
styleUrls: ['./language.component.css'],
})

2
frontend/app/login/login.component.html
View File

@ -1,6 +1,6 @@
<div class="container">
<div class="row">
<language class="pull-right"></language>
<app-language class="pull-right"></app-language>
</div>
<div class="row title">
<h1><img src="assets/icon.png"/>{{title}}</h1>

2
frontend/app/model/network/user.service.spec.ts
View File

@ -26,7 +26,7 @@ describe('UserService', () => {
it('should call postJson at login', inject([UserService, NetworkService], (userService, networkService) => {
spyOn(networkService, 'postJson');
let credential = new LoginCredential('name', 'pass');
const credential = new LoginCredential('name', 'pass');
userService.login(credential);
expect(networkService.postJson).toHaveBeenCalled();
expect(networkService.postJson.calls.argsFor(0)).toEqual(['/user/login', {'loginCredential': credential}]);

2
frontend/app/model/network/user.service.ts
View File

@ -27,7 +27,7 @@ export class UserService {
public async getSessionUser(): Promise<UserDTO> {
await this._shareService.wait();
if (Config.Client.Sharing.enabled == true) {
if (Config.Client.Sharing.enabled === true) {
if (this._shareService.isSharing()) {
return this._networkService.getJson<UserDTO>('/user/login?sk=' + this._shareService.getSharingKey());
}

2
frontend/app/settings/_abstract/abstract.settings.component.ts
View File

@ -26,7 +26,7 @@ export abstract class SettingsComponent<T, S extends AbstractSettingsService<T>=
public error: string = null;
public changed = false;
private _subscription = null;
private _settingsSubscription = null;
private readonly _settingsSubscription = null;
public settings: T = <any>{};
public original: T = <any>{};

4
frontend/app/settings/basic/basic.settings.component.ts
View File

@ -8,7 +8,7 @@ import {BasicConfigDTO} from '../../../../common/entities/settings/BasicConfigDT
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-basic',
selector: 'app-settings-basic',
templateUrl: './basic.settings.component.html',
styleUrls: ['./basic.settings.component.css',
'./../_abstract/abstract.settings.component.css'],
@ -33,7 +33,7 @@ export class BasicSettingsComponent extends SettingsComponent<BasicConfigDTO> {
public async save(): Promise<boolean> {
const val = await super.save();
if (val == true) {
if (val === true) {
this.notification.info('Restart the server to apply the new settings');
}

6
frontend/app/settings/database/database.settings.component.ts
View File

@ -1,4 +1,4 @@
import {Component} from '@angular/core';
import {Component, OnInit} from '@angular/core';
import {AuthenticationService} from '../../model/network/authentication.service';
import {DataBaseConfig, DatabaseType} from '../../../../common/config/private/IPrivateConfig';
import {Utils} from '../../../../common/Utils';
@ -9,13 +9,13 @@ import {DatabaseSettingsService} from './database.settings.service';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-database',
selector: 'app-settings-database',
templateUrl: './database.settings.component.html',
styleUrls: ['./database.settings.component.css',
'./../_abstract/abstract.settings.component.css'],
providers: [DatabaseSettingsService],
})
export class DatabaseSettingsComponent extends SettingsComponent<DataBaseConfig> {
export class DatabaseSettingsComponent extends SettingsComponent<DataBaseConfig> implements OnInit {
public types: Array<any> = [];
public DatabaseType: any;

3
frontend/app/settings/indexing/indexing.settings.component.ts
View File

@ -12,7 +12,7 @@ import {Utils} from '../../../../common/Utils';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-indexing',
selector: 'app-settings-indexing',
templateUrl: './indexing.settings.component.html',
styleUrls: ['./indexing.settings.component.css',
'./../_abstract/abstract.settings.component.css'],
@ -47,7 +47,6 @@ export class IndexingSettingsComponent extends SettingsComponent<IndexingConfig,
this.subscription.timer.unsubscribe();
this.subscription.timer = null;
}
};
constructor(_authService: AuthenticationService,

2
frontend/app/settings/map/map.settings.component.ts
View File

@ -9,7 +9,7 @@ import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-map',
selector: 'app-settings-map',
templateUrl: './map.settings.component.html',
styleUrls: ['./map.settings.component.css',
'./../_abstract/abstract.settings.component.css'],

4
frontend/app/settings/other/other.settings.component.ts
View File

@ -8,7 +8,7 @@ import {OtherConfigDTO} from '../../../../common/entities/settings/OtherConfigDT
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-other',
selector: 'app-settings-other',
templateUrl: './other.settings.component.html',
styleUrls: ['./other.settings.component.css',
'./../_abstract/abstract.settings.component.css'],
@ -36,7 +36,7 @@ export class OtherSettingsComponent extends SettingsComponent<OtherConfigDTO> im
public async save(): Promise<boolean> {
const val = await super.save();
if (val == true) {
if (val === true) {
this.notification.info(this.i18n('Restart the server to apply the new settings'), this.i18n('Info'));
}

2
frontend/app/settings/search/search.settings.component.ts
View File

@ -8,7 +8,7 @@ import {SearchSettingsService} from './search.settings.service';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-search',
selector: 'app-settings-search',
templateUrl: './search.settings.component.html',
styleUrls: ['./search.settings.component.css',
'./../_abstract/abstract.settings.component.css'],

2
frontend/app/settings/search/search.settings.service.ts
View File

@ -13,7 +13,7 @@ export class SearchSettingsService extends AbstractSettingsService<ClientConfig.
}
public isSupported(): boolean {
return this._settingsService.settings.value.Server.database.type != DatabaseType.memory;
return this._settingsService.settings.value.Server.database.type !== DatabaseType.memory;
}
public updateSettings(settings: ClientConfig.SearchConfig): Promise<void> {

2
frontend/app/settings/share/share.settings.component.ts
View File

@ -8,7 +8,7 @@ import {ShareSettingsService} from './share.settings.service';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-share',
selector: 'app-settings-share',
templateUrl: './share.settings.component.html',
styleUrls: ['./share.settings.component.css',
'./../_abstract/abstract.settings.component.css'],

2
frontend/app/settings/share/share.settings.service.ts
View File

@ -15,7 +15,7 @@ export class ShareSettingsService extends AbstractSettingsService<ClientConfig.S
public isSupported(): boolean {
return this._settingsService.settings.value.Server.database.type != DatabaseType.memory;
return this._settingsService.settings.value.Server.database.type !== DatabaseType.memory;
}
public updateSettings(settings: ClientConfig.SharingConfig): Promise<void> {

14
frontend/app/settings/thumbnail/thumbanil.settings.component.ts
View File

@ -1,4 +1,4 @@
import {Component} from '@angular/core';
import {Component, OnInit} from '@angular/core';
import {SettingsComponent} from '../_abstract/abstract.settings.component';
import {AuthenticationService} from '../../model/network/authentication.service';
import {NavigationService} from '../../model/navigation.service';
@ -10,13 +10,15 @@ import {Utils} from '../../../../common/Utils';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-thumbnail',
selector: 'app-settings-thumbnail',
templateUrl: './thumbanil.settings.component.html',
styleUrls: ['./thumbanil.settings.component.css',
'./../_abstract/abstract.settings.component.css'],
providers: [ThumbnailSettingsService],
})
export class ThumbnailSettingsComponent extends SettingsComponent<{ server: ThumbnailConfig, client: ClientConfig.ThumbnailConfig }> {
export class ThumbnailSettingsComponent
extends SettingsComponent<{ server: ThumbnailConfig, client: ClientConfig.ThumbnailConfig }>
implements OnInit {
types: Array<any> = [];
ThumbnailProcessingLib: any;
@ -38,14 +40,16 @@ export class ThumbnailSettingsComponent extends SettingsComponent<{ server: Thum
set ThumbnailSizes(value: string) {
value = value.replace(new RegExp(',', 'g'), ';');
value = value.replace(new RegExp(' ', 'g'), ';');
this.settings.client.thumbnailSizes = value.split(';').map(s => parseInt(s)).filter(i => !isNaN(i) && i > 0);
this.settings.client.thumbnailSizes = value.split(';')
.map(s => parseInt(s, 10))
.filter(i => !isNaN(i) && i > 0);
}
ngOnInit() {
super.ngOnInit();
this.types = Utils
.enumToArray(ThumbnailProcessingLib).map((v) => {
if (v.value.toLowerCase() == 'sharp') {
if (v.value.toLowerCase() === 'sharp') {
v.value += ' ' + this.i18n('(recommended)');
}
return v;

2
frontend/app/settings/usermanager/usermanager.settings.component.ts
View File

@ -10,7 +10,7 @@ import {ErrorCodes, ErrorDTO} from '../../../../common/entities/Error';
import {I18n} from '@ngx-translate/i18n-polyfill';
@Component({
selector: 'settings-usermanager',
selector: 'app-settings-usermanager',
templateUrl: './usermanager.settings.component.html',
styleUrls: ['./usermanager.settings.component.css',
'./../_abstract/abstract.settings.component.css'],

2
frontend/app/sharelogin/share-login.component.html
View File

@ -1,7 +1,7 @@
<div class="container">
<div class="row">
<language class="pull-right"></language>
<app-language class="pull-right"></app-language>
</div>
<div class="row title">
<h1><img src="assets/icon.png"/>{{title}}</h1>

2
frontend/app/sharelogin/share-login.component.ts
View File

@ -5,7 +5,7 @@ import {Config} from '../../../common/config/public/Config';
import {NavigationService} from '../model/navigation.service';
@Component({
selector: 'share-login',
selector: 'app-share-login',
templateUrl: './share-login.component.html',
styleUrls: ['./share-login.component.css'],
})