if ('serviceWorker' in navigator) { // Use the window load event to keep the page load performant window.addEventListener('load', () => { navigator.serviceWorker.register('/js/sw.js').then(function(reg) { if(reg.installing) { console.log('Service worker installing'); } else if(reg.waiting) { console.log('Service worker installed'); } else if(reg.active) { console.log('Service worker active'); } }).catch(function(error) { // registration failed console.log('Registration failed with ' + error); }); }); } async function main () { const forms = document.getElementsByClassName('form') for (const form of forms) { const fieldsName = [...new Set(Array.from(form.querySelectorAll("input")).map(item => item.name))] const scoreFields = Array.from(form.querySelectorAll(".score")) form.addEventListener('change', function() { const fieldsValue = fieldsName.map(fieldName => { const field = form.querySelector('input[name="' + fieldName + '"]:checked') if (field) return field.value }).filter(item => item !== undefined) if (fieldsName.length == fieldsValue.length) { const score = fieldsValue.reduce((accumulator, curr) => parseInt(accumulator) + parseInt(curr)) scoreFields.map(item => { item.classList.remove('active') return item }).filter(item => { return score >= item.dataset.min && (item.dataset.max == "" || score <= item.dataset.max) }).map(item => { item.classList.add('active') console.log(item.getElementsByClassName('score_' + form.dataset.id)) Array.from(item.getElementsByClassName('score_' + form.dataset.id)).map(item => item.innerHTML = score) }) } var all = form.querySelectorAll("input") const scoreField = document.getElementsByClassName('score_' + form.dataset.id) var score = 0 for (let field of all) { if (field.type != "submit" && field.type != "button") { if (field.type=="radio" || field.type=="checkbox") { if (field.checked) { score = score + parseInt(field.value) } } } } scoreField.innerHTML = score }); } } main()