2023-03-03 10:56:59 +01:00
// Variable global
// bouton
function init _variable _fonction ( dict _boutons , dict _imgs ) {
// fleche
2023-03-14 15:59:38 +01:00
//scale_fleche = 0.065
2023-03-03 10:56:59 +01:00
dy = 0.03 * H _3D
DY = 2 * dy
2023-03-14 15:59:38 +01:00
a = 0.05 * window . innerHeight //scale_fleche*dict_imgs["gauche"].height
ratio _fleche = a / dict _imgs [ "gauche" ] . height
b = ratio _fleche * dict _imgs [ "gauche" ] . width
2023-03-03 10:56:59 +01:00
// bouton
2023-03-14 15:59:38 +01:00
//scale_bouton = 0.3
h _bouton = 0.08 * window . innerHeight //scale_bouton*dict_boutons["choix_pose"].height
ratio = h _bouton / dict _boutons [ "choix_pose" ] . height
w _bouton = ratio * dict _boutons [ "choix_pose" ] . width
2023-03-03 10:56:59 +01:00
pos _bouton = ( ( W _3D * 0.2 + a + b ) / W _3D ) + 0.1
ecart _bouton = 0.1 * w _bouton
2023-03-14 15:59:38 +01:00
2023-03-03 10:56:59 +01:00
// Couleur
alpha _bloque = 0.6
// progress bar
x _progress _bar = 0
y _progress _bar = 0
2023-03-10 08:57:25 +01:00
w _progress _bar = window . innerWidth - W _3D * 0.1
2023-03-03 10:56:59 +01:00
h _progress _bar = H _3D * 0.04
2023-03-14 15:59:38 +01:00
2023-03-03 10:56:59 +01:00
// image recap
dx = 20
2023-03-14 15:59:38 +01:00
ecart _recap = 0.055 * window . innerHeight
y0 _recap = ( 2 * h _progress _bar + ecart _recap )
2023-03-07 18:16:30 +01:00
2023-03-03 10:56:59 +01:00
// Message pop up
x _pop _up = W _3D * pos _bouton + w _bouton * 2 + ecart _bouton + 30
y _pop _up = H _3D + dy * 4
ecart = 40
2023-03-14 15:59:38 +01:00
// texte
taille _texte = ( 0.01 * window . innerWidth )
2023-03-03 10:56:59 +01:00
}
function bloquer _pose ( L _poses ) {
for ( p = 0 ; p < L _poses . length ; p ++ ) {
2023-03-29 18:10:51 +02:00
idx _i _p = L _poses [ p ] [ 3 ] . idx _i
idx _j _p = L _poses [ p ] [ 4 ] . idx _j
2023-03-03 10:56:59 +01:00
// Si on est en train de voir une pose déjà choisie
if ( idx _i == idx _i _p && idx _j == idx _j _p ) {
draw _rectangle ( 0 , h _progress _bar , W _3D , H _3D - h _progress _bar , "rgb(0, 0, 0)" , alpha _bloque )
2023-03-14 15:59:38 +01:00
print _text ( handle _text ( "Viewpoint already selected" , 10 , H _3D , taille _texte + "pt Courier" , H _3D , "#118AB2" ) )
2023-03-03 10:56:59 +01:00
}
}
}
function pose _deja _choisie ( L _poses , i _choix , j _choix ) {
deja _choisie = false
for ( p = 0 ; p < L _poses . length ; p ++ ) {
2023-03-29 18:10:51 +02:00
idx _i _p = L _poses [ p ] [ 3 ] . idx _i
idx _j _p = L _poses [ p ] [ 4 ] . idx _j
2023-03-03 10:56:59 +01:00
// Si on est en train de voir une pose déjà choisie
if ( i _choix == idx _i _p && j _choix == idx _j _p ) {
deja _choisie = true
}
}
}
2023-03-22 16:32:57 +01:00
function show _consignes ( ) {
w _consigne = 0.02 * window . innerWidth
h _consigne = w _consigne
2023-03-22 16:38:37 +01:00
x _titre _vue = W _3D + ( ( window . innerWidth - W _3D ) / 2 ) - ( largeur / 2 ) // Position de "Selected Viewpoints"
x _consigne = W _3D + ( x _titre _vue - W _3D ) / 2 - w _consigne / 2
2023-03-22 16:32:57 +01:00
y _consigne = h _progress _bar + 10
2023-03-22 16:38:37 +01:00
ctx . drawImage ( boutons [ "consigne" ] , x _consigne , y _consigne , w _consigne , h _consigne )
// survol
2023-03-22 16:32:57 +01:00
if ( is _inside ( xyMouseMove , x _consigne , y _consigne , w _consigne , h _consigne ) ) {
x _ecran = W _3D
y _ecran = 0.15 * window . innerHeight
w _ecran = window . innerWidth - W _3D
h _ecran = H _3D / 2
draw _rectangle ( x _ecran , y _ecran , w _ecran , h _ecran , "rgb(255, 255, 255)" , 1 )
// Texte
2023-03-22 16:38:37 +01:00
//tt = {"t":"- You will be presented "+nb_mesh+" different objects."}
//ff = {"t":"- For each of them, you will chose a viewpoint you find most representative of the given object. You will have to do this "+nb_choix_demande+" times."}
2023-03-31 20:52:21 +02:00
print _text ( handle _text ( textes _contexte [ 'texte13' ] . t , x _ecran + 20 , y _ecran + 0.2 * h _ecran , ( 0.01 * window . innerWidth ) + "pt Courier" , w _ecran - 20 , "rgb(0,0,0)" ) )
print _text ( handle _text ( textes _contexte [ 'texte14' ] . t , x _ecran + 20 , y _ecran + 0.4 * h _ecran , ( 0.01 * window . innerWidth ) + "pt Courier" , w _ecran - 20 , "rgb(0,0,0)" ) )
2023-03-22 16:32:57 +01:00
}
}
2023-03-03 10:56:59 +01:00
///////////////////////////////////////////////////////////////
///////////////////// Recap
function swapElements ( arr , i1 , i2 ) {
// Step 1
let temp = arr [ i1 ] ;
// Step 2
arr [ i1 ] = arr [ i2 ] ;
// Step 3
arr [ i2 ] = temp ;
}
// legende des nb_demande recap
function affichage _texte _recap ( pos ) {
2023-03-14 15:59:38 +01:00
y _image = y0 _recap + ( 20 + H _3D / 3.5 ) * pos
2023-03-03 10:56:59 +01:00
ctx . strokeStyle = "rgb(255, 255, 255)" ; ctx . fillStyle = "rgb(255, 255, 255)"
2023-03-14 15:59:38 +01:00
if ( pos == 0 ) { print _text ( handle _text ( "Best viewpoint:" , W _3D + dx , ( H _3D / 3.5 ) * 0.4 + y _image , 1.1 * taille _texte + "pt Courier" , longueur _max _recap ) ) }
if ( pos == 1 ) { print _text ( handle _text ( "2nd viewpoint:" , W _3D + dx , ( H _3D / 3.5 ) * 0.4 + y _image , 1.1 * taille _texte + "pt Courier" , longueur _max _recap ) ) }
if ( pos == 2 ) { print _text ( handle _text ( "3rd viewpoint:" , W _3D + dx , ( H _3D / 3.5 ) * 0.4 + y _image , 1.1 * taille _texte + "pt Courier" , longueur _max _recap ) ) }
2023-03-03 10:56:59 +01:00
}
function afficher _recap ( ) {
w _recap = window . innerWidth - W _3D
// fleche swap haut
2023-03-14 15:59:38 +01:00
x _fleche _h = W _3D + w _recap / 2 - 30
2023-03-03 10:56:59 +01:00
w _fleche _h = 20
h _fleche _h = 20
// fleche swap bas
2023-03-14 15:59:38 +01:00
x _fleche _b = W _3D + w _recap / 2 - 30
2023-03-03 10:56:59 +01:00
w _fleche _b = 20
h _fleche _b = 20
// croix
x _croix = W _3D + w _recap / 2.5 + W _3D / 3.5 + 10
w _croix = 20
h _croix = 20
// pour chaque recap
for ( let i = 0 ; i < canvasMins . length ; i ++ ) {
// Draw les images des contextes
2023-03-14 15:59:38 +01:00
y _image = y0 _recap + ( 10 + H _3D / 3.5 ) * i
ctx . drawImage ( canvasMins [ i ] , W _3D + w _recap / 2 , y _image , H _3D / 3.5 , H _3D / 3.5 )
2023-03-03 10:56:59 +01:00
//Fleche pour Switch haut
if ( nb _choix _fait > 1 && i > 0 && i < nb _choix _fait ) {
2023-03-14 15:59:38 +01:00
y _fleche _h = ( H _3D / 3.5 ) * 0.35 + y _image
2023-03-03 10:56:59 +01:00
ctx . drawImage ( imgs [ "haut" ] , x _fleche _h , y _fleche _h , w _fleche _h , h _fleche _h )
if ( clicked && click _inside ( xyMouseDown , x _fleche _h , y _fleche _h , w _fleche _h , h _fleche _h ) ) {
swapElements ( canvasMins , i , i - 1 )
swapElements ( ctxMins , i , i - 1 )
swapElements ( liste _poses , i , i - 1 )
2023-03-29 22:44:56 +02:00
liste _poses [ i - 1 ] [ 0 ] = 'choix' + ( i )
liste _poses [ i ] [ 0 ] = 'choix' + ( i + 1 )
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'switch_haut_i' , [ num _tache , nb _choix _fait , i ] ) } )
2023-03-03 10:56:59 +01:00
clicked = false
}
}
// Fleche pour Switch bas
if ( nb _choix _fait > 1 && i < nb _choix _fait - 1 ) {
2023-03-14 15:59:38 +01:00
y _fleche _b = ( H _3D / 3.5 ) * 0.65 + y _image
2023-03-03 10:56:59 +01:00
ctx . drawImage ( imgs [ "bas" ] , x _fleche _b , y _fleche _b , w _fleche _b , h _fleche _b )
if ( clicked && click _inside ( xyMouseDown , x _fleche _b , y _fleche _b , w _fleche _b , h _fleche _b ) ) {
swapElements ( canvasMins , i , i + 1 )
swapElements ( ctxMins , i , i + 1 )
swapElements ( liste _poses , i , i + 1 )
2023-03-29 22:44:56 +02:00
liste _poses [ i ] [ 0 ] = 'choix' + ( i + 1 )
liste _poses [ i + 1 ] [ 0 ] = 'choix' + ( i + 2 )
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'switch_bas_i' , [ num _tache , nb _choix _fait , i ] ) } )
2023-03-03 10:56:59 +01:00
clicked = false
}
}
// Croix
if ( i < nb _choix _fait ) {
// croix pour annuler
y _croix = ( H _3D / 3.5 ) * 0.4 + y _image
ctx . drawImage ( imgs [ "croix" ] , x _croix , y _croix , w _croix , h _croix )
if ( clicked && click _inside ( xyMouseDown , x _croix , y _croix , w _croix , h _croix ) ) {
liste _poses . splice ( i , 1 )
nb _choix _fait = nb _choix _fait - 1
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'supp_pose_i' , [ num _tache , nb _choix _fait , i ] ) } )
2023-03-03 10:56:59 +01:00
ctxMins [ i ] . clearRect ( 0 , 0 , canvasMins [ i ] . width , canvasMins [ i ] . height )
for ( let j = i ; j < nb _choix _demande - 1 ; j ++ ) {
swapElements ( canvasMins , j , j + 1 )
swapElements ( ctxMins , j , j + 1 )
}
2023-03-29 22:44:56 +02:00
for ( let j = i ; j < liste _poses . length ; j ++ ) {
liste _poses [ j ] [ 0 ] = 'choix' + ( j + 1 )
}
2023-03-03 10:56:59 +01:00
}
}
}
}
///////////////////////////////////////////////////////////////
///////////////////// FLECHE
function afficher _fleche ( dict _imgs ) {
// image, posx, posy, W, H
ctx . drawImage ( dict _imgs [ "bas" ] , W _3D * 0.2 , H _3D + DY + b + a , a , b )
ctx . drawImage ( dict _imgs [ "haut" ] , W _3D * 0.2 , H _3D + DY , a , b )
ctx . drawImage ( dict _imgs [ "gauche" ] , W _3D * 0.2 - b , H _3D + DY + b , b , a )
ctx . drawImage ( dict _imgs [ "droite" ] , W _3D * 0.2 + a , H _3D + DY + b , b , a )
}
// afficher un rectangle autour des fleches quand la souris survol
function survol _fleche ( ) {
// Fleche GAUCHE
if ( xyMouseMove . x >= W _3D * 0.2 - b && xyMouseMove . x <= W _3D * 0.2 && xyMouseMove . y > H _3D + DY + b && xyMouseMove . y < H _3D + DY + b + a ) {
2023-03-10 08:57:25 +01:00
draw _contour ( W _3D * 0.2 - b , H _3D + DY + b , b , a , "rgb(200, 200, 200)" , alpha _survol )
2023-03-03 10:56:59 +01:00
}
// Fleche DROITE
if ( xyMouseMove . x >= W _3D * 0.2 + a && xyMouseMove . x <= W _3D * 0.2 + a + b && xyMouseMove . y > H _3D + DY + b && xyMouseMove . y < H _3D + DY + b + a ) {
2023-03-10 08:57:25 +01:00
draw _contour ( W _3D * 0.2 + a , H _3D + DY + b , b , a , "rgb(200, 200, 200)" , alpha _survol )
2023-03-03 10:56:59 +01:00
}
// Fleche HAUT
if ( xyMouseMove . x >= W _3D * 0.2 && xyMouseMove . x <= W _3D * 0.2 + a && xyMouseMove . y > H _3D + DY && xyMouseMove . y < H _3D + DY + b ) {
// l'image devient verte
2023-03-10 08:57:25 +01:00
draw _contour ( W _3D * 0.2 , H _3D + DY , a , b , "rgb(200, 200, 200)" , alpha _survol )
2023-03-03 10:56:59 +01:00
}
// Fleche BAS
if ( xyMouseMove . x >= W _3D * 0.2 && xyMouseMove . x <= W _3D * 0.2 + a && xyMouseMove . y > H _3D + DY + b + a && xyMouseMove . y < H _3D + DY + b + a + b ) {
// l'image devient verte
2023-03-10 08:57:25 +01:00
draw _contour ( W _3D * 0.2 , H _3D + DY + b + a , a , b , "rgb(200, 200, 200)" , alpha _survol )
2023-03-03 10:56:59 +01:00
}
}
// MAJ de which_clicked avec le nom de la fleche clickée
function get _clicked _fleche ( ) {
// Fleche GAUCHE
if ( clicked && xyMouseMove . x >= W _3D * 0.2 - b && xyMouseMove . x <= W _3D * 0.2 && xyMouseMove . y > H _3D + DY + b && xyMouseMove . y < H _3D + DY + b + a ) {
which _clicked _fleche = 'gauche'
}
// Fleche DROITE
if ( clicked && xyMouseMove . x >= W _3D * 0.2 + a && xyMouseMove . x <= W _3D * 0.2 + a + b && xyMouseMove . y > H _3D + DY + b && xyMouseMove . y < H _3D + DY + b + a ) {
which _clicked _fleche = 'droite'
}
// Fleche HAUT
if ( clicked && xyMouseMove . x >= W _3D * 0.2 && xyMouseMove . x <= W _3D * 0.2 + a && xyMouseMove . y > H _3D + DY && xyMouseMove . y < H _3D + DY + b ) {
// l'image devient verte
which _clicked _fleche = 'haut'
}
// Fleche BAS
if ( clicked && xyMouseMove . x >= W _3D * 0.2 && xyMouseMove . x <= W _3D * 0.2 + a && xyMouseMove . y > H _3D + DY + b + a && xyMouseMove . y < H _3D + DY + b + a + b ) {
// l'image devient verte
which _clicked _fleche = 'bas'
}
}
function traitement _fleche ( ) {
// Survol des fleches avec la souris
2023-03-08 10:50:45 +01:00
survol _fleche ( )
2023-03-03 10:56:59 +01:00
// click sur une fleche
get _clicked _fleche ( )
//console.log(which_clicked_fleche)
switch ( which _clicked _fleche ) {
case 'gauche' :
2023-03-10 17:37:58 +01:00
//console.log("deplacement G")
2023-03-03 10:56:59 +01:00
action _fleche _gauche ( )
//idx_i = (idx_i+1)%8
break ;
case 'droite' :
2023-03-10 17:37:58 +01:00
//console.log("deplacement D")
2023-03-03 10:56:59 +01:00
//idx_i = (idx_i+7)%8
action _fleche _droite ( )
break ;
case 'haut' :
2023-03-10 17:37:58 +01:00
//console.log("deplacement H")
2023-03-03 10:56:59 +01:00
action _fleche _haut ( )
//idx_j = Math.max(idx_j-1,0)
//idx_j = Math.max(idx_j-1,1)
break ;
case 'bas' :
2023-03-10 17:37:58 +01:00
//console.log("deplacement B")
2023-03-03 10:56:59 +01:00
action _fleche _bas ( )
//idx_j = Math.min(idx_j+1,4)
//idx_j = Math.min(idx_j+1,3)
break ;
}
console . log ( idx _i , idx _j )
theta = 2 * Math . PI * ( ( 2 / 8 ) * ( idx _j == 0 ) + ( 1 / 8 ) * ( idx _j == 1 ) + ( - 1 / 8 ) * ( idx _j == 3 ) + ( - 2 / 8 ) * ( idx _j == 4 ) )
delta = 2 * Math . PI * ( idx _i / 8 )
//camera.position.set(R*Math.cos(theta)*Math.cos(delta), R*Math.sin(theta)*Math.cos(delta), R*Math.sin(delta)) // repère wiki
camera . position . set ( R * Math . cos ( delta ) * Math . cos ( theta ) , R * Math . sin ( theta ) , R * Math . sin ( delta ) * Math . cos ( theta ) ) // repère JS
camera . lookAt ( 0 , 0 , 0 )
}
function action _fleche _gauche ( ) {
idx _i = ( idx _i + 1 ) % 8
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'FG' , [ num _tache , nb _choix _fait , idx _i , idx _j ] ) } ) }
2023-04-11 09:18:07 +02:00
2023-03-03 10:56:59 +01:00
function action _fleche _droite ( ) {
idx _i = ( idx _i + 7 ) % 8
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'FD' , [ num _tache , nb _choix _fait , idx _i , idx _j ] ) } ) }
2023-04-11 09:18:07 +02:00
2023-03-03 10:56:59 +01:00
function action _fleche _haut ( ) {
if ( idx _j == 0 ) {
2023-03-08 10:50:45 +01:00
texte _temporaire = { "text" : "You can't go any further, GO BACK DOWN." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-04-11 09:18:07 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_FH" , [ num _tache , nb _choix _fait ] ) } ) }
2023-03-03 10:56:59 +01:00
idx _j = Math . max ( idx _j - 1 , 0 )
2023-04-11 09:18:07 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'FH' , [ num _tache , nb _choix _fait , idx _i , idx _j ] ) } )
2023-03-03 10:56:59 +01:00
}
2023-04-11 09:18:07 +02:00
2023-03-03 10:56:59 +01:00
function action _fleche _bas ( ) {
if ( idx _j == 4 ) {
2023-03-08 10:50:45 +01:00
texte _temporaire = { "text" : "You can't go any further, GO UP." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_FB" , [ num _tache , nb _choix _fait ] ) } )
2023-03-03 10:56:59 +01:00
}
idx _j = Math . min ( idx _j + 1 , 4 )
2023-04-11 09:18:07 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'FB' , [ num _tache , nb _choix _fait , idx _i , idx _j ] ) } )
2023-03-03 10:56:59 +01:00
}
///////////////////////////////////////////////////////////////
///////////////////// BOUTON
function afficher _bouton ( dict _boutons ) {
2023-03-14 15:59:38 +01:00
// Partie selection vue
ctx . strokeStyle = "rgb(255, 255, 255)" // Pour que le contour soit rouge
ctx . fillStyle = "rgb(255, 255, 255)" // Pour que l'intérieur soit bleu
ctx . font = 2 * taille _texte + "pt Courier"
texte = "Selected Viewpoints:"
largeur = ctx . measureText ( texte ) . width
ctx . fillText ( texte , W _3D + ( ( window . innerWidth - W _3D ) / 2 ) - ( largeur / 2 ) , h _progress _bar + ecart _recap )
//print_text(handle_text("Selected Viewpoints:", W_3D +(window.innerWidth-W_3D)/5, h_progress_bar + ecart_recap, 2*taille_texte+"pt Courier", 500))
// BOUTONS
2023-03-03 10:56:59 +01:00
// image, posx, posy, W, H
ctx . drawImage ( dict _boutons [ "choix_pose" ] , W _3D * pos _bouton , H _3D + dy * 2 , w _bouton , h _bouton )
ctx . drawImage ( dict _boutons [ "retirer" ] , W _3D * pos _bouton + w _bouton + ecart _bouton , H _3D + dy * 2 , w _bouton , h _bouton )
ctx . drawImage ( dict _boutons [ "reinitialiser" ] , W _3D * pos _bouton + w _bouton / 2 , H _3D + dy * 2 + h _bouton + ecart _bouton , w _bouton , h _bouton )
ctx . drawImage ( dict _boutons [ "raz" ] , window . innerWidth - w _bouton - 10 , window . innerHeight - h _bouton - 10 , w _bouton , h _bouton )
if ( nb _choix _fait == nb _choix _demande ) {
ctx . drawImage ( dict _boutons [ "valider" ] , - ( 1.2 * w _bouton ) / 4 + W _3D , H _3D + dy * 2 + h _bouton , w _bouton * 1.2 , h _bouton * 1.2 ) }
}
function survol _bouton ( ) {
// Choisir le pt de vue
//if (xyMouseMove.x >= W_3D*0.2+a+2*b+ecart && xyMouseMove.x <= W_3D*0.2+a+2*b+ecart+w_bouton && xyMouseMove.y > H_3D+dy && xyMouseMove.y < H_3D+dy+h_bouton ){
if ( is _inside ( xyMouseMove , W _3D * pos _bouton , H _3D + dy * 2 , w _bouton , h _bouton ) ) {
draw _rectangle ( W _3D * pos _bouton , H _3D + dy * 2 , w _bouton , h _bouton , "rgb(200, 200, 200)" , 0.6 )
}
// Retirer
//if (xyMouseMove.x >= W_3D*0.2+a+2*b+ecart*7 && xyMouseMove.x <= W_3D*0.2+a+2*b+ecart*7+w_bouton && xyMouseMove.y > H_3D+dy+b && xyMouseMove.y < H_3D+dy+h_bouton ){
else if ( is _inside ( xyMouseMove , W _3D * pos _bouton + w _bouton + ecart _bouton , H _3D + dy * 2 , w _bouton , h _bouton ) ) {
draw _rectangle ( W _3D * pos _bouton + w _bouton + ecart _bouton , H _3D + dy * 2 , w _bouton , h _bouton , "rgb(200, 200, 200)" , 0.6 )
}
// Reintialiser
//if (xyMouseMove.x >= W_3D*0.2+a+2*b+ecart*7 && xyMouseMove.x <= W_3D*0.2+a+2*b+ecart*7+w_bouton && xyMouseMove.y > H_3D+dy+b+ecart*2 && xyMouseMove.y < H_3D+dy+b+ecart*2+h_bouton ){
else if ( is _inside ( xyMouseMove , W _3D * pos _bouton + w _bouton / 2 , H _3D + dy * 2 + h _bouton + ecart _bouton , w _bouton , h _bouton ) ) {
draw _rectangle ( W _3D * pos _bouton + w _bouton / 2 , H _3D + dy * 2 + h _bouton + ecart _bouton , w _bouton , h _bouton , "rgb(200, 200, 200)" , 0.6 )
}
// Valider
//if (xyMouseMove.x >= W_3D*0.2+a+2*b+ecart && xyMouseMove.x <= W_3D*0.2+a+2*b+ecart+w_bouton && xyMouseMove.y > H_3D+dy+b+ecart*2 && xyMouseMove.y < H_3D+dy+b+ecart*2+h_bouton ){
else if ( nb _choix _demande == nb _choix _fait && is _inside ( xyMouseMove , - ( 1.2 * w _bouton ) / 4 + W _3D , H _3D + dy * 2 + h _bouton , w _bouton * 1.2 , h _bouton * 1.2 ) ) {
draw _rectangle ( - ( 1.2 * w _bouton ) / 4 + W _3D , H _3D + dy * 2 + h _bouton , w _bouton * 1.2 , h _bouton * 1.2 , "rgb(200, 200, 200)" , 0.6 )
}
//RAZ
else if ( is _inside ( xyMouseMove , window . innerWidth - w _bouton - 10 , window . innerHeight - h _bouton - 10 , w _bouton , h _bouton ) ) {
draw _rectangle ( window . innerWidth - w _bouton - 10 , window . innerHeight - h _bouton - 10 , w _bouton , h _bouton , "rgb(200, 200, 200)" , 0.6 )
}
}
function get _clicked _bouton ( ) {
//if (clicked && xyMouseMove.x >= W_3D*0.35+a+2*b+ecart && xyMouseMove.x <= W_3D*0.35+a+2*b+ecart+w_bouton && xyMouseMove.y > H_3D+dy+b && xyMouseMove.y < H_3D+dy+b+h_bouton ){
if ( clicked && click _inside ( xyMouseMove , W _3D * pos _bouton , H _3D + dy * 2 , w _bouton , h _bouton ) ) {
which _clicked _bouton = "bouton_pose"
}
//if (clicked && xyMouseMove.x >= W_3D*0.35+a+2*b+ecart*7 && xyMouseMove.x <= W_3D*0.35+a+2*b+ecart*7+w_bouton && xyMouseMove.y > H_3D+dy+b && xyMouseMove.y < H_3D+dy+b+h_bouton ){
if ( clicked && click _inside ( xyMouseMove , W _3D * pos _bouton + w _bouton + ecart _bouton , H _3D + dy * 2 , w _bouton , h _bouton ) ) {
which _clicked _bouton = "bouton_retirer"
}
//if (clicked && xyMouseMove.x >= W_3D*0.35+a+2*b+ecart*7 && xyMouseMove.x <= W_3D*0.35+a+2*b+ecart*7+w_bouton && xyMouseMove.y > H_3D+dy+b+ecart*2 && xyMouseMove.y < H_3D+dy+b+ecart*2+h_bouton ){
if ( clicked && click _inside ( xyMouseMove , W _3D * pos _bouton + w _bouton / 2 , H _3D + dy * 2 + h _bouton + ecart _bouton , w _bouton , h _bouton ) ) {
which _clicked _bouton = "bouton_reinitialiser"
}
//if (clicked && xyMouseMove.x >= W_3D*0.35+a+2*b+ecart && xyMouseMove.x <= W_3D*0.35+a+2*b+ecart+w_bouton && xyMouseMove.y > H_3D+dy+b+ecart*2 && xyMouseMove.y < H_3D+dy+b+ecart*2+h_bouton ){
if ( nb _choix _demande == nb _choix _fait && clicked && click _inside ( xyMouseMove , - ( 1.2 * w _bouton ) / 4 + W _3D , H _3D + dy * 2 + h _bouton , w _bouton * 1.2 , h _bouton * 1.2 ) ) {
which _clicked _bouton = "bouton_valider"
}
if ( clicked && click _inside ( xyMouseMove , window . innerWidth - w _bouton - 10 , window . innerHeight - h _bouton - 10 , w _bouton , h _bouton ) ) {
which _clicked _bouton = "bouton_raz"
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "bouton_raz" , [ num _tache , nb _choix _fait ] ) } )
2023-03-03 10:56:59 +01:00
}
}
function action _bouton _pose ( ) {
// on regarde si la pose sélectionnée n'a pas déjà été choisie avant
pose _deja _choisie ( liste _poses , idx _i , idx _j )
2023-03-29 18:10:51 +02:00
2023-03-03 10:56:59 +01:00
if ( deja _choisie && ! ( nb _choix _fait == nb _choix _demande ) ) {
2023-03-10 17:37:58 +01:00
//console.log("Cette pose a déjà été sélectionnée.")
2023-03-03 10:56:59 +01:00
texte _temporaire = { "text" : "This viewpoint has already been selected." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_pose_selectionnee" , [ num _tache , nb _choix _fait ] ) } ) }
2023-03-03 10:56:59 +01:00
// plus de choix possible
if ( nb _choix _fait == nb _choix _demande ) {
2023-03-10 17:37:58 +01:00
//console.log("Tu as déjà fait tes "+nb_choix_demande+" choix.")
2023-03-03 10:56:59 +01:00
texte _temporaire = { "text" : "You have already selected your " + nb _choix _demande + " viewpoints." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_choix_fait" , [ num _tache , nb _choix _fait , nb _choix _fait ] ) } ) }
2023-03-03 10:56:59 +01:00
// si on a pas encore choisie toutes nos poses, on peut en ajouter
if ( nb _choix _fait < nb _choix _demande && ! ( deja _choisie ) ) {
2023-03-22 16:54:11 +01:00
liste _poses . push ( [ 'choix' + ( nb _choix _fait + 1 ) , { 'theta' : theta } , { "delta" : delta } , { 'idx_i' : idx _i } , { 'idx_j' : idx _j } ] )
2023-03-03 10:56:59 +01:00
// affichage de la vue sélectionnée dans le recap
2023-03-06 14:25:36 +01:00
ctxMins [ nb _choix _fait ] . drawImage ( canvasRenderer , 0.5 * canvasRenderer . width - 0.5 * canvasRenderer . height , 0 , canvasRenderer . height , canvasRenderer . height , 0 , 0 , canvasMins [ 0 ] . width , canvasMins [ 0 ] . height ) //canvasRenderer.height*0.3, canvasRenderer.height*0.25)
2023-03-03 10:56:59 +01:00
nb _choix _fait = nb _choix _fait + 1
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "bouton_select" , [ num _tache , nb _choix _fait , nb _choix _fait , idx _i , idx _j ] ) } )
2023-03-03 10:56:59 +01:00
}
}
function action _bouton _retirer ( ) {
// il y a des poses à retirer
if ( liste _poses . length > 0 ) {
liste _poses . pop ( )
nb _choix _fait = nb _choix _fait - 1
// RAZ du contexte liée à la dernière vue ajoutée
ctxMins [ nb _choix _fait ] . clearRect ( 0 , 0 , canvasMins [ nb _choix _fait ] . width , canvasMins [ nb _choix _fait ] . height )
2023-03-31 09:31:23 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'bouton_remove' , [ num _tache , nb _choix _fait ] ) } )
2023-03-03 10:56:59 +01:00
// On retire toutes les checkbox des checkbox
//checkbox_clicked_courant[nb_choix_fait].idx_checkbox = []
//checkbox_clicked_courant[nb_choix_fait].mots = []
}
// S'il n'y a pas de pose choisie
else {
2023-03-10 17:37:58 +01:00
//console.log("Il n'y a pas de pose à retirer.")
2023-03-03 10:56:59 +01:00
texte _temporaire = { "text" : "There are no selected viewpoints to remove." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_pas_de_pose" , [ num _tache , nb _choix _fait ] ) } )
2023-03-03 10:56:59 +01:00
}
}
function action _bouton _reinitialiser ( ) {
if ( liste _poses . length > 0 ) {
liste _poses = [ ]
nb _choix _fait = 0
2023-03-31 09:31:23 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "bouton_reset" , [ num _tache , nb _choix _fait ] ) } )
2023-03-03 10:56:59 +01:00
// RAZ de tous les contexte : on ne les surrpime pas, on les nettoie
for ( let i = 0 ; i < nb _choix _demande ; i ++ ) {
ctxMins [ i ] . clearRect ( 0 , 0 , canvasMins [ i ] . width , canvasMins [ i ] . height )
}
}
2023-03-10 17:37:58 +01:00
else { //console.log("Il n'y a pas de pose à reintialiser.")
2023-03-03 10:56:59 +01:00
texte _temporaire = { "text" : "There are no selected viewpoints to resart." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_reset_impossible" , [ num _tache , nb _choix _fait ] ) } ) }
2023-03-03 10:56:59 +01:00
}
function action _bouton _valider ( ) {
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "bouton_valider" , [ num _tache , nb _choix _fait ] ) } )
2023-03-03 10:56:59 +01:00
// Si tous les mesh ont été vu
if ( num _tache == nb _mesh && nb _choix _demande == nb _choix _fait ) {
choix _courant [ 'choix_poses' ] = liste _poses
choix [ 'tache_N' + num _tache ] = choix _courant
// sauvegarde des images du recap
all _ctxMins [ 'tache_N' + num _tache ] = [ mesh _courant , ctxMins ]
all _canvasMins [ 'tache_N' + num _tache ] = [ mesh _courant , canvasMins ]
//checkbox_clicked['tache_N'+num_tache] = checkbox_clicked_courant
num _tache = num _tache + 1
2023-03-18 19:05:16 +01:00
//page_analyse = true
page _explication _analyse = true
2023-03-03 10:56:59 +01:00
page _vues = false
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'fin_tache_i' , [ num _tache - 1 ] ) } )
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "fin_choix" , [ ] ) } )
2023-03-03 10:56:59 +01:00
}
// Si le nombre de vue demandé a été fait et que ce n'est pas le dernier mesh à voir
else if ( nb _choix _demande == liste _poses . length && num _tache < nb _mesh ) {
choix _courant [ 'choix_poses' ] = liste _poses
choix [ 'tache_N' + num _tache ] = choix _courant
// sauvegarde des images du recap
all _ctxMins [ 'tache_N' + num _tache ] = [ mesh _courant , ctxMins ]
all _canvasMins [ 'tache_N' + num _tache ] = [ mesh _courant , canvasMins ]
//checkbox_clicked['tache_N'+num_tache] = checkbox_clicked_courant
// RAZ
choix _courant = { }
liste _poses = [ ]
nb _choix _fait = 0
//checkbox_clicked_courant = []
//for (let i = 0 ; i < nb_choix_demande; i++){checkbox_clicked_courant.push({recap: "n°"+(i+1),idx_checkbox:[], mots:[]})}
// Mesh suivant
indice _mesh = indice _mesh + 1
num _tache = num _tache + 1
2023-03-06 16:02:20 +01:00
idx _i _init = Math . floor ( Math . random ( ) * 8 ) ; idx _j _init = Math . floor ( Math . random ( ) * 5 )
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'fin_tache_i' , [ num _tache - 1 ] ) } )
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( 'debut_tache_i' , [ num _tache ] ) } )
setUp _3D ( indice _mesh , idx _i _init , idx _j _init )
2023-03-03 10:56:59 +01:00
}
// Error : il reste des vues à sélectionner
else if ( nb _choix _fait < nb _choix _demande ) {
//console.log("Tu n'as pas fait tes 3 choix")
texte _temporaire = { "text" : "You did not select your " + nb _choix _demande + " viewpoints." , "x" : x _pop _up , "y" : y _pop _up , "t_end" : new Date ( ) . getTime ( ) + temps _pop }
2023-03-29 22:44:56 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "erreur_valider" , [ num _tache , nb _choix _fait ] ) } )
2023-03-10 17:37:58 +01:00
}
2023-03-03 10:56:59 +01:00
// Error : un pbl à identifier
else {
console . log ( "PBL bouton valider" )
}
}
function action _bouton _raz ( ) {
2023-03-14 15:59:38 +01:00
x _texte _raz = - ( 1.2 * w _bouton ) / 4 + W _3D + w _bouton * 1.2 + 10
y _texte _raz = H _3D + dy * 2 + h _bouton
l _max _raz = window . innerWidth - w _bouton - 10 - x _texte _raz
2023-03-03 10:56:59 +01:00
//on efface les autres textes pop
texte _temporaire = { }
//affichage du message
2023-03-14 15:59:38 +01:00
print _text ( handle _text ( "Do you really want to restart the study?" , x _texte _raz , y _texte _raz , taille _texte + "pt Courier" , l _max _raz , color = "#FFFFFF" , interligne = 0.045 * window . innerHeight ) )
2023-03-03 10:56:59 +01:00
// affichage
2023-03-14 15:59:38 +01:00
ctx . drawImage ( imgs [ 'croix' ] , x _texte _raz + l _max _raz * 0.2 , window . innerHeight - h _bouton + 10 , h _bouton / 2 , h _bouton / 2 )
ctx . drawImage ( imgs [ 'check' ] , x _texte _raz + l _max _raz * 0.6 , window . innerHeight - h _bouton + 10 , h _bouton / 2 , h _bouton / 2 )
2023-03-11 22:35:29 +01:00
// si on veut raz
2023-03-14 15:59:38 +01:00
if ( clicked && is _inside ( xyMouseMove , x _texte _raz + l _max _raz * 0.6 , window . innerHeight - h _bouton + 10 , h _bouton / 2 , h _bouton / 2 ) ) {
2023-03-03 10:56:59 +01:00
init _variable ( false ) ;
2023-03-06 16:02:20 +01:00
idx _i _init = Math . floor ( Math . random ( ) * 8 ) ; idx _j _init = Math . floor ( Math . random ( ) * 5 )
setUp _3D ( indice _mesh , idx _i _init , idx _j _init )
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "bouton_raz_check" , [ num _tache , nb _choix _fait ] ) } ) }
2023-03-03 10:56:59 +01:00
// click sur la croix ou ailleurs : on clear
if ( clicked ) {
bouton _raz _clicked = false
2023-03-29 18:10:51 +02:00
interactions . push ( { "time" : new Date ( ) . getTime ( ) , "type" : get _message ( "bouton_raz_croix" , [ num _tache , nb _choix _fait ] ) } ) }
2023-03-03 10:56:59 +01:00
}
function traitement _bouton ( ) {
2023-03-08 10:50:45 +01:00
// raccourcis bouton et fleche
2023-03-10 15:00:08 +01:00
//shortcuts(xyMouseMove, imgs['clavier_vues'], window.innerWidth/2 -(imgs['clavier_vues'].width/2), window.innerHeight/2 -(imgs['clavier_vues'].height/2), imgs['clavier_vues'].width, imgs['clavier_vues'].height, boutons['raccourcis'], x_Bshortcut, y_Bshortcut, w_Bshortcut, h_Bshortcut)
2023-03-03 10:56:59 +01:00
// si on survol, on a les contours qui apparaissent
survol _bouton ( )
// si on click
get _clicked _bouton ( )
switch ( which _clicked _bouton ) {
// bouton valider pose : on rajoute le bouton à la liste
case 'bouton_pose' :
bouton _raz _clicked = false
action _bouton _pose ( )
break ;
case 'bouton_retirer' :
bouton _raz _clicked = false
action _bouton _retirer ( )
break ;
case 'bouton_reinitialiser' :
bouton _raz _clicked = false
action _bouton _reinitialiser ( )
break ;
case 'bouton_valider' :
bouton _raz _clicked = false
action _bouton _valider ( )
break ;
case 'bouton_raz' :
bouton _raz _clicked = true
2023-03-10 17:37:58 +01:00
//console.log("bouton raz")
2023-03-03 10:56:59 +01:00
break ;
}
}