sibu 0.9.4 → 1.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 16fcabca38cde95976db8beeee9af23a7f2a98bd
-  data.tar.gz: 834031726d3d44f99b416a5a7500e6c381487434
+  metadata.gz: e6eb3cad54639de1385e45c0465b10aabeb58612
+  data.tar.gz: 456b3d03e871ddf4d74efec50ac7439361843591
 SHA512:
-  metadata.gz: '06682819d589f5619ec8214cf293942a97d533280f6e29ad895da7353032e98ae7559cc208b0d5f5058794ae8665d88867fe4bb3e4291b0fd79ea852c1309f10'
-  data.tar.gz: 03ce9e5e3d4fc9df431391fb61edad5f965d47404cd8cfc1de16cd2687d263f97fe4bb82b0a901b863cc9d995f06dbf96fe2ce69b810d3874c2934d38bcf2112
+  metadata.gz: 6ac41267562d922d72f7b6d61fc70a9adf039b53b6f2b23fdb611e7630667545831a1fb7d337aa65fdde806d32612cc0f32261b8147d26332966f4e4d1749c19
+  data.tar.gz: c8bd6917787c516117e671d09ebe3a57c4fd402f28dfbe2b6065260cc57d54c561b0016b478e71ce33dd6bb56764a049bec7492e507a0debb2934407f03c9632

data/app/assets/javascripts/sibu/sibu.js.erb

@@ -1,5 +1,3 @@
-//= require jquery
-//= require jquery_ujs
 //= require sibu/common
 //= require ../quill/quill
 //= require ../tabs/van11y-accessible-tab-panel-aria
