Issue #1193 : Minor design fixes, ban navigator cache on tag's page

admin/themes/default/js/tags.js

@@ -148,6 +148,7 @@ function addTag(name) {
           $('.tag-container').prepend(newTag);
           setupTagbox(newTag);
           updateBadge();
+          updateSearchInfo();
 
           //Update the data
           dataTags.unshift({
@@ -288,6 +289,7 @@ function removeTag(id, name) {
             dataTags = dataTags.filter((tag) => tag.id != id);
             showMessage(str_tag_deleted.replace('%s', name));
             updateBadge();
+            updateSearchInfo();
             updatePaginationMenu();
           } else {
             showError('A problem has occured')
@@ -300,6 +302,8 @@ function removeTag(id, name) {
 }
 
 function renameTag(id, new_name) {
+  console.log('problème');
+  
   return new Promise((resolve, reject) => {
     jQuery.ajax({
       url: "ws.php?format=json&method=pwg.tags.rename",
@@ -376,7 +380,8 @@ function duplicateTag(id, name) {
             url_name: data.result.url_name,
             counter : data.result.count
           });
-          updateBadge()
+          updateBadge();
+          updateSearchInfo();
           resolve(data);
         }
       },
@@ -510,11 +515,10 @@ function updateSelectionContent() {
     $('#MergeSelectionMode').removeClass('unavailable');
     if (mergeOption) {
       $('#MergeOptionsBlock').show();
-      $('.selection-mode-tag').hide();
       updateMergeItems();
     } else {
-    $('#MergeOptionsBlock').hide();
-    $('.selection-mode-tag').show();
+      $('#MergeOptionsBlock').hide();
+      $('.selection-mode-tag').show();
     }
   }
 }
@@ -533,9 +537,12 @@ $('#selectAll').on('click', function() {
   selectAll(tagToDisplay())
   updateSelectionContent();
   if (selected.length < dataTags.length) {
-    showSelectMessage(str_selection_done, str_select_all_tag, function() {
-      $('.tag-select-message div').html("");
-      $('.tag-select-message a').html("<i class='icon-spin6 animate-spin'> </i>");
+    showSelectMessage(
+      str_selection_done.replace('%d', $('.tag-box').length), 
+      str_select_all_tag.replace('%d', dataTags.length), 
+      function() {
+      $('.tag-select-message a').html("");
+      $('.tag-select-message div').html("<i class='icon-spin6 animate-spin'> </i>");
       setTimeout(() => {
         selectAll(dataTags).then(() => {
           updateSelectionContent();
@@ -665,6 +672,7 @@ function removeSelectedTags() {
             clearSelection();
             updatePaginationMenu();
             updateBadge();
+            updateSearchInfo();
           } else {
             return raw_data;
           }
@@ -734,6 +742,7 @@ function mergeGroups(destination_id, merge_ids) {
             clearSelection();
             updatePaginationMenu();
             updateBadge()
+            updateSearchInfo()
           } else {
             return raw_data;
           }
@@ -936,7 +945,7 @@ function updatePage() {
     newPage = actualPage;
     dataToDisplay = tagToDisplay();
     tagBoxes = $('.tag-box');
-    $('.pageLoad').animate({opacity:1}, 200);
+    $('.pageLoad').fadeIn();;
     $('.tag-box, .tag-pagination').animate({opacity:0}, 500).promise().then(() => {
 
       let displayTags = new Promise((res, rej) => {
@@ -970,11 +979,12 @@ function updatePage() {
       })
 
       displayTags.then(() => {
-        $('.pageLoad').animate({opacity:0}, 200);
+        $('.pageLoad').fadeOut();
         $('.tag-box').animate({opacity:1}, 500);
         if (getNumberPages() > 1) {
           $('.tag-pagination').animate({opacity:1}, 500);
         }
+        updateSearchInfo();
         resolve()
       }) 
     });
@@ -1006,3 +1016,11 @@ $('.tag-pagination-select input[type="radio"]').on('click',function () {
   per_page = parseInt($(this).val());
   updatePaginationMenu();
 })
+
+function updateSearchInfo () {
+  $('.search-info').html(str_showing.replace('%d1', $('.tag-box').length).replace('%d2', dataTags.length));
+}
+
+$(function() {
+  updateSearchInfo();
+})

admin/themes/default/template/tags.tpl

@@ -20,10 +20,12 @@ var str_and_others_tags = '{'and %s others'|@translate}';
 var str_others_tags_available = '{'%s other tags available...'|@translate}'
 var str_number_photos = '{'%d photos'}'
 var str_no_photos = '{'no photo'}'
-var str_select_all_tag = '{'Select all tags'|@translate}';
+var str_select_all_tag = '{'Select all %d tags'|@translate}';
 var str_clear_selection = '{'Clear Selection'|@translate}';
-var str_selection_done = '{'Selection done in this page only'|@translate}';
+var str_selection_done = '{'The %d tags on this page are selected'|@translate}';
 var str_tag_selected = '{'<b>%d</b> tag selected'|@translate}';
+var str_showing = '{'Showing <b>%d1</b> out of <b>%d2</b>'|@translate}';
+var str_filtered_on = '{'Filtered on <b>%d</b> tags'|@translate}';
 {/footer_script}
 
 {combine_script id='common' load='footer' path='admin/themes/default/js/common.js'}
@@ -33,6 +35,10 @@ var str_tag_selected = '{'<b>%d</b> tag selected'|@translate}';
 {combine_script id='tiptip' load='header' path='themes/default/js/plugins/jquery.tipTip.minified.js'}
 {combine_script id='tags' load='footer' path='admin/themes/default/js/tags.js'}
 
+<meta http-equiv='cache-control' content='no-cache'>
+<meta http-equiv='expires' content='0'>
+<meta http-equiv='pragma' content='no-cache'>
+
 {function name=tagContent}
 {function tagContent}
     <p class='tag-name'>{$tag_name}</p>
@@ -107,6 +113,7 @@ var str_tag_selected = '{'<b>%d</b> tag selected'|@translate}';
 
 <div class='tag-header'>
   <div id='search-tag'>
+    <div class='search-info'> </div>
     <span class='icon-filter search-icon'> </span>
     <span class="icon-cancel search-cancel"></span>
     <input class='search-input' type='text' placeholder='{'Filter'|@translate}'>

admin/themes/default/theme.css

@@ -262,6 +262,14 @@ TABLE.doubleSelect SELECT.categoryList {
   background-color: #f0f0f0 !important;
 }
 
+.search-info {
+  position: absolute;
+  left: 0px;
+  top: 50%;
+  transform: translate(-100%,-50%);
+  font-style: italic;
+}
+
 .search-cancel {
   display: none;
   right: 5px;
@@ -3557,7 +3565,7 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
   margin: auto;
   justify-content: space-between;
   color: white;
-  border-bottom: solid 1px #ffffff17;
+  border-bottom: solid 1px #00000017;
   padding: 5px 10px; 
   min-width: 150px;
 }
@@ -3691,20 +3699,31 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
 }
 
 .tag-select-message {
-  margin-right: 223px;
-  background: #ffbf0042;
-  height: 40px;
+  background: #bce5f7;
+  height: 46px;
   display: flex;
   justify-content: center;
   align-items: center;
   font-size: 14px;
   display: none;
+  margin: 10px;
+  margin-right: 223px;
+  color: #0051a5;
+  font-weight: 600;
 }
 
 .tag-select-message a{
   font-weight: bold;
-  color: #ffa646;
   margin-left: 6px;
+  background-color: #0051a5;
+  color: white;
+  padding: 0px 4px;
+}
+
+.tag-select-message a:hover {
+  color: white;
+  text-decoration: none;
+  background-color: #002e5f;
 }
 
 .tag-pagination {
@@ -3839,10 +3858,10 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
 }
 
 .pageLoad {
+  display: none;
   text-align: center;
   margin-right: 223px;
   position: absolute;
-  opacity: 0;
   left: 50%;
   z-index: 100;
   transform: translateY(50px);