xamxam/app/public/assets/js/app/form-duration-toggle.js

/**
 * form-duration-toggle.js — Duration unit toggle on TFE form.
 *
 * Switches between integer input (pages/mo) and h/m/s time inputs (durée).
 * Updates hidden #duration_value on change.
 */
(function () {
    var unit = document.getElementById('duration_unit');
    var hidden = document.getElementById('duration_value');
    var intWrap = document.getElementById('duration-value-integer');
    var intInput = document.getElementById('duration_value_int');
    var intLabel = document.getElementById('duration-value-label');
    var timeWrap = document.getElementById('duration-value-time');
    var hInput = document.getElementById('duration_h');
    var mInput = document.getElementById('duration_m');
    var sInput = document.getElementById('duration_s');

    var LABELS = { pages: 'Nombre :', mo: 'Taille :', durée: 'Durée :' };
    if (!unit || !hidden) return;

    function updateHidden() {
        if (unit.value === 'durée') {
            var h = parseInt(hInput.value, 10) || 0;
            var m = parseInt(mInput.value, 10) || 0;
            var s = parseInt(sInput.value, 10) || 0;
            var total = h + m / 60 + s / 3600;
            hidden.value = total > 0 ? total.toFixed(6) : '';
        } else {
            hidden.value = intInput.value;
        }
    }

    function toggleFields() {
        if (unit.value === 'durée') {
            intWrap.style.display = 'none';
            timeWrap.style.display = '';
        } else {
            timeWrap.style.display = 'none';
            intWrap.style.display = '';
            if (intLabel) intLabel.textContent = LABELS[unit.value] || 'Valeur :';
        }
        updateHidden();
    }

    unit.addEventListener('change', toggleFields);
    if (intInput) intInput.addEventListener('input', updateHidden);
    if (hInput) hInput.addEventListener('input', updateHidden);
    if (mInput) mInput.addEventListener('input', updateHidden);
    if (sInput) sInput.addEventListener('input', updateHidden);
    toggleFields();
})();