xuthus/pigallery2
1
0
Fork 0
mirror of https://github.com/xuthus83/pigallery2.git synced 2025-01-14 14:43:17 +08:00
Code Actions Projects Activity

sorting photo to creation data and scrolling to image with lightbox close

Browse Source
This commit is contained in:
Braun Patrik 2016-05-13 21:40:04 +02:00
parent 676f8601ff
commit c3b5a3139e
4 changed files with 24 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
frontend/app/gallery/directory/directory.gallery.component.html
View File

@ -1,6 +1,3 @@
<!--<a md-raised-button class="md-raised " [routerLink]="['Gallery',{directory: getDirectoryPath()}]" aria-label="More">
<i md-icon>folder</i> {{directory.name}}
</a>-->
<a class="button " [routerLink]="['Gallery',{directory: getDirectoryPath()}]" >
{{directory.name}}
</a>

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

@ -91,6 +91,17 @@ export class GalleryGridComponent implements OnChanges,AfterViewInit {
let containerWidth = this.getContainerWidth();
this.renderedContainerWidth = containerWidth;
this.photos.sort((a:Photo, b:Photo) => {
if (a.metadata.creationDate > b.metadata.creationDate) {
return 1;
}
if (a.metadata.creationDate < b.metadata.creationDate) {
return -1;
}
// a must be equal to b
return 0;
});
this.photosToRender = [];
let i = 0;

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

@ -31,6 +31,7 @@
display: inline-block;
padding: 15px;
cursor: pointer;
font-size: x-large;
}
.navigation-arrow span {
@ -44,7 +45,6 @@
left: 0;
position: fixed;;
color: white;
font-size: x-large;
}
#rightArrow {
@ -58,11 +58,12 @@
text-align: right;
width: 100%;
padding: 5px;
font-size: large;
}
#controls span {
margin-left: 2px;
margin-right: 2px;
margin-left: 6px;
margin-right: 6px;
color: white;
cursor: pointer;
}

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

@ -136,6 +136,10 @@ export class GalleryLightboxComponent {
public hide() {
console.log("hiding");
let to = this.activePhoto.getDimension();
//iff target image out of screen -> scroll to there
if (this.getBodyScrollTop() > to.top || this.getBodyScrollTop() + this.getScreenHeight() < to.top) {
this.setBodyScrollTop(to.top);
}
to.top -= this.getBodyScrollTop();
@ -163,6 +167,7 @@ export class GalleryLightboxComponent {
let fromImage = this.calcLightBoxPhotoDimension(this.activePhoto.gridPhoto.photo).toStyle();
let toImage = {width: to.width + "px", height: to.height + "px", top: "0px", left: "0px"};
this.forceAnimateTo(fromImage,
toImage,
this.imgContainer.nativeElement.nativeElement);
@ -220,6 +225,10 @@ export class GalleryLightboxComponent {
return this.dom.getProperty(this.dom.query('body'), 'scrollTop');
}
private setBodyScrollTop(value) {
return this.dom.setProperty(this.dom.query('body'), 'scrollTop', value);
}
private getScreenWidth() {
return window.innerWidth;
}