From 13f1fe32339a7608c2e47a054207e8a6ff935a6d Mon Sep 17 00:00:00 2001 From: James Ketrenos Date: Wed, 17 Oct 2018 21:23:05 -0700 Subject: [PATCH] Delete and Undo works from Lightbox and Thumbnail Signed-off-by: James Ketrenos --- frontend/elements/photo-thumbnail.html | 4 +- frontend/src/ketr-photos/ketr-photos.html | 107 +++++++++++++++++----- 2 files changed, 85 insertions(+), 26 deletions(-) diff --git a/frontend/elements/photo-thumbnail.html b/frontend/elements/photo-thumbnail.html index bf1fd03..e4b8520 100755 --- a/frontend/elements/photo-thumbnail.html +++ b/frontend/elements/photo-thumbnail.html @@ -145,8 +145,8 @@ thumbChanged: function(thumbpath, visible) { if (visible) { this.style.backgroundImage = "url(" + - encodeURI(thumbpath).replace(/'/g, "\\'").replace(/([\(\)])/g, "\\$1") + - ")"; + encodeURI(thumbpath).replace(/'/g, "\\'").replace(/([\(\)])/g, "\\$1") + + ")"; } else { this.style.backgroundImage = ""; } diff --git a/frontend/src/ketr-photos/ketr-photos.html b/frontend/src/ketr-photos/ketr-photos.html index 6c74975..c082222 100755 --- a/frontend/src/ketr-photos/ketr-photos.html +++ b/frontend/src/ketr-photos/ketr-photos.html @@ -1282,7 +1282,7 @@ this.processing = false; }, - _removeImageAfterFetch: function(thumbnail, callback, error, xhr) { + _removeImageAfterFetch: function(thumbnail, callback, error) { thumbnail.disabled = false; if (error) { console.log("Unable to take action on photo: " + error); @@ -1350,10 +1350,38 @@ }, undoAction: function(thumbnail) { - var params = {}; thumbnail.disabled = true; - window.fetch("api/v1/photos/" + thumbnail.item.id + "?a=undelete", - this._removeImageAfterFetch.bind(this, thumbnail, null), {}, "PUT"); + window.fetch("api/v1/photos/" + thumbnail.item.id + "?a=undelete", function(thumbnail, error) { + thumbnail.disabled = false; + + if (error) { + console.log("Unable to take action on photo: " + error); + return; + } + + /* If we are in the lightbox mode, then reload the corresponing + * 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) { + return; + } + + thumbnail = match; + } else { + console.log("Undo from thumbnail"); + } + + this._removeImageAfterFetch(thumbnail); + }.bind(this, thumbnail), {}, "PUT"); }, deleteAction: function(thumbnail) { @@ -1363,30 +1391,60 @@ console.log("TODO: Prompt user 'Are you sure?' ?"); query += "?permanent=1"; } + window.fetch("api/v1/photos/" + thumbnail.item.id + query, - this._removeImageAfterFetch.bind(this, thumbnail, function() { - /* If there is a lightbox, close the lightbox */ - this.$.lightbox.close(); - /* In duplicates mode, if an image is deleted it has the same - * effect as renaming it since it removes it from the view */ - if (this.mode != "duplicates") { + function(thumbnail, error) { + thumbnail.disabled = false; + + if (error) { + console.log("Unable to take action on photo: " + error); return; } - /* If there is now only one item with this thumbnail's name, - * remove it from the view */ - var orphan = null; - for (var i = 0; i < this.thumbnails.length; i++) { - if (this.thumbnails[i].item.filename == thumbnail.item.filename) { - if (orphan) { - return; + + /* If we are in the lightbox mode, then reload the corresponing + * 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; } - orphan = this.thumbnails[i]; } + if (!match) { + return; + } + + thumbnail = match; + } else { + console.log("Delete from thumbnail"); } - if (orphan) { - this._removeImageAfterFetch(orphan, null); - } - }.bind(this)), {}, "DELETE"); + + this._removeImageAfterFetch(thumbnail, function() { + /* If there is a lightbox, close the lightbox */ + /* In duplicates mode, if an image is deleted it has the same + * effect as renaming it since it removes it from the view */ + if (this.mode != "duplicates") { + return; + } + /* If there is now only one item with this thumbnail's name, + * remove it from the view */ + var orphan = null; + for (var i = 0; i < this.thumbnails.length; i++) { + if (this.thumbnails[i].item.filename == thumbnail.item.filename) { + if (orphan) { + return; + } + orphan = this.thumbnails[i]; + } + } + if (orphan) { + this._removeImageAfterFetch(orphan); + } + }.bind(this)); + }.bind(this, thumbnail), {}, "DELETE"); }, renameAction: function(thumbnail) { @@ -1405,7 +1463,7 @@ } } if (orphan) { - this._removeImageAfterFetch(orphan, null); + this._removeImageAfterFetch(orphan); } }.bind(this)), {}, "PUT"); }, @@ -1415,7 +1473,7 @@ thumbnail.loading = true; window.fetch("api/v1/photos/" + thumbnail.item.id + "?a=rotate&direction=" + direction, - function(thumbnail, error, xhr) { + function(thumbnail, error) { thumbnail.disabled = false; thumbnail.loading = false; @@ -1426,6 +1484,7 @@ } thumbnail.reload(); + /* If we are in the lightbox mode, then reload the corresponing * thumb in the main view as well */ if (thumbnail.tagName == "PHOTO-LIGHTBOX") {