@@ -140,7 +138,7 @@ function displayCurrentCenter(img, centerPos) {
 }
 
 function refreshAfterEdit(reload, sectionId) {
-    var baseUrl = window.location.href.split('?')[0];
+    var baseUrl = window.location.href.split('?')[0].replace(/#.+/, '');
     if (reload) {
         if (sectionId) {
             window.location.href = baseUrl + '?edit_section=' + sectionId;
@@ -152,6 +150,22 @@ function refreshAfterEdit(reload, sectionId) {
     }
 }
 
+function setLinkMode(elt) {
+    var selected = elt.value,
+        enabledElts = document.querySelector("#link_" + selected).querySelectorAll("#element_value, #element_target");
+    for (var i = 0; i < enabledElts.length; i++) {
+        enabledElts[i].removeAttribute("disabled");
+    }
+
+    var linkModes = document.querySelectorAll(".sibu_edit_form .link_mode");
+    for (var j = 0; j < linkModes.length; j++) {
+        if(linkModes[j].getAttribute("id") !== ("link_" + selected)) {
+            linkModes[j].querySelector("#element_value").setAttribute("disabled", "disabled");
+            linkModes[j].querySelector("#element_target").setAttribute("disabled", "disabled");
+        }
+    }
+}
+
 function initSectionsPanel() {
 
 }

data/app/assets/javascripts/tabs/van11y-accessible-tab-panel-aria.js

@@ -160,9 +160,10 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
      * @param  {Node} node Default document
      * @return {Array}
      */
+    // Note : patched to target only direct child nodes having .js-tabs class
     var $listTabs = function $listTabs() {
         var node = arguments.length <= 0 || arguments[0] === undefined ? doc : arguments[0];
-        return [].slice.call(node.querySelectorAll('.' + TABS_JS));
+        return [].slice.call(node.querySelectorAll(':scope > .' + TABS_JS));
     };
 
     /**
@@ -178,10 +179,10 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
             var hx = tabs_node.hasAttribute(TABS_DATA_HX) === true ? tabs_node.getAttribute(TABS_DATA_HX) : '';
             var hxGeneratedClass = tabs_node.hasAttribute(TABS_DATA_GENERATED_HX_CLASS) === true ? tabs_node.getAttribute(TABS_DATA_GENERATED_HX_CLASS) : TABS_HX_DEFAULT_CLASS;
             var existingHx = tabs_node.hasAttribute(TABS_DATA_EXISTING_HX) === true ? tabs_node.getAttribute(TABS_DATA_EXISTING_HX) : '';
-            var $tabList = [].slice.call(tabs_node.querySelectorAll('.' + TABS_JS_LIST));
-            var $tabListItems = [].slice.call(tabs_node.querySelectorAll('.' + TABS_JS_LISTITEM));
-            var $tabListLinks = [].slice.call(tabs_node.querySelectorAll('.' + TABS_JS_LISTLINK));
-            var $tabListPanels = [].slice.call(tabs_node.querySelectorAll('.' + TABS_JS_CONTENT));
+            var $tabList = [].slice.call(tabs_node.querySelectorAll(':scope > .' + TABS_JS_LIST));
+            var $tabListItems = [].slice.call(tabs_node.querySelectorAll(':scope > .' + TABS_JS_LIST + ' > .' + TABS_JS_LISTITEM));
+            var $tabListLinks = [].slice.call(tabs_node.querySelectorAll(':scope > .' + TABS_JS_LIST + ' > .' + TABS_JS_LISTITEM + ' > .' + TABS_JS_LISTLINK));
+            var $tabListPanels = [].slice.call(tabs_node.querySelectorAll(':scope > .' + TABS_JS_CONTENT));
             var noTabSelected = true;
 
             // container
@@ -300,35 +301,91 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
     };
 
     /* listeners */
-    var bindListeners = function() {
-        ['click', 'keydown'].forEach(function (eventName) {
-            //let isCtrl = false;
-
-            doc.body.addEventListener(eventName, function (e) {
+    ['click', 'keydown'].forEach(function (eventName) {
+        //let isCtrl = false;
+
+        doc.body.addEventListener(eventName, function (e) {
+
+            // click on a tab link or on something IN a tab link
+            var parentLink = searchParent(e.target, TABS_JS_LISTLINK);
+            if ((hasClass(e.target, TABS_JS_LISTLINK) === true || parentLink !== '') && eventName === 'click') {
+                var linkSelected = hasClass(e.target, TABS_JS_LISTLINK) === true ? e.target : findById(parentLink);
+                var parentTabId = searchParent(e.target, TABS_JS);
+                var parentTab = findById(parentTabId);
+                //let $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
+                var $parentListLinks = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTLINK));
+                var $parentListContents = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_CONTENT));
+
+                // aria selected false on all links
+                unSelectLinks($parentListLinks);
+                // add aria-hidden on all tabs contents
+                unSelectContents($parentListContents);
+                // add aria selected on selected link + show linked panel
+                selectLink(linkSelected);
+
+                e.preventDefault();
+            }
 
-                // click on a tab link or on something IN a tab link
-                var parentLink = searchParent(e.target, TABS_JS_LISTLINK);
-                if ((hasClass(e.target, TABS_JS_LISTLINK) === true || parentLink !== '') && eventName === 'click') {
-                    var linkSelected = hasClass(e.target, TABS_JS_LISTLINK) === true ? e.target : findById(parentLink);
-                    var parentTabId = searchParent(e.target, TABS_JS);
-                    var parentTab = findById(parentTabId);
-                    //let $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
-                    var $parentListLinks = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTLINK));
-                    var $parentListContents = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_CONTENT));
+            // Key down on tabs
+            if ((hasClass(e.target, TABS_JS_LISTLINK) === true || parentLink !== '') && eventName === 'keydown') {
+                //let linkSelected = hasClass( e.target, TABS_JS_LISTLINK) === true ? e.target : findById( parentLink );
+                var parentTabId = searchParent(e.target, TABS_JS);
+                var parentTab = findById(parentTabId);
+                var $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
+                var $parentListLinks = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTLINK));
+                var $parentListContents = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_CONTENT));
+                var firstLink = $parentListItems[0].querySelector('.' + TABS_JS_LISTLINK);
+                var lastLink = $parentListItems[$parentListItems.length - 1].querySelector('.' + TABS_JS_LISTLINK);
+
+                // strike home on a tab => 1st tab
+                if (e.keyCode === 36) {
+                    unSelectLinks($parentListLinks);
+                    unSelectContents($parentListContents);
+                    selectLink(firstLink);
 
-                    // aria selected false on all links
+                    e.preventDefault();
+                }
+                // strike end on a tab => last tab
+                else if (e.keyCode === 35) {
                     unSelectLinks($parentListLinks);
-                    // add aria-hidden on all tabs contents
                     unSelectContents($parentListContents);
-                    // add aria selected on selected link + show linked panel
-                    selectLink(linkSelected);
+                    selectLink(lastLink);
 
                     e.preventDefault();
                 }
+                // strike up or left on the tab => previous tab
+                else if ((e.keyCode === 37 || e.keyCode === 38) && !e.ctrlKey) {
+                    if (firstLink.getAttribute(ATTR_SELECTED) === 'true') {
+                        unSelectLinks($parentListLinks);
+                        unSelectContents($parentListContents);
+                        selectLink(lastLink);
+
+                        e.preventDefault();
+                    } else {
+                        selectLinkInList($parentListItems, $parentListLinks, $parentListContents, 'prev');
+                        e.preventDefault();
+                    }
+                }
+                // strike down or right in the tab => next tab
+                else if ((e.keyCode === 40 || e.keyCode === 39) && !e.ctrlKey) {
+                    if (lastLink.getAttribute(ATTR_SELECTED) === 'true') {
+                        unSelectLinks($parentListLinks);
+                        unSelectContents($parentListContents);
+                        selectLink(firstLink);
+
+                        e.preventDefault();
+                    } else {
+                        selectLinkInList($parentListItems, $parentListLinks, $parentListContents, 'next');
+                        e.preventDefault();
+                    }
+                }
+            }
 
-                // Key down on tabs
-                if ((hasClass(e.target, TABS_JS_LISTLINK) === true || parentLink !== '') && eventName === 'keydown') {
-                    //let linkSelected = hasClass( e.target, TABS_JS_LISTLINK) === true ? e.target : findById( parentLink );
+            // Key down in tab panels
+            var parentTabPanelId = searchParent(e.target, TABS_JS_CONTENT);
+            if (parentTabPanelId !== '' && eventName === 'keydown') {
+                (function () {
+                    var linkSelected = findById(findById(parentTabPanelId).getAttribute(ATTR_LABELLEDBY));
                     var parentTabId = searchParent(e.target, TABS_JS);
                     var parentTab = findById(parentTabId);
                     var $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
@@ -337,130 +394,71 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
                     var firstLink = $parentListItems[0].querySelector('.' + TABS_JS_LISTLINK);
                     var lastLink = $parentListItems[$parentListItems.length - 1].querySelector('.' + TABS_JS_LISTLINK);
 
-                    // strike home on a tab => 1st tab
-                    if (e.keyCode === 36) {
-                        unSelectLinks($parentListLinks);
-                        unSelectContents($parentListContents);
-                        selectLink(firstLink);
-
+                    // strike up + ctrl => go to header
+                    if (e.keyCode === 38 && e.ctrlKey) {
+                        setTimeout(function () {
+                            linkSelected.focus();
+                        }, 0);
                         e.preventDefault();
                     }
-                    // strike end on a tab => last tab
-                    else if (e.keyCode === 35) {
-                        unSelectLinks($parentListLinks);
-                        unSelectContents($parentListContents);
-                        selectLink(lastLink);
-
+                    // strike pageup + ctrl => go to prev header
+                    if (e.keyCode === 33 && e.ctrlKey) {
+                        // go to header
+                        linkSelected.focus();
                         e.preventDefault();
-                    }
-                    // strike up or left on the tab => previous tab
-                    else if ((e.keyCode === 37 || e.keyCode === 38) && !e.ctrlKey) {
+                        // then previous
                         if (firstLink.getAttribute(ATTR_SELECTED) === 'true') {
                             unSelectLinks($parentListLinks);
                             unSelectContents($parentListContents);
                             selectLink(lastLink);
-
-                            e.preventDefault();
                         } else {
                             selectLinkInList($parentListItems, $parentListLinks, $parentListContents, 'prev');
-                            e.preventDefault();
                         }
                     }
-                    // strike down or right in the tab => next tab
-                    else if ((e.keyCode === 40 || e.keyCode === 39) && !e.ctrlKey) {
+                    // strike pagedown + ctrl => go to next header
+                    if (e.keyCode === 34 && e.ctrlKey) {
+                        // go to header
+                        linkSelected.focus();
+                        e.preventDefault();
+                        // then next
                         if (lastLink.getAttribute(ATTR_SELECTED) === 'true') {
                             unSelectLinks($parentListLinks);
                             unSelectContents($parentListContents);
                             selectLink(firstLink);
-
-                            e.preventDefault();
                         } else {
                             selectLinkInList($parentListItems, $parentListLinks, $parentListContents, 'next');
-                            e.preventDefault();
                         }
                     }
-                }
-
-                // Key down in tab panels
-                var parentTabPanelId = searchParent(e.target, TABS_JS_CONTENT);
-                if (parentTabPanelId !== '' && eventName === 'keydown') {
-                    (function () {
-                        var linkSelected = findById(findById(parentTabPanelId).getAttribute(ATTR_LABELLEDBY));
-                        var parentTabId = searchParent(e.target, TABS_JS);
-                        var parentTab = findById(parentTabId);
-                        var $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
-                        var $parentListLinks = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTLINK));
-                        var $parentListContents = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_CONTENT));
-                        var firstLink = $parentListItems[0].querySelector('.' + TABS_JS_LISTLINK);
-                        var lastLink = $parentListItems[$parentListItems.length - 1].querySelector('.' + TABS_JS_LISTLINK);
-
-                        // strike up + ctrl => go to header
-                        if (e.keyCode === 38 && e.ctrlKey) {
-                            setTimeout(function () {
-                                linkSelected.focus();
-                            }, 0);
-                            e.preventDefault();
-                        }
-                        // strike pageup + ctrl => go to prev header
-                        if (e.keyCode === 33 && e.ctrlKey) {
-                            // go to header
-                            linkSelected.focus();
-                            e.preventDefault();
-                            // then previous
-                            if (firstLink.getAttribute(ATTR_SELECTED) === 'true') {
-                                unSelectLinks($parentListLinks);
-                                unSelectContents($parentListContents);
-                                selectLink(lastLink);
-                            } else {
-                                selectLinkInList($parentListItems, $parentListLinks, $parentListContents, 'prev');
-                            }
-                        }
-                        // strike pagedown + ctrl => go to next header
-                        if (e.keyCode === 34 && e.ctrlKey) {
-                            // go to header
-                            linkSelected.focus();
-                            e.preventDefault();
-                            // then next
-                            if (lastLink.getAttribute(ATTR_SELECTED) === 'true') {
-                                unSelectLinks($parentListLinks);
-                                unSelectContents($parentListContents);
-                                selectLink(firstLink);
-                            } else {
-                                selectLinkInList($parentListItems, $parentListLinks, $parentListContents, 'next');
-                            }
-                        }
-                    })();
-                }
-
-                // click on a tab link
-                var parentLinkToPanelId = searchParent(e.target, TABS_JS_LINK_TO_TAB);
-                if ((hasClass(e.target, TABS_JS_LINK_TO_TAB) === true || parentLinkToPanelId !== '') && eventName === 'click') {
-                    var panelSelectedId = hasClass(e.target, TABS_JS_LINK_TO_TAB) === true ? e.target.getAttribute('href').replace('#', '') : findById(parentLinkToPanelId).replace('#', '');
-                    var panelSelected = findById(panelSelectedId);
-                    var buttonPanelSelected = findById(panelSelected.getAttribute(ATTR_LABELLEDBY));
-                    var parentTabId = searchParent(e.target, TABS_JS);
-                    var parentTab = findById(parentTabId);
-                    //let $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
-                    var $parentListLinks = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTLINK));
-                    var $parentListContents = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_CONTENT));
-
-                    unSelectLinks($parentListLinks);
-                    unSelectContents($parentListContents);
-                    selectLink(buttonPanelSelected);
+                })();
+            }
 
