adam/Piwigo
1
0
Fork 0
mirror of https://github.com/Piwigo/Piwigo.git synced 2026-06-02 04:15:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

fixes #2132 implementing and improving new album selector

Browse Source 
- Moved all related logic into album_selector.js for better maintainability and separation of concerns.

- Removed duplicates in TPL and CSS files, consolidating them into a single CSS file and a single TPL file for better organization and efficiency.

- Implementation of the album selector in the pages: photo editing, album editing and batch manager unit.

- Improved the album selector by adding a creation mode to create and select an album (only in admin pages).
This commit is contained in:
Linty
2024-07-31 11:49:44 +02:00
parent 3826f355ae
commit 653b03aacc
20 changed files with 874 additions and 788 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/batch_manager_unit.php
+1 -1
View File
@@ -499,7 +499,7 @@ SELECT
'STATS' => l10n('Visited %d times', $row['hit']),
'FILE' => l10n('%s', $row['file']),
'related_categories' => $related_categories,
'related_category_ids' => json_encode($related_category_ids,JSON_NUMERIC_CHECK),
'related_category_ids' => json_encode($related_category_ids),
'U_JUMPTO' => (isset($url_img) and $user['level'] >= $media['image']['level']) ? $url_img : null,
'tag_selection' => $tag_selection,
'U_DOWNLOAD' => 'action.php?id='.$row['id'].'&part=e&pwg_token='.get_pwg_token().'&download',
admin/themes/default/css/components/album_selector.css
+283
View File
@@ -0,0 +1,283 @@
#addLinkedAlbum {
display:none;
}
.linkedAlbumPopIn {
position: fixed;
z-index: 102;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0,0,0,0.7);
}
.linkedAlbumPopInContainer {
display:flex;
position:absolute;
left:50%;
top: 50%;
transform:translate(-50%, -48%);
text-align:left;
padding:20px;
flex-direction:column;
border-radius:15px;
align-items:center;
width: 460px;
height: 400px;
}
.linkedAlbumPopInContainer.big {
height: 500px;
}
.ClosePopIn {
position: absolute;
right: -40px;
top: -40px;
font-size: 30px;
color: white;
}
.ClosePopIn:hover {
text-decoration: none;
cursor: pointer;
}
.linkedAlbumPopInContainer .AddIconContainer {
margin-top: 20px;
}
.linkedAlbumPopInContainer .AddIcon {
border-radius: 9999px;
padding: 10px;
font-size: 2em;
}
.linkedAlbumPopInContainer .AddIconTitle {
font-size: 1.4em;
font-weight: bold;
text-align: center;
margin-bottom: 10px;
margin-top: 15px;
}
#linkedAlbumSearch .search-icon {
position: absolute;
transform: translate(7px, 8px);
font-size: 18px;
top: auto;
}
.search-cancel-linked-album {
opacity: 0.4;
cursor: pointer;
position: absolute;
font-size: 18px;
transform: translate(215px, 8px);
}
.search-cancel-linked-album:hover {
opacity: 1;
}
.linkedAlbumPopInContainer .searching {
margin-top: 10px;
}
.linkedAlbumPopInContainer #searchResult {
width: 100%;
overflow-y: auto;
max-height: 400px;
margin: 10px 0 0 0;
}
.put-to-root {
width: 220px;
margin-top: 5px;
}
.put-to-root p {
margin: 0 auto;
}
/* Prefill */
.display-subcat {
margin-right: 2px;
}
.display-subcat:hover {
cursor: pointer;
}
.display-subcat::before {
transition: 0.5s;
transform: rotate(90deg);
}
.display-subcat.open::before {
transform: rotate(180deg);
}
.search-result-item {
margin: 10px 0px;
padding: 5px 10px;
height: 25px;
border-radius: 5px;
font-weight: bold;
display: flex;
align-items: center;
cursor: pointer;
}
.search-result-item .item-add {
margin-left: auto;
cursor: pointer;
}
.notClickable {
opacity: 0.3;
cursor: default;
}
.notClickable:hover {
cursor: default;
}
.search-result-item.already-in {
cursor: default;
}
.prefill-results-item {
width: 100%;
height: 100%;
display: flex;
align-items: center;
}
.search-result-path {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 350px;
direction: rtl;
text-align: left;
}
.search-result-subcat-item {
display: none;
}
.and-more{
text-align: center;
}
/* Album selector View */
.album-create {
display: flex;
width: 100%;
height: 100%;
flex-direction: column;
}
.album-selector,
.album-create {
text-align: center;
}
.linked-album-subtitle {
margin: 0 0 30px 0;
}
.linked-album-subtitle p {
margin: 0;
font-style: italic;
font-weight: 700;
color: #AAAAAA;
}
.linked-add-album {
display: none;
margin: 0px;
}
.album-switch-bottom {
width: 100%;
margin-top: auto;
}
.album-switch-container {
width: 100%;
display: flex;
flex-wrap: wrap;
margin-top: 5px;
align-items: center;
justify-content: space-between;
height: 40px;
}
.switch-input {
display: flex;
align-items: center;
}
.linked-album-input-container {
width: 100%;
text-align: start;
}
.linked-album-input-container.album-name {
margin-bottom: 20px;
}
.linked-album-input-container .user-property-input,
.linked-add-radio-input {
margin-top: 10px;
}
.linked-add-radio-input {
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 10px;
}
.linked-add-radio-input input {
margin-right: 5px;
}
.linked-add-radio-input label {
font-size: 12px;
font-weight: 600;
}
.linked-album-create-btn {
display: flex;
margin-top: auto;
justify-content: space-between;
align-items: center;
}
.linked-album-create-btn p {
margin: 0;
font-size: 15px;
}
.linked-button-cancel {
cursor: pointer;
font-weight: 700;
}
.linked-button-cancel:hover {
color: #000;
}
.AddAlbumErrors {
visibility: hidden;
}
#linkedAddAlbumErrors {
margin: 0;
text-align: start;
padding: 10px;
}
admin/themes/default/js/album_selector.js
+430 -90
View File
@@ -1,95 +1,346 @@
function set_up_popin() {
$(".ClosePopIn").on('click', function () {
linked_albums_close();
/*-------
Variables
-------*/
const addLinkedAlbum = $('#addLinkedAlbum');
const closeAlbumPopIn = $('#closeAlbumPopIn');
const searchInput = $('.search-input');
const searchResult = $('#searchResult');
const limitReached = $('.limitReached');
const iconCancelInput = $(".search-cancel-linked-album");
const relatedCategoriesDom = $('.related-categories-container .breadcrumb-item .remove-item');
const iconSearchingSpin = $('.searching');
const albumSelector = $('#linkedAlbumSelector');
const albumCreate = $('#linkedAlbumCreate');
const albumCheckBox = $('#album-create-check');
const linkedAddAlbum = $('#linkedAddAlbum');
const linkedModalTitle = $('#linkedModalTitle');
const linkedAlbumSwitch = $('#linkedAlbumSwitch');
const linkedAlbumSubTitle = $('#linkedAlbumSubtitle');
const linkedAddNewAlbum = $('#linkedAddNewAlbum');
const linkedAlbumInput = $('#linkedAlbumInput');
const putToRoot = $('.put-to-root-container');
const linkedAlbumCancel = $('#linkedAlbumCancel');
const linkedAddAlbumErrors = $('#linkedAddAlbumErrors');
const AddAlbumErrors = $('.AddAlbumErrors');
let isAlbumCreationChecked = false;
/*--------------------
Document ready / event
--------------------*/
$(function() {
iconCancelInput.hide();
albumCreate.hide();
// event close pop in
closeAlbumPopIn.on('click', () => {
close_album_selector();
});
// event empty search input
if (iconCancelInput.length) {
iconCancelInput.on("click", function () {
searchInput.val("");
searchInput.trigger("input");
});
}
// event perform search
searchInput.on('input', function () {
if ($(this).val() != 0) {
iconCancelInput.show()
} else {
iconCancelInput.hide();
}
// Search input value length required to start searching
if ($(this).val().length > 0) {
perform_albums_search($(this).val());
} else {
limitReached.html(str_no_search_in_progress);
searchResult.empty();
prefill_search();
}
});
// event remove category
relatedCategoriesDom.on("click", function () {
const pictureId = $(this).parents("fieldset").data("image_id");
if (pictureId) {
remove_related_category($(this).attr("id"), pictureId);
} else {
remove_related_category($(this).attr("id"));
}
});
// in admin mode
if (in_admin_mode) {
// toggle view
albumCheckBox.on('change', function () {
isAlbumCreationChecked = $(this).is(':checked');
switch_album_creation();
});
}
});
/*--------------
General function
--------------*/
function open_album_selector() {
if (in_admin_mode) {
hard_reset_album_selector();
} else {
reset_album_selector();
}
addLinkedAlbum.fadeIn();
}
function close_album_selector() {
addLinkedAlbum.fadeOut();
}
function reset_album_selector() {
prefill_search();
searchInput.val('');
searchInput.trigger("input").trigger('focus');
limitReached.html(str_no_search_in_progress);
albumSelector.show();
}
function switch_album_creation() {
reset_album_selector();
if (isAlbumCreationChecked) {
if (putToRoot.length) {
putToRoot.hide();
}
linkedModalTitle.hide();
linkedModalTitle.html(str_create_and_select);
linkedAddAlbum.fadeIn();
linkedModalTitle.fadeIn();
linkedAddAlbum.off('click').on('click', function() {
switch_album_view('root');
});
} else {
if (putToRoot.length) {
putToRoot.fadeIn();
}
linkedModalTitle.hide();
linkedModalTitle.html(str_album_modal_title);
linkedModalTitle.fadeIn();
linkedAddAlbum.fadeOut();
linkedAddAlbum.off('click');
}
}
function switch_album_view(cat) {
albumSelector.hide();
searchResult.hide();
linkedAlbumSwitch.hide();
albumCreate.fadeIn();
linkedAlbumSubTitle.html(sprintf(str_add_subcat_of, cat === 'root' ? str_root_album_select : cat.name));
linkedAddNewAlbum.off('click').on('click', function () {
add_new_album(cat === 'root' ? cat : cat.id);
});
linkedAlbumCancel.off('click').on('click', function () {
close_album_selector();
});
linkedAlbumInput.off('input').on('input', function () {
hide_new_album_error();
});
}
function linked_albums_close() {
$("#addLinkedAlbum").fadeOut();
}
function linked_albums_open(pictureId) {
$("#addLinkedAlbum").fadeIn();
if(null != pictureId)
{
console.log(pictureId);
$("#addLinkedAlbum .linkedAlbumPopInContainer").attr("id",pictureId);
}
$(".search-input").val("");
$(".search-input").focus();
$("#searchResult").empty();
$(".limitReached").html(str_no_search_in_progress);
}
function linked_albums_search(searchText, pictureId) {
if (api_method == 'pwg.categories.getList') {
api_params = {
cat_id: 0,
recursive: true,
fullname: true,
search: searchText,
}
function select_new_album_and_close(cat) {
if (typeof b_current_picture_id !== 'undefined') {
add_related_category(cat.id, cat.full_name_with_admin_links, b_current_picture_id);
} else {
api_params = {
search: searchText,
additional_output: "full_name_with_admin_links",
}
add_related_category(cat.id, cat.full_name_with_admin_links);
}
close_album_selector();
hard_reset_album_selector();
}
function hard_reset_album_selector() {
albumCreate.hide();
hide_new_album_error();
reset_album_selector();
linkedAlbumInput.val('');
if (albumCheckBox.is(':checked')) {
albumCheckBox.trigger('click');
}
searchResult.show();
linkedAlbumSwitch.show();
}
function hide_new_album_error() {
AddAlbumErrors.css('visibility', 'hidden');
}
function show_new_album_error(text) {
linkedAddAlbumErrors.html(text);
AddAlbumErrors.css('visibility', 'visible');
}
function prefill_results(rank, cats, limit) {
let display_div = $('#subcat-'+rank);
if ('root' == rank){
$("#searchResult").empty();
display_div = $('#searchResult');
} else {
display_div = $('#subcat-'+rank);
}
$(".linkedAlbumPopInContainer .searching").show();
$.ajax({
url: "ws.php?format=json&method=" + api_method,
type: "POST",
dataType: "json",
data : api_params,
before: function () {
cats.forEach(cat => {
let subcat = '';
if (cat.nb_categories > 0) {
subcat = "<span id=" + cat.id + " class='display-subcat gallery-icon-up-open'></span>"
}
const iconAlbum = isAlbumCreationChecked ? 'icon-add-album' : 'gallery-icon-plus-circled';
if (!related_categories_ids.includes(cat.id) || isAlbumCreationChecked) {
display_div.append(
"<div class='search-result-item' id="+ cat.id + ">" +
subcat +
"<div class='prefill-results-item available' id=" + cat.id + ">" +
"<span class='search-result-path'>" + cat.name +"</span>" +
"<span id="+ cat.id + " class='" + iconAlbum + " item-add'></span>" +
"</div>" +
"</div>"
);
} else {
display_div.append(
"<div class='search-result-item already-in' id="+ cat.id + " title='" + str_already_in_related_cats + "'>" +
subcat +
"<div class='prefill-results-item' id=" + cat.id + ">" +
"<span class='search-result-path'>" + cat.name +"</span>" +
"<span id="+ cat.id + " class='gallery-icon-plus-circled item-add notClickable' title='" + str_already_in_related_cats + "'></span>" +
"</div>" +
"</div>"
);
}
if (rank !== 'root') {
const item = $("#"+rank+".search-result-item");
const margin_left = parseInt(item.css('margin-left')) + 25;
$("#"+cat.id+".search-result-item").css('margin-left', margin_left);
$("#"+cat.id+".search-result-item .search-result-path").css('max-width', 400 - margin_left - 80);
}
if (isAlbumCreationChecked) {
$('#'+ cat.id +'.prefill-results-item').off('click').on('click', function () {
switch_album_view(cat);
});
} else {
$("#"+ cat.id +".prefill-results-item.available").off('click').on('click', function () {
if (typeof b_current_picture_id !== 'undefined') {
add_related_category(cat.id, in_admin_mode ? cat.full_name_with_admin_links : cat.name, b_current_picture_id);
} else {
add_related_category(cat.id, in_admin_mode ? cat.full_name_with_admin_links : cat.name);
}
});
}
},
success: function (raw_data) {
$(".linkedAlbumPopInContainer .searching").hide();
$("#"+cat.id+".display-subcat").off('click').on('click', function () {
const cat_id = $(this).prop('id');
categories = raw_data.result.categories;
if (typeof pictureId !== 'undefined') {
fill_results(categories, pictureId);
} else {
fill_results(categories);
}
if($(this).hasClass('open')){
// CLOSING SUBCAT
$(this).removeClass('open');
$("#subcat-"+cat.id).fadeOut();
if (raw_data.result.limit_reached) {
$(".limitReached").html(str_result_limit.replace("%d", categories.length));
} else {
if (categories.length == 1) {
$(".limitReached").html(str_album_found);
} else {
$(".limitReached").html(str_albums_found.replace("%d", categories.length));
// OPENING SUBCAT
// if subcat div exist
if ($("#subcat-"+cat.id).length){
$(this).addClass('open');
$("#subcat-"+cat.id).fadeIn();
} else { // if subcat div doesn't exist
$("#"+cat_id+".display-subcat").removeClass('gallery-icon-up-open').addClass('gallery-icon-spin6 animate-spin');
$("#"+cat_id+".search-result-item").after(`<div id="subcat-${cat_id}" class="search-result-subcat-item"></div>`);
prefill_search_subcats(cat_id).then(() => {
$("#"+cat_id+".display-subcat").removeClass('gallery-icon-spin6 animate-spin').addClass('gallery-icon-up-open');
$(this).addClass('open');
$("#subcat-"+cat.id).fadeIn();
});
}
}
}
},
error: function (e) {
$(".linkedAlbumPopInContainer .searching").hide();
console.log(e.message);
}
})
});
});
// for debug
// console.log(limit);
if (limit.remaining_cats > 0) {
const text = sprintf(str_plus_albums_found, limit.limited_to, limit.total_cats);
display_div.append(
"<p class='and-more'>" + text + "</p>"
);
}
}
function fill_results(cats) {
$("#searchResult").empty();
cats.forEach(cat => {
const cat_name = in_admin_mode ? cat.fullname : cat.name;
const iconAlbum = isAlbumCreationChecked ? 'icon-add-album' : 'gallery-icon-plus-circled';
$("#searchResult").append(
"<div class='search-result-item' id="+ cat.id + ">" +
"<span class='search-result-path'>" + cat_name + "</span><span id="+ cat.id + " class='" + iconAlbum + " item-add'></span>" +
"</div>"
);
if (isAlbumCreationChecked) {
$(".search-result-item#"+ cat.id).off('click').on("click", function () {
switch_album_view(cat);
});
return
}
console.log(related_categories_ids)
if (related_categories_ids.includes(cat.id)) {
$(".search-result-item #"+ cat.id +".item-add").addClass("notClickable").attr("title", str_already_in_related_cats).off('click').on("click", function (event) {
event.preventDefault();
});
$("#"+cat.id+".search-result-item").addClass("notClickable").attr("title", str_already_in_related_cats).off('click').on("click", function (event) {
event.preventDefault();
});
} else {
$(".search-result-item#"+ cat.id).off('click').on("click", function () {
if (typeof b_current_picture_id !== 'undefined') {
add_related_category(cat.id, in_admin_mode ? cat.full_name_with_admin_links : cat.name, b_current_picture_id);
} else {
add_related_category(cat.id, in_admin_mode ? cat.full_name_with_admin_links : cat.name);
}
});
}
});
}
/*-----------
Ajax function
-----------*/
function prefill_search() {
$(".linkedAlbumPopInContainer .searching").show();
if (api_method == "pwg.categories.getList") {
api_params = {
cat_id: 0,
recursive: false,
fullname: true,
limit: limit_params,
};
} else {
api_params = {
additional_output: "full_name_with_admin_links",
};
}
let api_params = {
cat_id: 0,
recursive: false,
fullname: true,
limit: limit_params,
};
in_admin_mode && (api_params.additional_output = 'full_name_with_admin_links');
$.ajax({
url: "ws.php?format=json&method=" + api_method,
url: "ws.php?format=json&method=" + methodPwg,
type: "POST",
dataType: "json",
data: api_params,
@@ -109,33 +360,122 @@ function prefill_search() {
}
async function prefill_search_subcats(cat_id) {
let method = {};
if (api_method == "pwg.categories.getList") {
method = {
cat_id: cat_id,
recursive: false,
limit: limit_params,
};
} else {
method = {
additional_output: "full_name_with_admin_links",
};
}
let api_params = {
cat_id: cat_id,
recursive: false,
limit: limit_params,
};
in_admin_mode && (api_params.additional_output = 'full_name_with_admin_links');
try {
const data = await $.ajax({
url: "ws.php?format=json&method=" + api_method,
url: "ws.php?format=json&method=" + methodPwg,
type: "POST",
dataType: "json",
data: method,
data: api_params,
});
// for debug
// console.log(data);
const cats = data.result.categories.filter((c) => c.id !== +cat_id);
const cats = data.result.categories.filter((c) => c.id != cat_id);
const limit = data.result.limit;
prefill_results(cat_id, cats, limit);
} catch (e) {
console.log("error", e.message);
}
}
function perform_albums_search(searchText) {
let api_params = {
cat_id: 0,
recursive: true,
fullname: true,
search: searchText,
}
in_admin_mode && (api_params.additional_output = 'full_name_with_admin_links');
iconSearchingSpin.show();
$.ajax({
url: "ws.php?format=json&method=" + methodPwg,
type: "POST",
dataType: "json",
data : api_params,
before: function () {
},
success: function (raw_data) {
iconSearchingSpin.hide();
categories = raw_data.result.categories;
fill_results(categories);
if (raw_data.result.limit_reached) {
limitReached.html(str_result_limit.replace("%d", categories.length));
} else {
if (categories.length == 1) {
limitReached.html(str_album_found);
} else {
limitReached.html(str_albums_found.replace("%d", categories.length));
}
}
},
error: function (e) {
iconSearchingSpin.hide();
console.log(e.message);
}
})
}
function add_new_album(cat_id) {
const cat_name = linkedAlbumInput.val();
const cat_position = $("input[name=position]:checked").val();
const api_params = {
name: cat_name,
parent: cat_id === 'root' ? 0 : +cat_id,
position: cat_position,
}
if(!cat_name || '' === cat_name) {
show_new_album_error(str_complete_name_field);
return
}
$.ajax({
url: 'ws.php?format=json&method=pwg.categories.add',
type: 'POST',
dataType: 'json',
data: api_params,
success: function (data) {
if (data.stat === 'ok') {
get_album_by_id(data.result.id);
} else {
show_new_album_error(str_an_error_has_occured);
}
},
error: function () {
show_new_album_error(str_an_error_has_occured);
}
});
}
function get_album_by_id(cat_id) {
$.ajax({
url: 'ws.php?format=json&method=pwg.categories.getAdminList',
dataType: 'json',
data: {
cat_id,
additional_output: 'full_name_with_admin_links',
},
success: function(data) {
if(data.stat === 'ok') {
select_new_album_and_close(data.result.categories[0]);
} else {
show_new_album_error(str_an_error_has_occured);
}
},
error: function () {
show_new_album_error(str_an_error_has_occured);
}
});
}
admin/themes/default/js/batchManagerUnit.js
+25 -75
View File
@@ -161,101 +161,54 @@ $(document).ready(function() {
});
//Categories
$(".linked-albums.add-item").on("click", function() {
var pictureId = $(this).parents("fieldset").data("image_id")
linked_albums_open(pictureId);
set_up_popin();
b_current_picture_id = $(this).parents("fieldset").data("image_id");
related_categories_ids = get_related_category(b_current_picture_id);
open_album_selector();
});
$(".limitReached").html(str_no_search_in_progress);
$(".search-cancel-linked-album").hide();
$(".linkedAlbumPopInContainer .searching").hide();
$("#linkedAlbumSearch .search-input").on('input', function() {
var pictureId = $("#linkedAlbumSearch .search-input").parents(".linkedAlbumPopInContainer").attr("id");
if ($(this).val() != 0) {
$("#linkedAlbumSearch .search-cancel-linked-album").show()
} else {
$("#linkedAlbumSearch .search-cancel-linked-album").hide();
}
// Search input value length required to start searching
if ($(this).val().length > 0) {
linked_albums_search($(this).val(), pictureId);
} else {
$(".limitReached").html(str_no_search_in_progress);
$("#searchResult").empty();
}
})
$(".search-cancel-linked-album").on("click", function() {
$("#linkedAlbumSearch .search-input").val("");
$("#linkedAlbumSearch .search-input").trigger("input");
})
$(".related-categories-container .breadcrumb-item .remove-item").on("click", function() {
var pictureId = $(this).parents("fieldset").data("image_id")
remove_related_category($(this).attr("id"), pictureId);
})
pluginFunctionMapInit(activePlugins);
})
function fill_results(cats, pictureId) {
$("#searchResult").empty();
cats.forEach(cat => {
$("#searchResult").append(
"<div class='search-result-item' id=" + cat.id + ">" +
"<span class='search-result-path'>" + cat.fullname + "</span><span id=" + cat.id + " class='icon-plus-circled item-add' onclick='showUnsavedLocalBadge(" + pictureId + ")'></span>" +
"</div>"
);
var this_related_category_ids = window["related_category_ids_" + pictureId];
var catId = parseInt(cat.id);
if (this_related_category_ids.includes(catId)) {
$(".search-result-item#" + catId + " .item-add").addClass("notClickable").attr("title", str_already_in_related_cats).on("click", function(event) {
event.preventDefault();
});
$(".search-result-item").addClass("notClickable").attr("title", str_already_in_related_cats).on("click", function(event) {
event.preventDefault();
});
} else {
$(".search-result-item#" + catId + " .item-add").on("click", function() {
add_related_category(catId, cat.full_name_with_admin_links, pictureId);
});
}
});
function get_related_category(pictureId) {
return all_related_categories_ids.find((c) => c.id == pictureId).cat_ids ?? [];
}
function remove_related_category(cat_id, pictureId) {
var catId = parseInt(cat_id);
var this_related_category_ids = window["related_category_ids_" + pictureId];
$("#" + pictureId + " .invisible-related-categories-select option[value=" + catId + "]").remove();
$("#" + pictureId + " .invisible-related-categories-select option[value=" + +cat_id + "]").remove();
$("#" + pictureId + " .invisible-related-categories-select").trigger('change');
$("#" + pictureId + " #" + catId).parent().remove();
cat_to_remove_index = this_related_category_ids.indexOf(catId);
$("#" + pictureId + " #" + cat_id).parent().remove();
const cat_to_remove_index = all_related_categories_ids.findIndex((c) => c.id == pictureId);
if (cat_to_remove_index > -1) {
this_related_category_ids.splice(cat_to_remove_index, 1);
all_related_categories_ids[cat_to_remove_index].cat_ids.splice(cat_to_remove_index, 1);
showUnsavedLocalBadge(pictureId);
}
check_related_categories(pictureId);
}
function add_related_category(cat_id, cat_link_path, pictureId) {
var catId = parseInt(cat_id);
var this_related_category_ids = window["related_category_ids_" + pictureId];
if (!this_related_category_ids.includes(catId)) {
related_categories_ids = get_related_category(pictureId);
if (!related_categories_ids.includes(cat_id)) {
$("#" + pictureId + " .related-categories-container").append(
"<div class='breadcrumb-item album-listed'>" +
"<span class='link-path'>" + cat_link_path + "</span><span id=" + catId + " class='icon-cancel-circled remove-item'></span>" +
"<span class='link-path'>" + cat_link_path + "</span><span id=" + cat_id + " class='icon-cancel-circled remove-item'></span>" +
"</div>"
);
$(".search-result-item#" + catId).addClass("notClickable");
this_related_category_ids.push(catId);
$(".invisible-related-categories-select").append("<option selected value=" + catId + "></option>").trigger('change');
$("#" + catId).on("click", function() {
remove_related_category(catId, pictureId);
$(".search-result-item#" + cat_id).addClass("notClickable");
related_categories_ids.push(cat_id);
showUnsavedLocalBadge(pictureId);
$(".invisible-related-categories-select").append("<option selected value=" + cat_id + "></option>").trigger('change');
$("#" + cat_id).on("click", function() {
remove_related_category(cat_id, pictureId);
})
linked_albums_close();
close_album_selector();
}
check_related_categories(pictureId);
}
function check_related_categories(pictureId) {
var this_related_category_ids = window["related_category_ids_" + pictureId];
$("#picture-" + pictureId + " .linked-albums-badge").html(this_related_category_ids.length);
if (this_related_category_ids.length == 0) {
related_categories_ids = get_related_category(pictureId);
$("#picture-" + pictureId + " .linked-albums-badge").html(related_categories_ids.length);
if (related_categories_ids.length == 0) {
$("#" + pictureId + " .linked-albums-badge").addClass("badge-red");
$("#" + pictureId + " .add-item").addClass("highlight");
$("#" + pictureId + " .orphan-photo").html(str_orphan).show();
@@ -393,10 +346,7 @@ function saveChanges(pictureId) {
var comment = $("#description-" + pictureId).val();
var level = $("#level-" + pictureId + " option:selected").val();
// Get Categories
var categories = [];
$("#picture-" + pictureId + " .remove-item").each(function() {
categories.push($(this).attr("id"));
});
const categories = get_related_category(pictureId);
var categoriesStr = categories.join(';');
// Get Tags
var tags = [];
admin/themes/default/js/cat_modify.js
+8 -50
View File
@@ -329,8 +329,7 @@ jQuery(document).ready(function() {
$("#cat-parent.icon-pencil").on("click", function (e) {
// Don't open the popin if you click on the album link
if (e.target.localName != 'a') {
linked_albums_open();
set_up_popin();
open_album_selector();
if (parent_album != 0) {
$(".put-to-root").removeClass("notClickable");
@@ -343,29 +342,6 @@ jQuery(document).ready(function() {
}
});
$(".limitReached").html(str_no_search_in_progress);
$(".search-cancel-linked-album").hide();
$(".linkedAlbumPopInContainer .searching").hide();
$("#linkedAlbumSearch .search-input").on('input', function () {
if ($(this).val() != 0) {
$("#linkedAlbumSearch .search-cancel-linked-album").show()
} else {
$("#linkedAlbumSearch .search-cancel-linked-album").hide();
}
if ($(this).val().length > 0) {
linked_albums_search($(this).val());
} else {
$(".limitReached").html(str_no_search_in_progress);
$("#searchResult").empty();
}
})
$(".search-cancel-linked-album").on("click", function () {
$("#linkedAlbumSearch .search-input").val("");
$("#linkedAlbumSearch .search-input").trigger("input");
})
$(".allow-comments").on("click", function () {
jQuery.ajax({
url: "ws.php?format=json&method=pwg.categories.setInfo",
@@ -497,42 +473,24 @@ function checkAlbumLock() {
// Parent album popin functions
function fill_results(cats) {
$("#searchResult").empty();
cats.forEach(cat => {
$("#searchResult").append(
"<div class='search-result-item' id="+ cat.id + ">" +
"<span class='search-result-path'>" + cat.fullname +"</span><span class='icon-plus-circled item-add'></span>" +
"</div>"
);
// If the searched albums are in the children of the current album they become unclickable
// Same if the album is already selected
if (parent_album == cat.id || cat.uppercats.split(',').includes(album_id+"")) {
$(" #"+ cat.id +".search-result-item").addClass("notClickable").attr("title", str_already_in_related_cats).on("click", function (event) {
event.preventDefault();
});
} else {
$("#"+ cat.id + ".search-result-item ").on("click", function () {
add_related_category(cat.id, cat.full_name_with_admin_links);
});
}
});
}
function add_related_category(cat_id, cat_link_path) {
if (parent_album != cat_id) {
const cat_to_remove_index = related_categories_ids.indexOf(parent_album.toString());
if (cat_to_remove_index > -1) {
related_categories_ids.splice(cat_to_remove_index, 1);
}
$("#cat-parent").html(
cat_link_path
);
$(".search-result-item #" + cat_id).addClass("notClickable");
parent_album = cat_id;
related_categories_ids.push(cat_id);
$(".invisible-related-categories-select").append("<option selected value="+ cat_id +"></option>");
linked_albums_close();
close_album_selector();
}
}
admin/themes/default/js/picture_modify.js
+2 -54
View File
@@ -1,37 +1,9 @@
$(document).ready(function () {
$(".linked-albums.add-item").on("click", function () {
linked_albums_open();
set_up_popin();
open_album_selector();
});
$(".limitReached").html(str_no_search_in_progress);
$(".search-cancel-linked-album").hide();
$(".linkedAlbumPopInContainer .searching").hide();
$("#linkedAlbumSearch .search-input").on('input', function () {
if ($(this).val() != 0) {
$("#linkedAlbumSearch .search-cancel-linked-album").show()
} else {
$("#linkedAlbumSearch .search-cancel-linked-album").hide();
}
// Search input value length required to start searching
if ($(this).val().length > 0) {
linked_albums_search($(this).val());
} else {
$(".limitReached").html(str_no_search_in_progress);
$("#searchResult").empty();
}
})
$(".search-cancel-linked-album").on("click", function () {
$("#linkedAlbumSearch .search-input").val("");
$("#linkedAlbumSearch .search-input").trigger("input");
})
$(".related-categories-container .breadcrumb-item .remove-item").on("click", function () {
remove_related_category($(this).attr("id"));
})
// Unsaved settings message before leave this page
let form_unsaved = false;
let user_interacted = false;
@@ -54,30 +26,6 @@ $(document).ready(function () {
});
})
function fill_results(cats) {
$("#searchResult").empty();
cats.forEach(cat => {
$("#searchResult").append(
"<div class='search-result-item' id="+ cat.id + ">" +
"<span class='search-result-path'>" + cat.fullname +"</span><span id="+ cat.id + " class='icon-plus-circled item-add'></span>" +
"</div>"
);
if (related_categories_ids.includes(cat.id)) {
$(".search-result-item #"+ cat.id +".item-add").addClass("notClickable").attr("title", str_already_in_related_cats).on("click", function (event) {
event.preventDefault();
});
$(".search-result-item").addClass("notClickable").attr("title", str_already_in_related_cats).on("click", function (event) {
event.preventDefault();
});
} else {
$(".search-result-item#"+ cat.id).on("click", function () {
add_related_category(cat.id, cat.full_name_with_admin_links);
});
}
});
}
function remove_related_category(cat_id) {
$(".invisible-related-categories-select option[value="+ cat_id +"]").remove();
$(".invisible-related-categories-select").trigger('change');
@@ -107,7 +55,7 @@ function add_related_category(cat_id, cat_link_path) {
remove_related_category($(this).attr("id"))
})
linked_albums_close();
close_album_selector();
}
check_related_categories();
admin/themes/default/template/albums.tpl
-15
View File
@@ -328,21 +328,6 @@ const tiptip_locked_album = "{'Locked album'|translate|escape:javascript}";
max-width: 700px;
}
.user-property-input {
width: 100%;
box-sizing:border-box;
font-size:1.1em;
padding:8px 16px;
border:none;
}
.user-property-label {
color:#A4A4A4;
font-weight:bold;
font-size:1.1em;
margin-bottom:5px;
}
.AddIconContainer, .DeleteIconContainer, .AddIconContainer {
margin-top: 10px;
}
admin/themes/default/template/batch_manager_unit.tpl
+6 -7
View File
@@ -51,12 +51,7 @@ jQuery("a.preview-box").colorbox( {
str_are_you_sure = '{'Are you sure?'|translate|escape:javascript}';
str_yes = '{'Yes, delete'|translate|escape:javascript}';
str_no = '{'No, I have changed my mind'|translate|@escape:'javascript'}';
str_albums_found = '{"<b>%d</b> albums found"|translate|escape:javascript}';
str_album_found = '{"<b>1</b> album found"|translate|escape:javascript}';
str_result_limit = '{"<b>%d+</b> albums found, try to refine the search"|translate|escape:javascript}';
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}';
str_meta_warning = '{'Warning ! Unsaved changes will be lost'|translate|escape:javascript}';
str_meta_yes = '{'I want to continue'|translate|escape:javascript}'
str_meta_no = '{'No, I have changed my mind'|translate|escape:javascript}'
@@ -69,6 +64,9 @@ const strs_privacy = {
"3" : "{$level_options[1]}",
"4" : "{$level_options[0]}",
};
const all_related_categories_ids = [];
let related_categories_ids = [];
let b_current_picture_id;
{/footer_script}
@@ -107,8 +105,8 @@ const strs_privacy = {
</div>
</div>
{foreach from=$elements item=element}
{footer_script}
var related_category_ids_{$element.ID} = {$element.related_category_ids};
{footer_script}
all_related_categories_ids.push({ id: {$element.ID}, cat_ids: {$element.related_category_ids} });
url_delete_{$element.id} = '{$element.U_DELETE}';
{/footer_script}
<div class="success deleted-badge" data-image_id="{$element.ID}" style="display: none;">
@@ -331,6 +329,7 @@ const strs_privacy = {
{include file='include/album_selector.inc.tpl'
title={'Associate to album'|@translate}
searchPlaceholder={'Search'|@translate}
admin_mode=true
}
<style>
.selectize-input .item,
admin/themes/default/template/cat_modify.tpl
+2 -18
View File
@@ -18,6 +18,7 @@ const nb_sub_albums = {$NB_SUBCATS}
const pwg_token = '{$PWG_TOKEN}'
const u_delete = '{$U_DELETE}'
var is_visible = '{$IS_VISIBLE}'
let related_categories_ids = ["{$CAT_ID}", "{$PARENT_CAT_ID}"];
const str_cancel = '{'No, I have changed my mind'|@translate|@escape}'
const str_delete_album = '{'Delete album'|@translate|escape:javascript}'
@@ -28,12 +29,7 @@ const str_dont_delete_photos = '{'delete only album, not photos'|@translate|esca
const str_delete_orphans = '{'delete album and the %d orphan photos'|@translate|escape:javascript}';
const str_delete_all_photos = '{'delete album and all %d photos, even the %d associated to other albums'|@translate|escape:javascript}';
str_albums_found = '{"<b>%d</b> albums found"|translate|escape:javascript}';
str_album_found = '{"<b>1</b> album found"|translate|escape:javascript}';
str_result_limit = '{"<b>%d+</b> albums found, try to refine the search"|translate|escape:javascript}';
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}';
str_album_comment_allow = '{'Comments allowed for sub-albums'|@translate|escape:javascript}';
str_album_comment_disallow = '{'Comments disallowed for sub-albums'|@translate|escape:javascript}';
str_root = '{'Root'|@translate|escape:javascript}';
@@ -153,6 +149,7 @@ str_root = '{'Root'|@translate|escape:javascript}';
title={'New parent album'|@translate}
searchPlaceholder={'Search'|@translate}
show_root_btn=true
admin_mode=true
}
{if isset($CAT_COMMENTABLE)}
@@ -268,19 +265,6 @@ str_root = '{'Root'|@translate|escape:javascript}';
border-bottom-right-radius: 10px;
}
.put-to-root {
width: 220px;
margin-top: 5px;
}
.put-to-root p {
margin: 0 auto;
}
.notClickable {
opacity: 0.5;
pointer-events: none;
}
.cat-modify-footer .spinner {
width: 20px;
height: 20px;
admin/themes/default/template/include/album_selector.inc.tpl
+86 -28
View File
@@ -1,53 +1,111 @@
{if empty($load_mode)}{$load_mode='footer'}{/if}
{if !isset($show_root_btn)}{$show_root_btn=false}{/if}
{if !isset($admin_mode)}{$method_pwg="pwg.categories.getList"}{$admin_mode=false}{else}{$method_pwg="pwg.categories.getAdminList"}{/if}
{include file='include/colorbox.inc.tpl' load_mode=$load_mode}
{combine_css path="admin/themes/default/css/components/album_selector.css"}
{combine_css path="themes/default/vendor/fontello/css/gallery-icon.css" order=-10}
{combine_script id='albumSelector' load=$load_mode path='admin/themes/default/js/album_selector.js'}
{combine_script id='common' load='footer' path='admin/themes/default/js/common.js'}
{footer_script}
str_no_search_in_progress = '{'No search in progress'|@translate|escape:javascript}';
str_albums_found = '{"<b>%d</b> albums found"|translate}';
str_album_found = '{"<b>1</b> album found"|translate}';
{if isset($api_method)}
api_method = '{$api_method}';
{else}
api_method = 'pwg.categories.getAdminList';
{/if}
const limit_params = 50;
const methodPwg = "{$method_pwg|escape:javascript}";
const in_admin_mode = {$admin_mode|json_encode};
const str_plus_albums_found = "{'Only the first %d albums are displayed, out of %d.'|@translate|escape:javascript}"
const str_album_selected = "{'Album already selected'|@translate|escape:javascript}"
const str_already_in_related_cats = '{'This albums is already in related categories list'|translate|escape:javascript}';
const str_no_search_in_progress = '{'No search in progress'|@translate|escape:javascript}';
const str_albums_found = '{"<b>%d</b> albums found"|translate}';
const str_album_found = '{"<b>1</b> album found"|translate}';
const str_result_limit = '{"<b>%d+</b> albums found, try to refine the search"|translate|escape:javascript}';
const str_add_subcat_of = '{"Add a sub-album to “%s”"|translate|escape:javascript}';
const str_create_and_select = '{"Create and select"|translate|escape:javascript}';
const str_root_album_select = '{"Root"|translate|escape:javascript}';
const str_complete_name_field = '{"Name field must not be empty"|translate|escape:javascript}';
const str_an_error_has_occured = '{"An error has occured"|translate|escape:javascript}';
const str_album_modal_title = '{$title|escape:javascript}';
{/footer_script}
<div id="addLinkedAlbum" class="linkedAlbumPopIn">
<div class="linkedAlbumPopInContainer">
<a class="icon-cancel ClosePopIn"></a>
<div class="linkedAlbumPopInContainer {if $admin_mode and $show_root_btn}{'big'}{/if}">
<a class="gallery-icon-cancel ClosePopIn" id="closeAlbumPopIn"></a>
<div class="AddIconContainer">
<span class="AddIcon icon-blue icon-plus-circled"></span>
<span class="AddIcon icon-blue gallery-icon-plus-circled"></span>
</div>
<div class="AddIconTitle">
<span>{$title}</span>
<span id="linkedModalTitle">{$title}</span>
</div>
<div class="album-selector" id="linkedAlbumSelector">
{if $show_root_btn}
<label class="head-button-2 put-to-root-container">
<p class="icon-home">{'Put at the root'|@translate}</p>
</label>
<p class="put-to-root-container">{'or'|@translate}</p>
{/if}
{if $show_root_btn}
<label class="head-button-2 put-to-root">
<p class="icon-home">{'Put at the root'|@translate}</p>
</label>
<p>{'or'|@translate}</p>
{/if}
<div id="linkedAlbumSearch">
<span class='icon-search search-icon'> </span>
<span class="icon-cancel search-cancel-linked-album"></span>
<input class='search-input' type='text' placeholder={$searchPlaceholder}>
<div id="linkedAlbumSearch">
<span class='icon-search search-icon'> </span>
<span class="icon-cancel search-cancel-linked-album"></span>
<input class='search-input' type='text' placeholder={$searchPlaceholder}>
</div>
<div class="limitReached"></div>
<div class="noSearch"></div>
<div class="searching gallery-icon-spin6 animate-spin"> </div>
</div>
<div class="limitReached"></div>
<div class="noSearch"></div>
<div class="searching icon-spin6 animate-spin"> </div>
<div id="searchResult">
</div>
{if $admin_mode}
<div class="album-create" id="linkedAlbumCreate">
<div class="linked-album-subtitle">
<p id="linkedAlbumSubtitle" >Add a sub-album of “Album 3”</p>
</div>
<div class="linked-album-input-container album-name">
<label class="user-property-label">{'Album name'|@translate}
<input class="user-property-input" id="linkedAlbumInput"/>
</label>
</div>
<div class="linked-album-input-container">
<label class="user-property-label">{'Position'|@translate}
<div class="linked-add-radio-input">
<input type="radio" id="place-start" name="position" value="first" checked>
<label for="place-start">{'Place first'|translate}</label>
</div>
<div class="linked-add-radio-input">
<input type="radio" id="place-end" name="position" value="last">
<label for="place-end">{'Place last'|translate}</label>
</div>
</label>
</div>
<div class="AddAlbumErrors">
<p class="icon-cancel" id="linkedAddAlbumErrors">omg big big error</p>
</div>
<div class="linked-album-create-btn">
<p class="linked-button-cancel" id="linkedAlbumCancel">{'Cancel'|translate}</p>
<p class="buttonLike icon-plus" id="linkedAddNewAlbum">{'Create and select'|translate}</p>
</div>
</div>
<div class="album-switch-bottom" id="linkedAlbumSwitch">
<div class="album-switch-container">
<div class="switch-input">
<label class="switch">
<input type="checkbox" name="locked" id="album-create-check" value="true">
<span class="slider round"></span>
</label>
<label class="switch-label" for="album-create-check"><span>{'Creation mode'|translate}</span> <i class="icon-help-circled tiptip" style="cursor:help" title="{"Activate create mode to create and select an album"|translate}"></i></label>
</div>
<p class="head-button-2 icon-plus-circled linked-add-album" id="linkedAddAlbum"> {"Create a root album"|translate}</p>
</div>
</div>
{/if}
</div>
</div>
admin/themes/default/template/picture_modify.tpl
+1 -5
View File
@@ -49,14 +49,9 @@ str_are_you_sure = '{'Are you sure?'|translate|escape:javascript}';
str_yes = '{'Yes, delete'|translate|escape:javascript}';
str_no = '{'No, I have changed my mind'|translate|@escape:'javascript'}';
url_delete = '{$U_DELETE}';
str_albums_found = '{"<b>%d</b> albums found"|translate|escape:javascript}';
str_album_found = '{"<b>1</b> album found"|translate|escape:javascript}';
str_result_limit = '{"<b>%d+</b> albums found, try to refine the search"|translate|escape:javascript}';
str_orphan = '{'This photo is an orphan'|@translate|escape:javascript}';
str_no_search_in_progress = '{'No search in progress'|@translate|escape:javascript}';
related_categories_ids = {$related_categories_ids|@json_encode};
str_already_in_related_cats = '{'This albums is already in related categories list'|translate|escape:javascript}';
{literal}
$('#action-delete-picture').on('click', function() {
@@ -238,6 +233,7 @@ $('#action-delete-picture').on('click', function() {
{include file='include/album_selector.inc.tpl'
title={'Associate to album'|@translate}
searchPlaceholder={'Search'|@translate}
admin_mode=true
}
<style>
admin/themes/default/template/user_list.tpl
-8
View File
@@ -1845,14 +1845,6 @@ $(document).ready(function() {
background-color: transparent;
}
.user-property-input {
width: 100%;
box-sizing:border-box;
font-size:1.1em;
padding:8px 16px;
border:none;
}
{* .AddUserPopInContainer .user-property-input {
background-color: #F3F3F3;
} *}
admin/themes/default/theme.css
+12 -125
View File
@@ -4348,14 +4348,6 @@ a#showPermissions:hover {text-decoration: none;}
background-color: white;
}
.ClosePopIn {
position: absolute;
right: -40px;
top: -40px;
font-size: 30px;
color: white;
}
.AddIcon {
border-radius: 9999px;
padding: 10px;
@@ -6896,6 +6888,18 @@ color:#FF7B00;
.user-property-input {
color:#353535;
background-color:#F3F3F3;
width: 100%;
box-sizing:border-box;
font-size:1.1em;
padding:8px 16px;
border:none;
}
.user-property-label {
color:#A4A4A4;
font-weight:bold;
font-size:1.1em;
margin-bottom:5px;
}
.user-property-input[type="text"] {
@@ -7156,123 +7160,6 @@ color:#FF7B00;
color: #3A3A3A;
}
#addLinkedAlbum {
display:none;
}
.linkedAlbumPopIn {
position: fixed;
z-index: 102;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0,0,0,0.7);
}
.linkedAlbumPopInContainer {
display:flex;
position:absolute;
left:50%;
top: 50%;
transform:translate(-50%, -48%);
text-align:left;
padding:20px;
flex-direction:column;
border-radius:15px;
align-items:center;
width: 400px;
height: 400px;
}
.linkedAlbumPopInContainer .AddIconContainer {
margin-top: 20px;
}
.ClosePopIn {
position: absolute;
right: -40px;
top: -40px;
font-size: 30px;
color: white;
}
.linkedAlbumPopInContainer .AddIcon {
border-radius: 9999px;
padding: 10px;
font-size: 2em;
}
.AddIconTitle {
font-size: 1.4em;
font-weight: bold;
text-align: center;
margin-bottom: 10px;
margin-top: 15px;
}
#linkedAlbumSearch .search-icon {
position: absolute;
transform: translate(7px, 8px);
font-size: 18px;
top: auto;
}
.linkedAlbumPopInContainer #searchResult {
width: 100%;
overflow-y: auto;
max-height: 400px;
margin: 10px 0 0 0;
}
.search-cancel-linked-album {
opacity: 0.4;
cursor: pointer;
position: absolute;
font-size: 18px;
transform: translate(215px, 8px);
}
.search-cancel-linked-album:hover {
opacity: 1;
}
.search-result-item {
margin: 10px 0px;
padding: 5px 10px;
height: 25px;
background-color: #fafafa;
box-shadow: 0px 2px #00000024;
border-radius: 5px;
font-weight: bold;
color: #777;
display: flex;
align-items: center;
cursor: pointer;
}
.search-result-path {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 80%;
direction: rtl;
text-align: left;
}
.search-result-item .icon-plus-circled{
margin-left: auto;
cursor: pointer;
}
.search-result-item .notClickable {
opacity: 0.3;
}
.linkedAlbumPopInContainer .searching {
margin-top: 10px;
}
.invisible-related-categories-select {
display: none;
}
language/en_UK/admin.lang.php
+6
View File
@@ -1368,4 +1368,10 @@ $lang['image(s) contains unsaved changes'] = 'image(s) contains unsaved changes'
$lang['Pagination has changed and needs to be reloaded !'] = 'Pagination has changed and needs to be reloaded !';
$lang['Metadata sync complete'] = 'Metadata sync complete';
$lang['Save'] = 'Save';
$lang['Creation mode'] = 'Creation mode';
$lang['Create and select'] = 'Create and select';
$lang['Add a sub-album to “%s”'] = 'Add a sub-album to “%s”';
$lang['Activate create mode to create and select an album'] = 'Activate create mode to create and select an album';
$lang['Name field must not be empty'] = 'Name field must not be empty';
$lang['Create a root album'] = 'Create a root album';
// Leave this line empty
language/fr_FR/admin.lang.php
+6
View File
@@ -1368,4 +1368,10 @@ $lang['image(s) contains unsaved changes'] = 'image(s) ne sont pas sauvegardées
$lang['Pagination has changed and needs to be reloaded !'] = "La pagination a changée et nécessite d'être rechargée !";
$lang['Metadata sync complete'] = 'Méta-données synchronisées';
$lang['Save'] = 'Enregistrer';
$lang['Creation mode'] = 'Mode création';
$lang['Create and select'] = 'Créer et sélectionner';
$lang['Add a sub-album to “%s”'] = 'Ajouter un sous-album à “%s”';
$lang['Activate create mode to create and select an album'] = 'Activer le mode création pour créer et sélectionner un album';
$lang['Name field must not be empty'] = 'Le champ nom ne doit pas être vide';
$lang['Create a root album'] = 'Créer un album racine';
// Leave this line empty
themes/default/css/clear-search.css
-4
View File
@@ -190,10 +190,6 @@
color: #ff7700;
}
.linkedAlbumPopIn {
background-color: rgba(0,0,0,0.7);
}
.linkedAlbumPopInContainer {
background-color: white;
}
themes/default/css/dark-search.css
-4
View File
@@ -184,10 +184,6 @@
color: #ff7700bb;
}
.linkedAlbumPopIn {
background-color: rgba(0,0,0,0.7);
}
.linkedAlbumPopInContainer {
background-color: #555;
}
themes/default/css/search.css
+4 -153
View File
@@ -463,6 +463,10 @@
.breadcrumb-item .link-path {
margin-right: 15px;
white-space: nowrap;
max-width: 350px;
overflow-x: hidden;
direction: rtl;
text-overflow: ellipsis;
}
.breadcrumb-item .remove-item {
@@ -489,124 +493,6 @@
transition: 0.3s;
}
#addLinkedAlbum {
display:none;
}
.linkedAlbumPopIn {
position: fixed;
z-index: 100;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
}
.linkedAlbumPopInContainer {
display:flex;
position:absolute;
left:50%;
top: 50%;
transform:translate(-50%, -48%);
text-align:left;
padding:20px;
flex-direction:column;
border-radius:15px;
align-items:center;
width: 400px;
height: 400px;
}
.linkedAlbumPopInContainer .AddIconContainer {
margin-top: 20px;
}
.ClosePopIn {
position: absolute;
right: -40px;
top: -40px;
font-size: 30px;
}
.ClosePopIn:hover {
text-decoration: none;
cursor: pointer;
}
.linkedAlbumPopInContainer .AddIcon {
border-radius: 9999px;
padding: 10px;
font-size: 2em;
}
.AddIconTitle {
font-size: 1.4em;
font-weight: bold;
text-align: center;
margin-bottom: 10px;
margin-top: 15px;
}
#linkedAlbumSearch .search-icon {
position: absolute;
transform: translate(7px, 8px);
font-size: 18px;
top: auto;
}
.linkedAlbumPopInContainer #searchResult {
width: 100%;
overflow-y: auto;
max-height: 400px;
margin: 10px 0 0 0;
}
.search-cancel-linked-album {
opacity: 0.4;
cursor: pointer;
position: absolute;
font-size: 18px;
transform: translate(215px, 8px);
}
.search-cancel-linked-album:hover {
opacity: 1;
}
.search-result-item {
margin: 10px 0px;
padding: 5px 10px;
height: 25px;
border-radius: 5px;
font-weight: bold;
display: flex;
align-items: center;
cursor: pointer;
}
.search-result-path {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 80%;
direction: rtl;
text-align: left;
}
.search-result-item .gallery-icon-plus-circled{
margin-left: auto;
cursor: pointer;
}
.search-result-item .notClickable {
opacity: 0.3;
}
.linkedAlbumPopInContainer .searching {
margin-top: 10px;
}
.clear-all {
cursor: not-allowed;
font-weight: 600;
@@ -765,41 +651,6 @@
margin-bottom:10px;
}
.display-subcat {
margin-right: 2px;
}
.display-subcat:hover {
cursor: pointer;
}
.display-subcat::before {
transition: 0.5s;
transform: rotate(90deg);
}
.display-subcat.open::before {
transform: rotate(180deg);
}
.prefill-results-item {
width: 100%;
height: 100%;
display: flex;
align-items: center;
}
.search-result-subcat-item {
display: none;
}
.search-result-item.already-in {
cursor: default;
}
.and-more{
text-align: center;
}
@media (max-width: 600px) {
html, body {
max-width: 100%;
themes/default/js/mcs.js
+2 -150
View File
@@ -721,38 +721,9 @@ $(document).ready(function () {
});
$(".add-album-button").on("click", function () {
$("#linkedAlbumSearch .search-cancel-linked-album").hide();
prefill_search();
linked_albums_open();
set_up_popin();
open_album_selector();
});
$("#linkedAlbumSearch .search-input").on('input', function () {
const clear_button = $("#linkedAlbumSearch .search-cancel-linked-album");
if ($(this).val() != 0) {
clear_button.show();
clear_button.on('click', function () {
$("#linkedAlbumSearch .search-input").val('');
$(".limitReached").html(str_no_search_in_progress);
$("#searchResult").empty();
prefill_search();
$(this).hide();
});
} else {
clear_button.hide();
}
// Search input value length required to start searching
if ($(this).val().length > 0) {
$("#searchResult").empty();
linked_albums_search($(this).val());
} else {
$(".limitReached").html(str_no_search_in_progress);
$("#searchResult").empty();
prefill_search();
}
})
/**
* Author Widget
*/
@@ -1113,125 +1084,6 @@ function performSearch(params, reload = false) {
});
}
function set_up_popin() {
$(".ClosePopIn").on('click', function () {
linked_albums_close();
});
$("#addLinkedAlbum").on('keyup', function (e) {
// 27 is 'Escape'
if(e.keyCode === 27) {
linked_albums_close();
}
})
}
function linked_albums_close() {
$("#addLinkedAlbum").fadeOut();
}
function fill_results(cats) {
$("#searchResult").empty();
cats.forEach(cat => {
if (!related_categories_ids.includes(cat.id)) {
$("#searchResult").append(
"<div class='search-result-item' id="+ cat.id + ">" +
"<span class='search-result-path'>" + cat.name +"</span><span id="+ cat.id + " class='gallery-icon-plus-circled item-add'></span>" +
"</div>"
);
$(".search-result-item#"+ cat.id).on("click", function () {
add_related_category(cat.id, cat.name);
});
}
});
}
function prefill_results(rank, cats, limit) {
// get where appends data
let display_div = '';
if ('root' == rank){
$("#searchResult").empty();
display_div = '#searchResult';
} else {
display_div = '#subcat-'+rank;
}
cats.forEach(cat => {
let subcat = '';
if (cat.nb_categories > 0) {
subcat = "<span id=" + cat.id + " class='display-subcat gallery-icon-up-open'></span>"
}
if (!related_categories_ids.includes(cat.id)) {
$(display_div).append(
"<div class='search-result-item' id="+ cat.id + ">" +
subcat +
"<div class='prefill-results-item available' id=" + cat.id + ">" +
"<span class='search-result-path'>" + cat.name +"</span>" +
"<span id="+ cat.id + " class='gallery-icon-plus-circled item-add'></span>" +
"</div>" +
"</div>"
);
} else {
$(display_div).append(
"<div class='search-result-item already-in' id="+ cat.id + ">" +
subcat +
"<div class='prefill-results-item' id=" + cat.id + ">" +
"<span class='search-result-path'>" + cat.name +"</span>" +
"<span id="+ cat.id + " class='gallery-icon-plus-circled item-add notClickable' title='" + str_album_selected + "'></span>" +
"</div>" +
"</div>"
);
}
if (rank !== 'root') {
const item = $("#"+rank+".search-result-item");
const margin_left = parseInt(item.css('margin-left')) + 25;
$("#"+cat.id+".search-result-item").css('margin-left', margin_left);
}
$("#"+cat.id+".prefill-results-item.available").on("click", function () {
add_related_category(cat.id, cat.name);
});
$("#"+cat.id+".display-subcat").on('click', function () {
const cat_id = $(this).prop('id');
if($(this).hasClass('open')){
// CLOSING SUBCAT
$(this).removeClass('open');
$("#subcat-"+cat.id).fadeOut();
} else {
// OPENING SUBCAT
// if subcat div exist
if ($("#subcat-"+cat.id).length){
$(this).addClass('open');
$("#subcat-"+cat.id).fadeIn();
} else { // if subcat div doesn't exist
$("#"+cat_id+".display-subcat").removeClass('gallery-icon-up-open').addClass('gallery-icon-spin6 animate-spin');
$("#"+cat_id+".search-result-item").after(`<div id="subcat-${cat_id}" class="search-result-subcat-item"></div>`);
prefill_search_subcats(cat_id).then(() => {
$("#"+cat_id+".display-subcat").removeClass('gallery-icon-spin6 animate-spin').addClass('gallery-icon-up-open');
$(this).addClass('open');
$("#subcat-"+cat.id).fadeIn();
});
}
}
});
});
// for debug
// console.log(limit);
if (limit.remaining_cats > 0) {
const text = sprintf(str_plus_albums_found, limit.limited_to, limit.total_cats);
$(display_div).append(
"<p class='and-more'>" + text + "</p>"
);
}
}
function add_related_category(cat_id, cat_link_path) {
$(".selected-categories-container").append(
"<div class='breadcrumb-item'>" +
@@ -1246,7 +1098,7 @@ function add_related_category(cat_id, cat_link_path) {
remove_related_category($(this).attr("id"));
});
linked_albums_close();
close_album_selector();
}
function remove_related_category(cat_id) {
themes/default/template/include/search_filters.inc.tpl
-1
View File
@@ -322,7 +322,6 @@ const prefix_icon = 'gallery-icon-';
title={'Search in albums'|@translate}
searchPlaceholder={'Search'|@translate}
show_root_btn=false
api_method='pwg.categories.getList'
}
{if isset($AUTHORS)}
<div class="filter filter-authors">