diff --git a/resources/library/interactivities/Choisir.wgt/css/basic.css b/resources/library/interactivities/Choisir.wgt/css/basic.css index 3aca2a39..22052586 100644 --- a/resources/library/interactivities/Choisir.wgt/css/basic.css +++ b/resources/library/interactivities/Choisir.wgt/css/basic.css @@ -1,3 +1,16 @@ +/* + Document : basic + Created on : Sep 5, 2011, 12:01:33 PM + Author : GEG.BY + Description: + Purpose of the stylesheet follows. +*/ + +/* + TODO customize this sample style + Syntax recommendation http://www.w3.org/TR/REC-CSS2/ +*/ + html, body{ width: 100%; height: 100%; @@ -10,174 +23,364 @@ body{ background-image: url(../images/bg.png); } -.toggleButton, .addButton{ +.toggleButton{ width: 20px; height: 28px; border: none; background-image: url(../images/greySquare.png); font-weight: bold; font-family: Verdana; - color: yellow; + color: #00C6FF;; cursor: pointer; - -webkit-border-top-left-radius: 5px; - -webkit-border-bottom-left-radius: 5px; - border-top-left-radius: 5px; - border-bottom-left-radius: 5px; } -.buttonDiv, .addButtonDiv{ +.buttonDiv{ position: fixed; float: right; z-index: 1; } -.addButtonDiv{ - display: none; +.addQstDiv{ + float: left; + padding: 5px; + margin: 2px; + font-family: Verdana,Arial,Helvetica,sans-serif; + font-size: large; } -.leftDiv{ - width: 50%; - height: 100%; +.addQstButton{ + margin: 0; + background: none; + color: white; + cursor: pointer; + border: 3px solid #ccc; + border-radius: 20px; +} + +#addQsqSpan1{ + font-size: 30px; + margin-right: 10px !important; +} + +.qstDiv{ + width: 90%; + margin: 2px auto; + padding: 5px; float: left; - background-color: black; - -webkit-border-top-left-radius: 7px; - -webkit-border-bottom-left-radius: 7px; - border-top-left-radius: 7px; - border-bottom-left-radius: 7px; + font-family: Verdana,Arial,Helvetica,sans-serif; } -.rightDiv{ - width: 50%; - height: 100%; - float: right; - background-color: yellow; - -webkit-border-top-right-radius: 7px; - -webkit-border-bottom-right-radius: 7px; - border-top-right-radius: 7px; - border-bottom-right-radius: 7px; +.qstDivDisplay{ + width: 90%; + margin: 5px 5%; + padding: 5px; + float: left; + font-family: Verdana,Arial,Helvetica,sans-serif; + border: 2px solid #cccccc; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + border-radius: 5px; + -moz-box-shadow: #dadada -1px 0 4px; + -webkit-box-shadow: #dadada -1px 0 4px; + box-shadow: #dadada -1px 0 4px; } -.shadowDiv{ +.spanOptConn{ + float: left; width: 100%; - display: none; - opacity: 0.7; - background-color: black; - -webkit-border-radius: 3px; - -webkit-border-radius: 3px; - border-radius: 3px; - border-radius: 3px; - z-index: 100; } -.popupBack{ - width: 360px; - height: 138px; - position: absolute; - background-image: url(../images/popupBack.png); - background-repeat: repeat; - -webkit-border-radius: 10px; - -webkit-border-radius: 10px; - border-radius: 10px; +.qstNumber{ + float: left; + font-size: 30px; + margin-left: 10px !important; + color: white; +} + +.qstOptions{ + float: right; +} + +.changeOptions{ + border: none; + height: 25px; + background-color: white; + width: auto; + color: black; + font-weight: bold; + cursor: pointer; border-radius: 10px; - display: none; - z-index: 500; } -.popupContainers{ - float: left; - width: 98%; - height: 36px; - padding: 5px 3px 5px 0; - overflow: hidden; +.applyChanges{ + border: none; + height: 25px; + background-color: white; + width: auto; + color: black; + font-weight: bold; + cursor: pointer; + border-radius: 10px; } -.popupLabels{ - color: yellow; +.qstDelete{ + border: none; + background-image: url(../images/bigBlackClose.png); + background-color: white; + background-repeat: no-repeat; + background-position: 45% 50%; + width: 25px; + height: 25px; + line-height: 25px; + cursor: pointer; + border-radius: 15px; margin: 0 5px; } -.expresionInput{ - float: right; - width: 70%; - border: none; +.qstContent{ + float: left; + padding: 3px; + margin-left: 10px; + margin-bottom: 10px; + width: 95%; font-family: Verdana,Arial,Helvetica,sans-serif; - background-color: #ffc; - -webkit-border-radius: 5px; + font-size: small; + border: 3px solid #ccc; -webkit-border-radius: 5px; border-radius: 5px; - border-radius: 5px; + -moz-box-shadow: #dadada -1px 0 4px; + -webkit-box-shadow: #dadada -1px 0 4px; + box-shadow: #dadada -1px 0 4px; + color: white; } -.popupButtons{ - float: right; - width: 74px; - height: 28px; - margin: 4px 5px; +.qstContentDisplay{ + float: left; + padding: 5px; + margin: 10px; + width: 100%; + font-family: Verdana,Arial,Helvetica,sans-serif; + color: white; +} + +.ansDiv{ + float: left; + margin-left: 100px; + width: 80%; +} + +.ansAdd{ border: none; - background-image: url(../images/greySquare2.png); - font-family: Verdana; - color: yellow; + height: 25px; + background-color: white; + font-weight: bold; + width: auto; + color: black; cursor: pointer; - -webkit-border-radius: 5px; + border-radius: 10px; +} + +.newAnswer{ + float: left; + width: 100%; + margin: 3px; -webkit-border-radius: 5px; border-radius: 5px; +} + +.ansSpan{ + border: none; + color: white; + font-size: 14px; + float: left; + margin: 0 3px; + width: 20px; +} + +.ansSpanDisplay{ + color: white; + font-size: 14px; + float: left; + font-weight: bold; +} + +.ansContent{ + padding: 1px 3px 3px 3px; + margin-left: 5px; + font-family: Verdana,Arial,Helvetica,sans-serif; + font-size: small; + width: 80%; + float: left; + border: 3px solid #ccc; + -webkit-border-radius: 5px; border-radius: 5px; + -moz-box-shadow: #dadada -1px 0 4px; + -webkit-box-shadow: #dadada -1px 0 4px; + box-shadow: #dadada -1px 0 4px; + color: white; } -.readyTask{ - margin: 2px; - padding: 2px; - width: 100%; - height: 100%; - overflow: hidden; - z-index: 100; +.ansContentDisplay{ + padding: 1px 3px 3px 3px; + margin-left: 5px; + font-family: Verdana,Arial,Helvetica,sans-serif; + font-size: small; + font-weight: bold; + width: 80%; + float: left; + -webkit-border-radius: 5px; + border-radius: 5px; + color: white; } -.taskContainer{ - width: 96%; +.ansDelete{ + width: 25px; + height: 25px; + float: left; + border: none; + background-image: url(../images/bigBlackClose.png); + background-repeat: no-repeat; + background-position: 45% 50%; + background-color: white; + cursor: pointer; + margin: 0 5px; + border-radius: 15px; +} + +.qstOptChoice{ + width: 80%; + margin: 10px 10%; + float: left; + background-color: #F3F3F2; + border-top-width: 1px; + border-right-width: 1px; + border-bottom-width: 1px; + border-left-width: 1px; + border-top-style: solid; + border-right-style: solid; + border-bottom-style: solid; + border-left-style: solid; + border-top-color: #ECECEB; + border-right-color: #ECECEB; + border-bottom-color: #ECECEB; + border-left-color: #ECECEB; + border-top-left-radius: 5px 5px; + border-top-right-radius: 5px 5px; + border-bottom-right-radius: 5px 5px; + border-bottom-left-radius: 5px 5px; + -webkit-box-shadow: #dededd 0 0 2px inset; + padding: 0; +} + +.optDescImg{ padding: 2px; + margin: 5px; + background: url(../images/tool.png) -0px -0px no-repeat; float: left; + margin-left: 20px; + width: 56px; + height: 51px; +} + +.optDescText{ text-align: center; + width: 70%; + color: #666666; + float: left; + font-size: small; font-family: Verdana,Arial,Helvetica,sans-serif; - font-weight: bold; + margin: 3px 5px; + padding: 5px; } -.editContainer{ - position: absolute; - border: 5px solid #c7c7c7; - -webkit-border-radius: 5px; +.type{ + float: left; + margin: 10px; + padding: 5px; -webkit-border-radius: 5px; border-radius: 5px; - border-radius: 5px; + -moz-box-shadow: #dadada -1px 0 4px; + -webkit-box-shadow: #dadada -1px 0 4px; + box-shadow: #dadada -1px 0 4px; +} + +.contentType{ + width: 100%; + padding: 0; + margin: 0; + background-color: white; + border-bottom: 1px solid #DFDFDE; + border-top-left-radius: 5px 5px; + border-top-right-radius: 5px 5px; } -.closeItem{ - width: 30px; +.divType1, .divType2, .divType3 { + width: 122px; + height: 97px; + padding: 0 15px; + margin-left: 30px; +} + +.divType1{ + background: url(../images/1thOption.png)-0px -0px no-repeat; +} + +.divType2{ + background: url(../images/2thOption.png)-0px -0px no-repeat; +} + +.divType3{ + background: url(../images/3thOption.png)-0px -0px no-repeat; +} + +.textType{ + width: 160px; + font-size: small; + font-family: Verdana,Arial,Helvetica,sans-serif; + color: #666; + padding: 3px; + margin-left: 20px; +} + +.radioDiv{ + background-color: #F5F5F5; + border-top: 1px solid white; + width: 100%; + padding: 0; + margin: 0; height: 30px; - position: absolute; - background-image: url(../images/icon-close.png); - right: -15px; - top: -15px; + border-bottom-right-radius: 5px 5px; + border-bottom-left-radius: 5px 5px; } -.rightResize{ - width: 10px; - height: 65%; - cursor: e-resize; - position: absolute; - background: none; - right: -10px; - top: 20%; +.radioType{ + float: right; + margin: 2px; + padding: 3px; } -.bottomResize{ - width: 65%; - height: 10px; - cursor: n-resize; +.popupWordInfo{ position: absolute; - background: none; - bottom: -10px; - left: 20%; + display: none; + width: 100px; + height: 20px; + top: 0; + left: 0; + text-align: center; + border: 1px solid #B9B9B9; + background-color: #eaebeb; + color: black; + -webkit-border-radius: 5px; + border-radius: 5px; + -webkit-box-shadow: #dadada -1px 0 4px; + box-shadow: #dadada -1px 0 4px; + z-index: 100; +} + +#answerText{ + padding: 3px; + -webkit-border-radius: 3px; + border-radius: 3px; } /*new design*/ @@ -254,22 +457,22 @@ body{ #wgt_name{ height: 44px; - width: 300px; + width: 220px; margin: 10px 10px 0 10px; padding: 0; float: left; - /*font-family: "Lobster13Regular";*/ + font-family: "Lobster13Regular"; font-size: 24px; color: #8c5730; } -#wgt_reload, #wgt_edit, #wgt_display,#wgt_add{ +#wgt_reload, #wgt_edit, #wgt_display{ cursor: pointer; - width: 95px; + width: 80px; height: 44px; margin: 10px 10px 0 0; float: right; - /*font-family: "Lobster13Regular";*/ + font-family: "Lobster13Regular"; font-size: 24px; color: #8c5730; } @@ -298,17 +501,9 @@ body{ background-position: top 0; } -#wgt_add{ - padding-left: 40px; - background-image: url(../images/plus.png); - background-repeat: no-repeat; - background-position: top 0; - display: none; -} - .style_select{ width: 120px; - /*font-family: "Lobster13Regular";*/ + font-family: "Lobster13Regular"; font-size: 24px; float: right; margin: 10px 20px 0 0; @@ -366,12 +561,8 @@ body{ background-image: url(../images/slate-display.png) !important; } -.pad_add{ - background-image: url(../images/plus-white.png) !important; -} - .pad_select{ background-color: black !important; color: white !important; background-image: url(../images/ar_down_white.png) !important; -} +} \ No newline at end of file diff --git a/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js b/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js index a534346e..1b638e73 100644 --- a/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js +++ b/resources/library/interactivities/Choisir.wgt/scripts/selQuestionApp.js @@ -75,7 +75,7 @@ function init(){ //import saved data if(window.sankore){ - if(sankore.preference("qstArrayData","")){ + if(sankore.preference("qstArrayData","") && sankore.preference("qstArrayData","") != "[]"){ questionArray = jQuery.parseJSON(sankore.preference("qstArrayData","")); for(var i in questionArray){ addQstBlock(questionArray[i].id, questionArray[i].text, questionArray[i].type,"style='display: none;'"); @@ -114,6 +114,8 @@ function init(){ $("#wgt_edit").css("display", "block"); displayData(true); mode = true; + sankore.setPreference("qstArrayData", JSON.stringify(questionArray)); + sankore.setPreference("choisir_style", $(".style_select").find("option:selected").val()); } } else { if(!$(this).hasClass("selected")){ @@ -129,7 +131,16 @@ function init(){ }); $("#wgt_reload").text(sankoreLang.reload).click(function(){ - window.location.reload(); + //window.location.reload(); + // if(!sankore.preference("qstArrayData","") || sankore.preference("qstArrayData","") == "[]" || sankore.preference("qstArrayData","") == "[null]"){ + // $(".qstDivDisplay").remove(); + // displayData(false); + // } + // else + if($("#wgt_edit").css("display") == "none") + $("#wgt_display").trigger("click"); + else + window.location.reload(); }); $(".style_select option[value='1']").text(sankoreLang.slate); @@ -225,7 +236,13 @@ function init(){ 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]; + if(j == 0) + questionArray[i].answers.shift(); + else + if((j+1) == questionArray[i].answers.length) + questionArray[i].answers.pop(); + else + questionArray[i].answers = questionArray[i].answers.slice(0,j).concat(questionArray[i].answers.slice(j+1)); break; } } @@ -238,7 +255,13 @@ function init(){ $("#" + currentQstId).remove(); for(var i in questionArray) if(questionArray[i].id == currentQstId){ - delete questionArray[i]; + if(i == 0) + questionArray.shift(); + else + if((i+1) == questionArray.length) + questionArray.pop(); + else + questionArray = questionArray.slice(0,i).concat(questionArray.slice(i+1)); break; } refreshQst();