* gallery view has album view image sorting implemented

* album export implemented

src/app/gallery/album/album.component.html

@@ -1,5 +1,5 @@
 <div class="main container">
-  <h1>{{album.name}}<span class="align right"><a [routerLink]="['']">back to album list</a></span></h1>
+  <h1>{{album.name}}<span class="align right"><a [href]="exportUrl">Export</a> * <a [routerLink]="['']">Back to album list</a></span></h1>
   <div class="row images">
     <app-thumbnail *ngFor="let thumbnail of thumbnailsLeft"
                    [image]="thumbnail.image"

src/app/gallery/album/album.component.ts

@@ -1,8 +1,8 @@
 import {Component, OnInit} from '@angular/core';
-
-import {Album} from "../shared/album.model";
 import {ActivatedRoute} from "@angular/router";
 import {Title} from "@angular/platform-browser";
+
+import {Album} from "../shared/album.model";
 import {DisplayImageService} from "../display-image/display-image.service";
 import {environment} from "../../../environments/environment";
 import {Image} from "../shared/image.model";
@@ -79,6 +79,10 @@ export class AlbumComponent implements OnInit {
     });
   }
 
+  public get exportUrl(): string {
+    return environment.apiUrl + `/export-album/${this.album.slug}`;
+  }
+
   private imageUrl(image: Image): string {
     return environment.apiUrl + `/image/${this.route.snapshot.params.slug}/${image.path}/thumb`;
   }

src/app/gallery/gallery/gallery.component.ts

@@ -6,6 +6,11 @@ import {ActivatedRoute} from "@angular/router";
 import {environment} from "../../../environments/environment";
 import {Thumbnail} from "../shared/thumbnail.model";
 
+const IDX_LEFT = 0;
+const IDX_MIDDLE = 1;
+const IDX_RIGHT = 2;
+const THUMB_MARGIN = 10;
+
 @Component({
   selector: 'app-gallery',
   templateUrl: './gallery.component.html',
@@ -14,7 +19,14 @@ import {Thumbnail} from "../shared/thumbnail.model";
 export class GalleryComponent implements OnInit {
 
   public albums: Array<Album> = [];
-  private thumbnails: Array<Thumbnail>;
+
+  private leftHeight: number = 0;
+  private middleHeight: number = 0;
+  private rightHeight: number = 0;
+
+  public thumbnailsLeft: Array<Thumbnail> = [];
+  public thumbnailsMiddle: Array<Thumbnail> = [];
+  public thumbnailsRight: Array<Thumbnail> = [];
 
   constructor(private titleService: Title,
               private route: ActivatedRoute) {
@@ -24,12 +36,12 @@ export class GalleryComponent implements OnInit {
     this.titleService.setTitle('Albums - photos.yvan.hu');
     this.route.data.subscribe((data: { albums: Array<Album> }) => {
       this.albums = data.albums.filter(album => album.isPublic).reverse();
-      this.thumbnails = this.initThumbnails();
+      this.initThumbnails();
     });
   }
 
-  private initThumbnails(): Array<Thumbnail> {
+  private initThumbnails() {
-    return this.albums.map(album => <Thumbnail>{
+    this.albums.map(album => <Thumbnail>{
       slug: album.slug,
       image: this.imageUrl(album),
       label: {
@@ -37,36 +49,27 @@ export class GalleryComponent implements OnInit {
         extraRight: album.images.length + ' images',
         extraLeft: album.date,
       },
+      height: album.coverImage.thumbHeight,
+    }).map(thumbnail => {
+      let heights = [this.leftHeight, this.middleHeight, this.rightHeight];
+      let idx = heights.reduce((low, nxt, idx) => nxt < heights[low] ? idx : low, 0);
+      switch(idx) {
+        case IDX_LEFT:
+          this.thumbnailsLeft.push(thumbnail);
+          this.leftHeight += thumbnail.height + THUMB_MARGIN;
+          break;
+        case IDX_MIDDLE:
+          this.thumbnailsMiddle.push(thumbnail);
+          this.middleHeight += thumbnail.height + THUMB_MARGIN;
+          break;
+        case IDX_RIGHT:
+          this.thumbnailsRight.push(thumbnail);
+          this.rightHeight += thumbnail.height + THUMB_MARGIN;
+          break;
+      }
     });
   }
 
-  get thumbnailsLeft(): Array<Thumbnail> {
-    let thumbs = [];
-    for (let i=0;i<this.thumbnails.length; i=i+3) {
-      thumbs.push(this.thumbnails[i]);
-
-    }
-    return thumbs;
-  }
-
-  get thumbnailsMiddle(): Array<Thumbnail> {
-    let thumbs = [];
-    for (let i=1;i<this.thumbnails.length; i=i+3) {
-      thumbs.push(this.thumbnails[i]);
-
-    }
-    return thumbs;
-  }
-
-  get thumbnailsRight(): Array<Thumbnail> {
-    let thumbs = [];
-    for (let i=2;i<this.thumbnails.length; i=i+3) {
-      thumbs.push(this.thumbnails[i]);
-
-    }
-    return thumbs;
-  }
-
   private imageUrl(album: Album): string {
     return environment.apiUrl + `/image/${album.slug}/${album.coverImage.path}/thumb`;
   }