Changeset 236 for Dev/branches/jos-branch/js

Timestamp:

01/16/12 23:12:50 (13 years ago)

Author:

tschipper

Message:

 

File:

• Dev/branches/jos-branch/js/questionEditorScripts.js (modified) (13 diffs)

Dev/branches/jos-branch/js/questionEditorScripts.js

@@ -1 @@
-// Old, should not be used anymore after class-based QuestionEditor() is finished!!!!!
-var qUID, parentObjectUID, qName, qTag, qType, qAnswerLength;
-
 var questionEditor = new QuestionEditor();
-
-function selectAnswerType(){
-    var selectBox = document.getElementById("questionType");
-    if (selectBox.value != undefined && selectBox.value != "") {
-        qType = selectBox.value;
-    }
-    else {
-        return;
-    }
-    removeWrongAnswerFields(selectBox);
-    switch (qType) {
-        case "int":
-            selectIntType();
-            break;
-        case "scale":
-            selectScaleType();
-            break;
-        case "choice":
-            //selectChoiceType();
-            break;
-        case "text":
-            //selectTextType();
-            break;
-        default:
-            alert("Invalid answer type selected!");
-            break;
-    }
-    
-}
 
 function createNewElement(tag, type, id, cl, value) {
@@ -53 +21 @@
 }
 
-function removeWrongAnswerFields(el) {
-    while (el.nextSibling) {
-        el.parentNode.removeChild(el.nextSibling);
-    }
-}
-
 function updateIdentifier() {
     var identField = document.getElementById("questionIdentifierField");
@@ -68 +30 @@
 }
 
-
-/////////////////////
-/* SCALE SELECTION */
-/////////////////////
-
-function selectScaleType() {
-    // I heard you like walls of text!
-    var content = document.getElementById("questionEditor_questionParams");
-    // Add number of choices input
-    var numChoicesBox = createNewElement("select", null, "numChoicesBox","questionParamField",null);
-    var numChoicesBoxLabel = createNewInputLabel("Scale size:","numChoicesBox");
-    for (var i = 0; i < 10; i++) {
-        var option = createNewElement("option");
-        option.text = i+1;
-        option.value = i+1;
-        numChoicesBox.appendChild(option);
-    }
-    addClass(numChoicesBoxLabel, "formLineBreak");
-    content.appendChild(numChoicesBoxLabel);
-    content.appendChild(numChoicesBox);
-    // Add legends enabled input
-    var legendsEnabledCheckBox = createNewElement("input","checkbox","legendsEnabledCheckbox","questionParamField",null);
-    var legendsEnabledCheckBoxLabel = createNewInputLabel("Enable legends","legendsEnabledCheckBox");
-    addClass(legendsEnabledCheckBoxLabel, "formLineBreak");
-    content.appendChild(legendsEnabledCheckBoxLabel);
-    content.appendChild(legendsEnabledCheckBox);
-    // Add legend labels boxes
-    var upperLegendBox = createNewElement("input","text","upperLegendBox","questionParamField");
-    var lowerLegendBox = createNewElement("input","text","lowerLegendBox","questionParamField");
-    var lowerLegendBoxLabel = createNewInputLabel("Lower legend","lowerLegendBox");
-    var upperLegendBoxLabel = createNewInputLabel("Upper legend","upperLegendBox");
-    addClass(lowerLegendBoxLabel,"formLineBreak");
-    content.appendChild(lowerLegendBoxLabel);
-    content.appendChild(lowerLegendBox);
-    addClass(upperLegendBoxLabel,"formLineBreak");
-    content.appendChild(upperLegendBoxLabel);
-    content.appendChild(upperLegendBox);
-    // Disable these boxes, since the checkbox is unchecked by default
-    lowerLegendBox.disabled = true;
-    upperLegendBox.disabled = true;
-    if (legendsEnabledCheckBox.addEventListener) {
-        legendsEnabledCheckBox.addEventListener("click", toggleScaleLegends, true);
-    }
-}
-
-function toggleScaleLegends() {
-    var content = document.getElementById("questionEditor_questionParams");
-    var checkbox = document.getElementById("legendsEnabledCheckbox");
-    var upperLegendBox = document.getElementById("upperLegendBox");
-    var lowerLegendBox = document.getElementById("lowerLegendBox");
-    if (checkbox.checked == true) {
-        upperLegendBox.disabled = false;
-        lowerLegendBox.disabled = false;
-    }
-    else {
-        upperLegendBox.disabled = true;
-        lowerLegendBox.disabled = true;
-    }
-}
-
-///////////////////////////////
-/* MULTIPLE CHOICE SELECTION */
-///////////////////////////////
-
-function selectChoiceType() {
-    var selectionBox = document.getElementById("questionType");
-    var content = document.getElementById("questionEditor_questionParams");
-}
-
-function resizeTextArea() {
-    var textArea = document.getElementById("questionEditor_bodyText");
-    if (document.getElementById("hiddenScalingDiv")) {
-        var hiddenDiv = document.getElementById("hiddenScalingDiv");
-    }
-    else {
-        var hiddenDiv = document.createElement("div");
-        hiddenDiv.style.visibility = "hidden";
-        textArea.appendChild(hiddenDiv);
-    }
-    
-    debugger;
-    hiddenDiv.innerHTML = "";
-    var userText = textArea.firstChild;
-    alert(userText);
-}
 
 //////////////////////////////////////////
