self-hosted/pigallery2
1
0
Fork 0
mirror of https://github.com/bpatrik/pigallery2.git synced 2024-12-02 09:12:07 +02:00
Code Issues Releases Activity

Merge pull request #286 from mcdamo/feature/directory-layout-device-detection

Browse Source 
Add device detection for portrait mode in directories listing
This commit is contained in:
Patrik J. Braun 2021-05-06 12:46:32 +02:00 committed by GitHub
commit f1c46c5b75
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
package-lock.json generated
View File

@ -14027,6 +14027,21 @@
}
}
},
"ngx-device-detector": {
"version": "2.0.9",
"resolved": "https://registry.npmjs.org/ngx-device-detector/-/ngx-device-detector-2.0.9.tgz",
"integrity": "sha512-bsAO7w7REwHPTF1p4MrZJFqsNJLW8vnIcNhYDQxwFwZe3JOpIEcV0VebJCIG0HzkLg3/YlVsatTnXkErw111BA==",
"requires": {
"tslib": "^2.0.0"
},
"dependencies": {
"tslib": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz",
"integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w=="
}
}
},
"ngx-toastr": {
"version": "13.2.1",
"resolved": "https://registry.npmjs.org/ngx-toastr/-/ngx-toastr-13.2.1.tgz",

1
package.json
View File

@ -47,6 +47,7 @@
"image-size": "0.9.7",
"jimp": "0.16.1",
"locale": "0.1.0",
"ngx-device-detector": "^2.0.9",
"node-geocoder": "3.27.0",
"reflect-metadata": "0.1.13",
"sharp": "0.23.4",

7
src/frontend/app/ui/gallery/directories/directories.component.ts
View File

@ -1,4 +1,5 @@
import {Component, ElementRef, Input, OnChanges} from '@angular/core';
import { DeviceDetectorService } from 'ngx-device-detector';
import {DirectoryDTO} from '../../../../../common/entities/DirectoryDTO';
@Component({
@ -10,8 +11,10 @@ export class DirectoriesComponent implements OnChanges {
@Input() directories: DirectoryDTO[];
size: number;
isDesktop: boolean;
constructor(private container: ElementRef) {
constructor(private container: ElementRef, private deviceService: DeviceDetectorService) {
this.isDesktop = this.deviceService.isDesktop();
}
ngOnChanges(): void {
@ -19,7 +22,7 @@ export class DirectoriesComponent implements OnChanges {
}
private updateSize(): void {
if (window.innerWidth < window.innerHeight) {
if (!this.isDesktop && window.innerWidth < window.innerHeight) {
// On portrait mode, show 2 directories side by side with some padding
this.size = Math.round(window.innerWidth / 2) - 25;
} else {