ver. 0.274 - ShopProduct mass_edit + tree UI cleanup

admin/templates/articles/article-edit-custom-script.php

@@ -52,6 +52,49 @@ if (!empty($_COOKIE['cookie_menus'])) {
 <script type="text/javascript" src="/libraries/jquery/lozad.js"></script>
 
 <style type="text/css">
+  #fg-article-edit .layout-tree-toggle {
+    width: 18px;
+    height: 18px;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border: 0;
+    background: transparent;
+    padding: 0;
+    margin-right: 4px;
+    color: #666;
+    cursor: pointer;
+    text-indent: 0;
+    background-image: none !important;
+  }
+
+  #fg-article-edit .layout-tree-toggle:focus,
+  #fg-article-edit .layout-tree-toggle:active,
+  #fg-article-edit .layout-tree-toggle:focus-visible {
+    outline: none;
+    box-shadow: none;
+  }
+
+  #fg-article-edit li.sort-expanded > div .layout-tree-toggle i {
+    transform: rotate(90deg);
+  }
+
+  #fg-article-edit .sortable li.sort-branch > div > .layout-tree-toggle {
+    display: inline-flex;
+    float: none;
+    margin-right: 4px;
+  }
+
+  #fg-article-edit .menu_sortable .icheckbox_minimal-blue {
+    margin-top: 0;
+    margin-right: 5px;
+  }
+
+  #fg-article-edit .menu_sortable .g-checkbox {
+    position: relative;
+    overflow: hidden;
+  }
+
   .jconfirm.table-list-confirm-dialog .jconfirm-row {
     min-height: 100vh;
     display: flex;
@@ -371,9 +414,39 @@ if (!empty($_COOKIE['cookie_menus'])) {
       flash_swf_url: '/../libraries/plupload/plupload.flash.swf'
     });
 
+    function refreshTreeDisclosureState() {
+      $('ol.sortable li').each(function() {
+        var $li = $(this);
+        var hasChildren = $li.children('ol').children('li').length > 0;
+        var $disclose = $li.children('div').children('.disclose');
+
+        if (hasChildren) {
+          $li.removeClass('sort-leaf');
+          if (!$li.hasClass('sort-collapsed') && !$li.hasClass('sort-expanded')) {
+            $li.addClass('sort-collapsed');
+          }
+          $li.addClass('sort-branch');
+          $disclose.attr('aria-expanded', $li.hasClass('sort-expanded') ? 'true' : 'false');
+          $disclose.show();
+        } else {
+          $li.removeClass('sort-branch sort-collapsed sort-expanded').addClass('sort-leaf');
+          $disclose.attr('aria-expanded', 'false');
+          $disclose.hide();
+        }
+      });
+    }
+
+    if ($.fn && typeof $.fn.iCheck === 'function') {
+      $('#fg-article-edit .menu_sortable .g-checkbox').iCheck({
+        checkboxClass: 'icheckbox_minimal-blue',
+        radioClass: 'iradio_minimal-blue'
+      });
+    }
+
     $('ol.sortable').nestedSortable({
       forcePlaceholderSize: true,
       handle: 'div',
+      cancel: 'input,textarea,button,select,option,.icheckbox_minimal-blue,.iradio_minimal-blue,ins.iCheck-helper',
       helper: 'clone',
       items: 'li',
       opacity: .6,
@@ -390,8 +463,17 @@ if (!empty($_COOKIE['cookie_menus'])) {
       }
     });
 
+    refreshTreeDisclosureState();
+
     $('.disclose').on('click', function() {
-      $(this).closest('li').toggleClass('sort-collapsed').toggleClass('sort-expanded');
+      var $li = $(this).closest('li');
+      if (!$li.hasClass('sort-branch')) {
+        return;
+      }
+
+      $li.toggleClass('sort-collapsed').toggleClass('sort-expanded');
+      $(this).attr('aria-expanded', $li.hasClass('sort-expanded') ? 'true' : 'false');
+      this.blur();
     });
 
     $('.disclose').mousedown(function(e) {
@@ -423,10 +505,10 @@ if (!empty($_COOKIE['cookie_menus'])) {
     });
 
     <?php foreach ($cookiePages as $key => $val): ?>
-      <?php if ($val): ?>$('.<?= htmlspecialchars((string)$key, ENT_QUOTES, 'UTF-8') ?>').children('div').children('span.disclose').click();<?php endif; ?>
+      <?php if ($val): ?>$('.list_<?= (int)$key ?>').children('div').children('.disclose').click();<?php endif; ?>
     <?php endforeach; ?>
     <?php foreach ($cookieMenus as $key => $val): ?>
-      <?php if ($val): ?>$('.menu_<?= (int)$key ?>').children('div').children('span.disclose').click();<?php endif; ?>
+      <?php if ($val): ?>$('.menu_<?= (int)$key ?>').children('div').children('.disclose').click();<?php endif; ?>
     <?php endforeach; ?>
 
     $('body').on('change', '.image-alt', function() {

admin/templates/articles/subpages-list.php

@@ -3,8 +3,11 @@
     <? foreach ( $this -> pages as $page ):?>
       <li id="list_<?= $page['id'];?>" idk="<?= $page['id'];?>" class="sort-nonesting list_<?= $page['id'];?>" menu="<?= $page['menu_id'];?>">
         <div class="content <?= $this -> step < 2 ? $tmp = 'content_page' : $tmp = 'content_page_last_level';?>" <? if ( !$page['status'] ) echo 'style="color: #cc0000;"';?>>
-          <span class="disclose"><span></span></span>
-          <input type="checkbox" class="g-checkbox" name="pages[]" value="<?= $page['id'];?>" <? if ( is_array( $this -> article_pages ) and in_array( $page['id'], $this -> article_pages ) ):?>checked="checked"<? endif;?> /><?= $page['title'];?>
+          <button type="button" class="disclose layout-tree-toggle" aria-expanded="false" title="Rozwin / zwin">
+            <i class="fa fa-caret-right"></i>
+          </button>
+          <input type="checkbox" class="g-checkbox" name="pages[]" id="article_page_<?= $page['id'];?>" value="<?= $page['id'];?>" <? if ( is_array( $this -> article_pages ) and in_array( $page['id'], $this -> article_pages ) ):?>checked="checked"<? endif;?> />
+          <label for="article_page_<?= $page['id'];?>" class="mb0"><?= $page['title'];?></label>
         </div>
         <?= \Tpl::view( 'articles/subpages-list', [
           'pages' => $page['subpages'],