diff --git a/passbook/static/static/passbook/pf.js b/passbook/static/static/passbook/pf.js index 1e75d5850..44e713308 100644 --- a/passbook/static/static/passbook/pf.js +++ b/passbook/static/static/passbook/pf.js @@ -36,3 +36,50 @@ document.querySelectorAll(".codemirror").forEach((cm) => { autoRefresh: true, }); }); + +// Automatic slug fields +const convertToSlug = (text) => { + return text + .toLowerCase() + .replace(/[^\w ]+/g, '') + .replace(/ +/g, '-'); +}; + +document.querySelectorAll("input[name=name]").forEach((input) => { + input.addEventListener("input", (e) => { + const form = e.target.closest("form"); + const slugField = form.querySelector("input[name=slug]"); + slugField.value = convertToSlug(slugField.value); + }); +}); + +// Dynamic Array field logic +window.addEventListener('load', function () { + + function addRemoveEventListener(widgetElement) { + widgetElement.querySelectorAll('.array-remove').forEach(function (element) { + element.addEventListener('click', function () { + this.parentNode.parentNode.remove(); + }); + }); + } + + document.querySelectorAll('.dynamic-array-widget').forEach(function (widgetElement) { + + addRemoveEventListener(widgetElement); + + widgetElement.querySelector('.add-array-item').addEventListener('click', function () { + var first = widgetElement.querySelector('.array-item'); + var newElement = first.cloneNode(true); + var id_parts = newElement.querySelector('input').getAttribute('id').split('_'); + var id = id_parts.slice(0, -1).join('_') + '_' + String(parseInt(id_parts.slice(-1)[0]) + 1); + newElement.querySelector('input').setAttribute('id', id); + newElement.querySelector('input').value = ''; + + addRemoveEventListener(newElement); + first.parentElement.insertBefore(newElement, first.parentNode.lastChild); + }); + + }); + +});