$("#feuille").hide();// On masque la feuille de papier, elle sera transf<EFBFBD>r<EFBFBD>e dans Open-Sankor<EFBFBD>
$("#aper<EFBFBD>u").show();// On affiche la fen<EFBFBD>tre qui sert d'aper<EFBFBD>u
$("#marge_seyes").prop("checked",false);// Marge et r<EFBFBD>glage de la marge d<EFBFBD>sactiv<EFBFBD> par d<EFBFBD>faut sur papier Seyes
$("#curseur_position_marge_seyes").hide();
$("#marge_maternelle").prop("checked",false);// Marge et r<EFBFBD>glage de la marge d<EFBFBD>sactiv<EFBFBD> par d<EFBFBD>faut sur papier Maternelle
$("#curseur_position_marge_maternelle").hide();
$("#marge_guide_ane").prop("checked",false);// Marge et r<EFBFBD>glage de la marge d<EFBFBD>sactiv<EFBFBD>es par d<EFBFBD>faut sur papier Guide <EFBFBD>ne
$("#taille_carreau_seyes").val(ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('seyes','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### MATERNELLE #####
$("#curseur_maternelle").slider({
value:20,
min:10,
max:50,
step:10,
slide:function(event,ui){
$("#taille_carreau_maternelle").val(ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('maternelle','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### GUIDE <EFBFBD>NE #####
$("#curseur_guide_ane").slider({
value:50,
min:10,
max:200,
step:10,
slide:function(event,ui){
$("#interligne_guide_ane").val(ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('guide_ane','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### DYS #####
$("#curseur_dys").slider({
value:30,
min:10,
max:60,
step:5,
slide:function(event,ui){
$("#taille_carreau_dys").val(ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('dys','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### QUADRILLAGE #####
$("#curseur_quadrillage").slider({
value:30,
min:10,
max:200,
step:10,
slide:function(event,ui){
$("#taille_carreau_quadrillage").val(ui.value+"x"+ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('quadrillage','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### MILLIM<EFBFBD>TR<EFBFBD> #####
$("#curseur_mm").slider({
value:10,
min:5,
max:30,
step:5,
slide:function(event,ui){
$("#taille_carreau_mm").val(ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('mm','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### POINT<EFBFBD> #####
$("#curseur_point<EFBFBD>").slider({
value:30,
min:10,
max:150,
step:10,
slide:function(event,ui){
$("#taille_point<EFBFBD>").val(ui.value);// Actualisation de la valeur affich<EFBFBD>e
},
change:function(event,ui){
dessiner('point<EFBFBD>','aper<EFBFBD>u');// Actualisation de l'aper<EFBFBD>u
}
});
//##### INITIALISATION DES CURSEURS #####
$("#taille_carreau_maternelle").val($("#curseur_maternelle").slider("value"));// Affichage de la valeur initiale
$("#taille_carreau_seyes").val($("#curseur_seyes").slider("value"));// Affichage de la valeur initiale
$("#interligne_guide_ane").val($("#curseur_guide_ane").slider("value"));// Affichage de la valeur initiale
$("#taille_carreau_dys").val($("#curseur_dys").slider("value"));// Affichage de la valeur initiale
$("#taille_carreau_quadrillage").val($("#curseur_quadrillage").slider("value")+"x"+$("#curseur_quadrillage").slider("value"));// Affichage de la valeur initiale
$("#taille_carreau_mm").val($("#curseur_mm").slider("value"));// Affichage de la valeur initiale
$("#taille_point<EFBFBD>").val($("#curseur_point<EFBFBD>").slider("value"));// Affichage de la valeur initiale
});
// ##############################
//##### GESTION DU PAPIER POINT<EFBFBD> #####
// ##############################
$(function(){
// Changement du type de point pour le papier point<EFBFBD> maillage carr<EFBFBD>
varadresse=canvas.toDataURL('image/png',0.1);// Compression forte (0.1) car sans compression (1), image g<EFBFBD>n<EFBFBD>r<EFBFBD>e trop lourde <EFBFBD> charger sous windows
// D<EFBFBD>callage pour voir toutes les étiquettes
ctx.clearRect(0,0,largeur,hauteur);// On efface le fond
switch(type_papier){//D<EFBFBD>tection du papier choisi
case"uni":
ctx.fillStyle=couleur_fond_uni;//Couleur du fond s<EFBFBD>lectionn<EFBFBD> dans la palette
ctx.fillRect(0,0,largeur,hauteur);// On rempli le fond avec la couleur choisie
break;
case"seyes":// Seyes;
// Couleur de fond du papier
ctx.fillStyle=couleur_fond_seyes;//Couleur du fond s<EFBFBD>lectionn<EFBFBD> dans la palette
ctx.fillRect(0,0,largeur,hauteur);// On rempli le fond avec la couleur choisie
// <EFBFBD>paisseur
epaisseur=$("#curseur_<EFBFBD>paisseur_seyes").slider("value");// <EFBFBD>paisseur d<EFBFBD>finie par le curseur
// Interlignes
interligne=$("#curseur_seyes").slider("value"),taille_carreau=interligne*4;//N<EFBFBD> de ligne
ctx.beginPath();
ctx.lineWidth=epaisseur/2;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.strokeStyle=couleur_seyes_interligne;
varn=0;
for(i=interligne;i<hauteur+1;i+=interligne){// i=0 est une ligne donc on commence <EFBFBD> i=interligne (on en saute 1)
if(n%4!==0){ctx.moveTo(0,i);ctx.lineTo(largeur,i);}// Tous les 4 interlignes, on saute une ligne (3 interlignes par carreaux
n+=1;//Ligne suivante
}
ctx.stroke();
// Lignes Verticales
varposition_marge=0;// Aucune marge par d<EFBFBD>faut
if($('#marge_seyes').is(':checked')){// Si la case Marge est coch<EFBFBD>e
position_marge_seyes=$("#curseur_position_marge_seyes").slider("value");// Position de la marge d<EFBFBD>finie par le curseur
if(zone=='aper<EFBFBD>u'){position_marge=taille_carreau}else{position_marge=position_marge_seyes*taille_carreau}// marge <EFBFBD> 1 carreau sur l'aper<EFBFBD>u et <EFBFBD> 5 carreaux sur la feuille
}
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.strokeStyle=couleur_seyes_ligne_verticale;
for(i=position_marge+taille_carreau;i<largeur+1;i+=taille_carreau){// On commence <EFBFBD> tracer les lignes verticales 1 carreau apr<EFBFBD>s la marge
ctx.moveTo(i,0);
ctx.lineTo(i,hauteur);
}
ctx.stroke();
// Lignes Horizontales
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.strokeStyle=couleur_seyes_ligne_horizontale;
for(i=interligne;i<largeur+1;i+=taille_carreau){
ctx.moveTo(0,i);
ctx.lineTo(largeur,i);
}
ctx.stroke();
// Affichage de la marge si n<EFBFBD>cessaire
if($('#marge_seyes').is(':checked')){
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur de la marge
ctx.strokeStyle=couleur_marge_seyes;
ctx.moveTo(position_marge,0);
ctx.lineTo(position_marge,hauteur);
ctx.stroke();
}
break;
case"maternelle":// maternelle;
// Couleur de fond du papier
ctx.fillStyle=couleur_fond_maternelle;//Couleur du fond s<EFBFBD>lectionn<EFBFBD> dans la palette
ctx.fillRect(0,0,largeur,hauteur);// On remplit le fond avec la couleur choisie
// <EFBFBD>paisseur
epaisseur=$("#curseur_<EFBFBD>paisseur_maternelle").slider("value");// <EFBFBD>paisseur d<EFBFBD>finie par le curseur
// Interlignes
if(tableau){
interligne=$("#curseur_maternelle").slider("value")*2}//Hauteur de ligne sur la page
else{
interligne=$("#curseur_maternelle").slider("value")*0.5}//Hauteur de ligne dans l'aper<EFBFBD>u
taille_carreau=interligne*3;//Hauteur de ligne
// Lignes Horizontales principales
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.lineWidth=epaisseur/2;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.strokeStyle=couleur_maternelle_interligne;
for(i=0;i<largeur+1;i+=taille_carreau){
ctx.moveTo(0,i);
ctx.lineTo(largeur,i);
}
ctx.stroke();
// Marge ?
varposition_marge=0;// Aucune marge par d<EFBFBD>faut
if($('#marge_maternelle').is(':checked')){// Si la case Marge est coch<EFBFBD>e
position_marge_maternelle=$("#curseur_position_marge_maternelle").slider("value");// Position de la marge d<EFBFBD>finie par le curseur
if(zone=='aper<EFBFBD>u'){position_marge=position_marge_maternelle*taille_carreau/2}else{position_marge=position_marge_maternelle*taille_carreau}// marge <EFBFBD> une distance diff<EFBFBD>rente sur l'aper<EFBFBD>u et sur le tableau (mise <EFBFBD> l'<EFBFBD>chelle)
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur de la marge
ctx.strokeStyle=couleur_marge_maternelle;
ctx.moveTo(position_marge,0);
ctx.lineTo(position_marge,hauteur);
ctx.stroke();
}
break;
case'guide_ane':
// Couleur de fond du papier
ctx.fillStyle=couleur_fond_guide_ane;//Couleur du fond s<EFBFBD>lectionn<EFBFBD> dans la palette
ctx.fillRect(0,0,largeur,hauteur);// On rempli le fond avec la couleur choisie
// <EFBFBD>paisseur
epaisseur=$("#curseur_<EFBFBD>paisseur_guide_ane").slider("value");// <EFBFBD>paisseur d<EFBFBD>finie par le curseur
// Interlignes
interligne=$("#curseur_guide_ane").slider("value");//N<EFBFBD> de ligne
// Lignes Horizontales
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.strokeStyle=couleur_ligne_guide_ane;
for(i=interligne;i<largeur+1;i+=interligne){
ctx.moveTo(0,i);
ctx.lineTo(largeur,i);
}
ctx.stroke();
// Affichage de la marge si n<EFBFBD>cessaire
varposition_marge=0;// Aucune marge par d<EFBFBD>faut
if($('#marge_guide_ane').is(':checked')){// Si la case Marge est coch<EFBFBD>e
position_marge_guide_ane=$("#curseur_position_marge_guide_ane").slider("value");// Position de la marge d<EFBFBD>finie par le curseur
if(zone=='aper<EFBFBD>u'){position_marge=interligne*4}else{position_marge=interligne*position_marge_guide_ane}// marge plus petite sur l'aper<EFBFBD>u ou plus grande sur la feuille
}
if($('#marge_guide_ane').is(':checked')){
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur de la marge
ctx.strokeStyle=couleur_marge_guide_ane;
ctx.moveTo(position_marge,0);
ctx.lineTo(position_marge,hauteur);
ctx.stroke();
}
break;
case"dys":// Dyspraxie;
// Couleur de fond du papier
ctx.fillStyle=couleur_fond_dys;//Couleur du fond s<EFBFBD>lectionn<EFBFBD> dans la palette
ctx.fillRect(0,0,largeur,hauteur);// On rempli le fond avec la couleur choisie
// <EFBFBD>paisseur
epaisseur=$("#curseur_<EFBFBD>paisseur_dys").slider("value");// <EFBFBD>paisseur d<EFBFBD>finie par le curseur
// Interlignes
interligne=$("#curseur_dys").slider("value");
taille_carreau_dys=interligne*5;//Espace entre 2 lignages
// Lignes Horizontales
for(j=epaisseur;j<hauteur+1;j+=taille_carreau_dys){// La premi<EFBFBD>re ligne est enti<EFBFBD>re, on commence <EFBFBD> epaisseur
ctx.beginPath();
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.strokeStyle=couleur_dys_1;
ctx.moveTo(i,j);
ctx.lineTo(largeur,j);
ctx.stroke();
ctx.beginPath();
j+=interligne*2;
ctx.strokeStyle=couleur_dys_2;
ctx.moveTo(i,j);
ctx.lineTo(largeur,j);
ctx.stroke();
ctx.beginPath();
j+=interligne;
ctx.strokeStyle=couleur_dys_3;
ctx.moveTo(0,j);
ctx.lineTo(largeur,j);
ctx.stroke();
ctx.beginPath();
j+=interligne*2;
ctx.strokeStyle=couleur_dys_4;
ctx.moveTo(0,j);
ctx.lineTo(largeur,j);
ctx.stroke();
}
break;
case"quadrillage":// Petits Carreaux type 10x10
// Couleur de fond du papier
ctx.fillStyle=couleur_fond_quadrillage;//Couleur du fond s<EFBFBD>lectionn<EFBFBD> dans la palette
ctx.fillRect(0,0,largeur,hauteur);// On rempli le fond avec la couleur choisie
// <EFBFBD>paisseur
epaisseur=$("#curseur_<EFBFBD>paisseur_quadrillage").slider("value");// <EFBFBD>paisseur d<EFBFBD>finie par le curseur
// Lignes
interligne=$("#curseur_quadrillage").slider("value");// Taille du quadrillage, 30 par d<EFBFBD>faut
ctx.lineWidth=epaisseur;// <EFBFBD>paisseur des lignes trac<EFBFBD>es
ctx.beginPath();
ctx.strokeStyle=couleur_quadrillage;
// D<EFBFBD>marrage des boucle <EFBFBD> "epaisseur" pour que les lignes p<EFBFBD>riph<EFBFBD>riques apparaissent en entier.
