From 8fbde1f158a9177c5cb35fd5c7ccfe95bbf407c9 Mon Sep 17 00:00:00 2001
From: Robert Goldmann <deadlocker@gmx.de>
Date: Fri, 19 Mar 2021 20:32:23 +0100
Subject: [PATCH] #419 - added delete confirmation
---
src/main/resources/languages/base_de.properties | 1 +
src/main/resources/languages/base_en.properties | 1 +
src/main/resources/static/css/accounts.css | 16 ++++++++++++++++
src/main/resources/static/js/accounts.js | 10 +++++++++-
.../templates/accounts/availableImages.ftl | 4 +++-
src/main/resources/templates/helpers/header.ftl | 2 +-
6 files changed, 31 insertions(+), 3 deletions(-)
diff --git a/src/main/resources/languages/base_de.properties b/src/main/resources/languages/base_de.properties
index 05d17ec17..d7cfffcca 100644
--- a/src/main/resources/languages/base_de.properties
+++ b/src/main/resources/languages/base_de.properties
@@ -60,6 +60,7 @@ ok=OK
cancel=Abbrechen
save=Speichern
delete=Löschen
+delete.question=Löschen?
today=Heute
tagfield.placeholder=Tag hier eingeben
placeholder=Keine Daten verfügbar
diff --git a/src/main/resources/languages/base_en.properties b/src/main/resources/languages/base_en.properties
index 8313a5339..3079713e4 100644
--- a/src/main/resources/languages/base_en.properties
+++ b/src/main/resources/languages/base_en.properties
@@ -60,6 +60,7 @@ ok=OK
cancel=Cancel
save=Save
delete=Delete
+delete.question=Delete?
today=Today
tagfield.placeholder=Enter Tag here
placeholder=No data available
diff --git a/src/main/resources/static/css/accounts.css b/src/main/resources/static/css/accounts.css
index 79947dffe..dd05d9e89 100644
--- a/src/main/resources/static/css/accounts.css
+++ b/src/main/resources/static/css/accounts.css
@@ -53,3 +53,19 @@
border: 3px solid var(--color-blue);
line-height: 28px !important;
}
+
+.account-icon-option-delete span {
+ display: none;
+}
+
+.account-icon-option-delete i.left {
+ margin-right: 0;
+}
+
+.account-icon-option-delete-confirm {
+ color: var(--color-red) !important;
+}
+
+.account-icon-option-delete-confirm span {
+ display: inline-block;
+}
diff --git a/src/main/resources/static/js/accounts.js b/src/main/resources/static/js/accounts.js
index 807d7345f..ccf0a2fc5 100644
--- a/src/main/resources/static/js/accounts.js
+++ b/src/main/resources/static/js/accounts.js
@@ -84,9 +84,17 @@ function getAvailableImages(callback)
selectIcon(this);
});
+ let classDeleteConfirm = 'account-icon-option-delete-confirm';
$('.account-icon-option-delete').click(function()
{
- deleteImage(this);
+ if(this.classList.contains(classDeleteConfirm))
+ {
+ deleteImage(this);
+ }
+ else
+ {
+ this.classList.add(classDeleteConfirm);
+ }
});
callback();
diff --git a/src/main/resources/templates/accounts/availableImages.ftl b/src/main/resources/templates/accounts/availableImages.ftl
index edb3539ec..8feaa8ac8 100644
--- a/src/main/resources/templates/accounts/availableImages.ftl
+++ b/src/main/resources/templates/accounts/availableImages.ftl
@@ -1,6 +1,8 @@
<#import "/spring.ftl" as s>
<#import "../helpers/header.ftl" as header>
+<@header.globals/>
+
<#list availableImages as image>
<@imageOption image 'account-icon'/>
</#list>
@@ -10,6 +12,6 @@
<div class="${classPrefix}-option">
<img src="${image.getBase64EncodedImage()}" class="${classPrefix}-preview" data-image-id="${image.getID()}"/>
</div>
- <@header.buttonFlat url="/media/deleteImage/" + image.getID() icon='delete' localizationKey='' classes='no-padding text-default ' + classPrefix + '-option-delete' isDataUrl=true/>
+ <@header.buttonFlat url="/media/deleteImage/" + image.getID() icon='delete' localizationKey='delete.question' classes='no-padding text-default ' + classPrefix + '-option-delete' isDataUrl=true/>
</div>
</#macro>
\ No newline at end of file
diff --git a/src/main/resources/templates/helpers/header.ftl b/src/main/resources/templates/helpers/header.ftl
index f2b960b41..8a725a514 100644
--- a/src/main/resources/templates/helpers/header.ftl
+++ b/src/main/resources/templates/helpers/header.ftl
@@ -108,6 +108,6 @@
id="${id}"
class="waves-effect waves-light btn-flat ${classes}"
<#if isDataUrl>data-url="${url}"</#if>>
- <i class="material-icons left <#if !localizationKey?has_content>no-margin</#if> ${iconClasses}">${icon}</i><#if localizationKey?has_content>${locale.getString(localizationKey)}</#if>
+ <i class="material-icons left <#if !localizationKey?has_content>no-margin</#if> ${iconClasses}">${icon}</i><#if localizationKey?has_content><span>${locale.getString(localizationKey)}</span></#if>
</a>
</#macro>
\ No newline at end of file
--
GitLab