Skip to content

Instantly share code, notes, and snippets.

@eeejay

eeejay/rework.js

Created November 15, 2021 21:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save eeejay/f7760235c7ec68e3c32dbc8626f69b3c to your computer and use it in GitHub Desktop.
Save eeejay/f7760235c7ec68e3c32dbc8626f69b3c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
rework.js
'use strict';
let userAgentString = navigator.userAgent;
// Detect Chrome
let chromeAgent = userAgentString.indexOf("Chrome") > -1;
let safariAgent = userAgentString.indexOf("Safari") > -1 && !chromeAgent ? true : false;
Element.prototype.isInvisible = function() {
if (this.style.display == 'none') return true;
if (getComputedStyle(this).display === 'none') return true;
if (this.parentNode.isInvisible) return this.parentNode.isInvisible();
return false;
};
let isTouchDevice = ()=>{
try{
document.createEvent("TouchEvent");
return true;
} catch(e){
return false;
}
}
Array.prototype.move = function (fromIndex, toIndex) {
let element = this[fromIndex];
this.splice(fromIndex, 1);
this.splice(toIndex, 0, element);
}
class LisioJSWidget {
constructor() {
this.cookieVersion = "V1.5";
this.verifCookiesVersion();
this.cnt = [];
this.profils;
this.params = {
voice: 0,
pitch: 1,
rate: 1,
color: [],
trad: 0,
};
this.oldParams = {
process : 0,
};
this.synth = window.speechSynthesis;
this.cookiePreProf = 0;
this.acceptCookies = true;
this.nameProfApply = "";
this.nameProfSel ="";
this.selI=0;
window.addEventListener("message", e => {
const data = e.data;
const footer_img = document.querySelector("img#img_footer");
if (data.util == "init") {
const style = document.querySelector("style#initVar");
style.innerText = `:root{
--mdl-title-primary : ${data.colors.titlePrimary};
--mdl-title-ecolo : ${data.colors.titleEcolo};
}`;
this.display = data.display;
this.bookPage = data.bookPage;
document.querySelector("img#banner").src = data.imgs.banner;
footer_img.src = data.imgs.footer;
if(data.link_footer != "NULL"){
footer_img.style.cursor = "pointer";
footer_img.addEventListener("click",e=>{
window.open(data.link_footer, "_blank");
});
}
if(data.reduction_CO2 != "NULL"){
const div = document.querySelector("div#reduc");
div.classList.remove("d-none");
div.querySelector("span#reduc_rate").textContent = data.reduction_CO2;
}
if(data.disable_trad){
const trad = document.querySelector(`li[lisio-target="#lisiojs__section_trad"]`)
trad.classList.add("d-none");
trad.nextElementSibling.classList.add("d-none");
}
document.querySelectorAll("a[data-help]").forEach(elt=>{
elt.addEventListener("click",(e)=>{
window.parent.postMessage({
type: "util",
util: "url",
url : data.links_help[elt.getAttribute("data-help")]
}, "*");
});
});
this.addStats = data.addStats;
this.origin = data.origin;
this.nightModeOnHome = data.night_mode_on_home == "true";
this.init();
}
});
window.parent.postMessage({
type: "util",
util: "init"
}, "*");
if(isTouchDevice()){
document.querySelectorAll('.mobile-disable').forEach(li=>{
li.classList.add("d-none");
});
}
}
refresh(){
window.parent.postMessage({
type: 'util',
util: 'refresh'
}, '*');
}
async init() {
// Initialisation du transfert de message en envouyant un message à toutes les origines
//window.parent.postMessage('transfert set', '*');
if(!('speechSynthesis' in window)){
document.querySelector(`li[lisio-target="#lisiojs__section_synth"]`).classList.add("d-none");
}
const error = document.querySelector("div.overload");
error.textContent = "Les fonctionnalités suivantes sont désactivées : ";
if(!supportSynth){
error.textContent += "Synthèse vocale non disponible,";
error.classList.remove("d-none");
}
if(!supportsFilters){
error.textContent += "Filtres pour le daltonisme non disponible,";
error.classList.remove("d-none");
}
if(this.nightModeOnHome && this.display == 1){
document.querySelectorAll("input#nuit").forEach(elt=>{
elt.parentElement.parentElement.parentElement.classList.toggle("d-none");
});
}
if(this.display == 1){
this.adaptVersion();
}
// Initialisation des voix
await this.initVoices();
await this.createProfiles();
// Initialisation de l'interface
await this.instantiateMDL();
// Initialisation des écouteurs
await this.initListeners();
// Adaptation du menu
this.updateMenu();
this.sync(this.params);
if (this.nameProfApply != ""){
this.apply(this.nameProfApply, document.querySelector("button:not(.d-none) span.disable"));
}
Object.assign(this.oldParams, this.params);
window.setInterval(() => {
Object.keys(this.params).forEach(key => {
if (this.params[key] != this.oldParams[key]) {
this.twinkle();
}
});
Object.assign(this.oldParams, this.params);
}, 1000);
if(this.CO2){
document.querySelector("img#lisio_CO2").src = "assets/CO2_neutre_1.png";
}
}
adaptVersion() {
document.querySelectorAll('li[lisio-target="#lisiojs__section_eco"],li[lisio-target="#lisiojs__section_sen"],li[lisio-target="#lisiojs__section_zon"]').forEach(li => {
li.classList.add("d-none");
li.nextElementSibling.classList.add("d-none");
});
const sur = document.querySelector('li[lisio-target="#lisiojs__section_sur"]');
sur.classList.toggle("d-none");
if(this.nightModeOnHome){
sur.previousElementSibling.classList.toggle("d-none");
}
}
/**
* Navigation vers un menu enfant
* @param {Object} node
*/
nextMenu(node) {
const menu = document.querySelector('.lisiojs__position_show');
menu.classList.add('lisiojs__position_left');
menu.classList.remove('lisiojs__position_show');
this.setBtn(node);
node.classList.add('lisiojs__position_show');
node.classList.remove('lisiojs__position_right');
}
/**
* Retour au menu parent
*/
prevMenu() {
const menu = document.querySelector('.lisiojs__position_show');
const parent = document.querySelector(menu.getAttribute('lisio-parent'));
menu.classList.add('lisiojs__position_right');
menu.classList.remove('lisiojs__position_show');
this.setBtn(parent);
parent.classList.add('lisiojs__position_show');
parent.classList.remove('lisiojs__position_right');
}
/**
* Mise à jour de la hauteur du menu
*/
updateMenu() {
const height = document.querySelector('.mdl-top-app-bar').clientHeight;
document.querySelectorAll('.lisiojs__section').forEach((e) => {
e.style.height = `calc(100% - ${height}px)`;
});
if (window.screen.width < 760) {
document.querySelectorAll("#navClavier, #mask, #cursor").forEach(elt => {
elt.classList.add("d-none");
});
}
}
/**
* Mise à jour des boutons du bandeau supérieur
* @param {Object} node
*/
setBtn(node) {
const close = document.querySelector('.lisiojs__navbar_close');
const back = document.querySelector('.lisiojs__navbar_back');
if (node.hasAttribute('lisio-parent')) {
back.classList.remove('d-none');
close.classList.add('d-none');
} else {
back.classList.add('d-none');
close.classList.remove('d-none');
}
}
/**
*
* @param {*} tag
* @param {*} value
*/
sliderChange(slider, value) {
let tag = slider.getAttribute("data-lisiojs");
let state = slider.value != slider.getAttribute("data-default");
if (tag == 'rate' || tag == 'pitch') {
this.params.rate =
tag == 'rate' ?
Number(slider.value) / 10 :
this.params.rate;
this.params.pitch =
tag == 'pitch' ?
Number(slider.value) / 10 :
this.params.pitch;
/*window.parent.postMessage(
{
type: 'util',
util: 'params',
params: this.params,
},
'*'
);*/
this.breadcrumb(slider, state, this.explore("synth"), true);
} else {
this.params[tag] = tag == "brightness" ? Number(slider.value) / 10 : slider.value;
let example = slider.parentElement.parentElement.parentElement.querySelector(".example");
if (example != null) {
this.adaptExample(tag, value, example);
}
/*window.parent.postMessage(
{
type: 'feature',
feature: tag,
value: value,
},
'*'
);*/
this.breadcrumb(slider, state, this.explore("sur"), true);
}
if (tag == "zoom") {
document.querySelector("#mult").innerText = value;
}
}
adaptExample(style, value, example) {
let taille;
if (example.getAttribute(`data-lisio-${style}`) == null) {
taille = window.getComputedStyle(example).getPropertyValue(style); // on récupère la valeur du style de base si elle n'a jamais été récupéré
if (taille == "normal") { // ajustemment pour la valeur "normale"
if (style == "line-height") {
taille = parseFloat(window.getComputedStyle(example).getPropertyValue("font-size")) * 1.2;
} else if (style == "letter-spacing") {
taille = 2;
} else if (style == "word-spacing") {
taille = parseFloat(window.getComputedStyle(example).getPropertyValue("font-size")) * 1.25;
}
} else {
taille = parseFloat(taille);
if (taille === 0 && style == "word-spacing") {
taille = 1;
} else if (taille == 0 && style == "letter-spacing") {
taille = 0.25;
}
}
example.setAttribute(`data-lisio-${style}`, taille); // on sauvegarde la valeur par défaut en la stockant dans un attribut
} else {
taille = example.getAttribute(`data-lisio-${style}`); // on récupère la valeur par défaut si déjà récupéré
}
let calc;
if (style == "font-size") {
if (taille < 14) {
calc = Math.ceil(parseFloat(taille) + 5 * value);
} else if (taille < 20) {
calc = Math.ceil(parseFloat(taille) + 3.5 * value);
} else {
calc = Math.ceil(parseFloat(taille) + 3 * value);
}
example.style.lineHeight = `${Math.ceil(calc * 1.2)}px`;
} else {
calc = Math.ceil(taille * value);
}
example.style[style] = `${calc}px`;
}
/**
* Instantiation des composants MDL (Boutons, checkbox, slider, switch, listes, etc)
*/
async instantiateMDL() {
return new Promise((resolve, reject) => {
document.querySelectorAll('ul.lisiojs__section_menu > li, button[lisio-target]').forEach((btn) => {
if (btn.hasAttribute('lisio-target')) {
btn.addEventListener('click', () => {
if(btn.classList.contains("register") && this.nameProfSel == "" || btn.classList.contains("new_profile")){
this.authCookies(1);
}
if (btn.classList.contains("register") && (this.nameProfSel != "" || document.querySelector("#profile_name").value.trim() != "")) {
this.save();
} else {
this.nextMenu(document.querySelector(btn.getAttribute('lisio-target')));
}
});
}
});
document.querySelector('.lisiojs__navbar_back').addEventListener('click', () => {
this.prevMenu(parent);
});
this.cnt['MDLCheckbox'] = [];
document.querySelectorAll('input.mdl-checkbox').forEach((elem) => {
//this.cnt['MDLCheckbox'].push(new mdl.checkbox.MDLCheckbox(elem));
});
this.cnt['MDLFormField'] = [];
document.querySelectorAll('.mdl-form-field').forEach((elem) => {
//this.cnt['MDLFormField'].push(new mdl.formField.MDLFormField(elem));
});
this.cnt['MDLTextField'] = [];
document.querySelectorAll('.mdl-textfield__input').forEach((elem) => {
this.cnt['MDLTextField'].push(elem);
});
this.cnt['MDLSwitch'] = [];
document.querySelectorAll('.mdl-switch__input').forEach((elem) => {
this.cnt['MDLSwitch'].push(elem);
});
this.cnt['MDLSlider'] = [];
document.querySelectorAll('.mdl-slider').forEach((elem) => {
let slider = elem.MaterialSlider;
this.cnt['MDLSlider'].push(slider);
});
this.cnt['MDLList'] = [];
document.querySelectorAll('ul.mdl-list').forEach((elem) => {
this.cnt['MDLList'].push(elem);
/* if (elem.getAttribute("data-list") == "voice") {
list.selectedIndex = 0;
}else if(elem.getAttribute("data-list")=="users"){
list.selectedIndex = this.selI;
}*/
/*const listItemRipples = list.listElements.map((listItemEl) => new mdl.ripple.MDLRipple(listItemEl));
this.cnt['MDLList'].push(listItemRipples);*/
});
this.cnt['MDLRadio'] = [];
document.querySelectorAll('input.mdl-radio__button').forEach((elem) => {
this.cnt['MDLRadio'].push(elem);
});
resolve(true);
});
}
/**
* Récupération des voix pour la synthèse vocale
*/
async getPcVoices() {
return new Promise((resolve, reject) => {
let v = this.synth.getVoices();
while(v.length == 0){
v = this.synth.getVoices();
}
resolve(v);
});
}
/**
* Fabrique un cookie
* @param {string} style
* @param {number/string} value
*/
bakeCookies(style, value) {
if(safariAgent){
localStorage.setItem(style,value);
}else{
this.params[style] = value;
document.cookie = `${style}=${value}; expires=Tue 19 Jan 2038 03:14:08 UTC; samesite=None;secure`;
}
}
/**
* Permet de sauvegarder un profil
*/
save() {
try{
if(this.acceptCookies){
document.querySelector("html").style.cursor="wait";
let res=null;
if(safariAgent){
res = localStorage.getItem("profils");
res = res == "" ? null : res;
}else{
res = /profils=([\w\/\.\|_-]+)/gu.exec(document.cookie)
res = res != null ? res[1] : null;
}
let name = document.querySelector("#profile_name").value; //on demande un nom de profil
name=name.replace(/\s/g,"-");
// Si aucun nom n'est saisi, on stoppe la fonction
if (this.nameProfSel == "" || name != "") {
if (/[^\w-]/u.test(name)) {
alert("Veuillez ne saisir que des lettres, des chiffres, des espaces ou des tirets");
return;
}else if(name =="" && this.nameProfSel == ""){
alert("Veuillez entrer un nom");
return;
}
}else{
name = this.nameProfSel;
}
if (res == null) {
this.params.adaptation=true;
this.bakeCookies('profils', `${this.cookieVersion}/${this.convertParams()}/${name}_2`);
const fetchURL = this.addStats;
const fetchOptions = {
header: {
'Content-Type': 'application/json'
},
mode : 'cors',
method: "POST",
body: JSON.stringify({
col: "newUser",
nd: this.origin
})
}
fetch(fetchURL, fetchOptions)
.catch((error) => {
console.log(error);
});
} else {
let execRes = new RegExp(`([\\w\\/\\._-]+)${name}_[012]`, 'gu').exec(res);
/*if(this.nameProfSel ==""){
let split = res.split('|');
let newString = "";
split.forEach((res, i) => {
if (res.includes(name)) {
newString += res.replace(new RegExp(`[\\w\\/\\._-]+${name}_[012]`, 'gu'), `${this.cookieVersion}/${this.convertParams()}/${name}_2`);
} else {
newString += res.replace(new RegExp(`([\\w\\/\\._-]+\\w)_[012]`, 'gu'), "$1_0");
}
i != split.length - 1 ? newString += "|" : "";
})
this.bakeCookies(
'profils',
newString
);
}else */if(this.nameProfSel != this.nameProfApply){
let split = res.split('|');
let newString = "";
split.forEach((res, i) => {
if (res.includes(name)) {
newString += res.replace(new RegExp(`([\\w\\/\\._-]+${name})_[012]`, 'gu'), `$1_2`);
} else {
newString += res.replace(new RegExp(`([\\w\\/\\._-]+\\w)_[012]`, 'gu'), "$1_0");
}
i != split.length - 1 ? newString += "|" : "";
})
this.bakeCookies(
'profils',
newString
);
}else if (execRes != null) {
let split = res.split('|');
let newString = "";
split.forEach((res, i) => {
if (res.includes(name)) {
newString += res.replace(new RegExp(`([\\w\\/\\._-]+)${name}_[012]`, 'gu'), `${this.cookieVersion}/${this.convertParams()}/${name}_${this.params.adaptation && document.querySelector("input[data-lisiojs='adaptation']").value == name ? "2" : "1"}`);
} else {
newString += res.replace(new RegExp(`([\\w\\/\\._-]+\\w)_[012]`, 'gu'), "$1_0");
}
i != split.length - 1 ? newString += "|" : "";
})
this.bakeCookies(
'profils',
newString
);
} else if(execRes == null){
let split = res.split("|");
let newString = "";
split.forEach((res,i)=>{
newString += res.replace(new RegExp(`([\\w\\/\\._-]+)_[012]`, 'gu'), `$1_0`);
i != split.length - 1 ? newString += "|" : "";
});
newString +=`|${this.cookieVersion}/${this.convertParams()}/${name}_2`;
this.bakeCookies('profils', newString);
}else{
// Sinon, création d'un nouveau
res = res.replace(new RegExp(`([\\w\\/\\._-]+\\w)_[012]`, 'gu'), "$1_0");
this.bakeCookies('profils', `${res}|${this.cookieVersion}/${this.convertParams()}/${name}_2`);
const fetchURL = this.addStats;
const fetchOptions = {
header: {
'Content-Type': 'application/json'
},
mode : 'cors',
method: "POST",
body: JSON.stringify({
col: "newUser",
nd: this.origin
})
}
fetch(fetchURL, fetchOptions)
.catch((error) => {
console.log(error);
});
}
}
//window.location.reload();
if (this.params.preprof >= 256 && this.params.adaptation && this.display == 2) {
window.parent.postMessage({
type : 'util',
util : 'newTab',
values : 'default',
same : true
}, '*');
}else{
this.refresh();
}
}else{
alert("Veuillez activer les cookies");
return;
}
}catch(error){
console.log(error);
}
}
/**
* Permet de supprimer un profil
*/
deleteProf(name) {
try{
let result =null;
if(safariAgent){
result=localStorage.getItem("profils");
result = result == "" ? null : result;
}else{
result=/profils=([\w\/\.\|_-]+)/gu.exec(document.cookie);
result= result != null ? result[1] : null;
}
let newString = "";
let split = result.split("|");
let supprI;
split.forEach((res, i) => {
if (res.includes(name)) {
supprI=i;
newString += res.replace(new RegExp(`([\\w\\/\\._-]+)${name}_[012]`, 'gu'),'');
} else {
newString += res.replace(new RegExp(`([\\w\\/\\._-]+\\w)_[012]`, 'gu'), `$1_${i==0 || supprI == 0 || (supprI == undefined && i == split.length-2)?"2":"0"}`);
supprI=null;
}
i != split.length - 1 && split.length > 2? newString += "|" : "";
});
this.bakeCookies('profils',newString);
this.refresh();
}catch(error){
console.log(error);
}
}
apply(name) {
//appliquer un profil
try{
let tmp=null;
const oldParams = Object.assign({}, this.params);
if(safariAgent){
tmp = localStorage.getItem("profils");
tmp = tmp == "" ? null : tmp;
}else{
tmp = /profils=([\w\/\.\|_-]+)/gu.exec(document.cookie);
tmp = tmp != null ? tmp[1] : null;
}
let lastProfil = RegExp(`([\\w\\/\\._-]+)_([12])`, 'u').exec(tmp);
if (lastProfil == null) {
this.bakeCookies('profils', tmp.replace(RegExp(`([\\w\\/\\._-]+${name})_([012])`, 'u'), '$1_2'));
} else {
this.bakeCookies(
'profils',
tmp
.replace(RegExp(`([\\w\\/\\._-]+\\w)_([12])`, 'u'), '$1_0')
.replace(RegExp(`([\\w\\/\\._-]+${name})_([012])`, 'u'), '$1_2')
);
}
document.querySelector("span.activeUser").innerText += name;
const cookie = RegExp(`V[\\w\\.]+\\/(\\w+)\\/[\\w\\/\\._-]+${name}_[012]`, 'u').exec(tmp)[1];
if (cookie >= 256 && this.params.adaptation && this.display == 2 && !this.bookPage) {
window.parent.postMessage({
type : 'util',
util : 'newTab',
values : 'default',
same : false
}, '*');
}else{
window.parent.postMessage({
type: 'util',
util: 'apply',
apply: {
values: this.params,
},
},
'*'
);
const fetchURL = this.addStats;
const fetchOptions = {
header: {
'Content-Type': 'application/json'
},
mode : 'cors',
method: "POST",
body: JSON.stringify({
col: "nbApply",
nd: this.origin
})
}
fetch(fetchURL, fetchOptions)
.catch((error) => {
console.log(error);
});
/*const cleanParams = this.cleanParams()
if(cleanParams != {}){
const fetchURL = "https://www.adaptiweb.com/versions/test/updateBDD.php";
const fetchOptions = {
header: {
'Content-Type': 'application/json'
},
mode : 'cors',
method: "POST",
body: JSON.stringify({
url: "test",
params: cleanParams
})
}
fetch(fetchURL, fetchOptions)
.then((res) => {
return res.json();
})
.then((dataJSON) => {
console.log(dataJSON);
})
.catch((error) => {
console.log(error);
});
}*/
}
if(this.display != 2){
this.params=oldParams;
}
}catch(error){
console.log(error);
}
}
/**
* Permet de convertir les paramètres
*/
convertParams() {
let ret = [0, 0, 1, 0, 0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0].slice();
Object.keys(this.params).forEach((param) => {
switch (param) {
case 'preprof':
ret[0] = this.params[param];
break;
case 'font-size':
ret[1] = this.params[param];
break;
case 'line-height':
ret[2] = this.params[param];
break;
case 'word-spacing':
ret[3] = this.params[param];
break;
case 'letter-spacing':
ret[4] = this.params[param];
break;
case 'brightness':
ret[5] = this.params[param];
break;
case 'zoom':
ret[6] = this.params[param];
break;
case 'biggerclick':
ret[7] = this.params[param];
break;
case 'contrast':
ret[8] = this.params[param];
break;
case 'daltonisme':
ret[9] = this.params[param];
break;
case 'font-family':
ret[10] = this.params[param];
break;
case 'text-align':
ret[11] = this.params[param];
break;
case 'voca':
ret[12] = this.convertParam(param, this.params[param]);
break;
case 'showAlt':
ret[13] = this.convertParam(param, this.params[param]);
break;
case 'hightlight':
ret[14] = this.convertParam(param, this.params[param]);
break;
case 'animation':
ret[15] = this.convertParam(param, this.params[param]);
break;
case 'navClavier':
ret[16] = this.convertParam(param, this.params[param]);
break;
case 'mask':
ret[17] = this.convertParam(param, this.params[param]);
break;
case 'trad':
ret[18] = this.params[param];
break;
case 'dyslexie':
ret[19] = this.params.dyslexie;
break;
case 'synth':
ret[20] = `${this.convertParam(param,this.params[param])}-${this.params.voice}-${Math.round(this.params.rate * 10) / 10}-${
Math.round(this.params.pitch * 10) / 10
}`;
break;
case 'list':
ret[21] = this.convertParam(param, this.params[param]);
break;
case 'cursor':
ret[22] = this.params[param];
break;
}
});
ret = ret.join('/');
return ret;
}
convertParam(param, value) {
const contrasts = ['defaut', 'cYbgB', 'cBbgW', 'cWbgB', 'cBLbgW', 'cBbgG'];
const filtres = ['defaut', 'protanopia', 'deuteranopia', 'tritanopia', 'monochromacy', 'enhanceR', 'enhanceG'];
const polices = ['defaut', 'andika', 'openDyslexic', 'arial', 'comic'];
const textAlign = ['defaut', 'left', 'center', 'right', 'justify'];
const tailles = ['defaut', 'big', 'verybig'];
const states = ['false', 'true'];
const lang = ['defaut', "fr", "en", "es", "it", "de", "ja", "ru", "zh-CN","ar","pt","ca","ko","da","fi","cy","el","he","hi","nl","no","sv","cs","th","tr","uk","vi","yi","lb"];
switch (param) {
case 'contrast':
return contrasts.indexOf(value) == -1 ? this.params[param] : contrasts.indexOf(value);
break;
case 'daltonisme':
return filtres.indexOf(value) == -1 ? this.params[param] : filtres.indexOf(value);
break;
case 'font-family':
return polices.indexOf(value) == -1 ? this.params[param] : polices.indexOf(value);
break;
case 'text-align':
return textAlign.indexOf(value) == -1 ? this.params[param] : textAlign.indexOf(value);
break;
case 'cursor':
return tailles.indexOf(value) == -1 ? this.params[param] : tailles.indexOf(value);
break;
case 'showAlt':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'hightlight':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'animation':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'navClavier':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'mask':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'synth':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'trad':
return lang.indexOf(value) == -1 ? this.params[param] : lang.indexOf(value);
break;
case 'list':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'voca':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
break;
case 'auto':
return states.indexOf(value) == -1 && typeof value != "boolean" ? this.params[param] : states.indexOf(String(value));
}
}
/**
* Transforme un tableau en object avec les bonnes valeurs aux bon attributs
* @param {array} array
*/
bindStyleVal(array) {
return {
preprof: array[0],
'font-size': array[1],
'line-height': array[2],
'word-spacing': array[3],
'letter-spacing': array[4],
brightness: array[5],
zoom: array[6],
biggerclick: array[7],
contrast: array[8],
daltonisme: array[9],
'font-family': array[10],
'text-align': array[11],
voca: array[12] == 1,
showAlt: array[13] == 1,
hightlight: array[14] == 1,
animation: array[15] == 1,
navClavier: array[16] == 1,
mask: array[17] == 1,
trad: array[18],
dyslexie: array[19],
synth: array[20],
list: array[21] == 1,
cursor: array[22],
};
}
/**
* Convertit un entier en binaire
* @param {number} int
*/
convertToBin(int) {
let reste = int,
results = [];
while (reste != 1 && reste != 0) {
results.push(reste % 2);
reste = Math.floor(reste / 2);
}
results.push(reste);
return results;
}
/**
* Applique le cookie lié au profil pré établis
* @param {number} int
*/
applyPreProf(int) {
const bin = this.convertToBin(int);
const list = Array.from(document.querySelectorAll('[data-lisiojs-profils]'));
if(this.nightModeOnHome && this.display == "1"){
list.move(0, 7);
list.move(6, 0);
}
list.shift();
list.move(19, 17);
/*list.forEach((item,i)=>{
if(item.getAttribute("data-list-index") != undefined){
list.splice(item.getAttribute("data-list-index"), 0, list.splice(i, 1)[0]);
}
});*/
if(this.display != 2){
for(let i=0;i<8;i++){
if (bin[i] != undefined && bin[i] != 0) {
list[i].checked = true;
let e = new Event('change');
list[i].dispatchEvent(e);
}
}
}else{
list.forEach((profil, i) => {
let nuit = false;
if (bin[i] != undefined && bin[i] != 0 && i < 22) {
let e = new Event('change');
if(i>7 && !this.bookPage){
profil.checked = false;
}else{
if(i == 6){
nuit = true;
}
profil.checked = true;
}
e.nuit = nuit;
profil.dispatchEvent(e);
}
});
}
}
/**
* Applique à nouveaux les profils
*/
reApply() {
const list = Array.from(document.querySelectorAll('[data-lisiojs-profils]'))
list.forEach((profil, i) => {
if (profil.checked) {
this.cookiePreProf -= Math.pow(2, i);
profil.dispatchEvent(new Event('change'));
}
});
}
async initVoices() {
const pcVoices = await this.getPcVoices();
// Création d'un template, un template contient un object documentFragment
const tpl = document.createElement('template');
pcVoices.forEach((voice, i) => {
this.params.voice = voice.lang == "fr-FR" && this.params.voice == 0 ? i : this.params.voice;
tpl.innerHTML += `
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<span class="mdl-list-item__primary-text">${voice.name.replace(/Microsoft | Google/g, '') + ' (' + voice.lang + ')'}</span>
</span>
<span class="mdl-list__item-secondary-content">
<label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="voice${i}">
<input type="radio" id="voice${i}" class="mdl-radio__button" type="radio" name="lisiojs__section_synth_lang" data-lang="${voice.lang}" data-name="${voice.name}" data-i="${i}" ${i==0?'value="defaut"':""} data-lisio-parent="voice" checked="${i==0}" data-lisiojs="voice">
</label>
</span>
</li>`;
});
document.getElementById('langues').appendChild(tpl.content);
}
/**
* Permet de synchroniser l'affichage
* @param {object} obj
*/
sync(obj) {
for (let [key, value] of Object.entries(obj)) {
try{
if (key == "preprof" || key == "color" || key == "adaptation" || key == "profils" || key == "voice") {
if (key == "preprof" && this.cookiePreProf == 0) {
this.applyPreProf(value);
}
continue;
} else {
//boucle sur l'objet
let feature =
document.querySelectorAll(`[data-lisiojs="${key}"`).length == 0 ?
document.querySelectorAll(`[data-lisiojs-profils="${key}"`) :
document.querySelectorAll(`[data-lisiojs="${key}"`); //on récupère la fonctionnalité qui correspond dans le dom
feature = feature.length == 1 ? feature[0] : feature[value];
let parent = feature.getAttribute("data-lisio-parent") == null ? feature.getAttribute("data-lisiojs") : feature.getAttribute("data-lisio-parent");
parent = document.querySelector(`[data-lisio-section="${parent}"`).getAttribute("data-lisio-parent") == null ? feature.getAttribute("data-lisio-parent") : document.querySelector(`[data-lisio-section="${parent}"`).getAttribute("data-lisio-parent");
let id = parent == "sur-mesure" ? "sur" : parent == "synth" ? "synth" : parent == "accessibilite" ? "acc" : parent == "trad" ? "trad" : "sen";
let misc = false;
let state = value;
let mult = 1;
if (feature == null || feature == undefined) {
//si y en a pas on passe
continue;
} else {
if (feature.classList.contains("mdl-slider")) {
//si c'est une div
key == "rate" || key == "pitch" || key == "brightness" ? mult = 10 : mult;
if (feature.value != value * mult) {
//que les valeurs sont différentes
feature.MaterialSlider.change(value * mult); //on actualise la valeur
feature.dispatchEvent(new Event("input"));
misc = true;
}
state = value * mult != feature.getAttribute("data-default");
if (key == "zoom") {
document.querySelector("#mult").innerText = value;
}
} else if (feature.classList.contains("mdl-switch__input")) {
//si c'est un input
if (key == 'synth') {
//si c'est la synthèse vocale
//feature.parentNode.parentNode.lastElementChild.classList.remove('d-none'); //on affiche les paramètres
value = state = this.params.synth;
//document.querySelectorAll('#langues li')[this.params.voice].checked = true;
/*this.cnt['MDLSlider']
.find((slider) => slider.root.getAttribute('data-lisiojs') == `rate`)
.stepUp(this.params.rate*10); //on actualise les paramètres
this.cnt['MDLSlider']
.find((slider) => slider.root.getAttribute('data-lisiojs') == `pitch`)
.stepUp(this.params.pitch*10);*/
//document.querySelector("#langues").selectedIndex = ;
if (this.params.auto) {
const auto = document.querySelector('input[data-lisiojs="auto"]');
auto.checked = true;
auto.dispatchEvent(new Event("change"));
this.breadcrumb(auto, true, this.explore(id), false);
}
} else if (key == 'dyslexie' && value != 0) {
//si c'est la dyslexie mêmee démarche que pour la synthèse vocale
//feature.parentNode.parentNode.lastElementChild.classList.remove('d-none');
let tab = value.split('-');
if (tab[0] != "") {
const red = document.querySelector('input[name="red"]');
red.value = tab[0].replace(/_/g, ' ');
red.dispatchEvent(new Event("input"));
}
if (tab[1] != "") {
const green = document.querySelector('input[name="green"]');
green.value = tab[1].replace(/_/g, ' ');
green.dispatchEvent(new Event("input"));
}
if (tab[2] != "") {
const blue = document.querySelector('input[name="blue"]');
blue.value = tab[2].replace(/_/g, ' ');
blue.dispatchEvent(new Event("input"));
}
}
if (feature.getAttribute("data-lisiojs-profils") == null) {
state = value == 0 || value == 'false' ? false : value == 1 || value == 'true' ? true : value; //on converti la valeur
if(state){
feature.checked = state;
feature.dispatchEvent(new Event("change"));
}
}
} else if(feature.classList.contains("mdl-radio__button")){
state = value != 0;
if(state){
feature.checked = state;
feature.dispatchEvent(new Event("change"));
}
}
if (feature.getAttribute("data-lisiojs-profils") == null) {
this.breadcrumb(feature, state, this.explore(id), misc);
}
}
}
}catch(error){
console.log(error);
}
}
}
keepNotDefault(paramsP){
let ret={}
for (const [key, value] of Object.entries(paramsP)) {
if(((key == 'font-size' || key =='word-spacing' || key =='word-spacing' || key =='letter-spacing' || key =='biggerclick' ||key =='contrast'||key =='daltonisme'||key =='font-family'||key =='text-align'||key =='cursor'||key =='showAlt'||key =='hightlight'||key =='animation'||key =='navClavier'||key =='mask'||key =='preprof'||key =='dyslexie'||key =='synth'||key =='list'||key=='preprof'||key=='voice'|| key=='auto' || key == 'voca') && value != 0) || ((key=='line-height' || key=='brightness' || key=='zoom'||key=='pitch'||key=='rate') && value != 1) || key == "trad"){
ret[key]=value
}
}
return ret;
}
createProfiles() {
let res =null;
let process =null;
if(safariAgent){
res=localStorage.getItem("profils");
res = res == "" ? null : res;
process = localStorage.getItem("process");
process = process == "" ? null : process;
}else{
res=/profils=([\w\/\.\|_-]+)/g.exec(document.cookie);
res = res != null ? res[1] : null;
process=/process=([01])/g.exec(document.cookie);
process = process != null ? process[1] : null;
}
this.profils = res != null ? res.split('|').filter(elt => elt != "") : [];
//this.profils.length != 0 ? this.acceptCookies = true : this.acceptCookies =false;
if(res){
const prof_button = document.querySelector('li[lisio-target="#lisiojs__section_profiles"]');
prof_button.classList.remove('d-none');
prof_button.nextElementSibling.classList.remove('d-none');
}
// Création d'un template, un template contient un object documentFragment
const tplList = document.createElement('template');
const tplListActive = document.createElement('template');
const tplSection = document.createElement('template');
// On récupère les profils, si en y a on les affiche
this.profils.forEach((profil, i) => {
try{
let paramsProfil = profil.split('/');
paramsProfil.shift();
const name = paramsProfil[23].split('_')[0];
const state = paramsProfil[23].split('_')[1];
paramsProfil = this.bindStyleVal(paramsProfil);
window.parent.postMessage(`${paramsProfil} paramsProfil`,"*");
tplListActive.innerHTML += `
<li class="mdl-list__item">
<span class="mdl-list__item-primary-content">
<span class="mdl-list-item__primary-text">${name}</span>
</span>
<span class="mdl-list__item-secondary-content">
<label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="defaut-crs">
<input type="radio" id="defaut-crs" class="mdl-radio__button" name="lisiojs__section_prof" value="${i}" data-lisiojs="user" ${state>= 1 ? "checked" : ""}>
</label>
</span>
</li>`;
tplList.innerHTML += `
<li class="mdl-list__item" lisio-target="#lisiojs__profile_${i}">
<i class="mdl-list-item__graphic material-icons" aria-hidden="true">face</i>
<span class="mdl-list__item-primary-content">
<span class="mdl-list-item__primary-text">${name}</span>
</span>
<span class="mdl-list__item-secondary-content">
<span class="mdl-list__item-secondary-action" aria-hidden="true" data-lisio-section="profile${i}" data-lisio-parent="profiles"><i class="material-icons">chevron_right</i></span>
</span>
</li>`;
tplSection.innerHTML += `
<section class="mdl-grid mdl-grid--no-spacing lisiojs__section lisiojs__position_right" id="lisiojs__profile_${i}" lisio-parent="#lisiojs__section_profiles">
<article class="mdl-grid">
<div class="mdl-cell mdl-cell--12-col mdl-cell--8-col-tablet mdl-cell--4-col-phone">
<h3 class="mdl-typography--headline3 t-ctr">${name}</h3>
</div>
<div class="mdl-cell mdl-cell--12-col mdl-cell--8-col-tablet mdl-cell--4-col-phone">
<div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" id="${name}" name="profil-name" value="${name}">
</div>
</div>
<div class="mdl-cell mdl-cell--6-col mdl-cell--4-col-tablet mdl-cell--2-col-phone">
${this.profils.length > 1 ?`
<button class="mdl-button mdl-button--raised mdl-button--colored delete" data-profil-name="${name}" lisio-lang="Delete">
Supprimer
</button>`:""}
</div>
</article>
</section>`;
if (state > 0) {
let synthParams = paramsProfil.synth.split("-");
paramsProfil.synth = synthParams[0] >= 1;
if (paramsProfil.synth) {
paramsProfil.voice = synthParams[1];
paramsProfil.rate = synthParams[2];
paramsProfil.pitch = synthParams[3];
synthParams[0] == 2 ? paramsProfil.auto = true : '';
}
this.mergeObjects(this.keepNotDefault(paramsProfil));
let input = document.querySelector('input[data-lisiojs="adaptation"]');
input.value = name;
input.parentElement.parentElement.parentElement.classList.remove("d-none");
input.parentElement.parentElement.parentElement.nextElementSibling.classList.remove("d-none");
this.nameProfSel = name;
if (state == 1) {
window.parent.postMessage({
type:"util",
util:"clearTrad"
},"*")
Array.from(input.parentElement.parentElement.parentElement.parentElement.parentElement.children).forEach((elt, i) => {
if (i != 0) {
elt.classList.toggle("d-none");
}
});
}
this.params.adaptation = false;
if(safariAgent){
res=localStorage.getItem(name);
res = res == "" || res == null ? null : res;
}else{
res=RegExp(`${name}=(1)`).exec(document.cookie);
res = res != null ? res[1] : null;
}
if(res != null){
window.parent.postMessage({
type : "util",
util : "hide",
value : 1
},"*");
}
}
if (state == 2) {
let input = document.querySelector('input[data-lisiojs="adaptation"]');
if(process == 1){
this.params.adaptation = false;
input.checked = false;
const error = document.querySelector("div.overload");
error.textContent = "Une erreur est survenue durant l'adaptation du site";
error.classList.remove("d-none");
Array.from(input.parentElement.parentElement.parentElement.parentElement.parentElement.children).forEach((elt, i) => {
if (i != 0) {
elt.classList.toggle("d-none");
}
});
this.bakeCookies("process",0);
}else{
this.params.adaptation = true;
input.checked = true;
document.querySelector("#power").classList.toggle("on");
this.nameProfApply = name;
if(paramsProfil.dyslexie != "0"){
if(paramsProfil.dyslexie != "0"){
document.querySelector('span[lisio-lang="DescTrad1"]').classList.remove("d-none");
}
document.querySelector(`li[lisio-target="#lisiojs__section_trad"]`).classList.add("func-disable");
document.querySelector('span[lisio-lang="Translations"]').classList.replace("fs12-0","fs12");
}else if(paramsProfil.trad > 0){
document.querySelectorAll('span[lisio-lang="DescTrad"]').forEach(span=>{
span.classList.remove("d-none");
});
document.querySelector(`li[lisio-target="#lisiojs__section_sen_under"]`).classList.add("func-disable");
document.querySelector('span[lisio-lang="DescDys"]').classList.remove("d-none");
document.querySelector('span[lisio-lang="Dyslexia"]').classList.replace("fs12-0","fs12");
}
input.dispatchEvent(new Event("change"));
}
}
state>=1?this.selI=i:"";
} catch(error){
console.log(error);
}
});
window.parent.postMessage({
type : "util",
util : "refreshLabel",
values : this.params.adaptation
},"*")
document.querySelector('#parent').appendChild(tplSection.content);
document.querySelector('#profils-list').insertBefore(tplList.content,document.querySelector('#last-separator2'));
document.querySelector('#profils-listActive').insertBefore(tplListActive.content,document.querySelector('#last-separator1'));
}
async initListeners() {
return new Promise((resolve, reject) => {
try {
window.addEventListener("message",e=>{
if(e.data == "disable"){
document.querySelector('input[data-lisiojs="adaptation"]').checked=false;
document.querySelector('input[data-lisiojs="adaptation"]').dispatchEvent(new Event("change"));
this.save();
}else if(e.data.util == "hide"){
this.saveHide(e.data.value);
}else if(e.data.util == "process"){
this.bakeCookies("process", e.data.process);
}
});
document.querySelectorAll("li.mdl-list__item").forEach((elt)=>{
const input = elt.querySelector("input");
if(input != null){
elt.addEventListener("click",(e)=>{
if(e.target == e.currentTarget){
e.stopPropagation();
input.checked = input.type == "radio" ? true : !input.checked;
input.dispatchEvent(new Event("change"));
}
if(input.getAttribute("data-lisiojs") == "adaptation"){
this.save();
}
});
}
});
document.querySelectorAll('input[type="checkbox"]').forEach(elt=>{
elt.addEventListener("change",e=>{
if(e.target.checked){
e.currentTarget.parentElement.parentElement.parentElement.classList.add("fill_bg");
}else{
e.currentTarget.parentElement.parentElement.parentElement.classList.remove("fill_bg");
}
});
})
// Mise à jour de la taille du menu si la taille de la fenêtre change
window.addEventListener('resize', this.updateMenu);
// Ajout d'écouteurs sur la liste des voix
document.querySelectorAll('#langues li').forEach(this.evtLang.bind(this));
// Sauvegarde du profil
document.querySelector('#register').addEventListener('click', this.save.bind(this));
// mode auto de la synthèse vocale
document
.querySelector("input[data-lisiojs='auto']")
.addEventListener('change', this.evtAutoVoice.bind(this));
// cas particulier pour la dyslexie
document
.querySelector('input[data-lisiojs-profils="dyslexie"]')
.addEventListener('change', this.evtDyslexie.bind(this));
document.querySelectorAll("input[name='red'],input[name='green'],input[name='blue']").forEach(input => {
input.addEventListener("input", this.evtInputDyslexie.bind(this));
});
// Presbytie
document
.querySelector("input[data-lisiojs-profils='presbytie']")
.addEventListener('change', this.evtPresbytie.bind(this));
// Cataracte
document
.querySelector("input[data-lisiojs-profils='cataracte']")
.addEventListener('change', this.evtCataracte.bind(this));
// Epilepsie
document
.querySelector("input[data-lisiojs-profils='épilepsie']")
.addEventListener('change', this.evtEpilepsie.bind(this));
// Profil pour les mouvements et gestes
document
.querySelectorAll("input[data-lisiojs-profils='mouvements'], input[data-lisiojs-profils='gestes']")
.forEach(this.evtMouvements.bind(this));
//profil pour la vision faible etc
document
.querySelector("input[data-lisiojs-profils='low']")
.addEventListener('change', this.evtLowEyeSight.bind(this));
//profil pour la vision faible etc
document
.querySelector("input[data-lisiojs-profils='veryLow']")
.addEventListener('change', this.evtVeryLowEyeSight.bind(this));
//profil pour la vision faible etc
document
.querySelector("input[data-lisiojs-profils='vision']")
.addEventListener('change', this.evtVision.bind(this));
// Profil Zen / Séniors
document
.querySelector("input[data-lisiojs-profils='lecture']")
.addEventListener('change', this.evtLecture.bind(this));
document
.querySelector("input[data-lisiojs-profils='glassX2']")
.addEventListener('change', this.evtGlassX2.bind(this));
// Profil Nuit
document
.querySelector("input[data-lisiojs-profils='glassX4']")
.addEventListener('change', this.evtGlassX4.bind(this));
// Profil inexpérience, apprentissage
document
.querySelectorAll(
"input[data-lisiojs-profils='inexpérience'], input[data-lisiojs-profils='apprentissage']"
)
.forEach(this.evtInex.bind(this));
// Profil Nuit
document
.querySelectorAll("input[data-lisiojs-profils='nuit']").forEach(elt=>{
elt.addEventListener('change', this.evtNuit.bind(this));
});
// Profil Nuit
document
.querySelector("input[data-lisiojs-profils='focus']")
.addEventListener('change', this.evtFocus.bind(this));
// Profil trouble de l'attention et de la mémoire
document
.querySelectorAll("input[data-lisiojs-profils='attention'], input[data-lisiojs-profils='mémoire']")
.forEach(this.evtAtt.bind(this));
// Profil migraine
document
.querySelector("input[data-lisiojs-profils='migraine']")
.addEventListener('change', this.evtMigraine.bind(this));
// Profil migraine
document
.querySelector("input[data-lisiojs-profils='underline']")
.addEventListener('change', this.evtUnderline.bind(this));
// Profil rural
document
.querySelector("input[data-lisiojs-profils='lighter']")
.addEventListener('change', this.evtZon.bind(this));
// Profil éco
document
.querySelector("input[data-lisiojs-profils='éco']")
.addEventListener('change', (e)=>{e.nuit == undefined ? e.nuit = true : e.nuit = false; this.evtEco(e)});
//slider evenbtlistener
document.querySelectorAll("input.mdl-slider").forEach((elt)=>{
elt.addEventListener('input', e => this.sliderChange(elt, e.target.value));
});
//récupère toutes les checkbox de fonctionnalités
document.querySelectorAll('input[type="checkbox"][data-lisiojs]').forEach((elt) => {
elt.addEventListener('change', this.evtCheckbox.bind(this));
});
//on récupère tous les selects de fonctionnalités
document.querySelectorAll("input[type='radio'][data-lisiojs]").forEach((elt) => {
elt.addEventListener('change', this.evtRadio.bind(this));
});
document.querySelectorAll(".delete").forEach(button => {
button.addEventListener("click", (e) => {
this.deleteProf(button.getAttribute("data-profil-name"));
});
});
document.querySelector("#lisiojs__cookies").addEventListener("change", this.authCookies.bind(this));
//fermeture du widget
document.querySelector(".lisiojs__navbar_close").addEventListener("click", e => {
window.parent.postMessage({
type: 'util',
util: 'close',
},
'*'
);
});
document.querySelectorAll(".rename").forEach(elt => {
elt.addEventListener("click", e => {
this.renameProfil(e.target.getAttribute("data-profil-index"), e.target.parentElement.parentElement.parentElement.querySelector("input").value.replace(/\s/g,"-"));
});
});
document.querySelector("img.mw-40").addEventListener("click", (e) => {
window.parent.postMessage({
type: 'util',
util: 'url',
url: 'https://www.lisio.fr/'
},
'*'
);
});
document.querySelector("button.reset").addEventListener("click",this.reset.bind(this));
resolve(true);
} catch (err) {
reject(err);
}
});
}
mergeObjects(source) {
for (const [key, value] of Object.entries(source)) {
this.params[key] = value;
}
}
/**
* Mode auto de la synthèse vocale
* @param {Event} e
*/
evtAutoVoice(e) {
/*window.parent.postMessage(
{
type: 'util',
util: 'start',
start: e.target.checked,
},
'*'
);*/
if (e.target.checked) {
this.params.synth = 2;
} else if (document.querySelector('input[data-lisiojs="synth"]').checked) {
this.params.synth = 1;
} else {
this.params.synth = 0;
}
//this.mergeObjects(values);
this.breadcrumb(e.target, e.target.checked, this.explore("synth"));
}
evtInputDyslexie(e) {
let colors = [
document.getElementsByName('red')[0].value,
document.getElementsByName('green')[0].value,
document.getElementsByName('blue')[0].value,
],
double = false;
for (let i = 0; i < colors.length; i++) {
//permet de vérifier s'il n'y a pas de doublon au niveau des lettres avec d'autres couleurs
if (!/[^\w\s]/u.test(colors[i])) {
if (colors[i] != '') {
if (!double) {
let colorsSplit = colors[i].split(' ');
colorsSplit.forEach((letterI, index) => {
for (let j = index + 1; j < colorsSplit.length; j++) {
if (colorsSplit[j] == letterI) {
i == 0 ? document.getElementsByName('red')[0].value = "" : i == 1 ? document.getElementsByName('green')[0].value = "" : document.getElementsByName('blue')[0].value = "";
double = true;
}
}
});
for (let j = i + 1; j < colors.length; j++) {
if (RegExp(`[${colorsSplit.join('')}]`).test(colors[j])) {
j == 0 ? document.getElementsByName('red')[0].value = "" : j == 1 ? document.getElementsByName('green')[0].value = "" : document.getElementsByName('blue')[0].value = "";
double = true;
}
}
} else {
break;
}
}
} else {
i == 0 ? document.getElementsByName('red')[0].value = "" : i == 1 ? document.getElementsByName('green')[0].value = "" : document.getElementsByName('blue')[0].value = "";
}
}
if (document.getElementsByName('red')[0].value == '' &&
document.getElementsByName('green')[0].value == '' &&
document.getElementsByName('blue')[0].value == '') {
this.params.dyslexie = 0;
} else {
if (
document.getElementsByName('red')[0].value != '' ||
document.getElementsByName('green')[0].value != '' ||
document.getElementsByName('blue')[0].value != ''
) {
if (double) {} else {
let param = "";
document
.getElementsByName('red')[0]
.value.split(' ')
.forEach((letter) => {
param += `${letter}_`;
});
param = param.substring(0, param.length - 1) + '-';
document
.getElementsByName('green')[0]
.value.split(' ')
.forEach((letter) => {
param += `${letter}_`;
});
param = param.substring(0, param.length - 1) + '-';
document
.getElementsByName('blue')[0]
.value.split(' ')
.forEach((letter) => {
param += `${letter}_`;
});
param = param.substring(0, param.length - 1);
this.params.dyslexie = param;
}
}
}
}
/**
* cas particulier pour la dyslexie
* @param {Event} e
*/
evtDyslexie(e) {
let values = {
'font-family': 2,
};
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
if (e.target.checked) {
this.cookiePreProf += 1;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-1>=0){
this.cookiePreProf -= 1;
}
values = {
'font-family': 0,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params.preprof = this.cookiePreProf;
}
/**
* Profil nuit
* @param {Event} e
*/
evtGlassX2(e) {
let values = {
cursor:2
};
document.querySelector("[data-lisiojs='zoom']").getAttribute('aria-valuenow') < 2 ?
(values.zoom = 2) :
values;
if (e.target.checked) {
this.cookiePreProf += 2;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-2>=0){
this.cookiePreProf -= 2;
}
values = {
zoom: 1,
cursor:0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil nuit
* @param {Event} e
*/
evtGlassX4(e) {
let values = {
cursor:2,
};
document.querySelector("[data-lisiojs='zoom']").getAttribute('aria-valuenow') < 4 ?
(values.zoom = 4) :
values;
if (e.target.checked) {
this.cookiePreProf += 4;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-4>=0){
this.cookiePreProf -= 4;
}
values = {
zoom: 1,
cursor:0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil pour l'épilepsie
* @param {Event} e
*/
evtEpilepsie(e) {
let values = {
contrast: 5,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 2 ?
(values['font-size'] = 2) :
values;
if (e.target.checked) {
this.cookiePreProf += 8;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-8>=0){
this.cookiePreProf -= 8;
}
values = {
contrast: 0,
'font-size': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil pour les mouvements et gestes
* @param {Event} elt
*/
evtMouvements(elt) {
elt.addEventListener('change', (e) => {
let values = {
cursor : 1
};
document.querySelector("[data-lisiojs='biggerclick']").getAttribute('aria-valuenow') < 3 ?
(values['biggerclick'] = 5) :
values;
if (elt.getAttribute('data-lisiojs-profils') == 'mouvements') {
if (e.target.checked) {
this.cookiePreProf += 16;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-16>=0){
this.cookiePreProf -= 16;
}
values = {
biggerclick: 0,
cursor: 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
} else {
if (e.target.checked) {
this.cookiePreProf += 32;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-32>=0){
this.cookiePreProf -= 32;
}
values = {
biggerclick: 0,
cursor: 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params['preprof'] = this.cookiePreProf;
});
}
/**
* Profil nuit
* @param {Event} e
*/
evtNuit(e) {
let values = {
contrast: 3,
};
if (e.target.checked) {
this.cookiePreProf += 64;
this.sync(values);
this.mergeObjects(values);
document.querySelectorAll('input[data-lisiojs-profils="nuit"]').forEach(elt=>{
elt.parentElement.MaterialSwitch.on();
elt.checked = true;
});
} else{
if(this.cookiePreProf-64>=0){
this.cookiePreProf -= 64;
document.querySelectorAll('input[data-lisiojs-profils="nuit"]').forEach(elt=>{
elt.parentElement.MaterialSwitch.off();
elt.checked = false;
});
}
values = {
contrast: 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil nuit
* @param {Event} e
*/
evtFocus(e) {
let values = {
animation:true,
};
if (window.screen.width > 760){
values.mask=true;
values.cursor=1;
}
if (e.target.checked) {
this.cookiePreProf += 128;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-128>=0){
this.cookiePreProf -= 128;
}
values = {
mask: 0,
animation:0,
cursor:0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("acc"));
this.params['preprof'] = this.cookiePreProf;
}
//Inexpérience 256
/**
* Profil pour les personnes séniors
* @param {Event} e
*/
evtLecture(e) {
let values = {
'font-family': 3,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 2 ?
(values['font-size'] = 2) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 2 ?
(values['line-height'] = 1.5) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
document.querySelector("[data-lisiojs='font-family'][value='openDyslexic']").checked ?
(values['font-family'] = 2) :
values;
if (e.target.checked) {
this.cookiePreProf += 256;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-256>=0){
this.cookiePreProf -= 256;
}
values = {
'font-family': 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil pour la vision faible etc
* @param {Event} e
*/
evtLowEyeSight(e) {
let values = {
cursor: 1,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 4 ?
(values['font-size'] = 4) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 1.5 ?
(values['line-height'] = 1.5) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
if (e.target.checked) {
this.cookiePreProf += 262144;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-262144>=0){
this.cookiePreProf -= 262144;
}
values = {
cursor: 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil pour la vision très faible etc
* @param {Event} e
*/
evtVeryLowEyeSight(e) {
let values = {
cursor: 2,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 4 ?
(values['font-size'] = 6) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 2 ?
(values['line-height'] = 2) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 10) :
values;
if (e.target.checked) {
this.cookiePreProf += 16384;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-16384>=0){
this.cookiePreProf -= 16384;
}
values = {
cursor: 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil pour la vision faible etc
* @param {Event} e
*/
evtVision(e) {
let values = {
cursor: 1,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 4 ?
(values['font-size'] = 4) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 1.5 ?
(values['line-height'] = 1.5) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
if (e.target.checked) {
this.cookiePreProf += 512;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-512>=0){
this.cookiePreProf -= 512;
}
values = {
cursor: 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil pour la prebytie
* @param {Event} e
*/
evtPresbytie(e) {
let values = {
cursor: 2,
contrast: 4,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 2 ?
(values['font-size'] = 2) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 10 ?
(values['word-spacing'] = 10) :
values;
if (e.target.checked) {
this.cookiePreProf += 1024;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-1024>=0){
this.cookiePreProf -= 1024;
}
values = {
cursor: 0,
contrast: 0,
'font-size': 0,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params.preprof = this.cookiePreProf;
}
/**
* Profil pour la cataracte
* @param {Event} e
*/
evtCataracte(e) {
let values = {
contrast: 5,
cursor: 2,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 3 ?
(values['font-size'] = 3) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 2 ?
(values['line-height'] = 1.5) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
document.querySelector("[data-lisiojs='hightlight']").value ? (values['hightlight'] = true) : values;
if (e.target.checked) {
this.cookiePreProf += 2048;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-2048>=0){
this.cookiePreProf -= 2048;
}
values = {
contrast: 0,
cursor: 0,
hightlight: 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
}
evtUnderline(e){
let values = {
'font-family': 2,
};
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
if(e.target.checked){
document.querySelector(`li[lisio-target="#lisiojs__section_trad"]`).classList.add("func-disable");
document.querySelector('span[lisio-lang="Translations"]').classList.replace("fs12-0","fs12");
if(!this.params.synth){
document.querySelector('span[lisio-lang="DescTrad1"]').classList.remove("d-none");
}else{
document.querySelector('span[lisio-lang="DescTrad2"]').classList.add("d-none");
document.querySelector('span[lisio-lang="DescTrad3"]').classList.remove("d-none");
}
this.cookiePreProf+= 131072;
this.sync(values);
this.mergeObjects(values);
}else{
values = {
'font-family': 0,
'word-spacing': 0,
};
if(!this.params.synth){
document.querySelector(`li[lisio-target="#lisiojs__section_trad"]`).classList.remove("func-disable");
document.querySelector('span[lisio-lang="DescTrad1"]').classList.add("d-none");
document.querySelector('span[lisio-lang="Translations"]').classList.replace("fs12","fs12-0");
}else{
document.querySelector('span[lisio-lang="DescTrad2"]').classList.remove("d-none");
document.querySelector('span[lisio-lang="DescTrad3"]').classList.add("d-none");
}
if(this.cookiePreProf-131072>=0){
this.cookiePreProf-= 131072;
}
document.querySelectorAll("input.caracSoul").forEach(elt=>{
elt.value = "";
});
this.params.dyslexie = "0";
this.sync(values);
this.mergeObjects(values);
}
document.querySelectorAll(".caracSoul").forEach(elt=>{
elt.classList.toggle("d-none");
});
this.breadcrumb(e.target, e.target.checked, this.explore("sen"), true);
this.params['preprof'] = this.cookiePreProf;
}
/**
* Profil inexpérience et apprentissage
* @param {Element} elt
*/
evtInex(elt) {
elt.addEventListener('change', (e) => {
let values = {
'font-family': 1,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 2 ?
(values['font-size'] = 2) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 2 ?
(values['line-height'] = 1.5) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
document.querySelector("[data-lisiojs='font-family'][value='openDyslexic']").checked ?
(values['font-family'] = 2) :
values;
if (elt.getAttribute('data-lisiojs-profils') == 'inexpérience') {
if (e.target.checked) {
this.cookiePreProf += 32768;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-32768>=0){
this.cookiePreProf -= 32768;
}
values = {
'font-family': 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
} else {
if (e.target.checked) {
this.cookiePreProf += 65536;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-65536>=0){
this.cookiePreProf -= 65536;
}
values = {
'font-family': 0,
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
});
}
/**
* Profil trouble de l'attention et de la mémoire
* @param {Element} elt
*/
evtAtt(elt) {
elt.addEventListener('change', (e) => {
let values = {};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 2 ?
(values['font-size'] = 2) :
values;
document.querySelector("[data-lisiojs='line-height']").getAttribute('aria-valuenow') < 2 ?
(values['line-height'] = 1.5) :
values;
document.querySelector("[data-lisiojs='word-spacing']").getAttribute('aria-valuenow') < 5 ?
(values['word-spacing'] = 5) :
values;
if (elt.getAttribute('data-lisiojs-profils') == 'attention') {
if (e.target.checked) {
this.cookiePreProf += 4096;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-4096>=0){
this.cookiePreProf -= 4096;
}
values = {
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
} else {
if (e.target.checked) {
this.cookiePreProf += 8192;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-8192>=0){
this.cookiePreProf -= 8192;
}
values = {
'font-size': 0,
'line-height': 1,
'word-spacing': 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
});
}
/**
* Profil Migraine
* @param {Event} e
*/
evtMigraine(e) {
let values = {
contrast: 5,
'font-family': 3,
};
document.querySelector("[data-lisiojs='font-size']").getAttribute('aria-valuenow') < 2 ?
(values['font-size'] = 2) :
values;
document.querySelector("[data-lisiojs='font-family'][value='openDyslexic']").checked ?
(values['font-family'] = 2) :
values;
if (e.target.checked) {
this.cookiePreProf += 524288;
this.sync(values);
this.mergeObjects(values);
} else{
if(this.cookiePreProf-524288>=0){
this.cookiePreProf -= 524288;
}
values = {
'font-family': 0,
'font-size': 0,
contrast: 0,
};
this.sync(values);
//this.reApply();
this.mergeObjects(values);
}
this.breadcrumb(e.target, e.target.checked, this.explore("sen"));
this.params['preprof'] = this.cookiePreProf;
}
evtZon(e) {
if (e.target.checked) {
this.cookiePreProf += 1048576;
} else{
if(this.cookiePreProf-1048576>=0){
this.cookiePreProf -= 1048576;
}
}
this.breadcrumb(e.target, e.target.checked, this.explore("zon"));
this.params['preprof'] = this.cookiePreProf;
}
evtEco(e) {
const button = document.querySelector("input#nuitEco");
button.parentElement.parentElement.parentElement.classList.toggle("d-none");
if (e.target.checked) {
this.cookiePreProf += 2097152;
if(e.nuit){
document.querySelectorAll('input[data-lisiojs-profils="nuit"]').forEach(elt=>{
if(!elt.checked){
elt.parentElement.MaterialSwitch.on();
elt.checked = true;
elt.parentElement.parentElement.parentElement.classList.add("fill_bg");
}
});
document.querySelector("input#nuitEco").dispatchEvent(new Event("change"));
}
} else{
if(this.cookiePreProf-2097152>=0){
this.cookiePreProf -= 2097152;
document.querySelectorAll('input[data-lisiojs-profils="nuit"]').forEach(elt=>{
if(elt.checked){
elt.parentElement.MaterialSwitch.off();
elt.checked = false;
elt.parentElement.parentElement.parentElement.classList.remove("fill_bg");
}
});
document.querySelector("input#nuitEco").dispatchEvent(new Event("change"));
}
}
this.breadcrumb(e.target, e.target.checked, this.explore("eco"));
this.params['preprof'] = this.cookiePreProf;
}
/**
* Ajout écouteur de click sur la liste de voix
* @param {NodeElement} li
*/
evtLang(li) {
li.addEventListener('click', (e) => {
this.params.voice = e.target.children[0].children[0].getAttribute('data-i');
let state = e.target.children[0].children[0].getAttribute('data-i') == 0 ? false : true;
/*window.parent.postMessage(
{
type: 'util',
util: 'params',
params: this.params,
},
'*'
);*/
this.breadcrumb(e.target.children[0].children[0], state, this.explore("synth"), true);
});
}
/**
* Récupère toutes les checkbox de fonctionnalités
* @param {Event} e
*/
evtCheckbox(e) {
let feature = e.target.getAttribute('data-lisiojs');
if (feature == "synth") {
Array.from(e.target.parentElement.parentElement.parentElement.parentElement.parentElement.children).forEach((elt, i) => {
if (i != 0) {
elt.classList.toggle("d-none");
}
});
/*window.parent.postMessage(
{
type: 'feature',
feature: feature,
value:e.target.checked,
params:{
voice:this.params.voice,
rate:this.params.rate,
pitch:this.params.pitch,
},
},
'*'
);*/
this.breadcrumb(e.target, e.target.checked, this.explore("synth"));
} else if (feature == "adaptation") {
this.params.adaptation = e.target.checked;
const error = document.querySelector("div.overload");
error.textContent = "Une erreur est survenue durant l'adaptation du site";
//error.classList.remove("d-none");
Array.from(e.target.parentElement.parentElement.parentElement.parentElement.parentElement.children).forEach((elt, i) => {
if (i != 0) {
elt.classList.toggle("d-none");
}
});
document.querySelector("#power").classList.toggle("on");
return;
} else {
/*window.parent.postMessage(
{
type: 'feature',
feature: feature,
value: e.target.checked,
},
'*'
);*/
this.breadcrumb(e.target, e.target.checked, this.explore("sur"));
}
this.params[feature] = this.convertParam(feature, e.target.checked);
}
twinkle() {
document.querySelector("button.mdl-button.mdl-button--raised.register").classList.add("twinkle");
}
/**
* On récupère tous les selects de fonctionnalités
* @param {Event} e
*/
evtRadio(e) {
let feature = e.target.getAttribute('data-lisiojs');
let state = e.target.value != "defaut";
/*window.parent.postMessage(
{
type: 'feature',
feature: feature,
value: e.target.value,
},
'*'
);*/
if (feature == "font-family") {
let fontFamily;
let example = e.target.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.parentElement.querySelector(".example");
if (e.target.value == "andika") {
fontFamily = 'Andika';
} else if (e.target.value == "openDyslexic") {
fontFamily = 'OpenDyslexic';
} else if (e.target.value == "arial") {
fontFamily = "Arial";
} else if (e.target.value == "comic") {
fontFamily = "Comic Neue";
}
example.style.fontFamily = `${fontFamily},sans-serif`;
} else if (feature == "daltonisme") {
this.adaptDaltonisme(e.target.value);
}else if(feature == "trad"){
if(e.target.value != "defaut"){
document.querySelector(`li[lisio-target="#lisiojs__section_sen_under"]`).classList.add("func-disable");
document.querySelector('span[lisio-lang="DescDys"]').classList.remove("d-none");
document.querySelector('span[lisio-lang="Dyslexia"]').classList.replace("fs12-0","fs12");
}else{
document.querySelector(`li[lisio-target="#lisiojs__section_sen_under"]`).classList.remove("func-disable");
document.querySelector('span[lisio-lang="DescDys"]').classList.add("d-none");
document.querySelector('span[lisio-lang="Dyslexia"]').classList.replace("fs12","fs12-0");
}
window.parent.postMessage({
type : "trad",
values : {
trad : this.convertParam("trad", e.target.value)
}
},"*");
}
if (feature == "user") {
this.nameProfSel = this.profils[e.target.value].split("/")[24].split("_")[0];
} else {
feature == "voice" ? this.breadcrumb(e.target, state, this.explore("synth")) : feature == "daltonisme" ? this.breadcrumb(e.target, state, this.explore("acc"), true) : this.breadcrumb(e.target, state, this.explore("sur"),true);
feature != "voice" ? this.params[feature] = this.convertParam(feature, e.target.value) : this.params[feature];
}
}
breadcrumb(elt, state, nbActive, misc = false) {
if (elt != undefined) {
let parent = elt.getAttribute("data-lisio-parent") == null ? elt.getAttribute("data-lisiojs") : elt.getAttribute("data-lisio-parent");
while (parent != null && parent != "main") {
elt = document.querySelector(`[data-lisio-section="${parent}"]`);
if (state) {
elt.classList.add("active");
elt.parentElement.parentElement.classList.add("fill_bg");
} else {
if (nbActive == 0 || misc) {
elt.classList.remove("active");
elt.parentElement.parentElement.classList.remove("fill_bg");
}
}
parent = elt.getAttribute("data-lisiojs") == null ? elt.getAttribute("data-lisio-parent") : elt.getAttribute("data-lisiojs");
if (misc) {
misc = false;
nbActive--;
}
}
}
}
explore(sectionId) {
let section = document.querySelector(`#lisiojs__section_${sectionId}`);
let nbActive = 0;
section.querySelectorAll("li").forEach(li => {
li.querySelector("input") != null ? li.querySelector("input").checked ? nbActive++ : nbActive : li.children[1].firstElementChild.classList.contains("active") ? nbActive++ : nbActive;
});
return nbActive;
}
authCookies(e) {
this.acceptCookies = true;
let input = document.querySelector("#profile_name");
let last = /Utilisateur([0-9]+)/g.exec(this.profils[this.profils.length-1]);
const nbUtil = last == null ? 1 : Number(last[1])+1;
input.value = `Utilisateur${nbUtil}`;
//input.parentElement.parentElement.classList.toggle("d-none");
//input.parentElement.parentElement.nextElementSibling.classList.toggle("d-none");
}
renameProfil(i, newName) {
const profilsJoin = this.profils.join("|");
if (/[^\w-]/u.test(newName)) {
alert("Veuillez ne saisir que des lettres, des chiffres, des espaces ou des tirets");
return;
}
if (RegExp(newName).exec(profilsJoin) == null) {
console.log(/((-?[\w])+)_[012]$/u.exec(this.profils[i]));
this.profils[i] = this.profils[i].replace(/((-?[\w])+)_[012]$/u.exec(this.profils[i])[1], newName);
this.bakeCookies("profils", this.profils.join("|"));
window.location.reload();
} else {
alert("Un profil existe déjà");
}
}
adaptDaltonisme(type) {
let svg = document.getElementById("lisio-svg"),
matrice = document.getElementsByTagName("feColorMatrix")[0];
if (svg == null) { //si aucun svg est présent
let filter = document.createElementNS("http://www.w3.org/2000/svg", "filter");
svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
matrice = document.createElementNS("http://www.w3.org/2000/svg", "feColorMatrix");
svg.setAttribute('height', 0);
svg.id = "lisio-svg";
filter.id = "filter";
document.querySelector("body").appendChild(svg);
document.getElementById('lisio-svg').appendChild(filter);
document.getElementById("filter").appendChild(matrice);
}
if (type != "defaut") { //on choisi la valeur du filtre
let value;
if (type == "protanopia") {
value = '0.56667 0.43333 0.00000 0 0 0.55833 0.44167 0.00000 0 0 0.00000 0.24167 0.75833 0 0 0 0 0 1 0';
} else if (type == "deuteranopia") {
value = '0.4251 0.6934 -0.1147 0 0 0.3417 0.5882 0.0692 0 0 -0.0105 0.0234 0.9870 0 0 0 0 0 1 0';
} else if (type == "tritanopia") {
value = '0.95000 0.05000 0.00000 0 0 0.00000 0.83333 0.16700 0 0 0.00000 0.87500 0.12500 0 0 0 0 0 1 0';
} else if (type == "monochromacy") {
value = '0.33 0.33 0.33 0 0 0.33 0.33 0.33 0 0 0.33 0.33 0.33 0 0 0 0 0 1 0';
} else if (type == "enhanceR") {
value = '1.00 0.00 0.00 0 0 0.00 1.00 0.00 0 0 1.00 0.00 0.00 0 0 0 0 0 1 0';
} else if (type == "enhanceG") {
value = '1.00 0.00 0.00 0 0 0.00 1.00 0.00 0 0 0.00 1.00 0.00 0 0 0 0 0 1 0';
}
matrice.setAttribute('values', value);
} else { //si par défaut on suprime les valeurs de la matrice
if (matrice != null) {
matrice.setAttribute('values', "0");
}
}
document.querySelector("img.example").style.filter = "url(#filter)";
}
reset(){
this.bakeCookies("profils","");
window.parent.postMessage({
type : 'util',
util:'delAll',
}, '*');
}
verifCookiesVersion(){
let res=null;
if(safariAgent){
res = localStorage.getItem("profils");
res = res == "" ? null : res;
}else{
res = /profils=([\w\/\.\|_-]+)/gu.exec(document.cookie)
res = res != null ? res[1] : null;
}
if(res != null){
if(!res.includes(`${this.cookieVersion}/`)){
if(safariAgent){
localStorage.clear();
}else{
document.cookie="profils=; expires=Tue 19 Jan 2000 03:14:08 UTC; samesite=None;secure";
}
}
}
}
saveHide(value){
if(safariAgent){
localStorage.setItem(this.nameProfSel,value);
}else{
const expire = new Date();
expire.setHours(240);
document.cookie = `${this.nameProfSel}=${value}; expires=${expire.toUTCString()}; samesite=None;secure`;
}
}
cleanParams(){
const cleanParams = {};
for (const [param, value] of Object.entries(this.params)) {
if(param == "trad" && value != 0){
cleanParams[param] = value;
}else if(param != "adaptation" && param != "rate" && param != "pitch" && param != "voice" && param != "profils" && param != "preprof" && param != "color" && param != "trad"){
cleanParams[param] = value;
}
}
return cleanParams;
}
}
function checkSliders(){
if(document.querySelectorAll(".mdl-slider")[8].MaterialSlider != undefined){
new Langue(navigator.language);
new LisioJSWidget();
}else{
setTimeout(checkSliders, 10);
}
}
function supportSynth(){
SpeechSynthesisUtterance = window.webkitSpeechSynthesisUtterance ||
window.mozSpeechSynthesisUtterance ||
window.msSpeechSynthesisUtterance ||
window.oSpeechSynthesisUtterance ||
window.SpeechSynthesisUtterance;
return SpeechSynthesisUtterance === undefined;
}
function supportsFilters(){
const filterEl = document.createElement('div');
filterEl.style.cssText = 'filter:blur(2px)';
return filterEl.style.length != 0 && (document.documentMode === undefined || document.documentMode > 9);
}
if (document.readyState !== 'loading') {
checkSliders()
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment