darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-09-08 08:28:15 -04:00
Code Issues Packages Projects Releases Wiki Activity

Make a classesPersister per component instance

Browse Source 
It makes more sense for something that operates on
a single component to be local to it.
This commit is contained in:
Tom Byers
2022-02-16 16:08:48 +00:00
parent 3a86bd1685
commit 85e14d302c
1 changed files with 39 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
app/assets/javascripts/updateContent.js
View File

@@ -17,45 +17,46 @@
// Added to allow the use of JS, in main.js, to apply styles which in future could be // Added to allow the use of JS, in main.js, to apply styles which in future could be
// achieved with the :has pseudo-class. If :has is available in our supported browsers, // achieved with the :has pseudo-class. If :has is available in our supported browsers,
// this can be removed in favour of a CSS-only solution. // this can be removed in favour of a CSS-only solution.
var classesPersister = { var ClassesPersister = function ($contents) {
_classNames: [], this._$contents = $contents;
_classesTo$ElsMap: {}, this._classNames = [];
addClassName: function (className) { this._classesTo$ElsMap = {};
if (this._classNames.indexOf(className) === -1) { };
this._classNames.push(className); ClassesPersister.prototype.addClassName = function (className) {
} if (this._classNames.indexOf(className) === -1) {
}, this._classNames.push(className);
remove: function () {
// Store references to any elements with class names to persist
this._classNames.forEach(className => {
var $elsWithClassName = $('.' + className).removeClass(className);
if ($elsWithClassName.length > 0) {
this._classesTo$ElsMap[className] = $elsWithClassName;
}
});
},
replace: function () {
var className;
for (className in this._classesTo$ElsMap) {
this._classesTo$ElsMap[className].each((idx, el) => {
// Avoid updating elements that are no longer present.
// elements removed will still exist in memory but won't be attached to the DOM any more
if (global.document.body.contains(el)) {
$(el).addClass(className);
}
});
}
// remove references to elements
this._classesTo$ElsMap = {};
} }
}; };
ClassesPersister.prototype.remove = function () {
// Store references to any elements with class names to persist
this._classNames.forEach(className => {
var $elsWithClassName = $('.' + className, this._$contents).removeClass(className);
var getRenderer = ($contents, key) => response => { if ($elsWithClassName.length > 0) {
this._classesTo$ElsMap[className] = $elsWithClassName;
}
});
};
ClassesPersister.prototype.replace = function () {
var className;
for (className in this._classesTo$ElsMap) {
this._classesTo$ElsMap[className].each((idx, el) => {
// Avoid updating elements that are no longer present.
// elements removed will still exist in memory but won't be attached to the DOM any more
if (global.document.body.contains(el)) {
$(el).addClass(className);
}
});
}
// remove references to elements
this._classesTo$ElsMap = {};
};
var getRenderer = ($contents, key, classesPersister) => response => {
classesPersister.remove(); classesPersister.remove();
morphdom( morphdom(
$contents.get(0), $contents.get(0),
@@ -109,6 +110,7 @@
var key = $component.data('key'); var key = $component.data('key');
var resource = $component.data('resource'); var resource = $component.data('resource');
var form = $component.data('form'); var form = $component.data('form');
var classesPersister = new ClassesPersister($contents);
// Replace component with contents. // Replace component with contents.
// The renderer does this anyway when diffing against the first response // The renderer does this anyway when diffing against the first response
@@ -127,7 +129,7 @@
setTimeout( setTimeout(
() => poll( () => poll(
getRenderer($contents, key), getRenderer($contents, key, classesPersister),
resource, resource,
getQueue(resource), getQueue(resource),
form form