mirror of
https://github.com/Karaka-Management/oms-Navigation.git
synced 2026-01-11 16:18:42 +00:00
Adding navigation storage support
This commit is contained in:
parent
4122bb5433
commit
1f1c84b6ca
119
Controller.js
119
Controller.js
|
|
@ -1,34 +1,103 @@
|
|||
(function (skillet, undefined) {
|
||||
//Private Property
|
||||
var isHot = true;
|
||||
/**
|
||||
* Navigation controller.
|
||||
*
|
||||
* @author OMS Development Team <dev@oms.com>
|
||||
* @author Dennis Eichhorn <d.eichhorn@oms.com>
|
||||
* @copyright 2013 Dennis Eichhorn
|
||||
* @license OMS License 1.0
|
||||
* @version 1.0.0 * @since 1.0.0
|
||||
*/
|
||||
(function (jsOMS)
|
||||
{
|
||||
"use strict";
|
||||
|
||||
//Public Property
|
||||
skillet.ingredient = 'Bacon Strips';
|
||||
/** @namespace jsOMS.Modules.Navigation.Models */
|
||||
jsOMS.Autoloader.defineNamespace('jsOMS.Modules.Navigation');
|
||||
|
||||
//Public Method
|
||||
skillet.fry = function () {
|
||||
var oliveOil;
|
||||
|
||||
addItem('tn Butter nt');
|
||||
addItem(oliveOil);
|
||||
console.log('Frying ' + skillet.ingredient);
|
||||
jsOMS.Modules.Navigation = function ()
|
||||
{
|
||||
this.navigation = {};
|
||||
this.rawNavData = JSON.parse(localStorage.getItem(jsOMS.Modules.Navigation.MODULE_NAME));
|
||||
this.rawNavData = this.rawNavData !== null ? this.rawNavData : {};
|
||||
};
|
||||
|
||||
//Private Method
|
||||
function addItem(item) {
|
||||
if (item !== undefined) {
|
||||
console.log('Adding ' + item);
|
||||
jsOMS.Modules.Navigation.MODULE_NAME = '1000500001';
|
||||
|
||||
jsOMS.Modules.Navigation.prototype.bind = function (id)
|
||||
{
|
||||
let e = typeof id === 'undefined' ? document.getElementsByClassName('nav') : [document.getElementById(id)],
|
||||
length = e.length;
|
||||
|
||||
for (let i = 0; i < length; i++) {
|
||||
this.bindElement(e[i]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
}(window.skillet = window.skillet || {}));
|
||||
jsOMS.Modules.Navigation.prototype.bindElement = function (e)
|
||||
{
|
||||
if (typeof e === 'undefined') {
|
||||
// todo: do logging here
|
||||
|
||||
//Public Properties
|
||||
console.log(skillet.ingredient); //Bacon Strips
|
||||
return;
|
||||
}
|
||||
|
||||
//Public Methods
|
||||
skillet.fry(); //Adding Butter & Fraying Bacon Strips
|
||||
let extend = e.querySelectorAll('li label'),
|
||||
self = this;
|
||||
|
||||
//Adding a Public Property
|
||||
skillet.quantity = "12";
|
||||
console.log(skillet.quantity); //12
|
||||
this.navigation[e.id] = new jsOMS.Modules.Navigation.Models.Navigation(this.rawNavData[e.id]);
|
||||
|
||||
// Bind minimize/maximize
|
||||
jsOMS.addEventListenerToAll(extend, 'click', function ()
|
||||
{
|
||||
let box = document.getElementById(this.getAttribute('for'));
|
||||
|
||||
if (!box.checked) {
|
||||
self.navigation[e.id].setOpen(box.id);
|
||||
} else {
|
||||
self.navigation[e.id].setClose(box.id);
|
||||
}
|
||||
|
||||
localStorage.setItem(jsOMS.Modules.Navigation.MODULE_NAME, JSON.stringify(self.navigation));
|
||||
});
|
||||
|
||||
// On load
|
||||
let open = this.navigation[e.id].getOpen();
|
||||
|
||||
for (let key in open) {
|
||||
if (open.hasOwnProperty(key)) {
|
||||
document.getElementById(key).checked = open[key];
|
||||
}
|
||||
}
|
||||
|
||||
// Bind show/hide
|
||||
e.nextElementSibling.addEventListener('change', function ()
|
||||
{
|
||||
self.navigation[e.id].setVisible(this.checked);
|
||||
localStorage.setItem(jsOMS.Modules.Navigation.MODULE_NAME, JSON.stringify(self.navigation));
|
||||
});
|
||||
|
||||
// On load
|
||||
if (!this.navigation[e.id].isVisible()) {
|
||||
e.nextElementSibling.checked = false;
|
||||
}
|
||||
|
||||
// Bind scroll
|
||||
e.addEventListener('scroll', function ()
|
||||
{
|
||||
self.navigation[e.id].setScrollPosition(this.scrollLeft, this.scrollTop);
|
||||
localStorage.setItem(jsOMS.Modules.Navigation.MODULE_NAME, JSON.stringify(self.navigation));
|
||||
});
|
||||
|
||||
// On load
|
||||
e.scrollTop = this.navigation[e.id].getScrollPosition().y;
|
||||
e.scrollLeft = this.navigation[e.id].getScrollPosition().x;
|
||||
};
|
||||
}(window.jsOMS = window.jsOMS || {}));
|
||||
|
||||
jsOMS.ready(function ()
|
||||
{
|
||||
"use strict";
|
||||
|
||||
let navigation = new jsOMS.Modules.Navigation();
|
||||
navigation.bind('nav-side');
|
||||
});
|
||||
|
|
@ -0,0 +1,101 @@
|
|||
/**
|
||||
* Navigation class.
|
||||
*
|
||||
* @author OMS Development Team <dev@oms.com>
|
||||
* @author Dennis Eichhorn <d.eichhorn@oms.com>
|
||||
* @copyright 2013 Dennis Eichhorn
|
||||
* @license OMS License 1.0
|
||||
* @version 1.0.0 * @since 1.0.0
|
||||
*/
|
||||
(function (jsOMS)
|
||||
{
|
||||
"use strict";
|
||||
|
||||
/** @namespace jsOMS.Modules.Navigation.Models */
|
||||
jsOMS.Autoloader.defineNamespace('jsOMS.Modules.Navigation.Models');
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation = function (data)
|
||||
{
|
||||
if (typeof data === 'undefined') {
|
||||
this.scrollPosition = {x: 0, y: 0};
|
||||
this.activeLinks = {};
|
||||
this.visible = true;
|
||||
this.openCategories = {};
|
||||
} else {
|
||||
this.scrollPosition = typeof data.scrollPosition === 'undefined' ? {x: 0, y: 0} : data.scrollPosition;
|
||||
this.activeLinks = typeof data.activeLinks === 'undefined' ? {} : data.activeLinks;
|
||||
this.visible = typeof data.visible === 'undefined' ? true : data.visible;
|
||||
this.openCategories = typeof data.openCategories === 'undefined' ? {} : data.openCategories;
|
||||
}
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.setScrollPosition = function (x, y)
|
||||
{
|
||||
this.scrollPosition.x = x;
|
||||
this.scrollPosition.y = y;
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.getScrollPosition = function ()
|
||||
{
|
||||
return this.scrollPosition;
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.setOpen = function (id)
|
||||
{
|
||||
this.openCategories[id] = true;
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.setClose = function (id)
|
||||
{
|
||||
delete this.openCategories[id];
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.getOpen = function ()
|
||||
{
|
||||
return this.openCategories;
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.active = function (id)
|
||||
{
|
||||
this.allInactive();
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.allInactive = function ()
|
||||
{
|
||||
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.inactive = function (id)
|
||||
{
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.setVisible = function (visible)
|
||||
{
|
||||
this.visible = visible;
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.isVisible = function ()
|
||||
{
|
||||
return this.visible;
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.serialize = function ()
|
||||
{
|
||||
return JSON.stringify({
|
||||
visible: this.visible,
|
||||
activeLinks: this.activeLinks,
|
||||
scrollPosition: this.scrollPosition,
|
||||
openCategories: this.openCategories
|
||||
});
|
||||
};
|
||||
|
||||
jsOMS.Modules.Navigation.Models.Navigation.prototype.unserialize = function (data)
|
||||
{
|
||||
let temp = JSON.parse(data);
|
||||
|
||||
this.visible = temp.visible;
|
||||
this.activeLinks = temp.activeLinks;
|
||||
this.openCategories = temp.openCategories;
|
||||
this.scrollPosition = temp.scrollPosition;
|
||||
};
|
||||
}(window.jsOMS = window.jsOMS || {}));
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
* @var \Modules\Navigation\Views\NavigationView $this
|
||||
*/
|
||||
if (isset($this->nav[\Modules\Navigation\Models\NavigationType::SIDE])) : ?>
|
||||
<ul id="nav-side" role="navigation">
|
||||
<ul id="nav-side" class="nav" role="navigation">
|
||||
<?php foreach ($this->nav[\Modules\Navigation\Models\NavigationType::SIDE][\Modules\Navigation\Models\LinkType::CATEGORY] as $key => $parent) : ?>
|
||||
<li><input id="nav-<?= $parent['nav_name']; ?>" type="checkbox">
|
||||
<ul>
|
||||
|
|
|
|||
93
module.js
93
module.js
|
|
@ -1,93 +0,0 @@
|
|||
/* global supports_html5_storage, setCookie, getCookie */
|
||||
$(document).ready(function () {
|
||||
"use strict";
|
||||
|
||||
var sidebar = document.getElementById("s-nav"),
|
||||
scrollPos = sidebar.scrollTop;
|
||||
|
||||
/* [BEGIN]: Load/Save old navigation status */
|
||||
var $localStorage = supports_html5_storage();
|
||||
var navigation = null;
|
||||
|
||||
if (!$localStorage) {
|
||||
navigation = getCookie('1000500001');
|
||||
} else {
|
||||
navigation = localStorage['1000500001'];
|
||||
}
|
||||
|
||||
var naviOBJ = null;
|
||||
|
||||
if (navigation !== null) {
|
||||
naviOBJ = JSON.parse(navigation);
|
||||
|
||||
if ('1000500000' in naviOBJ) {
|
||||
sidebar.hide();
|
||||
$('#content').css('margin-left', 0);
|
||||
}
|
||||
|
||||
var val = null;
|
||||
for (var key in naviOBJ) {
|
||||
//noinspection JSUnfilteredForInLoop
|
||||
if (!isNaN(key)) {
|
||||
val = naviOBJ[key];
|
||||
sidebar.find('.' + val + ' li:not(:first-child)').hide();
|
||||
sidebar.find('.' + val + ' .min').hide();
|
||||
sidebar.find('.' + val + ' .max').show();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
sidebar.find('li .min').click(function () {
|
||||
$(this).parent().parent().children('li:not(:first-child)').slideUp();
|
||||
naviOBJ[$(this).parent().parent().attr('class')] = $(this).parent().parent().attr('class');
|
||||
|
||||
if (!$localStorage) {
|
||||
setCookie('1000500000', JSON.stringify(naviOBJ), 365, window.location.host, '/');
|
||||
}
|
||||
else {
|
||||
localStorage['1000500000'] = JSON.stringify(naviOBJ);
|
||||
}
|
||||
});
|
||||
|
||||
sidebar.find('li .max').click(function () {
|
||||
$(this).parent().parent().children('li:not(:first-child)').slideDown();
|
||||
delete naviOBJ[$(this).parent().parent().attr('class')];
|
||||
|
||||
if (!$localStorage) {
|
||||
setCookie('1000500000', JSON.stringify(naviOBJ), 365, window.location.host, '/');
|
||||
}
|
||||
else {
|
||||
localStorage['1000500000'] = JSON.stringify(naviOBJ);
|
||||
}
|
||||
});
|
||||
|
||||
sidebar.find('.hide').click(function () {
|
||||
$(this).hide();
|
||||
$('#content').css('margin-left', 0);
|
||||
});
|
||||
|
||||
/* [BEGIN]: Hide and Show sidenav */
|
||||
$(document).keydown(function (e) {
|
||||
if (e.ctrlKey && e.altKey && e.which === 78) {
|
||||
if (!sidebar.hasClass('.hidden')) {
|
||||
sidebar.show();
|
||||
$('#content').css('margin-left', sidebar.width());
|
||||
delete naviOBJ['1000500000'];
|
||||
} else {
|
||||
sidebar.hide();
|
||||
$('#content').css('margin-left', 0);
|
||||
naviOBJ['1000500000'] = 0;
|
||||
}
|
||||
|
||||
if (!$localStorage) {
|
||||
setCookie('1000500000', JSON.stringify(naviOBJ), 365, window.location.host, '/');
|
||||
}
|
||||
else {
|
||||
localStorage['1000500000'] = JSON.stringify(naviOBJ);
|
||||
}
|
||||
}
|
||||
});
|
||||
/* [END]: Hide and Show sidenav */
|
||||
|
||||
/* [END]: Load/Save old navigation status */
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user