tyler.durden/icingaweb2
1
0
Fork 0
mirror of https://github.com/Icinga/icingaweb2.git synced 2025-07-27 07:44:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

collapsible.js: Enhance how we'll utilize localStorage

Browse Source
This commit is contained in:
Johannes Meyer 2019-06-07 09:17:13 +02:00
parent 6f28a5c3e1
commit 1748404efe
1 changed files with 19 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
public/js/icinga/behavior/collapsible.js
View File

@ -18,10 +18,11 @@
this.on('click', '.collapsible + .collapsible-control', this.onControlClicked, this); this.on('click', '.collapsible + .collapsible-control', this.onControlClicked, this);
this.icinga = icinga; this.icinga = icinga;
this.expanded = new Set();
this.defaultVisibleRows = 2; this.defaultVisibleRows = 2;
this.defaultVisibleHeight = 36; this.defaultVisibleHeight = 36;
this.collapsibleStates = this.getStateFromStorage(); this.loadStorage();
}; };
Collapsible.prototype = new Icinga.EventListener(); Collapsible.prototype = new Icinga.EventListener();
@ -42,15 +43,9 @@
$collapsible.after($('#collapsible-control-ghost').clone().removeAttr('id')); $collapsible.after($('#collapsible-control-ghost').clone().removeAttr('id'));
$collapsible.addClass('can-collapse'); $collapsible.addClass('can-collapse');
if (typeof _this.collapsibleStates[collapsiblePath] === 'undefined') { if (! _this.expanded.has(collapsiblePath)) {
_this.collapsibleStates[collapsiblePath] = true;
_this.collapse($collapsible);
} else if (_this.collapsibleStates[collapsiblePath]) {
_this.collapse($collapsible); _this.collapse($collapsible);
} }
} else {
// This collapsible is not large enough (anymore)
delete _this.collapsibleStates[collapsiblePath];
} }
}); });
}; };
@ -69,12 +64,12 @@
_this.icinga.logger.error('[Collapsible] Collapsible control has no associated .collapsible: ', $target); _this.icinga.logger.error('[Collapsible] Collapsible control has no associated .collapsible: ', $target);
} else { } else {
var collapsiblePath = _this.icinga.utils.getCSSPath($collapsible); var collapsiblePath = _this.icinga.utils.getCSSPath($collapsible);
if (_this.collapsibleStates[collapsiblePath]) { if (_this.expanded.has(collapsiblePath)) {
_this.collapsibleStates[collapsiblePath] = false; _this.expanded.delete(collapsiblePath);
_this.expand($collapsible);
} else {
_this.collapsibleStates[collapsiblePath] = true;
_this.collapse($collapsible); _this.collapse($collapsible);
} else {
_this.expanded.add(collapsiblePath);
_this.expand($collapsible);
} }
} }
}; };
@ -146,24 +141,24 @@
}; };
/** /**
* Load the collapsible states from storage * Load state from storage
*
* @returns {{}}
*/ */
Collapsible.prototype.getStateFromStorage = function () { Collapsible.prototype.loadStorage = function () {
var state = localStorage.getItem('collapsible.state'); var expanded = localStorage.getItem('collapsible.expanded');
if (!! state) { if (!! expanded) {
return JSON.parse(state); this.expanded = new Set(JSON.parse(expanded));
} }
return {};
}; };
/** /**
* Save the collapsible states to storage * Save state to storage
*/ */
Collapsible.prototype.destroy = function () { Collapsible.prototype.destroy = function () {
localStorage.setItem('collapsible.state', JSON.stringify(this.collapsibleStates)); if (this.expanded.size > 0) {
localStorage.setItem('collapsible.expanded', JSON.stringify(Array.from(this.expanded.values())));
} else {
localStorage.removeItem('collapsible.expanded');
}
}; };
Icinga.Behaviors.Collapsible = Collapsible; Icinga.Behaviors.Collapsible = Collapsible;