diff --git a/frontend/elements/photo-lightbox.html b/frontend/elements/photo-lightbox.html
index 1fa2123..7e1f238 100644
--- a/frontend/elements/photo-lightbox.html
+++ b/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() {
diff --git a/frontend/src/ketr-photos/ketr-photos.html b/frontend/src/ketr-photos/ketr-photos.html
index e961242..fbcb875 100755
--- a/frontend/src/ketr-photos/ketr-photos.html
+++ b/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) {
- var results = this.findPhoto(this.lightBoxElement);
-
- /* If there are less than 2 rows less (2 * cols) then queue up more to load! */
- if (results.index + (this.cols * 2) >= results.photos.length && this.next) {
- this.loadNextPhotos();
+ lightBoxSet: function(index) {
+ /* If lightBoxNext / lightBoxPrev is called after the last image
+ * was deleted, close the lightbox instead of trying to cycle */
+ if (index >= this.thumbnails.length) {
+ this.$.lightbox.close();
+ } else {
+ this.loadLightbox(this.thumbnails[index]);
}
- if (results.index == -1 || results.index + 1 >= results.photos.length) {
- return;
- }
+ this.debounce("load-check", function() {
+ this.triggerLoadMore();
+ this.triggerVisibilityChecks();
+ }, 150);
+ },
- var photo = results.photos[results.index + 1];
- photo.scrollIntoView(false);
- this.topStickX = window.scrollX;
- this.topStickY = window.scrollY;
- this.loadLightbox(photo);
- this.triggerVisibilityChecks();
+ findThumbnail: function(id) {
+ for (var i = 0; i < this.thumbnails.length; i++) {
+ if (this.thumbnails[i].item.id == id) {
+ return i;
+ }
+ }
+ 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) {
- var results = this.findPhoto(this.lightBoxElement);
- if (results.index == -1 || results.index < 1) {
- return;
+ lightBoxPrevious: function() {
+ var index = this.findThumbnail(this.lightBoxElement.item.id);
+ if (index == -1 || index == 0) {
+ index = this.thumbnails.length - 1;
+ } else {
+ index--;
}
- var photo = results.photos[results.index - 1];
- photo.scrollIntoView(false);
- this.topStickX = window.scrollX;
- this.topStickY = window.scrollY;
- this.loadLightbox(photo);
- this.triggerVisibilityChecks();
+ this.lightBoxSet(index);
},
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 match = null;
- for (var i = 0; i < this.thumbnails.length; i++) {
- if (this.thumbnails[i].item.id == thumbnail.item.id) {
- match = this.thumbnails[i];
- break;
- }
- }
- if (!match) {
+ var index = this.findThumbnail(thumbnail.item.id);
+ if (index == -1) {
+ this.$.lightbox.close();
return;
}
-
- thumbnail = match;
+ thumbnail = this.thumbnails[index];
+ 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,
- function(thumbnail, error) {
+ window.fetch("api/v1/photos/" + thumbnail.item.id + query, 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 match = null;
- for (var i = 0; i < this.thumbnails.length; i++) {
- if (this.thumbnails[i].item.id == thumbnail.item.id) {
- match = this.thumbnails[i];
- break;
- }
- }
- if (!match) {
+ var index = this.findThumbnail(thumbnail.item.id);
+ if (index == -1) {
+ this.$.lightbox.close();
return;
}
-
- thumbnail = match;
+ thumbnail = this.thumbnails[index];
+ 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();