@@ -164 +41 @@
     this.element = null;    // The parent div element containing the questionEditor
     this.paramsElement = null;  // The parent parameters element where all the input sets will be located
-    this.paramSets = null;  // The currently enabled input sets to be displayed in the paramsElement
+    this.paramSets = null;  // The currently enabled input sets to be displayed in the paramsElement. 
+    //Currently only supports a single param set (based on answer type), but functionality will scale to multiple sets as needed.
     
     // Methods
@@ -205 +83 @@
         
         var basicContainer = ce("div");
-        basicContainer.className = "basicInputs";
+        basicContainer.id = "basicInputs";
         
         var qeCodeField = createNewElement("input", "text", "qeCodeField", "qeParamField", null);
@@ -276 +154 @@
         }
         
+        switch (ge("qeTypeField").value) {
+            case "int":
+                request.answerType = "int";
+                request.minValue = parseInt(ge("qeMinValueField").value);
+                request.maxValue = parseInt(ge("qeMaxValueField").value);
+                break;
+            case "scale":
+                request.answerType = "scale";
+                request.numChoices = parseInt(ge("qeNumChoicesField").value);
+                request.legendsEnabled = ge("qeLegendsEnabledField").checked;
+                request.lowerLegend = ge("qeLowerLegendField").value;
+                request.upperLegend = ge("qeUpperLegendField").value;
+                break;
+            case "choice":
+                request.answerType = "choice";
+                break;
+            case "text":
+                request.answerType = "text";
+                break;
+        }
+        
         newAjaxRequest(requestString, "createObject.php", function(result){
             // Display a success message, or throw an error.
-        }, true);
+            }, true);
     }
     this.reset = function() {
@@ -318 +217 @@
         // Loop through all input containers in the paramsField
         for (var n = 0; n < me.paramsElement.childNodes.length; n++) {
-            if (me.paramsElement.childNodes[n].className == "basicInputs") continue;
-            // Check if the class (inputSet) is currently in paramSets
-            if (me.paramSets.indexOf(me.paramsElement.childNodes[n].className) < 0) {
+            if (me.paramsElement.childNodes[n].id == "basicInputs") continue;
+            // Check if the id (inputSet) is currently in paramSets
+            if (me.paramSets.indexOf(me.paramsElement.childNodes[n].id) < 0) {
                 me.paramsElement.childNodes[n].parentNode.removeChild(me.paramsElement.childNodes[n]);
                 n--;
@@ -335 +234 @@
         
         me.checkInputSets();
-                
+        
+        var container = ce("div");
+        container.id = "int_basic";
+
         var qeMinValueField = createNewElement("input", "text", "qeMinValueField", "qeParamField", null);
         var qeMinValueField_lbl = createNewInputLabel("Minimum value: ", "qeMinValueField", "l");
         var qeMaxValueField = createNewElement("input", "text", "qeMaxValueField", "qeParamField", null);
         var qeMaxValueField_lbl = createNewInputLabel("Maximum value: ", "qeMaxValueField", "l");
-        var container = ce("div");
-        container.className = "int_basic";
+        
         container.appendChild(qeMinValueField_lbl);
         container.appendChild(qeMinValueField);
@@ -358 +259 @@
         
         var container = ce("div");
-        container.className = "scale_basic";
+        container.id = "scale_basic";
         
         // Number of choices SELECT
@@ -366 +267 @@
         for (var n = 2; n < 11; n++) {
             var o = ce("option");
-            o.value = n-1;
-            o.text = n-1;
+            o.value = n;
+            o.text = n;
             numChoicesField.appendChild(o);
         }
@@ -391 +292 @@
     }
     this.type_Text = function () {
-        
+        if (me.paramSets.indexOf("text_basic") < 0) {
+            me.paramSets = new Array("text_basic");
+        }
+        else return;
+        
+        me.checkInputSets();
+        
+        var container = ce("div");
+        container.id="text_basic";
     }
     this.type_Choice = function() {
-        debugger;
-        if (me.paramSets.indexOf("choice_basic")) {
+        //debugger;
+        if (me.paramSets.indexOf("choice_basic") < 0) {
             me.paramSets = new Array("choice_basic");
         }
@@ -403 +312 @@
         
         var container = ce("div");
-        container.className = "choice_basic";
+        container.id = "choice_basic";
         // num options SELECT
         var numOptionsSelect = createNewElement("select", null, "qeNumOptionsField", "qeParamField", null);
@@ -409 +318 @@
         for (var n = 2; n < 11; n++) {
             var o = ce("option");
-            o.value = n-1;
-            o.text = n-1;
+            o.value = n;
+            o.text = n;
             numOptionsSelect.appendChild(o);
         }
         container.appendChild(numOptionsSelect_lbl);
         container.appendChild(numOptionsSelect);
-        
+        numOptionsSelect.addEventListener("change", me.type_Choice_CheckAnswerFields, true);
+        
+        var allowMultiple = createNewElement("input", "checkbox", "qeMultipleAnswersField", "qeParamField", null);
+        var allowMultiple_lbl = createNewInputLabel("Allow multiple answers", "qeMultipleAnswersField", "l");
+        container.appendChild(allowMultiple_lbl);
+        container.appendChild(allowMultiple);
+        
+        var answersField = ce("div");
+        answersField.className = "qeParamFieldset";
+        answersField.id = "qeParamsAnswerFieldset"
+        container.appendChild(answersField);
+                        
         me.paramsElement.appendChild(container);
-    }
-        
+        me.type_Choice_CheckAnswerFields();
+    }
+    this.type_Choice_CheckAnswerFields = function() {
+        debugger;
+        var container = ge("qeParamsAnswerFieldset");
+        var numAnswers = parseInt(document.getElementById("qeNumOptionsField").value, 10);
+        var numAnswerFields = 0; 
+        {
+            for (var i = container.childNodes.length-1; i >= 0; i--) {
+                if (container.childNodes[i].className = "qeChoiceAnswerGroup") {
+                    numAnswerFields++;
+                }
+            }
+            
+        }
+        
+        // If there already are the correct number of answer fields, exit the function
+        if (numAnswers == numAnswerFields) return;
+        else if (numAnswers > numAnswerFields) {
+            // Extra inputs need to be added
+            var n = numAnswers - numAnswerFields;
+            for (var x = 0; x < n; x++) {
+                var group = ce("div");
+                group.className = "qeChoiceAnswerGroup";
+                var field = createNewElement("input", "text", "qeAnswerField"+(numAnswerFields+x), "qeParamField", null);
+                var field_lbl = createNewInputLabel((numAnswerFields+x), "qeAnswerField"+(numAnswerFields+x), "l");
+                
+                group.appendChild(field_lbl);
+                group.appendChild(field);
+                container.appendChild(group);
+            }
+        }
+        else if (numAnswers < numAnswerFields) {
+            // There are too many inputs and some need to be removed. Start at the end!
+            // TODO: This is SO inefficient. There has to be a better way, perhaps adding elements to an array?
+            // TODO: Another approach would be to use the previousSibling property as a way to prevent having to loop through the entire container tree every time an object needs to be removed.
+            var n = numAnswerFields-numAnswers;
+            for (var x = 0; x < n; x++) {
+                for (var y = container.childNodes.length-1; y >= 0; y--) {
+                    if (container.childNodes[y].className == "qeChoiceAnswerGroup") {
+                        container.removeChild(container.childNodes[y]);
+                        break;
+                    }
+                }
+            }
+        }
+    }
+     
     // Editing
     this.editQuestion = function(uid) {