73 lines
2.2 KiB
JavaScript
73 lines
2.2 KiB
JavaScript
/**
|
|
* @name Grid
|
|
* @author Julie Blanc <contact@julie-blanc.fr>
|
|
* @see { @link https://gitlab.com/csspageweaver/plugins/grid/ }
|
|
*/
|
|
|
|
|
|
export default function gridEvents(id){
|
|
let body = cssPageWeaver.ui.body;
|
|
let fileTitle = cssPageWeaver.docTitle;
|
|
let parameters = cssPageWeaver.features[id].parameters || {};
|
|
let isParametersSet = Object.keys(parameters).length > 0;
|
|
|
|
let grid = {};
|
|
|
|
// valeur par défaut
|
|
grid.default = {
|
|
steps: 7,
|
|
};
|
|
|
|
grid.toggle = {};
|
|
grid.toggle.value = localStorage.getItem('gridColToggle_' + fileTitle) || 'no-grid-col';
|
|
grid.toggle.input = document.querySelector(`#${id}-toggle`);
|
|
|
|
grid.steps = {};
|
|
grid.steps.value = parameters.steps || grid.default.steps;
|
|
grid.steps.input = document.querySelector('#steps-grid-col');
|
|
|
|
|
|
/* Récupération de la session précédente si elle existe */
|
|
|
|
grid.steps.value = localStorage.getItem('gridColSteps_' + fileTitle) || grid.steps.value;
|
|
|
|
grid.steps.input.value = grid.steps.value;
|
|
|
|
|
|
document.documentElement.style.setProperty('--grid-col-steps', grid.steps.value);
|
|
|
|
|
|
/* DOM edit */
|
|
if(grid.toggle.value === "grid-col"){
|
|
body.classList.add('grid-col'); // on indique qu'il y a la grille
|
|
grid.toggle.input.checked = true;
|
|
} else {
|
|
body.classList.remove('grid-col'); // grille désactivée
|
|
grid.toggle.input.checked = false;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Toggle event */
|
|
grid.toggle.input.addEventListener("input", (e) => {
|
|
if(e.target.checked){
|
|
body.classList.add('grid-col'); // grille activée
|
|
localStorage.setItem('gridColToggle_' + fileTitle, 'grid-col');
|
|
} else {
|
|
body.classList.remove('grid-col'); // grille désactivée
|
|
localStorage.setItem('gridColToggle_' + fileTitle, 'no-grid-col');
|
|
}
|
|
});
|
|
|
|
|
|
/* Change grid steps on input */
|
|
document.querySelector("#steps-grid-col").addEventListener("input", (e) => {
|
|
grid.steps.value = e.target.value;
|
|
document.documentElement.style.setProperty('--grid-col-steps', grid.steps.value);
|
|
localStorage.setItem('gridColSteps_' + fileTitle, grid.steps.value);
|
|
});
|
|
|
|
|
|
}
|
|
|