Changeset 176 for Dev/trunk/js/questionEditorScripts.js

Timestamp:

12/05/11 14:58:27 (13 years ago)

Author:

fpvanagthoven

Message:

• Wat assorted questionEditor fixes. Probleem met resetting form fields gefixt, was het gebruik van innerHTML dat roet in het eten gooide. Nu een aparte label style en class gegeven aan de text labels, nu is het prima te doen.

File:

• Dev/trunk/js/questionEditorScripts.js (modified) (5 diffs)

Dev/trunk/js/questionEditorScripts.js

@@ +1 @@
+//////////////////////
+/* HELPER FUNCTIONS */
+//////////////////////
+
+function hasClass(ele,cls) {
+    if (ele.className)
+        return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
+}
+ 
+function addClass(ele,cls) {
+    if (!this.hasClass(ele,cls)) ele.className += " "+cls;
+}
+ 
+function removeClass(ele,cls) {
+    if (hasClass(ele,cls)) {
+        var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
+        ele.className=ele.className.replace(reg,' ');
+    }
+}
+
+//////////////////////////
+/* END HELPER FUNCTIONS */
+//////////////////////////
+
+
 var qUID, parentObjectUID, qName, qTag, qType, qAnswerLength;
 
 function selectAnswerType(){
-    
     var selectBox = document.getElementById("questionType");
     if (selectBox.value != undefined && selectBox.value != "") {
@@ -10 +34 @@
         return;
     }
-    
     removeWrongAnswerFields(selectBox);
-    
     switch (qType) {
         case "int":
@@ -38 +60 @@
     if (id != undefined) newElement.id = id;
     if (cl != undefined) newElement.className = cl;
-    if (value != undefined) newElement.value = value;
+    if (value != undefined) {
+        newElement.value = value;
+        newElement.text = value;
+    }
     return newElement;
+}
+
+function createNewInputLabel(text, target) {
+    var newLabel = document.createElement("label");
+    if (target) newLabel.setAttribute("for",target);
+    newLabel.innerHTML = text;
+    return newLabel;
 }
 
@@ -48 +80 @@
 }
 
+function updateIdentifier() {
+    var identField = document.getElementById("questionIdentifierField");
+    if (identField.value == undefined && identField.value == "") {
+        return;
+    }
+    var headerField = document.getElementById("header_identifier");
+    headerField.innerHTML = identField.value;
+}
 
 
+///////////////////
+/* INT SELECTION */
+///////////////////
 
 function selectIntType() {
     var selectBox = document.getElementById("questionType");
     var content = document.getElementById("questionEditor_questionParams");
+    // Add minimum value input
     var minValueBox = createNewElement("input","text","minValueBox", "questionParamField", null);
-    content.innerHTML += "<br />Min value: ";
+    var minValueBoxLabel = createNewInputLabel("Minimum value:", "minValueBox");
+    addClass(minValueBoxLabel, "formLineBreak");
+    content.appendChild(minValueBoxLabel);
     content.appendChild(minValueBox);
+    // Add maximum value input
     var maxValueBox = createNewElement("input", "text", "maxValueBox", "questionParamField", null);
-    content.innerHTML += "<br />Max value: ";
+    var maxValueBoxLabel = createNewInputLabel("Maximum value:","maxValueBox");
+    addClass(maxValueBoxLabel, "formLineBreak");
+    content.appendChild(maxValueBoxLabel);
     content.appendChild(maxValueBox);
-    
-    // set the selected value, because adding a DOM element to the parent element resets the selected value.
-    for (var i = 0; i < selectBox.options.length; i++) {
-        if (selectBox.options[i].value == "int") {
-            selectBox.selectedValue = i;
-            selectBox.selectedText = "Integer";
-        // DIT WERKT NOG NIET, HIJ SELECTEERT HEM NIET, OOK AL IS SELECTED = TRUE
-        // MET ANDERE WOORDEN: WTF.
-        }
-    }
 }
 
-
+/////////////////////
+/* SCALE SELECTION */
+/////////////////////
 
 function selectScaleType() {
-    debugger;
-    var selectBox = document.getElementById("questionType");
+    // 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);
-    content.innerHTML += "<br />Scale size: ";
+    var numChoicesBoxLabel = createNewInputLabel("Scale size:","numChoicesBox");
     for (var i = 0; i < 10; i++) {
         var option = createNewElement("option");
@@ -86 +127 @@
         numChoicesBox.appendChild(option);
     }
+    addClass(numChoicesBoxLabel, "formLineBreak");
+    content.appendChild(numChoicesBoxLabel);
     content.appendChild(numChoicesBox);
-    numChoicesBox.addEventListener("change", selectScaleSize, false);
+    // 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 selectScaleSize() {
-    var numChoicesBox = document.getElementById("numChoicesBox");
+function toggleScaleLegends() {
     var content = document.getElementById("questionEditor_questionParams");
-    for (var i = 0; i < numChoicesBox.value; i++) {
-        var newBullet = createNewElement("input", "radio", "bullet"+i, "questionParamField","i");
-        content.appendChild(newBullet);
+    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.valueOf().value;
+    alert(userText);
 }
-