Redone field names actualizer for multifield with the batched run an unsubscribers
Closes:
*/
const IGNORED_FOUNDATION_FIELDS = ['.foundation-field-related', '.coral-PathBrowser'];
+ /** @returns {boolean} - is the passed multifield use composite(complex) items */
const isComposite = ($field) => $field.is(COMPOSITE_MULTIFIELD_SEL);
/**
* Actualizes the names of all fields with the current name prefix and item number: {multifieldName}/item{itemNumber}/{fieldName}.
* E.g. a field called 'url' is positioned in the second item of './links' field. The actual name is ./links/item2/url
- * @param {JQuery} $multifield Multifield JQuery element
+ * @param {JQuery<HTMLElement>} $multifield Multifield JQuery element
* @param {String} prefix Current field prefix
*/
function actualizeNames($multifield, prefix) {
});
}
- /** Traverses all fields and applies processor function for all primary (i.e. not related) foundation fields */
+ /**
+ * Traverses all fields and applies processor function for all primary (i.e. not related) foundation fields
+ * @param {JQuery<HTMLElement>} $root
+ * @param {function} process
+ */
function traverse($root, process) {
$root.children().each(function () {
const $field = $(this);
/**
* Creates a processor function for a single field.
* The processor function prepends the prefix to the current field name and call the the actualizer recursively for nested multiifields
- * @param prefix Item prefix that follows '{multifieldName}/item{itemNumber}/' pattern
+ * @param {string} prefix Item prefix that follows '{multifieldName}/item{itemNumber}/' pattern
*/
function getFieldProcessor(prefix) {
return ($field, fieldApi) => {
return name;
}
- function actualizeOnReady() {
- Coral.commons.ready(this, (el) => actualizeNames($(el), ''));
- }
+ /** @type number */
+ let batchUpdateTimeout = 0;
+ /** @type Set<HTMLElement> */
+ const batchUpdateQuery = new Set();
- $(document).on('coral-collection:add coral-collection:remove coral-multifield:itemorder',
- COMPOSITE_MULTIFIELD_SEL, actualizeOnReady);
+ /**
+ * Request Multifield update
+ * @param {HTMLElement} field - multifield
+ */
+ function actualizeBatched(field) {
+ batchUpdateQuery.add(field);
+ if (batchUpdateTimeout) window.clearTimeout(batchUpdateTimeout);
+ batchUpdateTimeout = window.setTimeout(() => {
+ batchUpdateQuery.forEach((el) => actualizeNames($(el), ''));
+ batchUpdateQuery.clear();
+ }, 100);
+ }
- $(document).on('foundation-contentloaded', function (e) {
- $(COMPOSITE_MULTIFIELD_SEL, e.target).each(actualizeOnReady);
+ // Subscribe on Multifield collection changes
+ $(document)
+ .off('coral-collection:add.eakfix coral-collection:remove.eakfix coral-multifield:itemorder.eakfix')
+ .on('coral-collection:add.eakfix coral-collection:remove.eakfix coral-multifield:itemorder.eakfix',
+ COMPOSITE_MULTIFIELD_SEL, function () {
+ actualizeBatched(this);
});
+
+ // Process Multifields on start
+ $(document)
+ .off('foundation-contentloaded.eakfix')
+ .on('foundation-contentloaded.eakfix', (e) => $(COMPOSITE_MULTIFIELD_SEL, e.target).each(function () {
+ Coral.commons.ready(this, actualizeBatched);
+ }));
})(window, Granite.$);
