Merge pull request #3880 from Icinga/feature/sidebar-state-per-tab

Maintain sidebar state per tab/window
This commit is contained in:
Johannes Meyer 2019-07-30 08:24:37 +02:00 committed by GitHub
commit ac03ea67b3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 17 deletions

View File

@ -38,22 +38,12 @@
*/ */
this.storage = Icinga.Storage.BehaviorStorage('navigation'); this.storage = Icinga.Storage.BehaviorStorage('navigation');
this.storage.setBackend(window.sessionStorage);
// Restore collapsed sidebar if necessary // Restore collapsed sidebar if necessary
if (this.storage.get('sidebar-collapsed')) { if (this.storage.get('sidebar-collapsed')) {
$('#layout').addClass('sidebar-collapsed'); $('#layout').addClass('sidebar-collapsed');
} }
// Ensure we'll get notified if the sidebar is toggled in another window
this.storage.onChange('sidebar-collapsed', function (collapsed) {
// Not using toggleClass here to avoid inconsistencies
if (collapsed) {
$('#layout').addClass('sidebar-collapsed');
} else {
$('#layout').removeClass('sidebar-collapsed');
}
$(window).trigger('resize');
}, this);
}; };
Navigation.prototype = new Icinga.EventListener(); Navigation.prototype = new Icinga.EventListener();

View File

@ -21,6 +21,13 @@
* @type {string} * @type {string}
*/ */
this.prefix = prefix; this.prefix = prefix;
/**
* Storage backend
*
* @type {Storage}
*/
this.backend = window.localStorage;
}; };
/** /**
@ -85,6 +92,15 @@
Icinga.Storage.prototype = { Icinga.Storage.prototype = {
/**
* Set the storage backend
*
* @param {Storage} backend
*/
setBackend: function(backend) {
this.backend = backend;
},
/** /**
* Prefix the given key * Prefix the given key
* *
@ -110,7 +126,7 @@
* @returns {void} * @returns {void}
*/ */
set: function(key, value) { set: function(key, value) {
window.localStorage.setItem(this.prefixKey(key), JSON.stringify(value)); this.backend.setItem(this.prefixKey(key), JSON.stringify(value));
}, },
/** /**
@ -122,14 +138,14 @@
*/ */
get: function(key) { get: function(key) {
key = this.prefixKey(key); key = this.prefixKey(key);
var value = window.localStorage.getItem(key); var value = this.backend.getItem(key);
try { try {
return JSON.parse(value); return JSON.parse(value);
} catch(error) { } catch(error) {
icinga.logger.error('[Storage] Failed to parse value (\`' + value icinga.logger.error('[Storage] Failed to parse value (\`' + value
+ '\`) of key "' + key + '". Error was: ' + error); + '\`) of key "' + key + '". Error was: ' + error);
window.localStorage.removeItem(key); this.backend.removeItem(key);
return null; return null;
} }
}, },
@ -142,7 +158,7 @@
* @returns {void} * @returns {void}
*/ */
remove: function(key) { remove: function(key) {
window.localStorage.removeItem(this.prefixKey(key)); this.backend.removeItem(this.prefixKey(key));
}, },
/** /**
@ -155,6 +171,10 @@
* @returns {void} * @returns {void}
*/ */
onChange: function(key, callback, context) { onChange: function(key, callback, context) {
if (this.backend !== window.localStorage) {
throw new Error('[Storage] Only the localStorage emits events');
}
var prefixedKey = this.prefixKey(key); var prefixedKey = this.prefixKey(key);
if (typeof Icinga.Storage.subscribers[prefixedKey] === 'undefined') { if (typeof Icinga.Storage.subscribers[prefixedKey] === 'undefined') {
@ -257,7 +277,10 @@
this.storage = storage; this.storage = storage;
this.key = key; this.key = key;
storage.onChange(key, this.onChange, this); if (storage.backend === window.localStorage) {
storage.onChange(key, this.onChange, this);
}
return this; return this;
}, },