Cette page est organis\u00e9e de diff\u00e9rentes parties : <\/p>\n\n\n\n
Tout se passe autour de la variable configBoard qui permet de m\u00e9moriser les param\u00e8tres de trac\u00e9 des fonctions d’utilit\u00e9. Cette structure est constitu\u00e9e de 6 \u00e9l\u00e9ments pour les 6 boards \u00e0 constituer. Le contenu de cette structure permet de m\u00e9moriser la s\u00e9lection de la fonction, les dimensions du board \u00e0 tracer, les courbes \u00e0 tracer et la valeur des sliders associ\u00e9s.<\/p>\n\n\n\n
Exemple de l’initialisation de la variable : <\/p>\n\n\n\n
const configBoard={\n1:{fct:\"0_0\",infx:-1.4, supx:2, infy:-1.4, supy:2, A_x:true, R_x:false, P_x:false, T_x:false, sliders:[]},\n2:{fct:\"0_0\",infx:-1.4, supx:2, infy:-1.4,supy:2,A_x:true, R_x:false, P_x:false, T_x:false, sliders:[]},\n3:{fct:\"0_0\",infx:-1.4, supx:2, infy:-1.4,supy:2,A_x:true, R_x:false, P_x:false, T_x:false, sliders:[]},\n4:{fct:\"0_0\",infx:-1.4, supx:2, infy:-1.4,supy:2,A_x:true, R_x:false, P_x:false, T_x:false, sliders:[]},\n5:{fct:\"0_0\",infx:-1.4, supx:2, infy:-1.4,supy:2,A_x:true, R_x:false, P_x:false, T_x:false, sliders:[]},\n6:{fct:\"0_0\",infx:-1.4, supx:2, infy:-1.4,supy:2,A_x:true, R_x:false, P_x:false, T_x:false, sliders:[]}\n};<\/code><\/pre>\n\n\n\nAttributs des structures de m\u00e9morisation : <\/p>\n\n\n\n
\n- fct : identification (0_0, 1_1 …) le premier num\u00e9ro indique la classe, et le deuxi\u00e8me le fonction dans cette classe.<\/li>\n\n\n\n
- infx : valeur r\u00e9elle <\/li>\n\n\n\n
- supx : valeur r\u00e9elle <\/li>\n\n\n\n
- infy : valeur r\u00e9elle <\/li>\n\n\n\n
- supy : valeur r\u00e9elle <\/li>\n\n\n\n
- A_x : boolean (true \/ false) <\/li>\n\n\n\n
- R_x: boolean (true \/ false)<\/li>\n\n\n\n
- P_x: boolean (true \/ false)<\/li>\n\n\n\n
- T_x : boolean (true \/ false)<\/li>\n\n\n\n
- sliders : [] tableau permettant de stocker les valeurs des sliders <\/li>\n<\/ul>\n\n\n\n
Attention lors de la modification et de la restitution des param\u00e8tres en fonction de l’objet jsxGraph utilis\u00e9 <\/p>\n\n\n\n
\n- Rappel pour un chekbox : checkbox.setAttribute({‘checked’:configBoard[id].A_x});<\/li>\n\n\n\n
- Rappel pour un slider : ne pas oublier le update du board apr\u00e8s la modification.\n
\n- configBoard[id].sliders.forEach((e,i)=> {
paramSliders[i].setValue(e);
})
board.update();<\/li>\n<\/ul>\n<\/li>\n\n\n\n - Rappel pour un select : document.getElementById(“uf_select”).value=configBoard[id].fct;<\/li>\n\n\n\n
- Rappel pour un input : in0.value=Number(configBoard[id].infx);<\/li>\n<\/ul>\n\n\n\n
Explications sur le fonctionnement de cette page : <\/p>\n\n\n\n
On a une variable qui d\u00e9finit les valeurs par d\u00e9faut pour chaque visuel. Donc ce qu’il faut faire est de stocker quel est le board actuel (valeur entre 1 et 6) avant la permutation, de m\u00e9moriser les valeurs des param\u00e8tres fix\u00e9s par l’utilisateur dans la variable configBoard avec le bon indice. Ensuite charger et construire le nouveau board en prenant en compte les param\u00e8tres de la variable configBoard du nouvel indice. Tout se fait autour de cPanel et de la variable configBoard. On pourra par la suite stocker ces valeurs dans le cache du navigateur pour m\u00e9moriser la configuration fix\u00e9e par l’utilisateur dans son contexte. Il suffira au d\u00e9marrage ou au rechargement de la page, de r\u00e9actualiser la variable configBoard avec un contenu sp\u00e9cifique et le tour est jou\u00e9. (reste \u00e0 faire)<\/p>\n