//also @See onOff.blade.php

class OnOff {
    toggleOnOff($id) {
        let onOffBox = document.getElementById($id);
        let onOffSwitch = document.getElementById($id + '-switch');

        if (onOffBox.checked) {
            onOffBox.value = '1';
            onOffSwitch.classList.add('on');
            onOffBox.setAttribute('checked', true);
        }
        else {
            onOffBox.value = '0';
            onOffSwitch.classList.remove('on');
            onOffBox.removeAttribute('checked');
        }
    }

    toggleOnOffSwitch($id) {
        let onOffBox = document.getElementById($id);
        onOffBox.checked = (onOffBox.checked) ? onOffBox.checked = false : onOffBox.checked = true;
        this.toggleOnOff($id);
        let changeEvent = document.createEvent("Event");
        changeEvent.initEvent("change", false, true);
        // args: string type, boolean bubbles, boolean cancelable
        onOffBox.dispatchEvent(changeEvent)
    }
}