-                    e.preventDefault();
-                }
-            }, true);
-        });
-    };
+            // click on a tab link
+            var parentLinkToPanelId = searchParent(e.target, TABS_JS_LINK_TO_TAB);
+            if ((hasClass(e.target, TABS_JS_LINK_TO_TAB) === true || parentLinkToPanelId !== '') && eventName === 'click') {
+                var panelSelectedId = hasClass(e.target, TABS_JS_LINK_TO_TAB) === true ? e.target.getAttribute('href').replace('#', '') : findById(parentLinkToPanelId).replace('#', '');
+                var panelSelected = findById(panelSelectedId);
+                var buttonPanelSelected = findById(panelSelected.getAttribute(ATTR_LABELLEDBY));
+                var parentTabId = searchParent(e.target, TABS_JS);
+                var parentTab = findById(parentTabId);
+                //let $parentListItems = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTITEM));
+                var $parentListLinks = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_LISTLINK));
+                var $parentListContents = [].slice.call(parentTab.querySelectorAll('.' + TABS_JS_CONTENT));
+
+                unSelectLinks($parentListLinks);
+                unSelectContents($parentListContents);
+                selectLink(buttonPanelSelected);
+
+                e.preventDefault();
+            }
+        }, true);
+    });
 
     var onLoad = function onLoad() {
         attach();
-        bindListeners();
         document.removeEventListener('DOMContentLoaded', onLoad);
     };
 
     document.addEventListener('DOMContentLoaded', onLoad);
 
