68 lines
1.8 KiB
JavaScript
68 lines
1.8 KiB
JavaScript
(function() {
|
|
'use strict';
|
|
|
|
window.utils = window.utils || {};
|
|
|
|
var LOCAL_STORAGE_SHOW_HIDE = 'SHOW_HIDE';
|
|
var SHOW_HIDE_TOGGLE_CLASS = 'js-show-hide__toggle';
|
|
var SHOW_HIDE_COLLAPSED_CLASS = 'js-show-hide--collapsed';
|
|
var SHOW_HIDE_TARGET_CLASS = 'js-show-hide__target';
|
|
|
|
/**
|
|
* div
|
|
* div.js-show-hide__toggle
|
|
* toggle here
|
|
* div
|
|
* content here
|
|
*/
|
|
window.utils.showHide = function(wrapper, options) {
|
|
|
|
options = options || {};
|
|
// make
|
|
|
|
function addEventHandler(el) {
|
|
el.addEventListener('click', function elClickListener() {
|
|
var newState = el.parentElement.classList.toggle(SHOW_HIDE_COLLAPSED_CLASS);
|
|
updateLSState(el.dataset.shIndex || null, newState);
|
|
});
|
|
}
|
|
|
|
function updateLSState(index, state) {
|
|
if (!index) {
|
|
return false;
|
|
}
|
|
var lsData = fromLocalStorage();
|
|
lsData[index] = state;
|
|
window.localStorage.setItem(LOCAL_STORAGE_SHOW_HIDE, JSON.stringify(lsData));
|
|
}
|
|
|
|
function collapsedStateInLocalStorage(index) {
|
|
return fromLocalStorage()[index] || null;
|
|
}
|
|
|
|
function fromLocalStorage() {
|
|
return JSON.parse(window.localStorage.getItem(LOCAL_STORAGE_SHOW_HIDE)) || {};
|
|
}
|
|
|
|
Array
|
|
.from(wrapper.querySelectorAll('.' + SHOW_HIDE_TOGGLE_CLASS))
|
|
.forEach(function(el) {
|
|
var index = el.dataset.shIndex || null;
|
|
el.parentElement.classList.toggle(
|
|
SHOW_HIDE_COLLAPSED_CLASS,
|
|
collapsedStateInLocalStorage(index) || el.dataset.collapsed === 'true'
|
|
);
|
|
Array.from(el.parentElement.children).forEach(function(el) {
|
|
if (!el.classList.contains('' + SHOW_HIDE_TOGGLE_CLASS)) {
|
|
el.classList.add(SHOW_HIDE_TARGET_CLASS);
|
|
}
|
|
});
|
|
addEventHandler(el);
|
|
});
|
|
|
|
return {
|
|
destroy: function() {},
|
|
};
|
|
};
|
|
})();
|