From 0afb2c0046b55c123eafb4ab9ee77efa68d12463 Mon Sep 17 00:00:00 2001
From: Jake Vanderwerf <get@jakevanderwerf.ca>
Date: Sat, 06 Jun 2026 17:15:31 +0000
Subject: [PATCH] =Starting the Favourites.js setup, converting previous Northeh stuff to new Registrar, fixing up Square.php integration to match
---
assets/js/concise/PopulateForm.js | 145 +++++++++++++++++++++++++++++++++---------------
1 files changed, 100 insertions(+), 45 deletions(-)
diff --git a/assets/js/concise/PopulateForm.js b/assets/js/concise/PopulateForm.js
index 761a134..edfda97 100644
--- a/assets/js/concise/PopulateForm.js
+++ b/assets/js/concise/PopulateForm.js
@@ -59,25 +59,30 @@
populateField(field, name, value) {
let type = this.formHelper.getFieldType(field);
- if (!type || this.isEmptyValue(name) || this.isEmptyValue(value)) return;
+ if (!type || this.isEmptyValue(name)) return;
const handlers = {
'repeater': this.populateRepeater.bind(this),
'tag-list': this.populateTagList.bind(this),
+ 'group': this.populateGroup.bind(this),
'location': this.populateLocation.bind(this),
'selector': this.populateTaxonomy.bind(this),
'user': this.populateUser.bind(this),
'upload': this.populateUpload.bind(this),
+ 'gallery': this.populateUpload.bind(this),
+ 'image': this.populateUpload.bind(this),
'set': this.populateMultiValue.bind(this),
'checkbox': this.populateMultiValue.bind(this),
'select': this.populateSingleValue.bind(this),
'radio': this.populateSingleValue.bind(this),
'true-false': this.populateBoolean.bind(this),
+ 'toggle-text': this.populateBoolean.bind(this),
'date': this.populateDate.bind(this),
'time': this.populateDate.bind(this),
'datetime': this.populateDate.bind(this),
'number': this.populateNumber.bind(this),
- 'textarea': this.populateTextarea.bind(this)
+ 'textarea': this.populateTextarea.bind(this),
+ 'quantity': this.populateNumber.bind(this),
};
if (Object.hasOwn(handlers, type)) {
@@ -88,37 +93,64 @@
}
populateRepeater(field, name, value) {
- if (!value || !Array.isArray(value)) return;
-
const container = field.querySelector('.repeater-items');
let template = field.querySelector('template')?.className ?? false;
if (!container || !template) return;
+ // Normalize: server/store may return an object with numeric keys instead of an array
+ if (typeof value === 'string') {
+ try { value = JSON.parse(value); } catch(e) { value = []; }
+ }
+ if (value && !Array.isArray(value) && typeof value === 'object') {
+ value = Object.values(value);
+ }
+
+ if (!value || !Array.isArray(value) || value.length === 0) {
+ window.removeChildren(container);
+ return;
+ }
+
window.removeChildren(container);
value.forEach((data, index) => {
- data.index = index;
- const row = this.templates.create(template, data);
+ const templateData = { ...data, index, repeater: field };
+
+ const row = this.templates.create(template, templateData);
if (!row) return;
+ container.append(row);
+
+ const formConfig = this.formHelper.getForm(row);
+ if (formConfig) {
+ this.formHelper.initializeFields(row, formConfig);
+ }
+
for (let [fieldName, fieldValue] of Object.entries(data)) {
- if (fieldName === 'index') continue;
let subField = row.querySelector(`[data-field="${fieldName}"]`);
if (subField) {
this.populateField(subField, fieldName, fieldValue);
}
}
-
- container.append(row);
});
}
populateTagList(field, name, value) {
- if (!value || !Array.isArray(value)) return;
const container = field.querySelector('.tag-items');
let template = field.querySelector('template')?.className ?? false;
if (!container || !template) return;
+ if (typeof value === 'string') {
+ try { value = JSON.parse(value); } catch(e) { value = []; }
+ }
+ if (value && !Array.isArray(value) && typeof value === 'object') {
+ value = Object.values(value);
+ }
+
+ if (!value || !Array.isArray(value) || value.length === 0) {
+ window.removeChildren(container);
+ return;
+ }
+
window.removeChildren(container);
value.forEach((data, index) => {
@@ -161,7 +193,16 @@
return data[format] ?? values[0] ?? 'New Item';
}
}
+ populateGroup(field, name, value) {
+ if (!value || typeof value !== 'object') return;
+ for (let [subName, subValue] of Object.entries(value)) {
+ let subField = field.querySelector(`[data-field="${subName}"]`);
+ if (subField) {
+ this.populateField(subField, subName, subValue);
+ }
+ }
+ }
populateLocation(field, name, value) {
const subFields = ['address', 'lat', 'lng', 'street', 'city', 'province', 'postal_code', 'country'];
subFields.forEach(subField => {
@@ -173,7 +214,6 @@
}
populateTaxonomy(field, name, value) {
let termIds = this.splitIDs(value);
- if (termIds.length === 0) return;
const hiddenInput = field.querySelector(`input[type="hidden"][name="${name}"]`);
if (hiddenInput) {
@@ -189,12 +229,11 @@
this.populateTaxonomy(field, name, value);
}
populateUpload(field, name, value) {
- if (name === 'timeline' || field.dataset.subtype && field.dataset.subtype === 'timeline') {
+ if (field.dataset.subtype && field.dataset.subtype === 'timeline') {
this.populateTimelineGallery(field,name,value);
return;
}
- if (this.isEmptyValue(value)) return;
const ids = this.splitIDs(value);
if (ids.length === 0) return;
const hiddenInput = field.querySelector(`input[type="hidden"]`);
@@ -203,8 +242,7 @@
}
const grid = field.querySelector('.item-grid');
- let uploadContainer = field.querySelector('.file-upload-wrapper');
- uploadContainer.hidden = ids.length > 0;
+
field.querySelector('.progress')?.remove();
if (grid) {
window.removeChildren(grid);
@@ -243,7 +281,7 @@
for (const m of meta) {
const input = imageDataField.querySelector(`[data-field="${m}"] input, [data-field="${m}"] textarea`);
if (input && data[m]!=='') {
- input.value = data[m];
+ input.value = window.decodeHTMLEntities(data[m]);
}
}
}
@@ -251,8 +289,7 @@
if (!value || !Array.isArray(value) || value.length === 0) return;
let grid = field.querySelector('.item-grid');
- let uploadContainer = field.querySelector('.file-upload-wrapper');
- uploadContainer.hidden = value.length > 0;
+
if (grid) {
window.removeChildren(grid);
@@ -283,7 +320,7 @@
}
return;
}
- field.querySelectorAll(`[type="checkbox"][name=${name}]`).forEach(checkbox => {
+ field.querySelectorAll(`input[type="checkbox"][name="${name}[]"], input[type="checkbox"][name="${name}"]`).forEach(checkbox => {
checkbox.checked = value.includes(checkbox.value);
});
@@ -291,13 +328,14 @@
populateSingleValue(field, name, value) {
value = String(value || '');
- // Try select first
let select = field.querySelector(`select[name="${name}"]`);
if (select) {
select.value = value;
return;
}
- let input = field.querySelector(`[name="${name}"][value="${value}"]`);
+
+ let input = field.querySelector(`input[type="radio"][value="${value}"], input[type="checkbox"][value="${value}"]`)
+ || field.querySelector(`[name="${name}"][value="${value}"]`);
if (input) {
input.checked = true;
}
@@ -343,18 +381,24 @@
}
}
populateTextarea(field, name, value) {
- let textarea = field.querySelector('textarea');
- if (!textarea.dataset.editor) {
- this.populateText(field, name, value)
- return;
+ let textarea = field.querySelector('textarea[data-editor], textarea');
+ this.populateText(field, name, value);
+
+ if (textarea?.dataset.editor) {
+ const editor = field.querySelector('.ql-editor');
+ if (editor) {
+ editor.innerHTML = value;
+ } else {
+ textarea.dispatchEvent(new Event('change', { bubbles: true }));
+ }
}
- textarea.value = String(value || '');
- textarea.dispatchEvent(new Event('change', {bubbles: true}));
}
populateText(field, name, value) {
- let input = field.querySelector(`[name="${name}"], input, textarea`);
- if (input && input.type !== 'file') {
- input.value = String(value || '');
+ let input = field.querySelector(`[name="${name}"]`)
+ || field.querySelector('textarea[data-editor]')
+ || field.querySelector('input:not([type="hidden"]):not([type="file"]), textarea, select');
+ if (input) {
+ input.value = window.decodeHTMLEntities(value??'');
}
}
/********************************************************************
@@ -387,10 +431,10 @@
video: 'video',
file: '.select-item span',
img: 'img',
- details: 'details[data-field]',
- imgAlt: '[name="image-alt-text"]',
- imgTitle: '[name="image-title"]',
- imgDesc: '[name="image-caption"]',
+ details: '[data-field="image_data"] details',
+ imgAlt: '[data-field="image-alt-text"]',
+ imgTitle: '[data-field="image-title"]',
+ imgDesc: '[data-field="image-caption"]',
},
manyRefs: {
fields: '.field',
@@ -408,41 +452,52 @@
let imgData = p.data.images[data['post_thumbnail']]??false;
if (refs.img && imgData) {
refs.img.src = imgData.medium || imgData.small || imgData.large || '';
- refs.img.title = imgData['image-title']??'';
+ refs.img.title = imgData.large.split("/").pop()??'';
refs.img.alt = imgData['image-alt-text']??'';
}
+
if (refs.details) {
let imgData = p.data.images[data.post_thumbnail];
refs.details.setAttribute('data-ignore', '');
refs.details.dataset.attachmentId = data.post_thumbnail;
- if (Object.hasOwn(imgData, 'image-alt-text') && refs.alt) {
- refs.alt.value = imgData['image-alt-text'];
+
+ let imgAlt = refs.imgAlt.querySelector('input');
+ let imgTitle = refs.imgTitle.querySelector('input');
+ let imgDesc = refs.imgDesc.querySelector('textarea');
+ window.prefixInput(imgAlt, `[${data.post_thumbnail}]`, refs.imgAlt, false, true);
+ window.prefixInput(imgTitle, `[${data.post_thumbnail}]`, refs.imgTitle, false, true);
+ window.prefixInput(imgDesc, `[${data.post_thumbnail}]`, refs.imgDesc, false, true);
+
+ if (Object.hasOwn(imgData, 'image-alt-text') && refs.imgAlt) {
+ imgAlt.value = window.decodeHTMLEntities(imgData['image-alt-text']);
}
- if ((Object.hasOwn(imgData, 'image-title') || Object.hasOwn(data, 'file')) && refs.title) {
- refs.title.value = imgData['image-title']||data.file.name;
+ if ((Object.hasOwn(imgData, 'image-title') || Object.hasOwn(data, 'file')) && refs.imgTitle) {
+ imgTitle.value = window.decodeHTMLEntities(imgData['image-title']||data.file.name);
}
- if (Object.hasOwn(imgData, 'image-caption') && refs.description) {
- refs.description.value = imgData['image-caption'];
+ if (Object.hasOwn(imgData, 'image-caption') && refs.imgDesc) {
+ imgDesc.value = window.decodeHTMLEntities(imgData['image-caption']);
}
}
if (manyRefs.fields) {
for (let field of manyRefs.fields) {
+ if (field.closest('[data-ignore]')) continue;
if (field.dataset.fieldType === 'group') continue;
if (field.dataset.field === 'post_thumbnail') {
field.remove();
continue;
}
let name = field.dataset.field;
- let value = data[name]??'';
+
+ const input = field.querySelector('input:not([type="file"]), textarea, select');
+ if (input) window.prefixInput(input, `[${data.id}]`, field, false, true);
+
+ let value = data[name] ?? '';
if (!p.isEmptyValue(value)) {
p.populateField(field, name, value);
}
- const input = field.querySelector('input:not([type="file"])');
- if (!input) continue;
- window.prefixInput(input, `[${data.id}]`, field);
}
}
--
Gitblit v1.10.0