From 59e22fc0ac0930fdd790924f85d1cb44ecdd5a94 Mon Sep 17 00:00:00 2001 From: mpelissi Date: Fri, 10 Mar 2023 08:57:25 +0100 Subject: [PATCH] plus de clignotement bizarre --- .../6e154eed-4f61-4e2f-973b-07d45dbdc7b6.json | 193 +++++ .../73898e78-035d-408b-90af-14be0c9a1505.json | 165 ++++ .../8a8f0cff-f99b-4138-b5f6-060e0de7dfaf.json | 763 ++++++++++++++++++ static/MAIN.js | 13 +- static/fonctions_analyse.js | 8 +- static/fonctions_choix_vues.js | 10 +- static/fonctions_explications.js | 73 +- static/fonctions_utiles.js | 11 +- 8 files changed, 1194 insertions(+), 42 deletions(-) create mode 100644 outputs/6e154eed-4f61-4e2f-973b-07d45dbdc7b6.json create mode 100644 outputs/73898e78-035d-408b-90af-14be0c9a1505.json create mode 100644 outputs/8a8f0cff-f99b-4138-b5f6-060e0de7dfaf.json diff --git a/outputs/6e154eed-4f61-4e2f-973b-07d45dbdc7b6.json b/outputs/6e154eed-4f61-4e2f-973b-07d45dbdc7b6.json new file mode 100644 index 0000000..2fb06d8 --- /dev/null +++ b/outputs/6e154eed-4f61-4e2f-973b-07d45dbdc7b6.json @@ -0,0 +1,193 @@ +{ + "tache_N1": { + "obj_file": "dragon_update_user_study.obj", + "mesh": "dragon", + "position_init_idx_i": 7, + "position_init_idx_j": 2, + "theta_init": 0, + "delta_init": 5.497787143782138, + "choix_poses": [ + [ + "choix1", + 0, + 4.71238898038469, + 6, + 2 + ], + [ + "choix2", + 0, + 3.9269908169872414, + 5, + 2 + ], + [ + "choix3", + 0, + 3.141592653589793, + 4, + 2 + ] + ] + }, + "tache_N2": { + "obj_file": "camel_update_user_study_normed.obj", + "mesh": "camel", + "position_init_idx_i": 3, + "position_init_idx_j": 2, + "theta_init": 0, + "delta_init": 2.356194490192345, + "choix_poses": [ + [ + "choix1", + 0, + 2.356194490192345, + 3, + 2 + ], + [ + "choix2", + 0, + 1.5707963267948966, + 2, + 2 + ], + [ + "choix3", + 0, + 0.7853981633974483, + 1, + 2 + ] + ] + }, + "Analyse": { + "analyse_N1": { + "mesh": "dragon", + "idx": [ + 0 + ], + "mots": [ + "1. De face" + ] + } + }, + "Interactions": [ + { + "time": 1678367168380, + "type": "start" + }, + { + "time": 1678367168404, + "type": "Affichage Mesh random : dragon en idx_i, idx_j : (7, 2)" + }, + { + "time": 1678367168404, + "type": "Affichage Mesh random : dragon en theta, delta : (0, 5.497787143782138)" + }, + { + "time": 1678367169990, + "type": "fleche droite" + }, + { + "time": 1678367170005, + "type": "bouton pose n°1" + }, + { + "time": 1678367170229, + "type": "bouton pose n°2" + }, + { + "time": 1678367170230, + "type": "Affichage error pose déjà sélectionnée" + }, + { + "time": 1678367170261, + "type": "fleche droite" + }, + { + "time": 1678367170421, + "type": "bouton pose n°2" + }, + { + "time": 1678367170533, + "type": "fleche droite" + }, + { + "time": 1678367170596, + "type": "bouton pose n°3" + }, + { + "time": 1678367170726, + "type": "fleche droite" + }, + { + "time": 1678367170804, + "type": "bouton pose n°4" + }, + { + "time": 1678367170804, + "type": "Affichage error 3 déjà fait" + }, + { + "time": 1678367171207, + "type": "bouton valider" + }, + { + "time": 1678367171241, + "type": "Affichage Mesh random : camel en idx_i, idx_j : (3, 2)" + }, + { + "time": 1678367171241, + "type": "Affichage Mesh random : camel en theta, delta : (0, 2.356194490192345)" + }, + { + "time": 1678367171626, + "type": "bouton pose n°1" + }, + { + "time": 1678367171701, + "type": "fleche droite" + }, + { + "time": 1678367171813, + "type": "bouton pose n°2" + }, + { + "time": 1678367171909, + "type": "fleche droite" + }, + { + "time": 1678367172007, + "type": "bouton pose n°3" + }, + { + "time": 1678367172075, + "type": "fleche droite" + }, + { + "time": 1678367173172, + "type": "bouton valider" + }, + { + "time": 1678367173172, + "type": "fin des choix." + }, + { + "time": 1678367173186, + "type": "Début analyse n°1" + }, + { + "time": 1678367174645, + "type": "ajout check sur : analyse n°1, mot 1. De face" + }, + { + "time": 1678367174964, + "type": "Bouton valider analyse." + }, + { + "time": 1678367174970, + "type": "Fin analyse" + } + ] +} \ No newline at end of file diff --git a/outputs/73898e78-035d-408b-90af-14be0c9a1505.json b/outputs/73898e78-035d-408b-90af-14be0c9a1505.json new file mode 100644 index 0000000..19a0587 --- /dev/null +++ b/outputs/73898e78-035d-408b-90af-14be0c9a1505.json @@ -0,0 +1,165 @@ +{ + "tache_N1": { + "obj_file": "dragon_update_user_study.obj", + "mesh": "dragon", + "position_init_idx_i": 3, + "position_init_idx_j": 2, + "theta_init": 0, + "delta_init": 2.356194490192345, + "choix_poses": [ + [ + "choix1", + 0, + 2.356194490192345, + 3, + 2 + ], + [ + "choix2", + 0, + 1.5707963267948966, + 2, + 2 + ], + [ + "choix3", + 0, + 0.7853981633974483, + 1, + 2 + ] + ] + }, + "tache_N2": { + "obj_file": "camel_update_user_study_normed.obj", + "mesh": "camel", + "position_init_idx_i": 6, + "position_init_idx_j": 2, + "theta_init": 0, + "delta_init": 4.71238898038469, + "choix_poses": [ + [ + "choix1", + 0, + 4.71238898038469, + 6, + 2 + ], + [ + "choix2", + 0, + 3.9269908169872414, + 5, + 2 + ], + [ + "choix3", + 0, + 3.141592653589793, + 4, + 2 + ] + ] + }, + "Analyse": { + "analyse_N1": { + "mesh": "dragon", + "idx": [ + 0 + ], + "mots": [ + "1. De face" + ] + } + }, + "Interactions": [ + { + "time": 1678365963961, + "type": "start" + }, + { + "time": 1678365963986, + "type": "Affichage Mesh random : dragon en idx_i, idx_j : (3, 2)" + }, + { + "time": 1678365963986, + "type": "Affichage Mesh random : dragon en theta, delta : (0, 2.356194490192345)" + }, + { + "time": 1678365964615, + "type": "bouton pose n°1" + }, + { + "time": 1678365964695, + "type": "fleche droite" + }, + { + "time": 1678365964790, + "type": "bouton pose n°2" + }, + { + "time": 1678365964885, + "type": "fleche droite" + }, + { + "time": 1678365964966, + "type": "bouton pose n°3" + }, + { + "time": 1678365965366, + "type": "bouton valider" + }, + { + "time": 1678365965383, + "type": "Affichage Mesh random : camel en idx_i, idx_j : (6, 2)" + }, + { + "time": 1678365965383, + "type": "Affichage Mesh random : camel en theta, delta : (0, 4.71238898038469)" + }, + { + "time": 1678365965725, + "type": "bouton pose n°1" + }, + { + "time": 1678365965797, + "type": "fleche droite" + }, + { + "time": 1678365965957, + "type": "bouton pose n°2" + }, + { + "time": 1678365965994, + "type": "fleche droite" + }, + { + "time": 1678365966117, + "type": "bouton pose n°3" + }, + { + "time": 1678365966518, + "type": "bouton valider" + }, + { + "time": 1678365966518, + "type": "fin des choix." + }, + { + "time": 1678365966522, + "type": "Début analyse n°1" + }, + { + "time": 1678365968362, + "type": "ajout check sur : analyse n°1, mot 1. De face" + }, + { + "time": 1678365969302, + "type": "Bouton valider analyse." + }, + { + "time": 1678365969307, + "type": "Fin analyse" + } + ] +} \ No newline at end of file diff --git a/outputs/8a8f0cff-f99b-4138-b5f6-060e0de7dfaf.json b/outputs/8a8f0cff-f99b-4138-b5f6-060e0de7dfaf.json new file mode 100644 index 0000000..2a859e4 --- /dev/null +++ b/outputs/8a8f0cff-f99b-4138-b5f6-060e0de7dfaf.json @@ -0,0 +1,763 @@ +{ + "identite": { + "Firstname": "pouet", + "Name": "pouet", + "Age": "6", + "Sexe": "M" + }, + "tache_N1": { + "obj_file": "dragon_update_user_study.obj", + "mesh": "dragon", + "position_init_idx_i": 6, + "position_init_idx_j": 4, + "theta_init": -1.5707963267948966, + "delta_init": 4.71238898038469, + "choix_poses": [ + [ + "choix1", + 0, + 5.497787143782138, + 7, + 2 + ], + [ + "choix2", + 0, + 4.71238898038469, + 6, + 2 + ], + [ + "choix3", + 0, + 0.7853981633974483, + 1, + 2 + ] + ] + }, + "tache_N2": { + "obj_file": "camel_update_user_study_normed.obj", + "mesh": "camel", + "position_init_idx_i": 1, + "position_init_idx_j": 4, + "theta_init": -1.5707963267948966, + "delta_init": 0.7853981633974483, + "choix_poses": [ + [ + "choix1", + 0, + 5.497787143782138, + 7, + 2 + ], + [ + "choix2", + 0, + 4.71238898038469, + 6, + 2 + ], + [ + "choix3", + 0, + 0.7853981633974483, + 1, + 2 + ] + ] + }, + "Analyse": { + "analyse_N1": { + "mesh": "dragon", + "idx": [ + 4 + ], + "mots": [ + "5. toto" + ] + } + }, + "Interactions": [ + { + "time": 1678374153796, + "type": "start" + }, + { + "time": 1678374264112, + "type": "Fin contexte - Début inscription" + }, + { + "time": 1678374303109, + "type": "Fin inscription - Début explications" + }, + { + "time": 1678374303349, + "type": "Affichage Mesh random : dragon en idx_i, idx_j : (4, 1)" + }, + { + "time": 1678374303349, + "type": "Affichage Mesh random : dragon en theta, delta : (0.7853981633974483, 3.141592653589793)" + }, + { + "time": 1678374393182, + "type": "fleche droite" + }, + { + "time": 1678374395416, + "type": "fleche haut" + }, + { + "time": 1678374396982, + "type": "fleche haut" + }, + { + "time": 1678374396982, + "type": "Affichage error à cause de fleche haut" + }, + { + "time": 1678374411665, + "type": "fleche bas" + }, + { + "time": 1678374415797, + "type": "fleche bas" + }, + { + "time": 1678374418797, + "type": "fleche droite" + }, + { + "time": 1678374471542, + "type": "bouton pose n°1" + }, + { + "time": 1678374528703, + "type": "Fin explication. Début des choix." + }, + { + "time": 1678374528887, + "type": "Affichage Mesh random : dragon en idx_i, idx_j : (6, 4)" + }, + { + "time": 1678374528887, + "type": "Affichage Mesh random : dragon en theta, delta : (-1.5707963267948966, 4.71238898038469)" + }, + { + "time": 1678374533352, + "type": "fleche haut" + }, + { + "time": 1678374534251, + "type": "fleche haut" + }, + { + "time": 1678374536468, + "type": "fleche droite" + }, + { + "time": 1678374538534, + "type": "fleche gauche" + }, + { + "time": 1678374539018, + "type": "fleche gauche" + }, + { + "time": 1678374541750, + "type": "fleche bas" + }, + { + "time": 1678374543284, + "type": "fleche haut" + }, + { + "time": 1678374543751, + "type": "fleche haut" + }, + { + "time": 1678374545600, + "type": "fleche bas" + }, + { + "time": 1678374547516, + "type": "fleche droite" + }, + { + "time": 1678374549700, + "type": "fleche gauche" + }, + { + "time": 1678374550966, + "type": "fleche gauche" + }, + { + "time": 1678374551433, + "type": "fleche gauche" + }, + { + "time": 1678374552417, + "type": "fleche gauche" + }, + { + "time": 1678374554616, + "type": "fleche droite" + }, + { + "time": 1678374555183, + "type": "fleche droite" + }, + { + "time": 1678374555783, + "type": "fleche droite" + }, + { + "time": 1678374558932, + "type": "bouton pose n°1" + }, + { + "time": 1678374561032, + "type": "fleche gauche" + }, + { + "time": 1678374562248, + "type": "fleche gauche" + }, + { + "time": 1678374563548, + "type": "fleche gauche" + }, + { + "time": 1678374565431, + "type": "fleche droite" + }, + { + "time": 1678374565899, + "type": "fleche droite" + }, + { + "time": 1678374566132, + "type": "fleche droite" + }, + { + "time": 1678374566348, + "type": "fleche droite" + }, + { + "time": 1678374569065, + "type": "bouton pose n°2" + }, + { + "time": 1678374574047, + "type": "fleche bas" + }, + { + "time": 1678374576514, + "type": "fleche haut" + }, + { + "time": 1678374576864, + "type": "fleche haut" + }, + { + "time": 1678374580014, + "type": "fleche haut" + }, + { + "time": 1678374580430, + "type": "fleche haut" + }, + { + "time": 1678374580430, + "type": "Affichage error à cause de fleche haut" + }, + { + "time": 1678374582030, + "type": "fleche droite" + }, + { + "time": 1678374582630, + "type": "fleche droite" + }, + { + "time": 1678374582864, + "type": "fleche droite" + }, + { + "time": 1678374583064, + "type": "fleche droite" + }, + { + "time": 1678374586180, + "type": "fleche bas" + }, + { + "time": 1678374588246, + "type": "fleche bas" + }, + { + "time": 1678374590395, + "type": "fleche gauche" + }, + { + "time": 1678374590612, + "type": "fleche gauche" + }, + { + "time": 1678374592029, + "type": "fleche droite" + }, + { + "time": 1678374592246, + "type": "fleche droite" + }, + { + "time": 1678374592462, + "type": "fleche droite" + }, + { + "time": 1678374592695, + "type": "fleche droite" + }, + { + "time": 1678374592895, + "type": "fleche droite" + }, + { + "time": 1678374593112, + "type": "fleche droite" + }, + { + "time": 1678374595745, + "type": "fleche bas" + }, + { + "time": 1678374597129, + "type": "fleche haut" + }, + { + "time": 1678374597728, + "type": "fleche haut" + }, + { + "time": 1678374600094, + "type": "fleche droite" + }, + { + "time": 1678374601594, + "type": "fleche gauche" + }, + { + "time": 1678374601928, + "type": "fleche gauche" + }, + { + "time": 1678374602661, + "type": "fleche gauche" + }, + { + "time": 1678374602911, + "type": "fleche gauche" + }, + { + "time": 1678374603128, + "type": "fleche gauche" + }, + { + "time": 1678374605444, + "type": "fleche haut" + }, + { + "time": 1678374606994, + "type": "fleche bas" + }, + { + "time": 1678374608077, + "type": "fleche bas" + }, + { + "time": 1678374610211, + "type": "fleche gauche" + }, + { + "time": 1678374611660, + "type": "fleche droite" + }, + { + "time": 1678374611977, + "type": "fleche droite" + }, + { + "time": 1678374615277, + "type": "bouton pose n°3" + }, + { + "time": 1678374629009, + "type": "bouton valider" + }, + { + "time": 1678374629050, + "type": "Affichage Mesh random : camel en idx_i, idx_j : (1, 4)" + }, + { + "time": 1678374629050, + "type": "Affichage Mesh random : camel en theta, delta : (-1.5707963267948966, 0.7853981633974483)" + }, + { + "time": 1678374633342, + "type": "fleche haut" + }, + { + "time": 1678374633774, + "type": "fleche haut" + }, + { + "time": 1678374636908, + "type": "fleche gauche" + }, + { + "time": 1678374637158, + "type": "fleche gauche" + }, + { + "time": 1678374637591, + "type": "fleche gauche" + }, + { + "time": 1678374637874, + "type": "fleche gauche" + }, + { + "time": 1678374638125, + "type": "fleche gauche" + }, + { + "time": 1678374638741, + "type": "fleche gauche" + }, + { + "time": 1678374640491, + "type": "fleche bas" + }, + { + "time": 1678374642008, + "type": "fleche haut" + }, + { + "time": 1678374642524, + "type": "fleche haut" + }, + { + "time": 1678374644657, + "type": "fleche droite" + }, + { + "time": 1678374645757, + "type": "fleche droite" + }, + { + "time": 1678374645974, + "type": "fleche droite" + }, + { + "time": 1678374646190, + "type": "fleche droite" + }, + { + "time": 1678374646407, + "type": "fleche droite" + }, + { + "time": 1678374646907, + "type": "fleche droite" + }, + { + "time": 1678374647374, + "type": "fleche droite" + }, + { + "time": 1678374647590, + "type": "fleche droite" + }, + { + "time": 1678374647757, + "type": "fleche droite" + }, + { + "time": 1678374649340, + "type": "fleche haut" + }, + { + "time": 1678374651073, + "type": "fleche bas" + }, + { + "time": 1678374651440, + "type": "fleche bas" + }, + { + "time": 1678374653756, + "type": "fleche droite" + }, + { + "time": 1678374655706, + "type": "fleche gauche" + }, + { + "time": 1678374656022, + "type": "fleche gauche" + }, + { + "time": 1678374656506, + "type": "fleche gauche" + }, + { + "time": 1678374658039, + "type": "fleche droite" + }, + { + "time": 1678374659539, + "type": "fleche bas" + }, + { + "time": 1678374660839, + "type": "fleche haut" + }, + { + "time": 1678374661322, + "type": "fleche haut" + }, + { + "time": 1678374665039, + "type": "fleche droite" + }, + { + "time": 1678374667172, + "type": "fleche gauche" + }, + { + "time": 1678374667522, + "type": "fleche gauche" + }, + { + "time": 1678374668138, + "type": "fleche gauche" + }, + { + "time": 1678374668755, + "type": "fleche gauche" + }, + { + "time": 1678374671621, + "type": "fleche haut" + }, + { + "time": 1678374672871, + "type": "fleche bas" + }, + { + "time": 1678374673671, + "type": "fleche bas" + }, + { + "time": 1678374681926, + "type": "fleche droite" + }, + { + "time": 1678374682192, + "type": "fleche droite" + }, + { + "time": 1678374686553, + "type": "fleche gauche" + }, + { + "time": 1678374687070, + "type": "fleche gauche" + }, + { + "time": 1678374728525, + "type": "fleche droite" + }, + { + "time": 1678374733698, + "type": "fleche bas" + }, + { + "time": 1678374735165, + "type": "fleche haut" + }, + { + "time": 1678374735582, + "type": "fleche haut" + }, + { + "time": 1678374737597, + "type": "fleche bas" + }, + { + "time": 1678374741148, + "type": "fleche droite" + }, + { + "time": 1678374742480, + "type": "fleche gauche" + }, + { + "time": 1678374742863, + "type": "fleche gauche" + }, + { + "time": 1678374745864, + "type": "fleche gauche" + }, + { + "time": 1678374746281, + "type": "fleche gauche" + }, + { + "time": 1678374746580, + "type": "fleche gauche" + }, + { + "time": 1678374747047, + "type": "fleche gauche" + }, + { + "time": 1678374747546, + "type": "fleche gauche" + }, + { + "time": 1678374750613, + "type": "fleche haut" + }, + { + "time": 1678374752747, + "type": "fleche bas" + }, + { + "time": 1678374759563, + "type": "bouton pose n°1" + }, + { + "time": 1678374762779, + "type": "fleche droite" + }, + { + "time": 1678374765078, + "type": "fleche gauche" + }, + { + "time": 1678374766828, + "type": "fleche bas" + }, + { + "time": 1678374767995, + "type": "fleche haut" + }, + { + "time": 1678374768744, + "type": "fleche haut" + }, + { + "time": 1678374770244, + "type": "fleche droite" + }, + { + "time": 1678374772094, + "type": "fleche gauche" + }, + { + "time": 1678374772461, + "type": "fleche gauche" + }, + { + "time": 1678374772744, + "type": "fleche gauche" + }, + { + "time": 1678374773344, + "type": "fleche gauche" + }, + { + "time": 1678374775844, + "type": "fleche haut" + }, + { + "time": 1678374777210, + "type": "fleche bas" + }, + { + "time": 1678374777877, + "type": "fleche bas" + }, + { + "time": 1678374780060, + "type": "fleche gauche" + }, + { + "time": 1678374780460, + "type": "fleche gauche" + }, + { + "time": 1678374780860, + "type": "fleche gauche" + }, + { + "time": 1678374781310, + "type": "fleche gauche" + }, + { + "time": 1678374783843, + "type": "bouton pose n°2" + }, + { + "time": 1678374786993, + "type": "fleche droite" + }, + { + "time": 1678374788943, + "type": "fleche gauche" + }, + { + "time": 1678374789259, + "type": "fleche gauche" + }, + { + "time": 1678374789526, + "type": "fleche gauche" + }, + { + "time": 1678374790359, + "type": "fleche gauche" + }, + { + "time": 1678374794559, + "type": "bouton pose n°3" + }, + { + "time": 1678374798942, + "type": "bouton valider" + }, + { + "time": 1678374798942, + "type": "fin des choix." + }, + { + "time": 1678374798942, + "type": "Début analyse n°1" + }, + { + "time": 1678374902132, + "type": "ajout check sur : analyse n°1, mot 5. toto" + }, + { + "time": 1678374907832, + "type": "Bouton valider analyse." + }, + { + "time": 1678374907847, + "type": "Fin analyse" + } + ] +} \ No newline at end of file diff --git a/static/MAIN.js b/static/MAIN.js index 4d8bf0c..d05af6e 100644 --- a/static/MAIN.js +++ b/static/MAIN.js @@ -316,7 +316,7 @@ function animate() { init_variable_fonction(boutons, imgs) init_explication() // affichage ecran 3D de manière aléatoire - idx_i_explication = 2 , idx_j_explication = 1 + idx_i_explication = 4 , idx_j_explication = 1 setUp_3D(indice_mesh, idx_i_explication, idx_j_explication) premier_tour_page_explications = false } @@ -332,7 +332,7 @@ function animate() { else{print_text(handle_text(texte_temporaire.text, texte_temporaire.x, texte_temporaire.y, " 18pt Courier", longueur_max_error, "#118AB2"))} } // progress bar - progress_bar(num_tache, nb_mesh) + progress_bar(0, 1) // Affichage fleche afficher_fleche(imgs) // affichage de sboutons @@ -383,7 +383,7 @@ function animate() { else{print_text(handle_text(texte_temporaire.text, texte_temporaire.x, texte_temporaire.y, " 18pt Courier", longueur_max_error, "#118AB2"))} } // progress bar - progress_bar(num_tache, nb_mesh) + progress_bar(num_tache-1, nb_mesh) // Affichage fleche afficher_fleche(imgs) // affichage de sboutons @@ -402,9 +402,9 @@ function animate() { // Les poses choisies sont grisées bloquer_pose(liste_poses) // RAZ - clicked = false - which_clicked_fleche = -1 - which_clicked_bouton = -1 + // clicked = false + // which_clicked_fleche = -1 + // which_clicked_bouton = -1 } //////////////////////////////////////////////////////////////////////////////// // page analyse @@ -419,6 +419,7 @@ function animate() { premier_tour_page_analyse = false} init_variable_analyse() traitement_fin() + } //////////////////////////////////////////////////////////////////////////////// // page fin diff --git a/static/fonctions_analyse.js b/static/fonctions_analyse.js index d97b3fd..43c5cc2 100644 --- a/static/fonctions_analyse.js +++ b/static/fonctions_analyse.js @@ -61,10 +61,10 @@ function progress_bar_analyse(N_analyse, N_analyse_total){ console.log(w_bar) draw_rectangle(x_progress_bar, y_progress_bar, w_bar, h_progress_bar, "rgb(17, 138, 178)", 1) // numero de tache - // 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 = "18pt Courier"; - // ctx.fillText((N_analyse+1)+"/"+(N_analyse_total), x_progress_bar+w_progress_bar+10, h_progress_bar) + 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 = "18pt Courier"; + ctx.fillText((N_analyse)+"/"+(N_analyse_total), x_progress_bar+w_progress_bar+10, h_progress_bar) } } diff --git a/static/fonctions_choix_vues.js b/static/fonctions_choix_vues.js index 18734f9..f8841bf 100644 --- a/static/fonctions_choix_vues.js +++ b/static/fonctions_choix_vues.js @@ -19,7 +19,7 @@ function init_variable_fonction(dict_boutons, dict_imgs ){ // progress bar x_progress_bar = 0 y_progress_bar = 0 - w_progress_bar = window.innerWidth //- W_3D*0.1 + w_progress_bar = window.innerWidth - W_3D*0.1 h_progress_bar = H_3D*0.04 // image recap dx = 20 @@ -177,21 +177,21 @@ function afficher_fleche(dict_imgs){ 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 ){ - draw_rectangle(W_3D*0.2-b, H_3D+DY+b, b, a, "rgb(200, 200, 200)", alpha_survol) + draw_contour(W_3D*0.2-b, H_3D+DY+b, b, a, "rgb(200, 200, 200)", alpha_survol) } // 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 ){ - draw_rectangle(W_3D*0.2+a, H_3D+DY+b, b, a, "rgb(200, 200, 200)", alpha_survol) + draw_contour(W_3D*0.2+a, H_3D+DY+b, b, a, "rgb(200, 200, 200)", alpha_survol) } // 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 - draw_rectangle(W_3D*0.2, H_3D+DY, a, b, "rgb(200, 200, 200)", alpha_survol) + draw_contour(W_3D*0.2, H_3D+DY, a, b, "rgb(200, 200, 200)", alpha_survol) } // 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 - draw_rectangle(W_3D*0.2, H_3D+DY+b+a, a, b, "rgb(200, 200, 200)", alpha_survol) + draw_contour(W_3D*0.2, H_3D+DY+b+a, a, b, "rgb(200, 200, 200)", alpha_survol) } } diff --git a/static/fonctions_explications.js b/static/fonctions_explications.js index 5e698bc..e758f47 100644 --- a/static/fonctions_explications.js +++ b/static/fonctions_explications.js @@ -4,7 +4,7 @@ alpha_ecran = 0.9 alpha_clignotement = 0.8 color_ecran ="rgb(255,255,255)" color_texte = "rgb(0,0,0)" -color_clignotement = "rgb(200,0,0)" +color_clignotement = "rgb(0,255,255)" font_texte = window.innerWidth ecart_x = 50 l_texte_max = window.innerWidth-W_3D-2*ecart_x -50 @@ -114,31 +114,37 @@ positions_bouton = [ clignotements = [ // 0 - {"type":"a_cliquer", "x":positions_bouton[0].x, "y":positions_bouton[0].y, "w":positions_bouton[0].w, "h":positions_bouton[0].h, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+temps_attente}, + {"type":"a_cliquer", "x":positions_bouton[0].x, "y":positions_bouton[0].y, "w":positions_bouton[0].w, "h":positions_bouton[0].h, "c":color_clignotement,"a": alpha_clignotement, "t": temps_attente}, // 1.1 : ecran 3D - {"type":"a_regarder", "x":0, "y":h_progress_bar, "w":W_3D, "h":H_3D, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+500}, + [{"type":"a_regarder", "x":0, "y":h_progress_bar, "w":W_3D, "h":H_3D, "c":color_clignotement,"a": alpha_clignotement, "t": 500}, + {"type":"a_cliquer", "x":positions_bouton[1].x, "y":positions_bouton[1].y, "w":positions_bouton[1].w, "h":positions_bouton[1].h, "c":color_clignotement,"a": alpha_clignotement, "t": temps_attente}, + ], // 1.2 : fleche - {"type":"a_regarder", "x": W_3D*0.2-b, "y":H_3D+DY, "w":b+a+b, "h":b+a+b, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+500}, + [{"type":"a_regarder", "x": W_3D*0.2-b, "y":H_3D+DY, "w":b+a+b, "h":b+a+b, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x":positions_bouton[2].x, "y":positions_bouton[2].y, "w":positions_bouton[2].w, "h":positions_bouton[2].h, "c":color_clignotement,"a": alpha_clignotement, "t": temps_attente}, + ], // 1.3 - {"type":"a_regarder", "x":W_3D*pos_bouton, "y":H_3D+dy*2, "w":w_bouton*2 + ecart_bouton, "h":h_bouton*2+ecart_bouton, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+500}, + [{"type":"a_regarder", "x":W_3D*pos_bouton, "y":H_3D+dy*2, "w":w_bouton*2 + ecart_bouton, "h":h_bouton*2+ecart_bouton, "c":color_clignotement,"a": alpha_clignotement, "t": 500}, + {"type":"a_cliquer", "x": positions_bouton[3].x, "y":positions_bouton[3].y, "w":positions_bouton[3].w, "h":positions_bouton[3].h, "c":color_clignotement,"a": alpha_clignotement, "t": temps_attente}, + ], // 2.1 : Selection 1er vues - {"type":"a_cliquer", "x": positions_bouton[4].x, "y":positions_bouton[4].y, "w":positions_bouton[4].w, "h":positions_bouton[4].h, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+temps_attente}, + {"type":"a_cliquer", "x": positions_bouton[4].x, "y":positions_bouton[4].y, "w":positions_bouton[4].w, "h":positions_bouton[4].h, "c":color_clignotement,"a": alpha_clignotement, "t": temps_attente}, // 2.2 : clique sur fleche droite - {"type":"a_cliquer", "x": W_3D*0.2+a, "y":H_3D+DY+b, "w":b, "h":a, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*0.2+a, "y":H_3D+DY+b, "w":b, "h":a, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 2.3 : clique sur fleche haut - {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 2.4 : clique sur fleche haut - {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 2.5 : PBL trop haut - {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY+b+a, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY+b+a, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 3.1 : clique sur fleche bas - {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY+b+a, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*0.2, "y":H_3D+DY+b+a, "w":a, "h":b, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 3.2 : clique sur fleche bas --> next step fleche droite - {"type":"a_cliquer", "x": W_3D*0.2+a, "y":H_3D+DY+b, "w":b, "h":a, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*0.2+a, "y":H_3D+DY+b, "w":b, "h":a, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 3.3 : clique sur fleche drioite --> next step bouton pose - {"type":"a_cliquer", "x": W_3D*pos_bouton, "y": H_3D+dy*2, "w": w_bouton, "h": h_bouton, "c":color_clignotement,"a":alpha_clignotement, "t": new Date().getTime()+500}, + {"type":"a_cliquer", "x": W_3D*pos_bouton, "y": H_3D+dy*2, "w": w_bouton, "h": h_bouton, "c":color_clignotement,"a":alpha_clignotement, "t": 500}, // 4 - {"type":"a_cliquer", "x": positions_bouton[12].x, "y":positions_bouton[12].y, "w":positions_bouton[12].w, "h":positions_bouton[12].h, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()+temps_attente} + {"type":"a_cliquer", "x": positions_bouton[12].x, "y":positions_bouton[12].y, "w":positions_bouton[12].w, "h":positions_bouton[12].h, "c":color_clignotement,"a": alpha_clignotement, "t": new Date().getTime()} ] @@ -175,6 +181,9 @@ conditions_suivant = [ nb_action = ecrans.length num_action = 0 nb_click_explication = 0 +time_clicke = time_animate +console.log('initttt') + } @@ -206,28 +215,46 @@ function traitement_explications(idx_i_explication, idx_j_explication){ // bouton suivant ctx.drawImage(boutons['suivant'], position_bouton.x, position_bouton.y, position_bouton.w, position_bouton.h) if (is_inside(xyMouseMove, position_bouton.x, position_bouton.y, position_bouton.w, position_bouton.h)){ - console.log('ttt') + //console.log('ttt') draw_rectangle(position_bouton.x, position_bouton.y, position_bouton.w, position_bouton.h, "rgb(200, 200, 200)", 0.6)} // Bouton previous if (num_action>0){ ctx.drawImage(boutons['avant'], position_bouton.x - w_bouton_suivant - marge_texte_x, position_bouton.y, position_bouton.w, position_bouton.h) if (is_inside(xyMouseMove, position_bouton.x - w_bouton_suivant - marge_texte_x, position_bouton.y, position_bouton.w, position_bouton.h)){ - console.log("dedans") + //console.log("dedans") draw_rectangle(position_bouton.x - w_bouton_suivant - marge_texte_x, position_bouton.y, position_bouton.w, position_bouton.h, "rgb(200, 200, 200)", 0.6)} } } - // clignotement courant - if (time_animate > clignotement.t && num_action!=12 && clignotement.type=="a_cliquer"){ - clignotement_contour(2000, clignotement.x, clignotement.y, clignotement.w, clignotement.h, clignotement.c, 5) } - - if (time_animate > clignotement.t && clignotement.type=="a_regarder"){ - clignotement_rectangle(2000, clignotement.x, clignotement.y, clignotement.w, clignotement.h, "rgb(17, 138, 178)", 0.6) } + // 1 clignotement courant donc taille = 8 car 8 keys + if (Object.keys(clignotement).length == 8){ + if (time_animate > time_clicke + clignotement.t && num_action!=12 && clignotement.type=="a_cliquer"){ + clignotement_contour(2000, clignotement.x, clignotement.y, clignotement.w, clignotement.h, clignotement.c, 10) + } + if (time_animate > time_clicke + clignotement.t && clignotement.type=="a_regarder"){ + clignotement_rectangle(2000, clignotement.x, clignotement.y, clignotement.w, clignotement.h, "rgb(17, 138, 178)", 0.6) + } + // on a plusieurs clignotement + } else { + for(let p=0; p time_clicke + clignotement_p.t && num_action!=12 && clignotement_p.type=="a_cliquer"){ + clignotement_contour(2000, clignotement_p.x, clignotement_p.y, clignotement_p.w, clignotement_p.h, clignotement_p.c, 10) + } + // rectangle + if (time_animate > time_clicke + clignotement_p.t && clignotement_p.type=="a_regarder"){ + clignotement_rectangle(2000, clignotement_p.x, clignotement_p.y, clignotement_p.w, clignotement_p.h, "rgb(17, 138, 178)", 0.6) + } + } + } + // si on clique sur NEXT if (condition_suivant.type =="bouton" && clicked && click_inside(xyMouseDown, condition_suivant.x, condition_suivant.y, condition_suivant.w, condition_suivant.h)){ console.log("next") action_suivante() + } // Si on clique sur PREVIOUS //if (condition_suivant.type =="bouton" && num_action >0 && clicked && click_inside(xyMouseDown, condition_suivant.x- w_bouton_suivant - marge_texte_x, condition_suivant.y, condition_suivant.w, condition_suivant.h)){ @@ -311,10 +338,12 @@ function action_bas_explication(){ function action_suivante(){ num_action = num_action+1 + time_clicke = time_animate } function action_precedente(){ num_action = num_action-1 + time_clicke = time_animate } function update_mesh(I,J){ diff --git a/static/fonctions_utiles.js b/static/fonctions_utiles.js index b1dc897..0501a8b 100644 --- a/static/fonctions_utiles.js +++ b/static/fonctions_utiles.js @@ -45,6 +45,7 @@ function draw_contour(originex, originey, largeur, hauteur, couleur, alpha=1, ep ctx.globalAlpha = alpha ctx.stroke() ctx.lineWidth = 1 + ctx.globalAlpha = 1 } function clignotement_rectangle(periode, originex, originey, largeur, hauteur, couleur, alhpa_max=1){ @@ -136,13 +137,13 @@ function progress_bar(N_tache, N_mesh){ // background draw_rectangle(x_progress_bar, y_progress_bar, w_progress_bar, h_progress_bar, "rgb(255,255,255)", 1) // bar - w_bar = ((N_tache-1)/N_mesh)*w_progress_bar + w_bar = ((N_tache)/N_mesh)*w_progress_bar draw_rectangle(x_progress_bar, y_progress_bar, w_bar, h_progress_bar, "rgb(17, 138, 178)", 1) // // numero de tache - // 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 = "18pt Courier"; - // ctx.fillText((N_tache)+"/"+(N_mesh), x_progress_bar+w_progress_bar+10, h_progress_bar) + 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 = "18pt Courier"; + ctx.fillText((N_tache)+"/"+(N_mesh), x_progress_bar+w_progress_bar+10, h_progress_bar) } }