composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-04-23 02:28:44 +02:00
Code Issues Packages Projects Releases Wiki Activity

N°3617 collapsible components state saving : use JQuery widget options instead of a method

Browse Source 
This is the way JQuery widget are intended to work !
Thanks @Molkobain for the review !
This commit is contained in:
Pierre Goiffon
2021-01-12 17:17:39 +01:00
parent 028a3ccec8
commit 09da54ee56
4 changed files with 33 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
js/components/alert.js
View File

@@ -26,8 +26,8 @@ $(function()
// default options
options:
{
hasCollapsibleStateSavingEnabled: false,
collapsibleStateStorageKey: null,
bOpenedByDefault: true,
collapsibleStateStorageKey: null, // if non null will save collapsible state
},
css_classes:
{
@@ -42,6 +42,16 @@ $(function()
// the constructor
_create: function () {
this._bindEvents();
let bStoredSectionState = JSON.parse(localStorage.getItem(this.options.collapsibleStateStorageKey));
let bIsSectionOpenedInitially = (bStoredSectionState == null)
? this.options.bOpenedByDefault
: bStoredSectionState;
if (bIsSectionOpenedInitially) {
this.element.addClass(this.css_classes.opened);
} else {
this.element.removeClass(this.css_classes.opened);
}
},
// events bound via _bind are removed automatically
// revert other modifications here
@@ -64,25 +74,12 @@ $(function()
_onCollapseTogglerClick: function (oEvent) {
this.element.toggleClass(this.css_classes.opened);
if (this.options.hasCollapsibleStateSavingEnabled) {
if (this.options.collapsibleStateStorageKey) {
localStorage.setItem(
this.options.collapsibleStateStorageKey,
this.element.hasClass(this.css_classes.opened)
);
}
},
enableSaveCollapsibleState: function (bOpenedByDefault, sSectionStateStorageKey) {
this.options.hasCollapsibleStateSavingEnabled = true;
this.options.collapsibleStateStorageKey = sSectionStateStorageKey;
let bStoredSectionState = JSON.parse(localStorage.getItem(sSectionStateStorageKey));
let bIsSectionOpenedInitially = (bStoredSectionState == null) ? bOpenedByDefault : bStoredSectionState;
if (bIsSectionOpenedInitially) {
this.element.addClass(this.css_classes.opened);
} else {
this.element.removeClass(this.css_classes.opened);
}
}
})
});

28
js/components/collapsible-section.js
View File

@@ -25,8 +25,8 @@ $(function () {
// default options
options:
{
hasCollapsibleStateSavingEnabled: false,
collapsibleStateStorageKey: null,
bOpenedByDefault: true,
collapsibleStateStorageKey: null, // if non null will save collapsible state
},
css_classes:
{
@@ -40,6 +40,15 @@ $(function () {
// the constructor
_create: function () {
this._bindEvents();
let bStoredSectionState = JSON.parse(localStorage.getItem(this.options.collapsibleStateStorageKey));
let bIsSectionOpenedInitially = (bStoredSectionState == null) ? this.options.bOpenedByDefault : bStoredSectionState;
if (bIsSectionOpenedInitially) {
this.element.addClass(this.css_classes.opened);
} else {
this.element.removeClass(this.css_classes.opened);
}
},
// events bound via _bind are removed automatically
// revert other modifications here
@@ -55,25 +64,12 @@ $(function () {
_onCollapseTogglerClick: function (oEvent) {
this.element.toggleClass(this.css_classes.opened);
if (this.options.hasCollapsibleStateSavingEnabled) {
if (this.options.collapsibleStateStorageKey) {
localStorage.setItem(
this.options.collapsibleStateStorageKey,
this.element.hasClass(this.css_classes.opened)
);
}
},
enableSaveCollapsibleState: function (bOpenedByDefault, sSectionStateStorageKey) {
this.options.hasCollapsibleStateSavingEnabled = true;
this.options.collapsibleStateStorageKey = sSectionStateStorageKey;
let bStoredSectionState = JSON.parse(localStorage.getItem(sSectionStateStorageKey));
let bIsSectionOpenedInitially = (bStoredSectionState == null) ? bOpenedByDefault : bStoredSectionState;
if (bIsSectionOpenedInitially) {
this.element.addClass(this.css_classes.opened);
} else {
this.element.removeClass(this.css_classes.opened);
}
}
})
});

11
templates/base/components/alert/layout.js.twig
View File

@@ -1,7 +1,4 @@
$('#{{ oUIBlock.GetId() }}').alert();
{% if oUIBlock.IsSaveCollapsibleStateEnabled() %}
$('#{{ oUIBlock.GetId() }}').alert("instance").enableSaveCollapsibleState(
{{ oUIBlock.IsOpenedByDefault() }},
'{{ oUIBlock.GetSessionCollapsibleStateStorageKey() }}'
);
{% endif %}
$('#{{ oUIBlock.GetId() }}').alert({
bOpenedByDefault: {{ oUIBlock.IsOpenedByDefault()|var_export }}
{% if oUIBlock.IsSaveCollapsibleStateEnabled() %}, collapsibleStateStorageKey: '{{ oUIBlock.GetSessionCollapsibleStateStorageKey() }}'{% endif %}
});

11
templates/base/components/collapsible-section/layout.js.twig
View File

@@ -1,7 +1,4 @@
$('#{{ oUIBlock.GetId() }}').collapsibleSection();
{% if oUIBlock.IsSaveCollapsibleStateEnabled() %}
$('#{{ oUIBlock.GetId() }}').collapsibleSection("instance").enableSaveCollapsibleState(
{{ oUIBlock.IsOpenedByDefault()|var_export }},
'{{ oUIBlock.GetSessionCollapsibleStateStorageKey() }}'
);
{% endif %}
$('#{{ oUIBlock.GetId() }}').collapsibleSection({
bOpenedByDefault: {{ oUIBlock.IsOpenedByDefault()|var_export }}
{% if oUIBlock.IsSaveCollapsibleStateEnabled() %}, collapsibleStateStorageKey: '{{ oUIBlock.GetSessionCollapsibleStateStorageKey() }}'{% endif %}
});