diff --git a/resources/library/interactive/Choisir.wgt/css/basic.css b/resources/library/interactive/Choisir.wgt/css/basic.css index 01cbe796..50165e3e 100644 --- a/resources/library/interactive/Choisir.wgt/css/basic.css +++ b/resources/library/interactive/Choisir.wgt/css/basic.css @@ -136,7 +136,7 @@ body{ padding: 3px; margin-left: 10px; margin-bottom: 10px; - width: 100%; + width: 95%; font-family: Verdana,Arial,Helvetica,sans-serif; font-size: small; border: 3px solid #ccc; @@ -177,17 +177,17 @@ body{ float: left; width: 100%; margin: 3px; + -webkit-border-radius: 5px; + border-radius: 5px; } .ansSpan{ - border: none; - background: url(../images/point.png) -0px -0px no-repeat; + border: none; background-color: white; - background-position: 0 50%; color: #00C6FF; font-size: 14px; float: left; - padding-left: 35px; + margin: 0 3px; width: 20px; } @@ -213,22 +213,25 @@ body{ } .ansContentDisplay{ - padding: 1px 3px 3px 3px; + padding: 1px 3px 3px 3px; margin-left: 5px; font-family: Verdana,Arial,Helvetica,sans-serif; font-size: small; width: 90%; float: left; + -webkit-border-radius: 5px; + border-radius: 5px; } .ansDelete{ - float: right; + float: left; border: none; background-image: url(../images/boldGreyClose.png); background-color: white; background-repeat: no-repeat; background-position: 0 50%; cursor: pointer; + margin: 0 5px; } .qstOptChoice{ diff --git a/resources/library/interactive/Choisir.wgt/scripts/selQuestionApp.js b/resources/library/interactive/Choisir.wgt/scripts/selQuestionApp.js index 80bd7da1..09dfaa44 100644 --- a/resources/library/interactive/Choisir.wgt/scripts/selQuestionApp.js +++ b/resources/library/interactive/Choisir.wgt/scripts/selQuestionApp.js @@ -24,6 +24,7 @@ function init(){ var mode = false; questionArray = new Array(); var popupFlag = false + var flagForSelect = false; // toggle button var buttonDiv = $("
").appendTo("body"); @@ -49,11 +50,19 @@ function init(){ for(var i in questionArray){ addQstBlock(questionArray[i].id, questionArray[i].text, questionArray[i].type,"style='display: none;'"); for(var j in questionArray[i].answers) - addAnsBlock(questionArray[i].answers[j].id, questionArray[i].id, questionArray[i].answers[j].text); + addAnsBlock(questionArray[i].answers[j].id, questionArray[i].id, questionArray[i].answers[j].text, true, questionArray[i].rightAns, questionArray[i].type); } + /*for(var i in questionArray) + setInputSelected(questionArray[i].id, questionArray[i].type, questionArray[i].rightAns); + alert(2); */ } } + //saving widget data into sankore object for a correct import + $("body").mouseout(function(){ + if(window.sankore) + sankore.setPreference("qstArrayData", JSON.stringify(questionArray)); + }) // add question addQstButton.click(function(){ //question block @@ -119,6 +128,12 @@ function init(){ $(".qstDiv").live('mouseover', function() { currentQstId = this.id; }); + + //set used at this moment question id into the variable + $(".qstDivDisplay").live('mouseover', function() { + if(!flagForSelect) + currentQstId = this.id.replace("qstDivDisplay",""); + }); //adding new answer $(".ansAdd").live('click', function(){ @@ -176,9 +191,10 @@ function init(){ $(".ansDelete").live('click', function(){ popupText.hide(); var id = this.id.replace("ansDelete",""); - $("#" + id).remove(); + $("#" + currentQstId + " #" + id).remove(); for(var i in questionArray) if(questionArray[i].id == currentQstId){ + questionArray[i].rightAns = questionArray[i].rightAns.replace($("#" + currentQstId + " #" + id + " input:checkbox").val(),""); for(var j in questionArray[i].answers) if(questionArray[i].answers[j].id == id){ delete questionArray[i].answers[j]; @@ -215,14 +231,48 @@ function init(){ }); //select option - $("input:radio").live('click', function(event){ + $(".qstOptChoice input:radio").live('click', function(event){ if(!mode){ - $("#" + currentQstId + " input:radio").removeAttr("checked"); + $("#" + currentQstId + "qstOptChoice input:radio").removeAttr("checked"); $(event.target).attr("checked", "checked"); getNeededElement(questionArray, currentQstId).type = $(event.target).attr("value"); } }); + //select right ansver in edit mode and answer question in display mode + $(".newAnswer input").live('click', function(event){ + + if(!mode){ + if(getNeededElement(questionArray, currentQstId).type == "1" || getNeededElement(questionArray, currentQstId).type == "3"){ + $("#" + currentQstId + "ansDiv input").removeAttr("checked"); + $(event.target).attr("checked", "checked"); + getNeededElement(questionArray, currentQstId).rightAns = $(event.target).attr("value"); + //alert(getNeededElement(questionArray, currentQstId).rightAns); + } else { + //alert(event.target.checked) + (event.target.checked) ? $(event.target).attr("checked", "checked") : $(event.target).removeAttr("checked", "checked"); + getNeededElement(questionArray, currentQstId).rightAns = ""; + for(var i in $("#" + currentQstId + "ansDiv input")){ + if($("#" + currentQstId + "ansDiv input")[i].checked) + getNeededElement(questionArray, currentQstId).rightAns += $("#" + currentQstId + "ansDiv input")[i].value + ", "; + } + } + } else { + if(event.target.type == "radio"){ + if(event.target.value == getNeededElement(questionArray, currentQstId).rightAns) + $(event.target).next().next().css("background-color","#6c0"); + else + $(event.target).next().next().css("background-color","#f66"); + } else { + //alert(event.target.value + " | " + getNeededElement(questionArray, currentQstId).rightAns + " | " + getNeededElement(questionArray, currentQstId).rightAns.replace(/,/g,"") + " | " + getNeededElement(questionArray, currentQstId).rightAns.replace(",","").indexOf(event.target.value + " ", 0) ) + if(getNeededElement(questionArray, currentQstId).rightAns.replace(/,/g,"").indexOf(event.target.value + " ", 0) != -1) + $(event.target).next().next().css("background-color","#6c0"); + else + $(event.target).next().next().css("background-color","#f66"); + } + } + }); + //popup messages $(".qstDelete").live('mouseover', function(evt){ popupFlag = true; @@ -252,16 +302,54 @@ function init(){ }); }); - $(".qstDelete, .ansDelete").live('mousemove', function(evt){ - popupText.css("top", evt.pageY + 15) - .css("left", evt.pageX - 40) + $(".newAnswer input").live('mouseover', function(evt){ + if(!mode){ + popupFlag = true; + popupText.text("Right answer") + .css("top", evt.pageY + 15) + .css("left", evt.pageX - 40) + .css({ + width:"105px" + }) + .show("fast", function(){ + if(!popupFlag) + popupText.hide(); + }); + } }); - $(".qstDelete, .ansDelete").live('mouseout', function(evt){ - popupFlag = false; - popupText.hide(); + $(".qstDelete, .ansDelete, .newAnswer input").live('mousemove', function(evt){ + if(!mode){ + popupText.css("top", evt.pageY + 15) + .css("left", evt.pageX - 40); + } + }); + + $(".qstDelete, .ansDelete, .newAnswer input").live('mouseout', function(evt){ + if(!mode){ + popupFlag = false; + popupText.hide(); + } }); + //answer the questions + + $("select").live('change', function(evt){ + if(mode){ + //alert(currentQstId + " | " + event.target.value + " | " + getNeededElement(questionArray, currentQstId).rightAns) + if(event.target.value == getNeededElement(questionArray, currentQstId).rightAns) + $(event.target).parent().css("background-color","#6c0"); + else + $(event.target).parent().css("background-color","#f66"); + flagForSelect = false; + } + }); + + $("select").live('mousedown', function(evt){ + if(mode){ + flagForSelect = true; + } + }); //toggle button click trigger toggleButton.trigger("click"); @@ -286,11 +374,11 @@ function init(){ var counter = 1; for(var i in array){ - var qstDiv = $("
"); + var qstDiv = $("
"); var spanOptConn = $("
").appendTo(qstDiv); var qstNumber = $("Question " + counter + "").appendTo(spanOptConn); var qstContent = $("
" + array[i].text + "
").appendTo(qstDiv); - var ansDiv = $("
").appendTo(qstDiv); + var ansDiv = $("
").appendTo(qstDiv); var ansCount = 1; var type = array[i].type; @@ -305,26 +393,26 @@ function init(){ switch(type){ case "1": newAnswer = $("
"); - var ansInput = $("").appendTo(newAnswer); + var ansInput = $("").appendTo(newAnswer); var ansSpan = $("" + ansCount + ".").appendTo(newAnswer); var ansContent = $("
" + array[i].answers[j].text + "
").appendTo(newAnswer); newAnswer.appendTo(ansDiv); break; case "2": newAnswer = $("
"); - ansInput = $("").appendTo(newAnswer); + ansInput = $("").appendTo(newAnswer); ansSpan = $("" + ansCount + ".").appendTo(newAnswer); ansContent = $("
" + array[i].answers[j].text + "
").appendTo(newAnswer); newAnswer.appendTo(ansDiv); break; case "3": - ansInput = $("").appendTo(selInput); + ansInput = $("").appendTo(selInput); break; } ansCount++; } qstDiv.appendTo("body"); - counter ++; + counter++; } } else { counter = 1; @@ -413,13 +501,32 @@ function addQstBlock(id, text, type, style){ } //add answers -function addAnsBlock(id, currId, text){ +function addAnsBlock(id, currId, text, stage, rightAns, type){ var newAnswer = $("
"); + var value; + var check = ""; + if(stage){ + value = getNeededElement(getNeededElement(questionArray, currId).answers,id).value; + if(type != "2"){ + if(rightAns == value) + check = "checked='true'"; + } + else { + rightAns = rightAns.replace(/,/g,""); + if(rightAns.indexOf(value + " ", 0) != -1) + check = "checked='true'"; + } + } + else { + value = ($("#" + currId + " .newAnswer input:checkbox").last().val()) ? parseInt($("#" + currId + " .newAnswer input:checkbox").last().val()) + 1 : 1; + getNeededElement(getNeededElement(questionArray, currId).answers,id).value = value; + } var count = $("#" + currId + " .newAnswer").size() + 1; + var input = $("").appendTo(newAnswer); var ansSpan = $("A" + count + "").appendTo(newAnswer); var ansContent = $("
" + text + "
").appendTo(newAnswer); var ansDelete = $("