adam/Piwigo
1
0
Fork 0
mirror of https://github.com/Piwigo/Piwigo.git synced 2026-07-13 21:31:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

Added image delete mechanism

Browse Source 
Added Delete validation (Work in progress)
Fixed bottom bar width
This commit is contained in:
marsooooo
2024-06-04 17:44:23 +02:00
parent 59223f6901
commit 4979edcdf8
2 changed files with 355 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/themes/default/js/batchManagerUnit.js
+107 -1
View File
@@ -1,5 +1,38 @@
$(document).ready(function () {
//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
}
}
});
})
$(".linked-albums.add-item").on("click", function () {
var pictureId = $(this).parents("fieldset").data("image_id")
linked_albums_open(pictureId);
@@ -119,6 +152,9 @@ function fill_results(cats, pictureId) {
$("#"+pictureId+" .orphan-photo").hide();
}
}
// $(function () {
// $('.privacy-filter-slider').each(function() {
// var id = $(this).attr('id');
@@ -138,4 +174,74 @@ function fill_results(cats, pictureId) {
// function updateCertificationFilterLabel(value, id) {
// let label = strs_privacy[value];
// $('#' + id + ' .privacy').html(label);
// }
// }
/* ********** Filters*/
// function filter_enable(filter) {
// /* show the filter*/
// $("#"+filter).show();
// /* check the checkbox to declare we use this filter */
// $("input[type=checkbox][name="+filter+"_use]").prop("checked", true);
// /* forbid to select this filter in the addFilter list */
// $("#addFilter").find("a[data-value="+filter+"]").addClass("disabled", "disabled");
// /* hide the no filter message */
// $('.noFilter').hide();
// $('.addFilter-button').removeClass('highlight');
// }
// function filter_disable(filter) {
// /* hide the filter line */
// $("#"+filter).hide();
// /* uncheck the checkbox to declare we do not use this filter */
// $("input[name="+filter+"_use]").prop("checked", false);
// /* give the possibility to show it again */
// $("#addFilter").find("a[data-value="+filter+"]").removeClass("disabled");
// /* show the no filter message if no filter selected */
// if ($('#filterList li:visible').length == 0) {
// $('.noFilter').show();
// $('.addFilter-button').addClass('highlight');
// }
// }
// $(".removeFilter").addClass("icon-cancel-circled");
// $(".removeFilter").click(function () {
// var filter = $(this).parent('li').attr("id");
// filter_disable(filter);
// return false;
// });
// $("#addFilter a").on('click', function () {
// var filter = $(this).attr("data-value");
// filter_enable(filter);
// });
// $("#removeFilters").click(function() {
// $("#filterList li").each(function() {
// var filter = $(this).attr("id");
// filter_disable(filter);
// });
// return false;
// });
// $('[data-slider=widths]').pwgDoubleSlider(sliders.widths);
// $('[data-slider=heights]').pwgDoubleSlider(sliders.heights);
// $('[data-slider=ratios]').pwgDoubleSlider(sliders.ratios);
// $('[data-slider=filesizes]').pwgDoubleSlider(sliders.filesizes);
// $(document).mouseup(function (e) {
// e.stopPropagation();
// if (!$(event.target).hasClass('addFilter-button')) {
// $('.addFilter-dropdown').slideUp();
// }
// });
admin/themes/default/template/batch_manager_unit.tpl
+248 -44
View File
@@ -53,37 +53,6 @@ str_orphan = '{'This photo is an orphan'|@translate|escape:javascript}';
str_no_search_in_progress = '{'No search in progress'|@translate|escape:javascript}';
str_already_in_related_cats = '{'This albums is already in related categories list'|translate|escape:javascript}';
{literal}
$('#action-delete-picture').on('click', function() {
$.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 = url_delete.replaceAll('amp;', '');
}
},
cancel: {
text: str_no
}
}
});
})
{/literal}
}());
const strs_privacy = {
"0" : "{$level_options[8]}",
@@ -92,7 +61,44 @@ const strs_privacy = {
"3" : "{$level_options[1]}",
"4" : "{$level_options[0]}",
};
{* <!-- sliders config -->
var sliders = {
widths: {
values: [{$dimensions.widths}],
selected: {
min: {$dimensions.selected.min_width},
max: {$dimensions.selected.max_width},
},
text: '{'between %d and %d pixels'|translate|escape:'javascript'}'
},
heights: {
values: [{$dimensions.heights}],
selected: {
min: {$dimensions.selected.min_height},
max: {$dimensions.selected.max_height},
},
text: '{'between %d and %d pixels'|translate|escape:'javascript'}'
},
ratios: {
values: [{$dimensions.ratios}],
selected: {
min: {$dimensions.selected.min_ratio},
max: {$dimensions.selected.max_ratio},
},
text: '{'between %.2f and %.2f'|translate|escape:'javascript'}'
},
filesizes: {
values: [{$filesize.list}],
selected: {
min: {$filesize.selected.min},
max: {$filesize.selected.max},
},
text: '{'between %s and %s MB'|translate|escape:'javascript'}'
}
}; *}
{/footer_script}
{combine_script id='batchManagerUnit' load='footer' require='jquery.ui.effect-blind,jquery.sort' path='admin/themes/default/js/batchManagerUnit.js'}
@@ -114,16 +120,213 @@ const strs_privacy = {
{if !empty($elements) }
<div><input type="hidden" name="element_ids" value="{$ELEMENT_IDS}"></div>
{* <fieldset>
<legend><span class='icon-filter icon-green'></span>{'Filter'|@translate}</legend>
<div class="filterBlock">
<ul id="filterList">
<li id="filter_prefilter" {if !isset($filter.prefilter)}style="display:none"{/if}>
<input type="checkbox" name="filter_prefilter_use" class="useFilterCheckbox" {if isset($filter.prefilter)}checked="checked"{/if}>
<p>{'Predefined filter'|@translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|@translate}"><span>[x]</span></a>
<select name="filter_prefilter">
{foreach from=$prefilters item=prefilter}
{assign 'optionClass' ''}
{if $prefilter.ID eq 'no_album'}{assign 'optionClass' 'icon-heart-broken'}{/if}
{if $prefilter.ID eq 'caddie'}{assign 'optionClass' 'icon-flag'}{/if}
<option value="{$prefilter.ID}" class="{$optionClass}" {if isset($filter.prefilter) && $filter.prefilter eq $prefilter.ID}selected="selected"{/if}>{$prefilter.NAME}</option>
{/foreach}
</select>
<a id="empty_caddie" href="admin.php?page=batch_manager&amp;action=empty_caddie" style="{if !isset($filter.prefilter) or $filter.prefilter ne 'caddie'}display:none{/if}">{'Empty caddie'|translate}</a>
{if $NB_ORPHANS > 0}
<a id="delete_orphans" href="#" style="{if !isset($filter.prefilter) or $filter.prefilter ne 'no_album'}display:none{/if}" class="icon-trash">{'Delete %d orphan photos'|translate:$NB_ORPHANS}</a>
{/if}
{if $NB_NO_MD5SUM > 0}
<a id="sync_md5sum" href="#" style="{if !isset($filter.prefilter) or $filter.prefilter ne 'no_sync_md5sum'}display:none{/if}" class="icon-arrows-cw">{'Compute %d missing checksums'|translate:{$NB_NO_MD5SUM}}</a>
{/if}
<span id="add_md5sum" style="display:none">
<img class="loading" src="themes/default/images/ajax-loader-small.gif">
<span id="md5sum_added">0</span>% -
<span id="md5sum_to_add" data-origin="{$NB_NO_MD5SUM}">{$NB_NO_MD5SUM}</span>
{'checksums to add'|translate}
</span>
<span id="add_md5sum_error" class="errors" style="display:none"></span>
<span id="orphans_deletion" style="display:none">
<img class="loading" src="themes/default/images/ajax-loader-small.gif">
<span id="orphans_deleted">0</span>% -
<span id="orphans_to_delete" data-origin="{$NB_ORPHANS}">{$NB_ORPHANS}</span>
{'orphans to delete'|translate}
</span>
<span id="orphans_deletion_error" class="errors" style="display:none"></span>
<span id="duplicates_options" style="{if !isset($filter.prefilter) or $filter.prefilter ne 'duplicates'}display:none{/if}">
{'based on'|translate}
<label class="font-checkbox"><span class="icon-check"></span><input type="checkbox" name="filter_duplicates_filename" {if isset($filter.duplicates_filename)}checked="checked"{/if}> {'file name'|translate}</label>
<label class="font-checkbox" title="md5sum"><span class="icon-check"></span><input type="checkbox" name="filter_duplicates_checksum" {if isset($filter.duplicates_checksum)}checked="checked"{/if}> {'checksum'|translate} <i class="icon-help-circled tiptip" title="translated md5sum definition here !"> </i></label>
<label class="font-checkbox"><span class="icon-check"></span><input type="checkbox" name="filter_duplicates_date" {if isset($filter.duplicates_date) or (isset($filter.prefilter) and $filter.prefilter ne 'duplicates')}checked="checked"{/if}> {'date & time'|translate}</label>
<label class="font-checkbox"><span class="icon-check"></span><input type="checkbox" name="filter_duplicates_dimensions" {if isset($filter.duplicates_dimensions)}checked="checked"{/if}> {'width & height'|translate}</label>
</span>
</li>
<li id="filter_category" {if !isset($filter.category)}style="display:none"{/if}>
<input type="checkbox" name="filter_category_use" class="useFilterCheckbox" {if isset($filter.category)}checked="checked"{/if}>
<p>{'Album'|@translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a>
<select data-selectize="categories" data-value="{$filter_category_selected|@json_encode|escape:html}"
data-default="first" name="filter_category"></select>
<label class="font-checkbox"><span class="icon-check"></span><input type="checkbox" name="filter_category_recursive" {if isset($filter.category_recursive)}checked="checked"{/if}> {'include child albums'|@translate}</label>
</li>
<li id="filter_tags" {if !isset($filter.tags)}style="display:none"{/if}>
<input type="checkbox" name="filter_tags_use" class="useFilterCheckbox" {if isset($filter.tags)}checked="checked"{/if}>
<p>{'Tags'|@translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a>
<select data-selectize="tags" data-value="{$filter_tags|@json_encode|escape:html}"
placeholder="{'Type in a search term'|translate}"
name="filter_tags[]" multiple style="width:600px;"></select>
<label class="font-checkbox"><span class="icon-circle-empty"></span><span><input type="radio" name="tag_mode" value="AND" {if !isset($filter.tag_mode) or $filter.tag_mode eq 'AND'}checked="checked"{/if}> {'All tags'|@translate}</span></label>
<label class="font-checkbox"><span class="icon-circle-empty"></span><span><input type="radio" name="tag_mode" value="OR" {if isset($filter.tag_mode) and $filter.tag_mode eq 'OR'}checked="checked"{/if}> {'Any tag'|@translate}</span></label>
</li>
<li id="filter_level" {if !isset($filter.level)}style="display:none"{/if}>
<input type="checkbox" name="filter_level_use" class="useFilterCheckbox" {if isset($filter.level)}checked="checked"{/if}>
<p>{'Privacy level'|@translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a>
<select name="filter_level" size="1">
{html_options options=$filter_level_options selected=$filter_level_options_selected}
</select>
<label class="font-checkbox"><span class="icon-check"></span><input type="checkbox" name="filter_level_include_lower" {if isset($filter.level_include_lower)}checked="checked"{/if}> {'include photos with lower privacy level'|@translate}</label>
</li>
<li id="filter_dimension" {if !isset($filter.dimension)}style="display:none"{/if}>
<input type="checkbox" name="filter_dimension_use" class="useFilterCheckbox" {if isset($filter.dimension)}checked="checked"{/if}>
<p>{'Dimensions'|translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a>
<blockquote>
<div data-slider="widths" class="dimensionSlidersBlocks">
<div class="dimensionSlidersTitleButtons">
<div>
{'Width'|translate} <span class="slider-info">{'between %d and %d pixels'|translate:$dimensions.selected.min_width:$dimensions.selected.max_width}</span>
</div>
<a class="slider-choice dimension-cancel" data-min="{$dimensions.bounds.min_width}" data-max="{$dimensions.bounds.max_width}">{'Reset'|translate}</a>
</div>
<div class="slider-slider"></div>
<input type="hidden" data-input="min" name="filter_dimension_min_width" value="{$dimensions.selected.min_width}">
<input type="hidden" data-input="max" name="filter_dimension_max_width" value="{$dimensions.selected.max_width}">
</div>
<div data-slider="heights" class="dimensionSlidersBlocks">
<div class="dimensionSlidersTitleButtons">
<div>
{'Height'|translate} <span class="slider-info">{'between %d and %d pixels'|translate:$dimensions.selected.min_height:$dimensions.selected.max_height}</span>
</div>
<a class="slider-choice dimension-cancel" data-min="{$dimensions.bounds.min_height}" data-max="{$dimensions.bounds.max_height}">{'Reset'|translate}</a>
</div>
<div class="slider-slider"></div>
<input type="hidden" data-input="min" name="filter_dimension_min_height" value="{$dimensions.selected.min_height}">
<input type="hidden" data-input="max" name="filter_dimension_max_height" value="{$dimensions.selected.max_height}">
</div>
<div data-slider="ratios" class="dimensionSlidersBlocks">
<div style="margin-bottom: 11px;">
<span>{'Ratio'|translate} ({'Width'|@translate}/{'Height'|@translate})</span>
<span class="slider-info">{'between %.2f and %.2f'|translate:$dimensions.selected.min_ratio:$dimensions.selected.max_ratio}</span>
</div>
<div class="dimensionSlidersRatioButtons">
<div>
{if isset($dimensions.ratio_portrait)} <a class="slider-choice" data-min="{$dimensions.ratio_portrait.min}" data-max="{$dimensions.ratio_portrait.max}">{'Portrait'|translate}</a>{/if}
{if isset($dimensions.ratio_square)} <a class="slider-choice" data-min="{$dimensions.ratio_square.min}" data-max="
{$dimensions.ratio_square.max}">{'square'|translate}</a>{/if}
{if isset($dimensions.ratio_landscape)} <a class="slider-choice" data-min="{$dimensions.ratio_landscape.min}" data-max="{$dimensions.ratio_landscape.max}">{'Landscape'|translate}</a>{/if}
{if isset($dimensions.ratio_panorama)} <a class="slider-choice" data-min="{$dimensions.ratio_panorama.min}" data-max="{$dimensions.ratio_panorama.max}">{'Panorama'|translate}</a>{/if}
</div>
<div>
<a class="slider-choice dimension-cancel" data-min="{$dimensions.bounds.min_ratio}" data-max="{$dimensions.bounds.max_ratio}">{'Reset'|translate}</a>
</div>
</div>
<div class="slider-slider"></div>
<input type="hidden" data-input="min" name="filter_dimension_min_ratio" value="{$dimensions.selected.min_ratio}">
<input type="hidden" data-input="max" name="filter_dimension_max_ratio" value="{$dimensions.selected.max_ratio}">
</div>
</blockquote>
</li>
<li id="filter_search"{if !isset($filter.search)} style="display:none"{/if}>
<input type="checkbox" name="filter_search_use" class="useFilterCheckbox"{if isset($filter.search)} checked="checked"{/if}>
<p>{'Search'|@translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a>
<input name="q" size=40 value="{if isset($filter.search)} {$filter.search.q|stripslashes|htmlspecialchars}{/if}">
<a href="admin/popuphelp.php?page=quick_search&amp;output=content_only" title="{'Help'|@translate}" class="help-popin-search"><span class="icon-help-circled">{'Search tips'|translate}</span></a>
{combine_script id='core.scripts' load='async' path='themes/default/js/scripts.js'}
{if (isset($no_search_results))}
<div>{'No results for'|@translate} :
<em><strong>
{foreach $no_search_results as $res}
{if !$res@first} &mdash; {/if}
{$res}
{/foreach}
</strong></em>
</div>
{/if}
</li>
<li id="filter_filesize" {if !isset($filter.filesize)}style="display:none"{/if}>
<input type="checkbox" name="filter_filesize_use" class="useFilterCheckbox" {if isset($filter.filesize)}checked="checked"{/if}>
<p>{'Filesize'|translate}</p>
<a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a>
<blockquote>
<div data-slider="filesizes">
<span class="slider-info">{'between %s and %s MB'|translate:$filesize.selected.min:$filesize.selected.max}</span>
<a class="slider-choice dimension-cancel" data-min="{$filesize.bounds.min}" data-max="{$filesize.bounds.max}">{'Reset'|translate}</a>
<div class="slider-slider"></div>
<input type="hidden" data-input="min" name="filter_filesize_min" value="{$filesize.selected.min}">
<input type="hidden" data-input="max" name="filter_filesize_max" value="{$filesize.selected.max}">
</div>
</blockquote>
</li>
</ul>
<div class='noFilter'>{'No filter, add one'|@translate}</div>
<div class="filterActions">
<div id="addFilter">
<div class="addFilter-button icon-plus" onclick="$('.addFilter-dropdown').slideToggle()">{'Add a filter'|@translate}</div>
<div class="addFilter-dropdown">
<a data-value="filter_prefilter" {if isset($filter.prefilter)}class="disabled"{/if}>{'Predefined filter'|@translate}</a>
<a data-value="filter_category" {if isset($filter.category)}class="disabled"{/if}>{'Album'|@translate}</a>
<a data-value="filter_tags" {if isset($filter.tags)}class="disabled"{/if}>{'Tags'|@translate}</a>
<a data-value="filter_level" {if isset($filter.level)}class="disabled"{/if}>{'Privacy level'|@translate}</a>
<a data-value="filter_dimension" {if isset($filter.dimension)}class="disabled"{/if}>{'Dimensions'|@translate}</a>
<a data-value="filter_filesize" {if isset($filter.filesize)}class="disabled"{/if}>{'Filesize'|@translate}</a>
<a data-value="filter_search"{if isset($filter.search)} class="disabled"{/if}>{'Search'|@translate}</a>
</div>
<a id="removeFilters" class="icon-cancel" style="display: none;">{'Remove all filters'|@translate}</a>
</div>
<button id="applyFilter" name="submitFilter" type="submit">
<i class="icon-arrows-cw"></i> {'Refresh photo set'|@translate}
</button>
</div>
</div>
</fieldset> *}
{foreach from=$elements item=element}
{footer_script}
var related_category_ids_{$element.ID} = {$element.related_category_ids};
console.log(related_category_ids_{$element.ID});
url_delete = '{$element.U_DELETE}';
id = '{$element.ID}';
url_delete_{$element.id} = '{$element.U_DELETE}';
{/footer_script}
{debug}
<fieldset class="elementEdit" id="picture-{$element.ID}" data-image_id="{$element.ID}">
<div class="media-box">
<img src="{$element.TN_SRC}" alt="imagename" class="media-box-embed" style="{if $element.FORMAT}width:100%; max-height:100%;{else}max-width:100%; height:100%;{/if}">
@@ -250,15 +453,16 @@ const strs_privacy = {
{/foreach}
{if !empty($navbar)}{include file='navigation_bar.tpl'|@get_extent:'navbar'}{/if}
{/if}
<br>
<br>
<br>
<br>
<div class="bottom-save-bar">
<input type="hidden" name="pwg_token" value="{$PWG_TOKEN}">
<button class="buttonLike" type="submit" value="{'Submit'|@translate}" name="submit" style="height:40px"><i class="icon-floppy"></i>Save all photos</button>
{* <span class="buttonLike" type="submit" name="submit"> {'Submit'|@translate}</span> *}
{* <input type="reset" value="{'Reset'|@translate}"> *}
<button class="buttonLike" type="submit" value="{'Submit'|@translate}" name="submit" style="height:40px"><i class="icon-floppy"></i>Save all photos</button>
</div>
{/if}
</form>
{include file='include/album_selector.inc.tpl'
@@ -514,12 +718,12 @@ const strs_privacy = {
.bottom-save-bar{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
right: 0;
width: calc(100% - 205px);
background-color: #ffffff;
text-align: right;
z-index: 4;
border-top: 1px solid #CCCCCC
z-index: 101;
border-top: 1px solid #CCCCCC;
}
.bottom-save-bar button{