ajout shorcut vues
This commit is contained in:
parent
efd43c18e1
commit
67a070acb1
|
@ -240,6 +240,7 @@ function init_data(){
|
||||||
imgs["check"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Choices/check.png')
|
imgs["check"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Choices/check.png')
|
||||||
imgs["checkbox"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Choices/empty_checkbox.png')
|
imgs["checkbox"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Choices/empty_checkbox.png')
|
||||||
imgs["marie"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/User_study/main/Autres/marie.png')
|
imgs["marie"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/User_study/main/Autres/marie.png')
|
||||||
|
imgs["clavier_vues"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/clavier_vues.png')
|
||||||
boutons = {}
|
boutons = {}
|
||||||
boutons["reinitialiser"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_reinitialiser.png')
|
boutons["reinitialiser"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_reinitialiser.png')
|
||||||
boutons["valider"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_valider.png')
|
boutons["valider"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_valider.png')
|
||||||
|
@ -249,6 +250,7 @@ function init_data(){
|
||||||
boutons["raz"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_raz.png')
|
boutons["raz"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_raz.png')
|
||||||
boutons["suivant"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_suivant.png')
|
boutons["suivant"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_suivant.png')
|
||||||
boutons["avant"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_avant.png')
|
boutons["avant"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_avant.png')
|
||||||
|
boutons["raccourcis"] = new_image('https://raw.githubusercontent.com/PelissierCombescure/BVS-study/main/graphics/Boutons/bouton_raccourcis.png')
|
||||||
|
|
||||||
// Mouse
|
// Mouse
|
||||||
xyMouseMove = {"x": -1, "y": -1}
|
xyMouseMove = {"x": -1, "y": -1}
|
||||||
|
@ -359,7 +361,7 @@ function animate() {
|
||||||
premier_tour_page_vues = false
|
premier_tour_page_vues = false
|
||||||
}
|
}
|
||||||
// Variable pour les fonctions
|
// Variable pour les fonctions
|
||||||
//init_variable_fonction(boutons, imgs)
|
init_variable_fonction(boutons, imgs)
|
||||||
// Nettoyage fleche
|
// Nettoyage fleche
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height)
|
ctx.clearRect(0, 0, canvas.width, canvas.height)
|
||||||
// Affichage bouton RAZ
|
// Affichage bouton RAZ
|
||||||
|
|
|
@ -40,6 +40,7 @@ function bloquer_pose(L_poses){
|
||||||
// Si on est en train de voir une pose déjà choisie
|
// Si on est en train de voir une pose déjà choisie
|
||||||
if (idx_i== idx_i_p && idx_j==idx_j_p){
|
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)
|
draw_rectangle(0, h_progress_bar, W_3D, H_3D-h_progress_bar, "rgb(0, 0, 0)", alpha_bloque)
|
||||||
|
print_text(handle_text("Viewpoint already selected", 10, H_3D, "16pt Courier", H_3D, "#118AB2"))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -176,21 +177,21 @@ function afficher_fleche(dict_imgs){
|
||||||
function survol_fleche(){
|
function survol_fleche(){
|
||||||
// Fleche GAUCHE
|
// 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 ){
|
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 ){
|
||||||
draw_contour(W_3D*0.2-b, H_3D+DY+b, b, a, "rgb(17, 138, 178)", alpha_survol)
|
draw_rectangle(W_3D*0.2-b, H_3D+DY+b, b, a, "rgb(200, 200, 200)", alpha_survol)
|
||||||
}
|
}
|
||||||
// Fleche DROITE
|
// 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 ){
|
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 ){
|
||||||
draw_contour(W_3D*0.2+a, H_3D+DY+b, b, a, "rgb(17, 138, 178)", alpha_survol)
|
draw_rectangle(W_3D*0.2+a, H_3D+DY+b, b, a, "rgb(200, 200, 200)", alpha_survol)
|
||||||
}
|
}
|
||||||
// Fleche HAUT
|
// 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 ){
|
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
|
// l'image devient verte
|
||||||
draw_contour(W_3D*0.2, H_3D+DY, a, b, "rgb(17, 138, 178)", alpha_survol)
|
draw_rectangle(W_3D*0.2, H_3D+DY, a, b, "rgb(200, 200, 200)", alpha_survol)
|
||||||
}
|
}
|
||||||
// Fleche BAS
|
// 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 ){
|
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
|
// l'image devient verte
|
||||||
draw_contour(W_3D*0.2, H_3D+DY+b+a, a, b, "rgb(17, 138, 178)", alpha_survol)
|
draw_rectangle(W_3D*0.2, H_3D+DY+b+a, a, b, "rgb(200, 200, 200)", alpha_survol)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -218,7 +219,7 @@ function get_clicked_fleche(){
|
||||||
|
|
||||||
function traitement_fleche(){
|
function traitement_fleche(){
|
||||||
// Survol des fleches avec la souris
|
// Survol des fleches avec la souris
|
||||||
//survol_fleche()
|
survol_fleche()
|
||||||
// click sur une fleche
|
// click sur une fleche
|
||||||
get_clicked_fleche()
|
get_clicked_fleche()
|
||||||
//console.log(which_clicked_fleche)
|
//console.log(which_clicked_fleche)
|
||||||
|
@ -263,7 +264,7 @@ function action_fleche_droite(){
|
||||||
function action_fleche_haut(){
|
function action_fleche_haut(){
|
||||||
interactions.push({"time": new Date().getTime(), "type": "fleche haut"})
|
interactions.push({"time": new Date().getTime(), "type": "fleche haut"})
|
||||||
if (idx_j == 0){
|
if (idx_j == 0){
|
||||||
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}
|
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}
|
||||||
interactions.push({"time": new Date().getTime(), "type": "Affichage error à cause de fleche haut"})
|
interactions.push({"time": new Date().getTime(), "type": "Affichage error à cause de fleche haut"})
|
||||||
}
|
}
|
||||||
idx_j = Math.max(idx_j-1,0)
|
idx_j = Math.max(idx_j-1,0)
|
||||||
|
@ -271,7 +272,7 @@ function action_fleche_haut(){
|
||||||
function action_fleche_bas(){
|
function action_fleche_bas(){
|
||||||
interactions.push({"time": new Date().getTime(), "type": "fleche bas"})
|
interactions.push({"time": new Date().getTime(), "type": "fleche bas"})
|
||||||
if (idx_j == 4){
|
if (idx_j == 4){
|
||||||
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}
|
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}
|
||||||
interactions.push({"time": new Date().getTime(), "type": "Affichage error à cause de fleche bas"})
|
interactions.push({"time": new Date().getTime(), "type": "Affichage error à cause de fleche bas"})
|
||||||
}
|
}
|
||||||
idx_j = Math.min(idx_j+1,4)
|
idx_j = Math.min(idx_j+1,4)
|
||||||
|
@ -487,6 +488,8 @@ function action_bouton_raz(){
|
||||||
}
|
}
|
||||||
|
|
||||||
function traitement_bouton(){
|
function traitement_bouton(){
|
||||||
|
// raccourcis bouton et fleche
|
||||||
|
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'], 10, window.innerHeight-0.5*h_bouton-10, 0.5*w_bouton, 0.5*h_bouton)
|
||||||
// si on survol, on a les contours qui apparaissent
|
// si on survol, on a les contours qui apparaissent
|
||||||
survol_bouton()
|
survol_bouton()
|
||||||
// si on click
|
// si on click
|
||||||
|
|
|
@ -5,9 +5,9 @@
|
||||||
function action_clavier_contexte(event){
|
function action_clavier_contexte(event){
|
||||||
switch (event.key){
|
switch (event.key){
|
||||||
// selectionner pose
|
// selectionner pose
|
||||||
case ' ' :
|
// case ' ' :
|
||||||
action_bouton_commencer_contexte('clavier')
|
// action_bouton_commencer_contexte('clavier')
|
||||||
break;
|
// break;
|
||||||
// valider
|
// valider
|
||||||
case 'Enter':
|
case 'Enter':
|
||||||
action_bouton_commencer_contexte('clavier')
|
action_bouton_commencer_contexte('clavier')
|
||||||
|
@ -18,10 +18,10 @@ function action_clavier_contexte(event){
|
||||||
function action_clavier_inscription(event){
|
function action_clavier_inscription(event){
|
||||||
switch (event.key){
|
switch (event.key){
|
||||||
// selectionner pose
|
// selectionner pose
|
||||||
case ' ' :
|
// case ' ' :
|
||||||
if (champs_remplis_correctment()){
|
// if (champs_remplis_correctment()){
|
||||||
action_bouton_commencer('clavier')}
|
// action_bouton_commencer('clavier')}
|
||||||
break;idx_i, idx_j
|
// break;idx_i, idx_j
|
||||||
// valider
|
// valider
|
||||||
case 'Enter':
|
case 'Enter':
|
||||||
if (champs_remplis_correctment()){
|
if (champs_remplis_correctment()){
|
||||||
|
@ -31,7 +31,6 @@ function action_clavier_inscription(event){
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function action_clavier_vues(event){
|
function action_clavier_vues(event){
|
||||||
switch (event.key){
|
switch (event.key){
|
||||||
case 'ArrowLeft':
|
case 'ArrowLeft':
|
||||||
|
|
|
@ -17,7 +17,8 @@ function affichage_texte_contexte(){
|
||||||
|
|
||||||
function action_bouton_commencer_contexte(){
|
function action_bouton_commencer_contexte(){
|
||||||
page_contexte = false
|
page_contexte = false
|
||||||
page_inscription = true
|
//page_inscription = true
|
||||||
|
page_vues = true
|
||||||
interactions.push({"time": new Date().getTime(), "type": "Fin contexte - Début inscription"})
|
interactions.push({"time": new Date().getTime(), "type": "Fin contexte - Début inscription"})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -131,9 +131,6 @@ function handle_text(dialogue, x_start, y_start, font, l_max, color="#FFFFFF", i
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function progress_bar(N_tache, N_mesh){
|
function progress_bar(N_tache, N_mesh){
|
||||||
if (N_tache<=N_mesh){
|
if (N_tache<=N_mesh){
|
||||||
// background
|
// background
|
||||||
|
@ -147,4 +144,14 @@ function progress_bar(N_tache, N_mesh){
|
||||||
// ctx.font = "18pt Courier";
|
// ctx.font = "18pt Courier";
|
||||||
// ctx.fillText((N_tache)+"/"+(N_mesh), x_progress_bar+w_progress_bar+10, h_progress_bar)
|
// ctx.fillText((N_tache)+"/"+(N_mesh), x_progress_bar+w_progress_bar+10, h_progress_bar)
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function shortcuts(xyMove, I_shortcut, x_shortcut, y_shortcut, w_shortcut, h_shortcut, I_bouton, xb, yb, wb, hb){
|
||||||
|
ctx.drawImage(I_bouton, xb, yb, wb, hb)
|
||||||
|
if (is_inside(xyMove, xb, yb, wb, hb)){
|
||||||
|
draw_rectangle(xb, yb, wb, hb, "rgb(200, 200, 200)", 0.6)
|
||||||
|
ctx.drawImage(I_shortcut, x_shortcut, y_shortcut, w_shortcut, h_shortcut)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
Loading…
Reference in New Issue