tforgione
/
bvs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update Jo et Berenice

This commit is contained in:
mpelissi 2023-03-14 10:45:18 +01:00
parent 58f5ec964d
commit 3159043372
5 changed files with 33 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
static/MAIN.js
View File

@ -84,8 +84,8 @@ function init_variable(premier_appel){
// Enchainement des pages // Enchainement des pages
if (premier_appel){ if (premier_appel){
page_contexte = true page_contexte = false
page_inscription = false // true page_inscription = true // true
page_explication = false page_explication = false
page_warning = false page_warning = false
page_explication_bis = false page_explication_bis = false

36
static/fonctions_contexte.js
View File

@ -27,7 +27,7 @@ function action_bouton_commencer_contexte(){
page_contexte = false page_contexte = false
page_inscription = true page_inscription = true
//page_vues = 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"})
} }
function afficher_bouton_commencer_contexte(){ function afficher_bouton_commencer_contexte(){
@ -169,29 +169,33 @@ titre = "User study : Best view selection"
color_blanc = "rgb(255,255,255)" color_blanc = "rgb(255,255,255)"
color_rouge = "rgb(239, 71, 111)" color_rouge = "rgb(239, 71, 111)"
textes={ textes={
"texte0":{"t":"Hello, I am Marie Pelissier, a 3rd year PhD student. I work in the field of computer science and more precisely in computer vision.", "y": window.innerHeight*0.15, "c": color_blanc}, //"texte0":{"t":"Hello, I am Marie Pelissier, a 3rd year PhD student. I work in the field of computer science and more precisely in computer vision.", "y": window.innerHeight*0.15, "c": color_blanc},
"texte1":{"t":"You are currently participating in my user study which will allow me to collect data related to my research. These data are precious because they will be used to demonstrate the effectiveness of my work. Unfortunately, such data are not available today in the scientific literature.", "y":window.innerHeight*0.35, "c": color_blanc}, "texte0":{"t":"Hello! I am Marie Pelissier, a 3rd year PhD student. I work on computer vision, a subfield of computer science, and you are about to help me with my research.", "y": window.innerHeight*0.15, "c": color_blanc},
"texte2":{"t":"My work is dedicated to the automatic selection of the best viewpoint for a given 3D object. I will give you more details.", "y":window.innerHeight*0.65, "c": color_blanc}, //"texte1":{"t":"You are currently participating in my user study which will allow me to collect data related to my research. These data are precious because they will be used to demonstrate the effectiveness of my work. Unfortunately, such data are not available today in the scientific literature.", "y":window.innerHeight*0.35, "c": color_blanc},
"texte1":{"t":"First, thank you for participating in my study. Then, I am collecting data in order to evaluate how well a computer does against actual human opinion in the mattter of finding the best viewpoint to look at an object. Unfortunatly, it seems that no one in the scientific community has yet proposed a dataset for this purpouse.", "y":window.innerHeight*0.35, "c": color_blanc},
//"texte2":{"t":"My work is dedicated to the automatic selection of the best viewpoint for a given 3D object. I will give you more details.", "y":window.innerHeight*0.65, "c": color_blanc},
"texte2":{"t":"That’s where you come into play, I need you to answer a few question in order to build a dataset of human-chosen viewpoints of objects. Let me get into the details...", "y":window.innerHeight*0.65, "c": color_blanc},
"texte3":{"t":"What is a viewpoint? ", "y": window.innerHeight*0.15, "c": color_rouge}, "texte3":{"t":"What is a viewpoint? ", "y": window.innerHeight*0.15, "c": color_rouge},
"texte4":{"t":"> A point of view of a object corresponds to the position from which we observe a object.", "y": window.innerHeight*0.2, "c": color_blanc}, "texte4":{"t":"> The viewpoint of an object is the position from which we observe the object.", "y": window.innerHeight*0.2, "c": color_blanc},
"texte5":{"t":"Depending on this position, we can observe different parts of this object. However, from any position, it is often not possible to observe all the parts of this object.", "y": window.innerHeight*0.32, "c": color_blanc}, //"texte5":{"t":"Depending on this position, we can observe different parts of this object. However, from any position, it is often not possible to observe all the parts of this object.", "y": window.innerHeight*0.32, "c": color_blanc},
//"texte5":{"t":"Depending on this position, we can observe different parts of this object. However, from any position, it is often not possible to observe all the parts of this object. Some of them, are not visible because they form the 'back' of the object.", "y": window.innerHeight*0.32, "c": color_blanc}, "texte5":{"t":"A viewpoint will always highlight some parts and obscure other parts of an object.", "y": window.innerHeight*0.3, "c": color_blanc},
"texte6":{"t":"For example, let's look at this object (which represents a wolf) from this position/viewpoint. Here we cannot see the head of the wolf but its four legs and tail are visible.", "y": window.innerHeight*0.55, "c": color_blanc}, "texte6":{"t":"For example, this is wolf. This perspective highlights the tail and the hind legs, but obscures the head and face.", "y": window.innerHeight*0.45, "c": color_blanc},
"texte7":{"t":"There, we cannot see its right eye, left rear leg and tail but the head of the wolf is visible.", "y": window.innerHeight*0.75, "c": color_blanc}, "texte7":{"t":"This viewpoint reveal the head, face, and front legs but hides the tail and barely shows the hind legs.", "y": window.innerHeight*0.6, "c": color_blanc},
"texte8":{"t":"What is a good viewpoint?", "y": window.innerHeight*0.15, "c": color_rouge}, "texte8":{"t":"What is a good viewpoint?", "y": window.innerHeight*0.15, "c": color_rouge},
"texte9":{"t":"> A good point of view corresponds to a position from which we can observe representative parts of an object that allow us to identify it. And also to observe the most salient elements. The more characteristic elements a viewpoint contains, the better the viewpoint will be considered.", "y": window.innerHeight*0.2, "c": color_blanc}, "texte9":{"t":"> A good point of view corresponds to a position from which we can observe representative parts of an object that allow us to identify it. And also to observe the most salient elements. The more characteristic elements a viewpoint contains, the better the viewpoint will be considered.", "y": window.innerHeight*0.2, "c": color_blanc},
"texte10":{"t":"The purpose of this study is to ask you, for a given object, which are for you the best viewpoints and why. The answers will of course be subjective because everyone has their own opinion. Thsi subjective information is what I am interested in.", "y": window.innerHeight*0.45, "c": color_blanc}, "texte10":{"t":"The purpose of this study is to ask you, for a given object, which are for you the best viewpoints and why. The answers will of course be subjective because everyone has their own opinion. This subjective information is what I am interested in.", "y": window.innerHeight*0.45, "c": color_blanc},
"texte11":{"t":"Now that you know the context of this study, here are the instructions:", "y": window.innerHeight*0.15, "c": color_blanc}, "texte11":{"t":"Now that you are up to speed, here are the instructions of the study:", "y": window.innerHeight*0.15, "c": color_blanc},
"texte12":{"t":"- you will study "+nb_mesh+" different objects,", "y": window.innerHeight*0.25, "c": color_blanc}, "texte12":{"t":"- You will be presented "+nb_mesh+" different objects.", "y": window.innerHeight*0.25, "c": color_blanc},
"texte13":{"t":"- for each of them, you will have to select the "+nb_choix_demande+" best viewpoints in your opinion,", "y": window.innerHeight*0.35, "c": color_blanc}, "texte13":{"t":"- For each of them, you will chose "+nb_choix_demande+" viewpoints you find most representative of the given object.", "y": window.innerHeight*0.35, "c": color_blanc},
"texte14":{"t":"- once this is done, you will have to fill in a questionnaire to justify your choice of viewpoint.", "y": window.innerHeight*0.47, "c": color_blanc}, "texte14":{"t":"- Afterward, you will answer a few questions to justify your choices.", "y": window.innerHeight*0.5, "c": color_blanc},
"texte15":{"t":"To learn how to use this interface and make your viewpoint selection correctly, a tutorial has been created. But first, you have to register.", "y": window.innerHeight*0.65, "c": color_blanc}, "texte15":{"t":"As a mean for you to get familiar with the interface, and make your selection easier, we have set up a quick tutorial.", "y": window.innerHeight*0.6, "c": color_blanc},
"texte16":{"t":"But before anything, we need you to register in order to save your answers.", "y": window.innerHeight*0.7, "c": color_blanc},
} }
textes_page_1 = [textes["texte0"], textes["texte1"], textes["texte2"]] textes_page_1 = [textes["texte0"], textes["texte1"], textes["texte2"]]
textes_page_2 = [textes["texte3"], textes["texte4"], textes["texte5"], textes["texte6"], textes["texte7"]] textes_page_2 = [textes["texte3"], textes["texte4"], textes["texte5"], textes["texte6"], textes["texte7"]]
textes_page_3 = [textes["texte8"], textes["texte9"], textes["texte10"]] textes_page_3 = [textes["texte8"], textes["texte9"], textes["texte10"]]
textes_page_4 = [textes["texte11"], textes["texte12"], textes["texte13"], textes["texte14"], textes["texte15"]] textes_page_4 = [textes["texte11"], textes["texte12"], textes["texte13"], textes["texte14"], textes["texte15"], textes["texte16"]]
texte_a_afficher = [textes["texte0"]] texte_a_afficher = [textes["texte0"]]
} }

4
static/fonctions_explications.js
View File

@ -81,7 +81,7 @@ function init_explication(){
// 0 // 0
{"t":"Here is how the interface looks like. (PRESS NEXT BUTTON)", "x": ecrans[0].x + marge_texte_x, "y": ecrans[0].y + marge_texte_y, "f":0.010, "l":l_texte_max, "c":color_texte, "i":50}, {"t":"Here is how the interface looks like. (PRESS NEXT BUTTON)", "x": ecrans[0].x + marge_texte_x, "y": ecrans[0].y + marge_texte_y, "f":0.010, "l":l_texte_max, "c":color_texte, "i":50},
// 1.1 : ecran 3D // 1.1 : ecran 3D
{"t":"You have: A screen to view the 3D object. (PRESS NEXT BUTTON)", "x": ecrans[1].x + marge_texte_x, "y": ecrans[1].y + marge_texte_y, "f":0.010, "l":l_texte_max, "c":color_texte, "i":50}, {"t":"You have: A screen to view the 3D object. Do not be surprised by the initial position of the object, it appears from a random viewpoint. (PRESS NEXT BUTTON)", "x": ecrans[1].x + marge_texte_x, "y": ecrans[1].y + marge_texte_y, "f":0.010, "l":l_texte_max, "c":color_texte, "i":50},
// 1.2 : fleche // 1.2 : fleche
{"t":"You have: Arrows to move the 3D object. (PRESS NEXT BUTTON)", "x": ecrans[2].x + marge_texte_x, "y": ecrans[2].y + marge_texte_y, "f":0.010, "l":l_texte_max, "c":color_texte, "i":50}, {"t":"You have: Arrows to move the 3D object. (PRESS NEXT BUTTON)", "x": ecrans[2].x + marge_texte_x, "y": ecrans[2].y + marge_texte_y, "f":0.010, "l":l_texte_max, "c":color_texte, "i":50},
// 1.3 : bouton // 1.3 : bouton
@ -115,7 +115,7 @@ function init_explication(){
// 6.4 // 6.4
{"t":"With the REMOVE button, we can remove the last selected viewpoint. (PRESS NEXT BUTTON)", "x": ecrans[15].x + marge_texte_x, "y": ecrans[15].y + marge_texte_y, "f":0.01, "l":l_texte_max, "c":color_texte, "i":50}, {"t":"With the REMOVE button, we can remove the last selected viewpoint. (PRESS NEXT BUTTON)", "x": ecrans[15].x + marge_texte_x, "y": ecrans[15].y + marge_texte_y, "f":0.01, "l":l_texte_max, "c":color_texte, "i":50},
// 6.5 // 6.5
{"t":"With the RESET SELECTION button, we can rmove all selected viewpoints. (PRESS NEXT BUTTON)", "x": ecrans[15].x + marge_texte_x, "y": ecrans[15].y + marge_texte_y, "f":0.01, "l":l_texte_max, "c":color_texte, "i":50}, {"t":"With the RESET SELECTION button, we can remove all selected viewpoints. (PRESS NEXT BUTTON)", "x": ecrans[15].x + marge_texte_x, "y": ecrans[15].y + marge_texte_y, "f":0.01, "l":l_texte_max, "c":color_texte, "i":50},
// 6.6 // 6.6
{"t":"With the RESET STUDY button, we can start from the beginning. (PRESS NEXT BUTTON)", "x": ecrans[15].x + marge_texte_x, "y": ecrans[15].y + marge_texte_y, "f":0.01, "l":l_texte_max, "c":color_texte, "i":50}, {"t":"With the RESET STUDY button, we can start from the beginning. (PRESS NEXT BUTTON)", "x": ecrans[15].x + marge_texte_x, "y": ecrans[15].y + marge_texte_y, "f":0.01, "l":l_texte_max, "c":color_texte, "i":50},
// 6.7 // 6.7

16
static/fonctions_inscription.js
View File

@ -19,7 +19,7 @@ function affichage_inscription(){
ctx.fillText("Firstname:", x_texte_zone, parseInt(document.getElementById("Firstname").style.top) -12) ctx.fillText("Firstname:", x_texte_zone, parseInt(document.getElementById("Firstname").style.top) -12)
ctx.fillText("Name:", x_texte_zone, parseInt(document.getElementById("Name").style.top) - 12) ctx.fillText("Name:", x_texte_zone, parseInt(document.getElementById("Name").style.top) - 12)
ctx.fillText("Age:", x_texte_zone, parseInt(document.getElementById("Age").style.top) - 12) ctx.fillText("Age:", x_texte_zone, parseInt(document.getElementById("Age").style.top) - 12)
ctx.fillText("Sex:", parseInt(document.getElementById("SexeM").style.left), parseInt(document.getElementById("SexeM").style.top) - 22) ctx.fillText("Gender:", parseInt(document.getElementById("SexeM").style.left), parseInt(document.getElementById("SexeM").style.top) - 22)
ctx.font = "24pt Courier" ctx.font = "24pt Courier"
ctx.fillText("Male", parseInt(document.getElementById("SexeM").style.left)+40, parseInt(document.getElementById("SexeM").style.top)+24) ctx.fillText("Male", parseInt(document.getElementById("SexeM").style.left)+40, parseInt(document.getElementById("SexeM").style.top)+24)
ctx.fillText("Female", parseInt(document.getElementById("SexeF").style.left)+40, parseInt(document.getElementById("SexeM").style.top)+24) ctx.fillText("Female", parseInt(document.getElementById("SexeF").style.left)+40, parseInt(document.getElementById("SexeM").style.top)+24)
@ -179,7 +179,7 @@ function afficher_champs_inscription() {
input3.id = 'Age'; input3.id = 'Age';
input3.min = 1 input3.min = 1
input3.max = 99 input3.max = 99
input3.size = w_text_zone input3.size = 10
// style // style
input3.style.position = 'fixed'; input3.style.position = 'fixed';
input3.style.left = x_texte_zone+'px'; input3.style.left = x_texte_zone+'px';
@ -198,8 +198,8 @@ function afficher_champs_inscription() {
//input4.size = w_text_zone //input4.size = w_text_zone
// style // style
input4.style.position = 'fixed'; input4.style.position = 'fixed';
input4.style.left = x_texte_zone + 250; input4.style.left = x_texte_zone+'px';
input4.style.top = 10+ 2*ecart_texte_zone + y_texte_zone+'px'; input4.style.top = 3*ecart_texte_zone + y_texte_zone+'px';
input4.style.height = 20 input4.style.height = 20
input4.style.width = 20 input4.style.width = 20
document.body.appendChild(input4); document.body.appendChild(input4);
@ -212,8 +212,8 @@ function afficher_champs_inscription() {
//input4.size = w_text_zone //input4.size = w_text_zone
// style // style
input5.style.position = 'fixed'; input5.style.position = 'fixed';
input5.style.left = x_texte_zone + 400; input5.style.left = 200 + x_texte_zone+'px';
input5.style.top = 10 + 2*ecart_texte_zone + y_texte_zone+'px'; input5.style.top = 3*ecart_texte_zone + y_texte_zone+'px';
input5.style.height = 20 input5.style.height = 20
input5.style.width = 20 input5.style.width = 20
document.body.appendChild(input5); document.body.appendChild(input5);
@ -226,8 +226,8 @@ function afficher_champs_inscription() {
//input4.size = w_text_zone //input4.size = w_text_zone
// style // style
input6.style.position = 'fixed'; input6.style.position = 'fixed';
input6.style.left = x_texte_zone + 600; input6.style.left = 400 + x_texte_zone+'px';
input6.style.top = 10 + 2*ecart_texte_zone + y_texte_zone+'px'; input6.style.top = 3*ecart_texte_zone + y_texte_zone+'px';
input6.style.height = 20 input6.style.height = 20
input6.style.width = 20 input6.style.width = 20
document.body.appendChild(input6); document.body.appendChild(input6);

2
static/fonctions_warnings.js
View File

@ -150,7 +150,7 @@ color_blanc = "rgb(255,255,255)"
color_rouge = "rgb(239, 71, 111)" color_rouge = "rgb(239, 71, 111)"
warnings={ warnings={
"texte0":{"t":"The following is a list of warnings to keep in mind during the study:", "y": window.innerHeight*0.15, "c": color_blanc}, "texte0":{"t":"The following is a list of warnings to keep in mind during the study:", "y": window.innerHeight*0.15, "c": color_blanc},
"texte1":{"t":"- When you have launched the web page, you should not change the size of the web page or computer screen. Changing the size may cause annoyance.", "y":window.innerHeight*0.25, "c": color_blanc}, "texte1":{"t":"- During the study, you should not change the size of the web page or computer screen. Changing the size may cause annoyance.", "y":window.innerHeight*0.25, "c": color_blanc},
"texte2":{"t":"- The loading time of the objects can take time. The 3D screen may be completely black for a few seconds. Be patient, the objects will appear.", "y":window.innerHeight*0.38, "c": color_blanc}, "texte2":{"t":"- The loading time of the objects can take time. The 3D screen may be completely black for a few seconds. Be patient, the objects will appear.", "y":window.innerHeight*0.38, "c": color_blanc},
"texte3":{"t":"- Once you have finished the study, wait a few seconds before leaving the web page, to allow time for the data to fully commit to the server. A message will indicate when the registration is complete.", "y": window.innerHeight*0.52, "c": color_blanc}, "texte3":{"t":"- Once you have finished the study, wait a few seconds before leaving the web page, to allow time for the data to fully commit to the server. A message will indicate when the registration is complete.", "y": window.innerHeight*0.52, "c": color_blanc},
"texte4":{"t":"- If during the study there are some problems that you can't solve with the interface features, you can refresh the web page.All your data will be lost and you will have to start all over again. ", "y": window.innerHeight*0.68, "c": color_blanc}, "texte4":{"t":"- If during the study there are some problems that you can't solve with the interface features, you can refresh the web page.All your data will be lost and you will have to start all over again. ", "y": window.innerHeight*0.68, "c": color_blanc},