+ * [toggle here]
+ *
+ * [content here]
*/
- window.utils.showHide = function(wrapper, options) {
+ var util = function(element) {
- options = options || {};
+ function _init() {
+ if (!element) {
+ throw new Error('ShowHide utility cannot be setup without an element!');
+ }
- function addEventHandler(el) {
- el.addEventListener('click', function elClickListener() {
- var newState = el.parentElement.classList.toggle(SHOW_HIDE_COLLAPSED_CLASS);
- updateLSState(el.dataset.shIndex || null, newState);
+ if (element.classList.contains(JS_INITIALIZED_CLASS)) {
+ return false;
+ }
+
+ _addEventHandler();
+ }
+
+ function _addEventHandler() {
+ element.addEventListener('click', function clickListener() {
+ console.log('showhide clicked');
+ var newState = element.parentElement.classList.toggle(SHOW_HIDE_COLLAPSED_CLASS);
+ _updateLSState(element.dataset.shIndex || null, newState);
});
}
- function updateLSState(index, state) {
+ function _updateLSState(index, state) {
if (!index) {
return false;
}
- var lsData = getLocalStorageData();
+ var lsData = _getLocalStorageData();
lsData[index] = state;
window.localStorage.setItem(LOCAL_STORAGE_SHOW_HIDE, JSON.stringify(lsData));
}
- function collapsedStateInLocalStorage(index) {
- var lsState = getLocalStorageData();
- return lsState[index];
- }
+ // function _getCollapsedLSState(index) {
+ // var lsState = _getLocalStorageData();
+ // return lsState[index];
+ // }
- function getLocalStorageData() {
+ function _getLocalStorageData() {
return JSON.parse(window.localStorage.getItem(LOCAL_STORAGE_SHOW_HIDE)) || {};
}
- Array
- .from(wrapper.querySelectorAll('.' + SHOW_HIDE_TOGGLE_CLASS))
- .forEach(function(el) {
- if (el.classList.contains(JS_INITIALIZED_CLASS)) {
- return false;
- }
+ // var showHides = Array.from(scope.querySelectorAll(UTIL_SELECTOR));
+ // showHides.forEach(function(el) {
+ // if (el.classList.contains(JS_INITIALIZED_CLASS)) {
+ // return false;
+ // }
- var index = el.dataset.shIndex || null;
- var isCollapsed = el.dataset.collapsed === 'true';
- var lsCollapsedState = collapsedStateInLocalStorage(index);
- if (typeof lsCollapsedState !== 'undefined') {
- isCollapsed = lsCollapsedState;
- }
- el.parentElement.classList.toggle(SHOW_HIDE_COLLAPSED_CLASS, isCollapsed);
+ // var index = el.dataset.shIndex || null;
+ // var isCollapsed = el.dataset.collapsed === 'true';
+ // var lsCollapsedState = _getCollapsedLSState(index);
+ // if (typeof lsCollapsedState !== 'undefined') {
+ // isCollapsed = lsCollapsedState;
+ // }
+ // el.parentElement.classList.toggle(SHOW_HIDE_COLLAPSED_CLASS, isCollapsed);
- Array.from(el.parentElement.children).forEach(function(el) {
- if (!el.classList.contains('' + SHOW_HIDE_TOGGLE_CLASS)) {
- el.classList.add(SHOW_HIDE_TARGET_CLASS);
- }
- });
- el.classList.add(JS_INITIALIZED_CLASS);
- addEventHandler(el);
- });
+ // Array.from(el.parentElement.children).forEach(function(el) {
+ // if (!el.matches(UTIL_SELECTOR)) {
+ // el.classList.add(SHOW_HIDE_TARGET_CLASS);
+ // }
+ // });
+ // el.classList.add(JS_INITIALIZED_CLASS);
+ // _addEventHandler(el);
+ // });
+
+ _init();
return {
- scope: wrapper,
+ name: UTIL_NAME,
+ element: element,
destroy: function() {},
};
};
+
+ if (UtilRegistry) {
+ UtilRegistry.register({
+ name: UTIL_NAME,
+ selector: UTIL_SELECTOR,
+ setup: util
+ });
+ }
+
})();