Delete key now works in lightbox mode

Signed-off-by: James Ketrenos <james_git@ketrenos.com>

frontend/elements/photo-lightbox.html

@@ -170,6 +170,10 @@ Polymer({
     this.hasFocus = false;
   },
 
+  delete: function() {
+    this.fire("action", "delete");
+  },
+
   next: function() {
     this.fire("next");
   },
@@ -187,7 +191,17 @@ Polymer({
       return;
     }
 
+    if (this.hasFocus) {
+      e.preventDefault();
+      e.stopPropagation();
+    }
+
 		switch (e.keyCode) {
+    case 46: /* delete */
+      if (this.hasFocus) {
+        this.delete();
+      }
+      break;
     case 39: /* right */
       if (this.hasFocus) {
         this.next();
@@ -206,11 +220,6 @@ Polymer({
       console.log(e.keyCode);
 			break;
     }
-    
-    if (this.hasFocus) {
-      e.preventDefault();
-      e.stopPropagation();
-    }
   },
 
   reload: function() {

frontend/src/ketr-photos/ketr-photos.html

@@ -729,7 +729,6 @@
           this.thumbnails = [];
           this.notifyPath("thumbnails.length");
           Polymer.dom(this.$.thumbnails).innerHTML = "";
-          this.next = false;
           this.limit = undefined;
         },
 
@@ -983,16 +982,6 @@
           });
         },
 
-        findPhoto: function(photo) {
-          var photos = this.$.thumbnails.querySelectorAll("photo-thumbnail");
-          for (var i = 0; i < photos.length; i++) {
-            if (photos[i] == photo) {
-              return { index: i, photos: photos };
-            }
-          }
-          return { index: -1, photos: photos };
-        },
-
         lightBoxClose: function(event) {
           this.disableScrolling = false;
           if (this.lightBoxElement) {
@@ -1001,39 +990,50 @@
           }
         },
 
-        lightBoxNext: function(event) {
+        lightBoxSet: function(index) {
-          var results = this.findPhoto(this.lightBoxElement);
+          /* If lightBoxNext / lightBoxPrev is called after the last image
-
+           * was deleted, close the lightbox instead of trying to cycle */
-          /* If there are less than 2 rows less (2 * cols) then queue up more to load! */
+          if (index >= this.thumbnails.length) {
-          if (results.index + (this.cols * 2) >= results.photos.length && this.next) {
+            this.$.lightbox.close();
-            this.loadNextPhotos();
+          } else {
+            this.loadLightbox(this.thumbnails[index]);
           }
 
-          if (results.index == -1 || results.index + 1 >= results.photos.length) {
+          this.debounce("load-check", function() {
-            return;
+            this.triggerLoadMore();
-          }
+            this.triggerVisibilityChecks();
+          }, 150);
+        },
 
-          var photo = results.photos[results.index + 1];
+        findThumbnail: function(id) {
-          photo.scrollIntoView(false);
+          for (var i = 0; i < this.thumbnails.length; i++) {
-          this.topStickX = window.scrollX;
+            if (this.thumbnails[i].item.id == id) {
-          this.topStickY = window.scrollY;
+              return i;
-          this.loadLightbox(photo);
+            }
-          this.triggerVisibilityChecks();
+          }
+          return -1;
+        },
+
+        lightBoxNext: function() {
+          var index = this.findThumbnail(this.lightBoxElement.item.id);
+          if (index == -1 || (index + 1) >= this.thumbnails.length) {
+            index = 0;
+          } else {
+            index++;
+          }
+          this.lightBoxSet(index);
         },
 
 
-        lightBoxPrevious: function(event) {
+        lightBoxPrevious: function() {
-          var results = this.findPhoto(this.lightBoxElement);
+          var index = this.findThumbnail(this.lightBoxElement.item.id);
-          if (results.index == -1 || results.index < 1) {
+          if (index == -1 || index == 0) {
-            return;
+            index = this.thumbnails.length - 1;
+          } else {
+            index--;
           }
 
-          var photo = results.photos[results.index - 1];
+          this.lightBoxSet(index);
-          photo.scrollIntoView(false);
-          this.topStickX = window.scrollX;
-          this.topStickY = window.scrollY;
-          this.loadLightbox(photo);
-          this.triggerVisibilityChecks();
         },
 
         widthChanged: function(calcWidth) {
@@ -1065,9 +1065,13 @@
           this.lightBoxElement = el;
           this.lightBoxElement.selected = true;
           this.disableScrolling = true;
+          if (this.$.lightbox.opened) {
+            this.lightBoxElement.scrollIntoView(false);
+          } else {
+            this.$.lightbox.open();
+          }
           this.topStickX = window.scrollX;
           this.topStickY = window.scrollY;
-          this.$.lightbox.open();
 
           this.updateStyles();
         },
@@ -1364,19 +1368,17 @@
             * thumb in the main view as well */
             if (thumbnail.tagName == "PHOTO-LIGHTBOX") {
               console.log("Undo from lightbox");
-              this.$.lightbox.close();
+              var index = this.findThumbnail(thumbnail.item.id);
-              var match = null;
+              if (index == -1) {
-              for (var i = 0; i < this.thumbnails.length; i++) {
+                this.$.lightbox.close();
-                if (this.thumbnails[i].item.id == thumbnail.item.id) {
-                  match = this.thumbnails[i];
-                  break;
-                }
-              }
-              if (!match) {
                 return;
               }
-
+              thumbnail = this.thumbnails[index];
-              thumbnail = match;
+              if (this.thumbnails.length == 1) {
+                this.$.lightbox.close();
+              } else {
+                this.lightBoxNext();
+              }
             } else {
               console.log("Undo from thumbnail");
             }
@@ -1393,8 +1395,7 @@
             query += "?permanent=1";
           }
 
-          window.fetch("api/v1/photos/" + thumbnail.item.id + query, 
+          window.fetch("api/v1/photos/" + thumbnail.item.id + query, function(thumbnail, error) {
-            function(thumbnail, error) {
             thumbnail.disabled = false;
 
             if (error) {
@@ -1406,19 +1407,17 @@
             * thumb in the main view as well */
             if (thumbnail.tagName == "PHOTO-LIGHTBOX") {
               console.log("Delete from lightbox");
-              this.$.lightbox.close();
+              var index = this.findThumbnail(thumbnail.item.id);
-              var match = null;
+              if (index == -1) {
-              for (var i = 0; i < this.thumbnails.length; i++) {
+                this.$.lightbox.close();
-                if (this.thumbnails[i].item.id == thumbnail.item.id) {
-                  match = this.thumbnails[i];
-                  break;
-                }
-              }
-              if (!match) {
                 return;
               }
-
+              thumbnail = this.thumbnails[index];
-              thumbnail = match;
+              if (this.thumbnails.length == 1) {
+                this.$.lightbox.close();
+              } else {
+                this.lightBoxNext();
+              }
             } else {
               console.log("Delete from thumbnail");
             }
@@ -1526,7 +1525,6 @@
         pathTapped: function(event) {
           this.path = event.currentTarget.path;
           Polymer.dom(this.$.thumbnails).innerHTML = "";
-          this.next = false;
           this._loadAlbums();
           this._loadDays();
           this._loadPhotos();