-    window.van11yAccessibleTabPanelAria = attach;
+    window.sibuVan11yAccessibleTabPanelAria = attach;
 })(document);

data/app/assets/stylesheets/sibu/defaults.scss

@@ -238,101 +238,93 @@ $sibu-color3 : #333 !default;
 }
 
 #sections_panel {
-  position: relative;
-
-  &:before {
-    box-shadow: 0 -15px 15px -15px inset;
-    content: " ";
-    width: 100%;
-    left: 0;
-    top: -15px;
-    position: absolute;
-    z-index: 0;
-    height: 15px;
-    opacity: 0.4;
-    color: $sibu-color3;
-  }
-
-  .sibu_sections_tabs, .tabs {
-    height: 100%;
-  }
-
-  .sibu_sections {
+  .sibu_site_content {
     padding: 2rem;
     max-height: 60vh;
     overflow-y: scroll;
 
-    .tabs__list {
-      margin: 0;
-      padding: 0;
-      display: table;
-      width: 100%;
-    }
-    .tabs__item {
-      display: table-cell;
-      > a {
-        text-decoration: none;
-      }
-    }
+    & > .sibu_sections_tabs {
+      height: 100%;
 
-    .tabs__link {
-      display: inline-block;
-      cursor: pointer;
-      margin-bottom: -2px;
-      padding: 1rem 2.5rem;
-      border-bottom: 4px solid transparent;
-      color: $sibu-color1;
-      text-decoration: none;
-      border-radius: 0 0 0 0;
-      transition: .25s;
-      transition-property: color, border, background-color;
-      font-size: 2rem;
-      &:focus {
-        border-bottom-color: $sibu-color2;
-        color: $sibu-color2;
-        outline: 0;
-      }
-    }
+      & > .tabs {
+        height: 100%;
 
-    [aria-selected="true"].tabs__link {
-      border-bottom-color: $sibu-color2;
-      color: $sibu-color2;
-      outline: 0;
-    }
+        & > .tabs__list {
+          margin: 0;
+          padding: 0;
+          display: table;
+          width: 100%;
 
-    .tabs__content {
-      padding: 2rem 0;
-      background-color: white;
-      max-height: calc(100% - 40px);
-      overflow-y: scroll;
+          .tabs__item {
+            display: table-cell;
 
-      > * {
-        padding: 4px 0;
-        margin: 0 1rem 2rem 1rem;
-        min-height: auto;
-        box-shadow: 0 0 5px #cdcdcd;
+            > a {
+              text-decoration: none;
+            }
+          }
 
-        &:hover {
-          cursor: pointer;
-          outline: dashed $sibu-color2 4px;
-          outline-offset: -5px;
-        }
+          .tabs__link {
+            display: inline-block;
+            cursor: pointer;
+            margin-bottom: -2px;
+            padding: 1rem 2.5rem;
+            border-bottom: 4px solid transparent;
+            color: $sibu-color1;
+            text-decoration: none;
+            border-radius: 0 0 0 0;
+            transition: .25s;
+            transition-property: color, border, background-color;
+            font-size: 2rem;
+
+            &:focus {
+              border-bottom-color: $sibu-color2;
+              color: $sibu-color2;
+              outline: 0;
+            }
+          }
 
-        &.selected {
-          outline: solid $sibu-color1 5px;
-          outline-offset: -5px;
+          [aria-selected="true"].tabs__link {
+            border-bottom-color: $sibu-color2;
+            color: $sibu-color2;
+            outline: 0;
+          }
         }
 
-        > * {
-          margin-top: 0 !important;
-          margin-bottom: 0 !important;
+        & > .tabs__content {
+          padding: 2rem 0;
+          background-color: white;
+          max-height: calc(100% - 40px);
+          overflow-y: scroll;
+
+          > * {
+            padding: 4px 0;
+            margin: 0 1rem 2rem 1rem;
+            min-height: auto;
+            box-shadow: 0 0 5px #cdcdcd;
+
+            &:hover {
+              cursor: pointer;
+              outline: dashed $sibu-color2 4px;
+              outline-offset: -5px;
+            }
+
+            &.selected {
+              outline: solid $sibu-color1 5px;
+              outline-offset: -5px;
+            }
+
+            > * {
+              margin-top: 0 !important;
+              margin-bottom: 0 !important;
+            }
+          }
+
+          &[aria-hidden="true"] {
+            display: none;
+          }
         }
       }
     }
-
-    [aria-hidden="true"].tabs__content {
-      display: none;
-    }
   }
 
   .sibu_actions {