update survey demos for docs page

jspsych · Mar 13, 2024 · 5b57978 · 5b57978
1 parent dbc9e85
commit 5b57978
Show file tree

Hide file tree

Showing 6 changed files with 300 additions and 237 deletions.
diff --git a/docs/demos/jspsych-survey-demo1.html b/docs/demos/jspsych-survey-demo1.html
@@ -20,39 +20,22 @@
         showQuestionNumbers: false,
         elements:
           [
-            {
-              type: 'html',
-              name: 'info',
-              html: '<p><strong>Please answer the following questions:</strong></p>',
-            },
             {
               type: 'radiogroup',
               title: "Which of the following do you like the most?", 
               name: 'vegetablesLike', 
-              choices: ['Tomato', 'Cucumber', 'Eggplant', 'Corn', 'Peas', 'Broccoli'], 
-              colCount: 2,
-              required: true,
-              showNoneItem: true,
-              showOtherItem: true,
+              choices: ['Tomato', 'Cucumber', 'Eggplant', 'Corn', 'Peas', 'Broccoli']
             }, 
             {
               type: 'checkbox',
               title: "Which of the following do you like?", 
               name: 'fruitLike', 
-              description: "You can select as many as you want. Select at least 2 to see a conditional question appear below.",
+              description: "You can select as many as you want.",
               choices: ['Apple', 'Banana', 'Orange', 'Grape', 'Strawberry', 'Kiwi', 'Mango'], 
-              colCount: 2,
               showOtherItem: true,
               showSelectAllItem: true,
-              required: false,
-            },
-            {
-              type: 'ranking',
-              title: "Of the fruits that you like, which one is your favorite?",
-              name: "fruitFavorite",
-              choicesFromQuestion: "fruitLike",
-              choicesFromQuestionMode: "selected",
-              visibleIf: "{fruitLike.length} > 1",
+              showNoneItem: true,
+              required: true,
             },
         ]
       }),

diff --git a/docs/demos/jspsych-survey-demo2.html b/docs/demos/jspsych-survey-demo2.html
@@ -20,7 +20,7 @@
       survey_json: JSON.stringify({
         showQuestionNumbers: false,
         title: 'My questionnaire',
-        completeText: 'Submit',
+        completeText: 'Done!',
         pageNextText: 'Continue',
         pagePrevText: 'Previous',
         pages: [
@@ -56,16 +56,16 @@
                 choices: ['Blue','Yellow','Pink','Teal','Orange','Lime green'],
                 showNoneItem: true,
                 showOtherItem: true,
-                name: 'FavColor', 
-                colCount: 2
+                colCount: 0,
+                name: 'FavColor',
               }, 
               {
                 type: 'checkbox',
                 title: 'Which of these animals do you like? Select all that apply.', 
                 choices: ['Lion','Squirrel','Badger','Whale', 'Turtle'],
                 choicesOrder: 'random',
                 colCount: 0,
-                name: 'AnimalLike', 
+                name: 'FavAnimals', 
               }
             ]
           }

