From 9e99aa72e3cc43f3e0c0b14df0719c50af571fe1 Mon Sep 17 00:00:00 2001 From: marsooooo Date: Tue, 11 Jun 2024 01:23:06 +0200 Subject: [PATCH] Update interface --- admin/themes/default/js/batchManagerUnit.js | 127 +++++++++++++----- .../default/template/batch_manager_unit.tpl | 74 ++++++++-- 2 files changed, 160 insertions(+), 41 deletions(-) diff --git a/admin/themes/default/js/batchManagerUnit.js b/admin/themes/default/js/batchManagerUnit.js index 3172f0fc6..3d123576d 100644 --- a/admin/themes/default/js/batchManagerUnit.js +++ b/admin/themes/default/js/batchManagerUnit.js @@ -1,37 +1,104 @@ $(document).ready(function () { + //Detect unsaved changes + var user_interacted = false; - //DELETE FUNCTION - $('#action-delete-picture').on('click', function() { - var pictureId = $(this).parents("fieldset").data("image_id") - var this_url_delete = window["url_delete_" + pictureId]; - console.log(pictureId + " - " + this_url_delete); - $.confirm({ - title: str_are_you_sure, - draggable: false, - titleClass: "groupDeleteConfirm", - theme: "modern", - content: "", - animation: "zoom", - boxWidth: '30%', - useBootstrap: false, - type: 'red', - animateFromElement: false, - backgroundDismiss: true, - typeAnimated: false, - buttons: { - confirm: { - text: str_yes, - btnClass: 'btn-red', - action: function () { - window.location.href = this_url_delete.replaceAll('amp;', ''); - } - }, - cancel: { - text: str_no - } + $('input, textarea, select').on('focus', function() { + user_interacted = true; + }); + $('input, textarea, select').on('change', function() { + if(user_interacted == true) + { + showUnsavedBadge(); + console.log("change seen") } + }); + function showUnsavedBadge() { + $('#global-unsaved-badge').css('visibility', 'visible'); + + } + + function hideUnsavedBadge() { //Implement with validation system + $('#global-unsaved-badge').css('visibility', 'hidden'); + } + + $(window).on('beforeunload', function() { + if (user_interacted) { + return "You have unsaved changes, are you sure you want to leave this page ?"; + } + }); + +//DELETE + $('.action-delete-picture').on('click', function(event) { + var $fieldset = $(this).parents("fieldset"); + var pictureId = $fieldset.data("image_id"); + + console.log(pictureId); + + $.confirm({ + title: str_are_you_sure, + draggable: false, + titleClass: "groupDeleteConfirm", + theme: "modern", + content: "", + animation: "zoom", + boxWidth: '30%', + useBootstrap: false, + type: 'red', + animateFromElement: false, + backgroundDismiss: true, + typeAnimated: false, + buttons: { + confirm: { + text: str_yes, + btnClass: 'btn-red', + action: function () { + var image_ids = [pictureId]; + + (function(ids) { + $.ajax({ + type: 'POST', + url: 'ws.php?format=json', + data: { + method: "pwg.images.delete", + pwg_token: jQuery("input[name=pwg_token]").val(), + image_id: ids.join(',') + }, + dataType: 'json', + success: function(data) { + var isOk = data.stat && data.stat === "ok"; + if (isOk) { + console.log("Success"); + $fieldset.remove(); + $('.pagination-container').css({ + 'pointer-events': 'none', + 'opacity': '0.5' + }); + $('.button-reload').css('visibility', 'visible'); + $('div[data-image_id="' + pictureId + '"]').css('display', 'flex'); + + } else { + console.log("Not all images were deleted successfully"); + } + }, + error: function(data) { + console.error("Error occurred"); + } + }); + })(image_ids); + + image_ids = []; + } + }, + cancel: { + text: str_no + } + } }); - }) +}); + + + +//Categories $(".linked-albums.add-item").on("click", function () { var pictureId = $(this).parents("fieldset").data("image_id") diff --git a/admin/themes/default/template/batch_manager_unit.tpl b/admin/themes/default/template/batch_manager_unit.tpl index 86df67f21..57545afd4 100644 --- a/admin/themes/default/template/batch_manager_unit.tpl +++ b/admin/themes/default/template/batch_manager_unit.tpl @@ -106,15 +106,20 @@ var sliders = {
+
+ {'photos per page'|@translate} : + 5 + 10 + 50 +
- {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} + +
+ {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if}
-
- {'photos per page'|@translate} : - 5 - 10 - 50
+ +
@@ -326,7 +331,7 @@ var sliders = { {/footer_script} {debug} - +
imagename @@ -338,7 +343,7 @@ var sliders = { {if !url_is_remote($element.PATH)} - + {/if}
@@ -452,7 +457,22 @@ var sliders = {
{/foreach} -{if !empty($navbar)}{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} +
+
+ {'photos per page'|@translate} : + 5 + 10 + 50 +
+
+ +
+ {if !empty($navbar) }{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if} +
+
+ + +
{/if}

@@ -461,6 +481,7 @@ var sliders = {
+
@@ -665,7 +686,7 @@ var sliders = { .calendar-input{ display: flex; border-radius: 2px; - padding: 0 7px; + padding-left: 7px; border: 1px solid #D3D3D3; background: #FFF; align-items: center; @@ -716,12 +737,14 @@ var sliders = { font-weight: bold; } .bottom-save-bar{ + display:flex; + flex-direction: row; position: fixed; bottom: 0; right: 0; width: calc(100% - 205px); background-color: #ffffff; - text-align: right; + justify-content: flex-end; z-index: 101; border-top: 1px solid #CCCCCC; } @@ -731,4 +754,33 @@ var sliders = { margin-right: 2%; } +.badge-container { + display: inline-block; + text-align: right; + margin-right: 2%; +} +.badge-container p{ + padding: 5px 10px; + border-radius: 100px; + background-color: #FADDA2; + color: #E18C32; + margin: 10px 0 !important; +} + +.pagination-reload{ + display: flex; + flex-direction: row; +} + +.deleted-element{ + display:flex; + justify-content: center; + box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); + background-color:#3C3C3C; + color: #FFFFFF; + padding:0px; + margin: 1.5em !important; + border-radius: 4px; +} +