related to #1704 Added alert is album is locked

* Corrected french sentences spelled wrong
* Added max length for album names in breadcrumbs
* Added attribute 'visible' in categories.setInfos
* Can now unlock an album by clicking on the alert
* Switch used to lock an album works properly now

admin/cat_modify.php

@@ -159,6 +159,9 @@ if (!empty($category['id_uppercat']))
   $self_url.= '&parent_id='.$category['id_uppercat'];
 }
 
+// We show or hide this warning in JS
+$page['warnings'][] = l10n('This album is currently locked, visible only to administrators.').'<span class="icon-key unlock-album">'.l10n('Unlock it').'</span>';
+
 $template->assign(
   array(
     'CATEGORIES_NAV'     => preg_replace("# {2,}#"," ",preg_replace("#(\r\n|\n\r|\n|\r)#"," ",$navigation)),
@@ -167,7 +170,7 @@ $template->assign(
     'CAT_ID'             => $category['id'],
     'CAT_NAME'           => @htmlspecialchars($category['name']),
     'CAT_COMMENT'        => @htmlspecialchars($category['comment']),
-    'IS_LOCKED'          => $category['status'] == "private",
+    'IS_VISIBLE'          => boolean_to_string($category['visible']),
 
     'U_DELETE' => $base_url.'albums',
 

admin/themes/default/js/cat_modify.js

@@ -1,6 +1,56 @@
 jQuery(document).ready(function() {
   
-  activateCommentDropdown()
+  activateCommentDropdown();
+  checkAlbumLock();
+
+  $(".unlock-album").on('click', function () {
+    jQuery.ajax({
+      url: "ws.php?format=json&method=pwg.categories.setInfo",
+      type:"POST",
+      dataType: "json",
+      data: {
+        category_id: album_id,
+        visible: 'true',
+      },
+      success:function(data) {
+        if (data.stat == "ok") {
+
+          is_visible = 'true';
+          if ($("#cat-locked").is(":checked")) {
+            $("input[id='cat-locked']").trigger('click');
+          }
+          checkAlbumLock();
+
+          setTimeout(
+            function() {
+              $('.info-message').hide()
+            }, 
+            5000
+          )
+        } else {
+          $('.info-error').show()
+          setTimeout(
+            function() {
+              $('.info-error').hide()
+            }, 
+            5000
+          )
+        }
+      },
+      error:function(XMLHttpRequest, textStatus, errorThrows) {
+        save_button_set_loading(false)
+
+        $('.info-error').show()
+        setTimeout(
+          function() {
+            $('.info-error').hide()
+          }, 
+          5000
+        )
+        console.log(errorThrows);
+      }
+    });
+  })
 
   jQuery('.tiptip').tipTip({
     'delay' : 0,
@@ -21,8 +71,8 @@ jQuery(document).ready(function() {
         category_id: album_id,
         name: $("#cat-name").val(),
         comment: $("#cat-comment").val(),
-        status: $("#cat-locked").is(":checked")? "public":"private",
-        commentable: $("#cat-commentable").is(":checked")? "true":"false",
+        visible: $("#cat-locked").is(":checked") ? 'false' : 'true',
+        commentable: $("#cat-commentable").is(":checked") ? "true":"false",
         apply_commentable_to_subalbums: $("#cat-apply-commentable-on-sub").is(":checked")? "true":"false",
       },
       success:function(data) {
@@ -32,6 +82,10 @@ jQuery(document).ready(function() {
           $('.info-message').show()
           $('.cat-modification .cat-modify-info-subcontent').html(str_just_now)
           $('.cat-modification .cat-modify-info-content').html(str_just_now)
+
+          is_visible = $("#cat-locked").is(":checked") ? 'false' : 'true';
+          checkAlbumLock();
+
           setTimeout(
             function() {
               $('.info-message').hide()
@@ -410,6 +464,15 @@ jQuery(document).ready(function() {
   });
 });
 
+function checkAlbumLock() {
+  console.log(is_visible);
+  if (is_visible == 'true') {
+    $(".warnings").hide();
+  } else {
+    $(".warnings").show();
+  }
+}
+
 // Parent album popin functions
 function set_up_popin() {
   $(".ClosePopIn").on('click', function () {

admin/themes/default/template/cat_modify.tpl

@@ -17,6 +17,7 @@ const album_name = "{$CAT_NAME}"
 const nb_sub_albums = {$NB_SUBCATS}
 const pwg_token = '{$PWG_TOKEN}'
 const u_delete = '{$U_DELETE}'
+var is_visible = '{$IS_VISIBLE}'
 
 const str_cancel = '{'No, I have changed my mind'|@translate|@escape}'
 const str_delete_album = '{'Delete album'|@translate|escape:javascript}'
@@ -170,12 +171,12 @@ str_root = '{'Root'|@translate}';
       <div class="cat-modify-switch-container">
         <div class="switch-input">
           <label class="switch">
-            <input type="checkbox" name="locked" id="cat-locked" value="true" {if !$IS_LOCKED}checked{/if}>
+            <input type="checkbox" name="locked" id="cat-locked" value="true" {if $IS_VISIBLE == 'false'}checked{/if}>
             <span class="slider round"></span>
           </label>
           
         </div>    
-        <label class="switch-label" for="cat-locked"><span>{'Unlocked album'|@translate}</span> <i class="icon-help-circled tiptip" title="{'Locked albums are disabled for maintenance. Only administrators can view them in the gallery. Lock this album will also lock his Sub-albums'|@translate}" style="cursor:help"></i></label>
+        <label class="switch-label" for="cat-locked"><span>{'Locked album'|@translate}</span> <i class="icon-help-circled tiptip" title="{'Locked albums are disabled for maintenance. Only administrators can view them in the gallery. Lock this album will also lock his Sub-albums'|@translate}" style="cursor:help"></i></label>
       </div>
     </div>
   </div>

admin/themes/default/theme.css

@@ -404,6 +404,10 @@ LI.menuLi {
 }
 
 /* Cat Modify */
+.unlock-album {
+  cursor: pointer;
+}
+
 .cat-modify {
   height: calc(100vh - 192px);
   width: calc(100vw - 205px);
@@ -425,6 +429,25 @@ LI.menuLi {
 }
 .cat-modify-ariane a {
   white-space: nowrap;
+  max-width: 300px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+#cat-parent {
+  display: flex;
+  flex-direction: row;
+  white-space: nowrap;
+  flex-wrap: wrap;
+}
+#cat-parent span {
+  margin: 0 5px;
+}
+#cat-parent a {
+  max-width: 175px;
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .cat-modify-ariane > * {