diff --git a/docs/demos/jspsych-survey-demo3.html b/docs/demos/jspsych-survey-demo3.html
@@ -64,7 +64,7 @@
           {
             type: 'matrix',
             name: 'like-food-matrix',
-            title: ' ',
+            title: 'Matrix question for rating mutliple statements on the same scale.',
             alternateRows: true,
             isAllRowRequired: true,
             rows: [

diff --git a/docs/demos/jspsych-survey-demo4.html b/docs/demos/jspsych-survey-demo4.html
@@ -19,31 +19,31 @@
       type: jsPsychSurvey,
       survey_json: JSON.stringify({
         showQuestionNumbers: false,
-        title: 'Multiple choice question with a correct answer.',
+        title: 'Conditional question visibility.',
         pages: [{
           name: 'question',
           elements: [
             {
               type: 'radiogroup',
               title: 'During the experiment, are you allowed to write things down on paper to help you?',
               choices: ["Yes", "No"],
-              correctAnswer: "No",
+              name: "WriteOK",
               isRequired: true
             }
           ],
         }, {
-          name: 'score',
+          name: 'feedback',
           elements: [
             {
               type: 'html',
               name: 'incorrect',
-              visibleIf: '{correctAnswers} < {questionCount}',
-              html: '<h4>That response was incorrect.</h4>'
+              visibleIf: '{WriteOK} = "Yes"',
+              html: '<h4>That response was incorrect.</h4><p>Please return to the previous page and try again.</p>'
             },
             {
               type: 'html',
               name: 'correct',
-              visibleIf: '{correctAnswers} == {questionCount}',
+              visibleIf: '{WriteOK} == "No"',
               html: '<h4>Congratulations!</h4>'
             }
           ]

diff --git a/docs/demos/jspsych-survey-demo5.html b/docs/demos/jspsych-survey-demo5.html
@@ -15,64 +15,69 @@
 
     const jsPsych = initJsPsych();
 
-    // values that change across survey trials - each object represents a single trial
-    const question_variables = [
-      {
-        'fruit': 'apples',
-        'Q1_prompt': 'Do you like apples?', 
-        'Q1_type': 'regular'
-      },
-      {
-        'fruit': 'pears',
-        'Q1_prompt': 'Do you like pears?', 
-        'Q1_type': 'regular'
-      },
-      {
-        'fruit': 'bananas',
-        'Q1_prompt': 'Do you NOT like bananas?', 
-        'Q1_type': 'reverse'
-      },
-    ];
-
-    // create an array to store all of our survey trials so that we can easily randomize their order
-    survey_trials = [];
-
-    // construct the survey trials dynamically using an array of question-specific information
-    for (let i=0; i<question_variables.length; i++) {
-
-      // set up the survey JSON for this trial
-      // any question-specific variables come from the appropriate object in the question_variables array
-      let survey_json = {
-        showQuestionNumbers: false,
-        title: 'Dynamically constructing survey trials.',
-        elements: [
+        // values that change across survey trials - each object represents a single trial
+        const question_variables = [
+          {
+            'fruit': 'apples',
+            'Q1_prompt': 'Do you like apples?', 
+            'Q1_type': 'regular',
+            'Q2_word': 'like'
+          },
           {
-            type: 'radiogroup',
-            title: question_variables[i].Q1_prompt,
-            choices: ['Yes', 'No'],
-            name: 'Q1'
+            'fruit': 'pears',
+            'Q1_prompt': 'Do you like pears?', 
+            'Q1_type': 'regular',
+            'Q2_word': 'like'
           },
           {
-            type: 'text',
-            title: 'What is your favorite thing about ' + question_variables[i].fruit + '?',
-            name: 'Q2'
-          }
-        ]
-      };
-
-      // set up a survey trial object using the JSON we've just created for this question, 
-      // and add the trial object to the survey trials array
-      survey_trials.push({
-        type: jsPsychSurvey,
-        survey_json: JSON.stringify(survey_json),
-        data: {
-          'Q1_prompt': question_variables[i].Q1_prompt,
-          'Q1_type': question_variables[i].Q1_type,
-          'fruit': question_variables[i].fruit                                                        
-        }  
-      });
+            'fruit': 'bananas',
+            'Q1_prompt': 'Do you NOT like bananas?', 
+            'Q1_type': 'reverse',
+            'Q2_word': 'hate'
+          },
+        ];
 
-    }
+        // create an array to store all of our survey trials so that we can easily randomize their order
+        survey_trials = [];
+
+        // construct the survey trials dynamically using an array of question-specific information
+        for (let i=0; i<question_variables.length; i++) {
+
+          // set up the survey JSON for this trial
+          // any question-specific variables come from the appropriate object in the question_variables array
+          let survey_json = {
+            showQuestionNumbers: false,
+            title: 'Dynamically constructing survey trials.',
+            completeText: 'Next >>',
+            elements: [
+              {
+                type: 'radiogroup',
+                title: question_variables[i].Q1_prompt,
+                choices: ['Yes', 'No'],
+                name: 'Q1'
+              },
+              {
+                type: 'text',
+                title: 'What do you '+question_variables[i].Q2_word+' most about '+question_variables[i].fruit+'?',
+                name: 'Q2'
+              }
+            ]
+          };
+
+          // set up a survey trial object using the JSON we've just created for this question, 
+          // and add the trial object to the survey trials array
+          survey_trials.push({
+            type: jsPsychSurvey,
+            survey_json: JSON.stringify(survey_json),
+            data: {
+              'Q1_prompt': question_variables[i].Q1_prompt,
+              'Q1_type': question_variables[i].Q1_type,
+              'Q2_word': question_variables[i].Q2_word,
+              'fruit': question_variables[i].fruit                                                        
+            }  
+          });
+
+        }
 
     const timeline = jsPsych.randomization.shuffle(survey_trials);