Merge remote-tracking branch 'origin/develop' into claudio-dev

resources/library/interactivities/Ass images.wgt/css/basic.css

@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -32,14 +32,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -288,58 +280,42 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
-    font-size: 24px;   
+    font-size: 24px;    
-    color: #8c5730;
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-edit.png);
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
-    background-repeat: no-repeat;
+    color: white;
-    background-position: top 0;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-edit.png);
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-toolbar-reload.png);
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
-}
 
 .btl_pad{
     background-image: url(../img/pad-top-left.png) !important;
@@ -373,43 +349,44 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
+/*new update 26 09 2012*/
+
 .pad_color{
-    color: white !important;
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
 .pad_reload{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
 }
 
 .pad_edit{
-    background-image: url(../img/slate-display.png) !important;
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.pad_select{
+.pad_help{
-    background-color: black !important;
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
 }
 
-.none_select{
+.help_wood{
-    background-color: #333 !important;
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
+.help_pad{
-    background-image: url(../img/slate-help-white.png) !important;
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
+    padding-left: 35px;
-    background-image: url(../img/slate-help.png);
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -419,4 +396,35 @@ body{
 
 .open{
 
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }

resources/library/interactivities/Ass images.wgt/index.html

@@ -55,11 +55,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -69,7 +64,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Ass images.wgt/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     short_desc: "Select the number \"three\".", 
     add: "Add new block",
@@ -10,7 +10,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //main function
@@ -22,9 +23,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer","")){
@@ -46,11 +49,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -71,7 +76,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -82,7 +87,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display", "none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -186,8 +191,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display", "block");
-                
                 $(".cont").each(function(){
                     var container = $(this);
                     container.find(".imgs_answers").find(".img_block").each(function(){
@@ -196,8 +200,6 @@ function start(){
                     container.find(".imgs_answers").remove();
                     $("<div class='close_cont'>").appendTo(container);
                     container.find(".text_cont").attr("contenteditable","true");
-                    //container.find(".imgs_cont").sortable("destroy");
-                    //container.find(".imgs_cont").css("background-color", "white");
                     
                     var add_img = $("<div class='add_img'>");
                     container.find(".img_block").each(function(){
@@ -279,7 +281,7 @@ function exportData(){
     if($("#wgt_edit").hasClass("selected")){
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.text = $(this).find(".text_cont").text();
             cont_obj.mode = "edit";
             cont_obj.imgs = [];
@@ -296,7 +298,7 @@ function exportData(){
     } else {
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.text = $(this).find(".text_cont").text();
             cont_obj.mode = "display";
             cont_obj.imgs = [];
@@ -325,7 +327,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -340,11 +342,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         } else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             if(data[i].mode == "edit"){          
                 var tmp_array = [];
@@ -623,7 +625,6 @@ function showExample(){
             }
         }
     });
-//container.appendTo("body")
 }
 
 //changing the style
@@ -641,10 +642,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -658,10 +659,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -675,10 +676,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Ass images.wgt/locales/fr/index.html

@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Ass images.wgt/locales/fr/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier", 
     short_desc: "Sélectionner le numéro «trois».", 
     add: "Nouveau bloc",
@@ -11,28 +11,28 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content:"<p><h2>Associer des images</h2></p>"+
-"<p><h3>Faire correspondre une image à la consigne indiquée.</h3></p>"+
+    "<p><h3>Faire correspondre une image à la consigne indiquée.</h3></p>"+
 
-"<p>L’activité s’effectue par un glisser-déposer de l’image dans la zone délimitée. Si le résultat est incorrect, la zone se colore en rouge. Si le résultat est correct, la zone se colore en vert.</p>"+
+    "<p>L’activité s’effectue par un glisser-déposer de l’image dans la zone délimitée. Si le résultat est incorrect, la zone se colore en rouge. Si le résultat est correct, la zone se colore en vert.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun), </li>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun), </li>"+
-"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
+    "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
+    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis</p>"+
-"<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir la consigne ici ...”, </li>"+
+    "<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir la consigne ici ...”, </li>"+
-"<li>ajoutez des zones image en cliquant sur le gros signe + en dessous, </li>"+
+    "<li>ajoutez des zones image en cliquant sur le gros signe + en dessous, </li>"+
-"<li>insérez des images dans ces zones par glisser-déposer des images à partir de votre bibliothèque, </li>"+
+    "<li>insérez des images dans ces zones par glisser-déposer des images à partir de votre bibliothèque, </li>"+
-"<li>définissez l’image correcte de l’interactivité en cliquant sur le bouton valider “v” situé en bas à droite de l’image concernée.</li></ul>"+
+    "<li>définissez l’image correcte de l’interactivité en cliquant sur le bouton valider “v” situé en bas à droite de l’image concernée.</li></ul>"+
-"<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+
+    "<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+
-"<p>Pour changer d’image, cliquez sur l’icône située au milieu à droite de l’image.</p>"+ 
+    "<p>Pour changer d’image, cliquez sur l’icône située au milieu à droite de l’image.</p>"+ 
 
-"<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
-
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
 
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 };
 
 //main function
@@ -44,9 +44,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer","")){
@@ -68,11 +70,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -93,7 +97,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
         
@@ -103,7 +107,7 @@ function start(){
                 sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display", "none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -206,7 +210,7 @@ function start(){
                 sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display", "block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -216,8 +220,6 @@ function start(){
                     container.find(".imgs_answers").remove();
                     $("<div class='close_cont'>").appendTo(container);
                     container.find(".text_cont").attr("contenteditable","true");
-                    //container.find(".imgs_cont").sortable("destroy");
-                    //container.find(".imgs_cont").css("background-color", "white");
                     
                     var add_img = $("<div class='add_img'>");
                     container.find(".img_block").each(function(){
@@ -299,7 +301,7 @@ function exportData(){
     if($("#wgt_edit").hasClass("selected")){
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.text = $(this).find(".text_cont").text();
             cont_obj.mode = "edit";
             cont_obj.imgs = [];
@@ -316,7 +318,7 @@ function exportData(){
     } else {
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.text = $(this).find(".text_cont").text();
             cont_obj.mode = "display";
             cont_obj.imgs = [];
@@ -345,7 +347,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -360,11 +362,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         } else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             if(data[i].mode == "edit"){          
                 var tmp_array = [];
@@ -638,7 +640,6 @@ function showExample(){
             }
         }
     });
-//container.appendTo("body")
 }
 
 //changing the style
@@ -656,10 +657,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -673,10 +674,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -690,10 +691,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Ass images.wgt/locales/ru/index.html

@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Ass images.wgt/locales/ru/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     short_desc: "Выберите число \"три\".", 
     add: "Новый блок",
@@ -10,7 +10,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 
@@ -23,9 +24,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer","")){
@@ -47,11 +50,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -72,7 +77,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
         
@@ -82,7 +87,7 @@ function start(){
                 sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display", "none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -185,7 +190,7 @@ function start(){
                 sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display", "block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -195,8 +200,6 @@ function start(){
                     container.find(".imgs_answers").remove();
                     $("<div class='close_cont'>").appendTo(container);
                     container.find(".text_cont").attr("contenteditable","true");
-                    //container.find(".imgs_cont").sortable("destroy");
-                    //container.find(".imgs_cont").css("background-color", "white");
                     
                     var add_img = $("<div class='add_img'>");
                     container.find(".img_block").each(function(){
@@ -278,7 +281,7 @@ function exportData(){
     if($("#wgt_edit").hasClass("selected")){
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.text = $(this).find(".text_cont").text();
             cont_obj.mode = "edit";
             cont_obj.imgs = [];
@@ -295,7 +298,7 @@ function exportData(){
     } else {
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.text = $(this).find(".text_cont").text();
             cont_obj.mode = "display";
             cont_obj.imgs = [];
@@ -324,7 +327,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -339,11 +342,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         } else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             if(data[i].mode == "edit"){          
                 var tmp_array = [];
@@ -617,7 +620,6 @@ function showExample(){
             }
         }
     });
-//container.appendTo("body")
 }
 
 //changing the style
@@ -635,10 +637,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -652,10 +654,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -669,10 +671,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Ass sons.wgt/css/basic.css

@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -28,14 +28,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -323,41 +315,40 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
-    font-size: 24px;   
+    font-size: 24px;    
-    color: #8c5730;
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-edit.png);
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
-    background-repeat: no-repeat;
+    color: white;
-    background-position: top 0;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-edit.png);
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-toolbar-reload.png);
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 .style_select{    
@@ -408,51 +399,50 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
+.without_radius{
-    color: white !important;
+    border-radius: 0 !important;
 }
 
-.pad_reload{
+.without_back{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+    background: none !important;
 }
 
-.pad_edit{
+.pad_color{
-    background-image: url(../img/slate-display.png) !important;
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
+.pad_reload{
-    background-color: black !important;
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
 }
 
-.without_radius{
+.pad_edit{
-    border-radius: 0 !important;
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
+.pad_help{
-    background: none !important;
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
+.help_wood{
-    background-color: #333 !important;
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
+.help_pad{
-    background-image: url(../img/slate-help-white.png) !important;
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
+    padding-left: 35px;
-    background-image: url(../img/slate-help.png);
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -461,5 +451,36 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }

resources/library/interactivities/Ass sons.wgt/index.html

@@ -51,12 +51,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
+                    <div id="wgt_edit"></div>                    
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -66,7 +61,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Ass sons.wgt/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     short_desc: "How many signals do you hear?", 
     add: "Add new block",
@@ -10,7 +10,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //main function
@@ -22,9 +23,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer_sound","")){
@@ -35,7 +38,7 @@ function start(){
             showExample();
         if(sankore.preference("as_snd_style","")){
             changeStyle(sankore.preference("as_snd_style",""));
-            $(".style_select").val(sankore.preference("as_snd_style",""));
+            $("#style_select").val(sankore.preference("as_snd_style",""));
         } else
             changeStyle("3")
     } 
@@ -46,18 +49,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("as_snd_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("as_snd_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -78,7 +83,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -89,7 +94,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display", "none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -195,7 +200,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display", "block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -777,10 +782,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -794,10 +799,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -811,10 +816,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Ass sons.wgt/locales/fr/index.html

@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Ass sons.wgt/locales/fr/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier", 
     short_desc: "Combien de signaux entendez-vous?", 
     add: "Nouveau bloc",
@@ -11,28 +11,29 @@ var sankoreLang = {
     none: "Aucun",
     help: "Aide",
     help_content: "<p><h2>Associer aux sons</h2></p>"+
-"<p><h3>Faire correspondre une image à un son.</h3></p>"+
+    "<p><h3>Faire correspondre une image à un son.</h3></p>"+
 
-"<p>L’activité s’effectue par un glisser-déposer de l’image dans la zone délimitée. Si le résultat est incorrect, la zone se colore en rouge. Si le résultat est correct, la zone se colore en vert.</p>"+
+    "<p>L’activité s’effectue par un glisser-déposer de l’image dans la zone délimitée. Si le résultat est incorrect, la zone se colore en rouge. Si le résultat est correct, la zone se colore en vert.</p>"+
 
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet : </p>"+
+    "<p>Le bouton “Modifier” vous permet : </p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun),</li>"+
-"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
+    "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis </p>"+
+    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, puis </p>"+
-"<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre description ici ...”,"+
+    "<ul><li>insérez une consigne en cliquant sur le champ de texte “Saisir votre description ici ...”,"+
-"<li>insérez un son dans la zone à gauche de la consigne par glisser-déposer d’un son à partir de votre bibliothèque,</li>"+
+    "<li>insérez un son dans la zone à gauche de la consigne par glisser-déposer d’un son à partir de votre bibliothèque,</li>"+
-"<li>ajoutez des zones image en cliquant sur le gros signe + en dessous,</li>"+
+    "<li>ajoutez des zones image en cliquant sur le gros signe + en dessous,</li>"+
-"<li>insérez des images par glisser-déposer des images à partir de votre bibliothèque,</li>"+
+    "<li>insérez des images par glisser-déposer des images à partir de votre bibliothèque,</li>"+
-"<li>définissez l’image correcte de l’interactivité en cliquant sur le bouton valider “v” situé en bas à droite de l’image concernée.</li></ul>"+
+    "<li>définissez l’image correcte de l’interactivité en cliquant sur le bouton valider “v” situé en bas à droite de l’image concernée.</li></ul>"+
-"<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+ 
+    "<p>Pour supprimer une zone image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+ 
-"<p>Pour remplacer un son, glissez-déposez simplement un nouveau son.</p>"+
+    "<p>Pour remplacer un son, glissez-déposez simplement un nouveau son.</p>"+
 
-"<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 
 };
 
@@ -45,9 +46,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer_sound","")){
@@ -58,7 +61,7 @@ function start(){
             showExample();
         if(sankore.preference("as_snd_style","")){
             changeStyle(sankore.preference("as_snd_style",""));
-            $(".style_select").val(sankore.preference("as_snd_style",""));
+            $("#style_select").val(sankore.preference("as_snd_style",""));
         } else
             changeStyle("3")
     } 
@@ -69,18 +72,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("as_snd_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("as_snd_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -101,7 +106,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -112,7 +117,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display", "none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -218,7 +223,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -785,10 +790,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -802,10 +807,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -819,10 +824,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Ass sons.wgt/locales/ru/index.html

@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Ass sons.wgt/locales/ru/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     short_desc: "Сколько сигналов вы слышите?", 
     add: "Новый блок",
@@ -10,7 +10,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 //main function
@@ -22,9 +23,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("associer_sound","")){
@@ -35,7 +38,7 @@ function start(){
             showExample();
         if(sankore.preference("as_snd_style","")){
             changeStyle(sankore.preference("as_snd_style",""));
-            $(".style_select").val(sankore.preference("as_snd_style",""));
+            $("#style_select").val(sankore.preference("as_snd_style",""));
         } else
             changeStyle("3")
     } 
@@ -46,18 +49,20 @@ function start(){
     if (window.widget) {
         window.widget.onleave = function(){
             exportData();
-            sankore.setPreference("as_snd_style", $(".style_select").find("option:selected").val());
+            sankore.setPreference("as_snd_style", $("#style_select").find("option:selected").val());
         }
     }
     
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -78,7 +83,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -89,7 +94,7 @@ function start(){
                     sankore.enableDropOnWidget(false);
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display", "none");
                 $(".add_block").remove();
                 $(".cont").each(function(){
                     var container = $(this);
@@ -195,7 +200,7 @@ function start(){
                     sankore.enableDropOnWidget(true);
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 
                 $(".cont").each(function(){
                     var container = $(this);
@@ -689,7 +694,7 @@ function addContainer(){
     audio_block.attr("ondragenter", "return false;")
     .attr("ondragleave", "$(this).removeClass('audio_gray'); return false;")
     .attr("ondragover", "$(this).addClass('audio_gray'); return false;")
-    .attr("ondrop", "$(this).removeClass('audio_gray'); return onDropAudio(this,event);");
+    .attr("ondrop", "$(this).removeClass('audio_gray'); return onDropAudio(this,event);");  
     $("<div class='play'>").appendTo(audio_block);
     $("<div class='replay'>").appendTo(audio_block);
     var source = $("<source/>").attr("src", "");
@@ -762,10 +767,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -779,10 +784,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -796,10 +801,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -850,7 +855,7 @@ function onDropAudio(obj, event) {
         textData = stringToXML(textData);
         var tmp = textData.getElementsByTagName("path")[0].firstChild.textContent;
         var tmp_type = textData.getElementsByTagName("type")[0].firstChild.textContent;
-        if(tmp_type.substr(0, 5) == "audio"){       
+        if(tmp_type.substr(0, 5) == "audio"){
             var audio_block = $(obj);
             $(obj).find("audio").remove();
             audio_block.find(":first-child").removeClass("stop").addClass("play");

resources/library/interactivities/Cat images.wgt/css/basic.css

@@ -3,7 +3,7 @@ html, body{
     height: 100%;
     margin: 0;
     padding: 0;
-    border-radius: 50px;
+    border-radius: 35px;
     overflow: hidden;
 }
 
@@ -28,14 +28,6 @@ body{
     margin: 5px 10px;
 }
 
-.green_point{
-    background-image: url(../img/green_point.png);
-}
-
-.red_point{
-    background-image: url(../img/red_point.png);
-}
-
 #display_text, #edit_text{
     height: 19px;
     padding: 3px 0 0 0;
@@ -264,57 +256,40 @@ body{
     margin: 10px 10px 0 10px;
     padding: 0;
     float: left;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
     font-size: 24px;
-    color: #8c5730;
+    color: #7F613F;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload, #wgt_edit, #wgt_display, #wgt_help{
     cursor: pointer;
-    height: 44px;
     margin: 10px 10px 0 0;
     float: right;
-    /*font-family: "Lobster13Regular";*/
+    font-family: Arial,Helvetica,sans-serif;
-    font-size: 24px;   
+    font-size: 24px;    
-    color: #8c5730;
+    line-height: 32px;
 }
 
 #wgt_display{
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-edit.png);
+    background: url(../img/toolbar-edit.png) left -32px no-repeat;
-    background-repeat: no-repeat;
+    color: white;
-    background-position: top 0;
     display: none;
 }
 
 #wgt_edit{    
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-edit.png);
+    background: url(../img/slate-toolbar-edit.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #wgt_reload{
-    padding-left: 40px;
+    padding-left: 35px;
-    background-image: url(../img/slate-toolbar-reload.png);
+    background: url(../img/slate-toolbar-reload.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
-}
-
-.style_select{    
-    width: 120px;
-    /*font-family: "Lobster13Regular";*/
-    font-size: 24px;
-    float: right;
-    margin: 10px 20px 0 0;
-    border-radius: 10px;
-    background-image: url(../img/ar_down.png);
-    background-color: #d4aa79;
-    color: #8c5730;
-    background-position: 105px 11px;
-    background-repeat: no-repeat;
-    -webkit-appearance: menulist-text;
-    display: none;
 }
 
 .btl_pad{
@@ -349,51 +324,50 @@ body{
     background-image: url(../img/pad-bottom-right.png) !important;
 }
 
-.pad_color{
+.without_radius{
-    color: white !important;
+    border-radius: 0 !important;
 }
 
-.pad_reload{
+.without_back{
-    background-image: url(../img/slate-toolbar-reload-white.png) !important;
+    background: none !important;
 }
 
-.pad_edit{
+.pad_color{
-    background-image: url(../img/slate-display.png) !important;
+    color: #FC9 !important;
+    text-shadow: none !important;
 }
 
-.pad_select{
+.pad_reload{
-    background-color: black !important;
+    background: url(../img/toolbar-reload.png) left top no-repeat !important;
-    color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
 }
 
-.without_radius{
+.pad_edit{
-    border-radius: 0 !important;
+    background: url(../img/toolbar-edit.png) left top no-repeat !important;    
 }
 
-.without_back{
+.pad_help{
-    background: none !important;
+    background: url(../img/toolbar-help.png) left top no-repeat !important;
 }
 
-.none_select{
+.help_wood{
-    background-color: #333 !important;
+    background: url(../img/slate-toolbar-help.png) left -32px no-repeat !important;
     color: white !important;
-    background-image: url(../img/ar_down_white.png) !important;
+    text-shadow: #7F613F 0 -1px 0 !important;
 }
 
-.pad_help{
+.help_pad{
-    background-image: url(../img/slate-help-white.png) !important;
+    background: url(../img/toolbar-help.png) left -32px no-repeat !important;
+    color: white !important;
 }
 
 #wgt_help{
-    padding-left: 32px;
+    padding-left: 35px;
-    background-image: url(../img/slate-help.png);
+    background: url(../img/slate-toolbar-help.png) left top no-repeat;
-    background-repeat: no-repeat;
+    color: #7F613F;
-    background-position: top 0;
+    text-shadow: #FFDCA9 0 1px 0;
 }
 
 #help{
-    width: 100%;
     height: 100%;    
     overflow: auto;
     display: none;
@@ -402,5 +376,36 @@ body{
 }
 
 .open{
-    
+
+}
+
+#parameters{    
+    display: none;
+    padding: 10px 20px;
+    background: url("../img/parameters-bg.png");
+    border-radius: 4px 4px 0 0;
+}
+
+.inline{
+    display: inline-block;
+    font-family: "helvetica neue";
+    font-size: 14px;
+    color: #666;
+}
+
+#parameters label {
+    font-style: italic;
+}
+
+#style_select{   
+    margin-left: 10px;
+}
+
+.display_wood{
+    background: url(../img/slate-toolbar-edit.png) left -32px no-repeat !important;
+    text-shadow: #7F613F 0 -1px 0;
+}
+
+.radius_ft{
+    border-radius: 45px !important;
 }

resources/library/interactivities/Cat images.wgt/index.html

@@ -51,12 +51,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
+                    <div id="wgt_edit"></div>                    
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -66,7 +61,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Cat images.wgt/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Display", 
+    display: "Close", 
     edit: "Edit", 
     first_desc: "Odd numbers", 
     second_desc: "Even numbers", 
@@ -11,7 +11,8 @@ var sankoreLang = {
     pad: "Pad",
     none: "None",
     help: "Help",
-    help_content: "This is an example of help content ..."
+    help_content: "This is an example of help content ...",
+    theme: "Theme"
 };
 
 //main function
@@ -23,9 +24,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("categoriser_images","")){
@@ -47,11 +50,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -72,7 +77,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -81,7 +86,7 @@ function start(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 if(window.sankore)
                     sankore.enableDropOnWidget(false);
                 $(".add_block").remove();
@@ -152,7 +157,7 @@ function start(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 if(window.sankore)
                     sankore.enableDropOnWidget(true);
                 $(".cont").each(function(){
@@ -234,7 +239,7 @@ function exportData(){
     if($("#wgt_edit").hasClass("selected")){
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.mode = "edit";
             cont_obj.conts = [];
             $(this).find(".imgs_cont").each(function(){
@@ -258,7 +263,7 @@ function exportData(){
     } else {
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.mode = "display";
             cont_obj.conts = [];
             $(this).find(".imgs_cont").each(function(){
@@ -292,7 +297,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -307,11 +312,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         } else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             if(data[i].mode == "edit"){          
                 var tmp_array = [];
@@ -625,10 +630,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -642,10 +647,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -659,10 +664,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Cat images.wgt/locales/fr/index.html

@@ -25,12 +25,7 @@
                     <div id="wgt_help"></div> 
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
-                    <div id="wgt_edit"></div>
+                    <div id="wgt_edit"></div>                    
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Cat images.wgt/locales/fr/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Afficher", 
+    display: "Fermer", 
     edit: "Modifier",
     first_desc: "Les nombres impairs", 
     second_desc: "Les nombres pairs", 
@@ -12,25 +12,26 @@ var sankoreLang = {
     none: "aucun",
     help: "Aide",
     help_content: "<p><h2>Catégoriser des images</h2></p>"+
-"<p><h3>Classer des images en fonction de la dénomination de la catégorie.</h3></p>"+
+    "<p><h3>Classer des images en fonction de la dénomination de la catégorie.</h3></p>"+
 
-"<p>L’activité s’effectue par un glisser-déposer de l’image dans la catégorie correspondante. Tant que toutes les images d’une catégorie ne sont pas classées, la zone reste rouge. Une fois que toutes les images sont classées dans la bonne catégorie, la zone se colore en vert.</p>"+
+    "<p>L’activité s’effectue par un glisser-déposer de l’image dans la catégorie correspondante. Tant que toutes les images d’une catégorie ne sont pas classées, la zone reste rouge. Une fois que toutes les images sont classées dans la bonne catégorie, la zone se colore en vert.</p>"+
-"<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
+    "<p>Le bouton “Recharger” réinitialise les exercices.</p>"+
 
-"<p>Le bouton “Modifier” vous permet :</p>"+
+    "<p>Le bouton “Modifier” vous permet :</p>"+
-"<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun) ,</li>"+
+    "<ul><li>de choisir le thème de l’interactivité : tablette, ardoise ou aucun (par défaut aucun) ,</li>"+
-"<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
+    "<li>de modifier un exercice ou d’en créer de nouveaux dans la même activité.</li></ul>"+
 
-"<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, une zone bleue apparaît, c’est une catégorie, puis</p>"+
+    "<p>En mode édition, pour créer un nouvel exercice, cliquez sur “Nouveau bloc” en bas, une zone bleue apparaît, c’est une catégorie, puis</p>"+
-"<ul><li>insérez le nom de la catégorie (par exemple “fruits”, “légumes”, “mammifères”...) en cliquant dans le champ de texte “Saisir le nom de la catégorie ici …”,</li>"+
+    "<ul><li>insérez le nom de la catégorie (par exemple “fruits”, “légumes”, “mammifères”...) en cliquant dans le champ de texte “Saisir le nom de la catégorie ici …”,</li>"+
-"<li>insérez des images dans la catégorie par glisser-déposer des images à partir de votre bibliothèque,</li>"+
+    "<li>insérez des images dans la catégorie par glisser-déposer des images à partir de votre bibliothèque,</li>"+
-"<li>ajoutez ensuite une catégorie (ou plusieurs)  en cliquant sur le signe “+” situé à droite de la catégorie, complétez par son nom et ajoutez des images.</li></ul>"+
+    "<li>ajoutez ensuite une catégorie (ou plusieurs)  en cliquant sur le signe “+” situé à droite de la catégorie, complétez par son nom et ajoutez des images.</li></ul>"+
-"<p>Pour supprimer une image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+ 
+    "<p>Pour supprimer une image, cliquez sur la croix située dans le coin supérieur droit de l’image.</p>"+ 
-"<p>Pour supprimer une catégorie, cliquez sur le signe “-” situé à droite de celle-ci.</p>"+
+    "<p>Pour supprimer une catégorie, cliquez sur le signe “-” situé à droite de celle-ci.</p>"+
 
-"<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
+    "<p>Pour supprimer un exercice, cliquez sur la croix à gauche du numéro de l’exercice.</p>"+
 
-"<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>"
+    "<p>Le bouton “Afficher” vous permet d’utiliser l’activité.</p>",
+    theme: "Thème"
 };
 
 //main function
@@ -42,9 +43,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("categoriser_images","")){
@@ -66,11 +69,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -91,7 +96,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -100,7 +105,7 @@ function start(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 sankore.enableDropOnWidget(false);
                 $(".add_block").remove();
                 $(".cont").each(function(){
@@ -170,7 +175,7 @@ function start(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 sankore.enableDropOnWidget(true);
                 $(".cont").each(function(){
                     var container = $(this);
@@ -251,7 +256,7 @@ function exportData(){
     if($("#wgt_edit").hasClass("selected")){
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.mode = "edit";
             cont_obj.conts = [];
             $(this).find(".imgs_cont").each(function(){
@@ -275,7 +280,7 @@ function exportData(){
     } else {
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.mode = "display";
             cont_obj.conts = [];
             $(this).find(".imgs_cont").each(function(){
@@ -309,7 +314,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -324,11 +329,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         } else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             if(data[i].mode == "edit"){          
                 var tmp_array = [];
@@ -656,10 +661,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -673,10 +678,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -690,10 +695,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }

resources/library/interactivities/Cat images.wgt/locales/ru/index.html

@@ -26,11 +26,6 @@
                     <div id="wgt_reload"></div>                    
                     <div id="wgt_display" class="selected"></div>
                     <div id="wgt_edit"></div>
-                    <select class="style_select">
-                        <option value="1"></option>
-                        <option value="2"></option>
-                        <option value="3"></option>
-                    </select>
                 </td>
                 <td class="b_top_right">&nbsp;</td>
             </tr>
@@ -40,7 +35,17 @@
                 <td>
                     <div id="help"></div>
                     <div id="data">
-                        
+                        <div id="parameters">
+                            <div class="inline">
+                                <label>
+                                    <select id="style_select">
+                                        <option value="1"></option>
+                                        <option value="2"></option>
+                                        <option value="3"></option>
+                                    </select>
+                                </label>
+                            </div>
+                        </div>
                     </div>
                 </td>
                 <td class="b_center_right">&nbsp;</td>

resources/library/interactivities/Cat images.wgt/locales/ru/js/script.js

@@ -1,5 +1,5 @@
 var sankoreLang = {
-    display: "Показать", 
+    display: "Закрыть", 
     edit: "Изменить", 
     first_desc: "Нечетные числа", 
     second_desc: "Четные числа", 
@@ -11,7 +11,8 @@ var sankoreLang = {
     pad: "Планшет",
     none: "Нет",
     help: "Помощь",
-    help_content: "Пример текста помощи ..."
+    help_content: "Пример текста помощи ...",
+    theme: "Тема"
 };
 
 //main function
@@ -23,9 +24,11 @@ function start(){
     $("#wgt_reload").text(sankoreLang.reload);
     $("#wgt_help").text(sankoreLang.help);
     $("#help").html(sankoreLang.help_content);
-    $(".style_select option[value='1']").text(sankoreLang.slate);
+    $("#style_select option[value='1']").text(sankoreLang.slate);
-    $(".style_select option[value='2']").text(sankoreLang.pad);
+    $("#style_select option[value='2']").text(sankoreLang.pad);
-    $(".style_select option[value='3']").text(sankoreLang.none);
+    $("#style_select option[value='3']").text(sankoreLang.none);
+    var tmpl = $("div.inline label").html();
+    $("div.inline label").html(sankoreLang.theme + tmpl)
     
     if(window.sankore){
         if(sankore.preference("categoriser_images","")){
@@ -47,11 +50,13 @@ function start(){
     $("#wgt_help").click(function(){
         var tmp = $(this);
         if($(this).hasClass("open")){
+            $(this).removeClass("help_pad").removeClass("help_wood")
             $("#help").slideUp("100", function(){
                 tmp.removeClass("open");
                 $("#data").show();
             });
-        } else {            
+        } else {
+            ($("#style_select").val() == 1)?$(this).removeClass("help_pad").addClass("help_wood"):$(this).removeClass("help_wood").addClass("help_pad");
             $("#data").hide();
             $("#help").slideDown("100", function(){
                 tmp.addClass("open");
@@ -72,7 +77,7 @@ function start(){
         exportData();
     });
     
-    $(".style_select").change(function (event){
+    $("#style_select").change(function (event){
         changeStyle($(this).find("option:selected").val());
     })
     
@@ -81,7 +86,7 @@ function start(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_edit").removeClass("selected");
-                $(".style_select").css("display","none");
+                $("#parameters").css("display","none");
                 sankore.enableDropOnWidget(false);
                 $(".add_block").remove();
                 $(".cont").each(function(){
@@ -151,7 +156,7 @@ function start(){
             if(!$(this).hasClass("selected")){
                 $(this).addClass("selected");
                 $("#wgt_display").removeClass("selected");
-                $(".style_select").css("display","block");
+                $("#parameters").css("display","block");
                 sankore.enableDropOnWidget(true);
                 $(".cont").each(function(){
                     var container = $(this);
@@ -232,7 +237,7 @@ function exportData(){
     if($("#wgt_edit").hasClass("selected")){
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.mode = "edit";
             cont_obj.conts = [];
             $(this).find(".imgs_cont").each(function(){
@@ -244,8 +249,7 @@ function exportData(){
                 $(this).find(".img_block").each(function(){
                     var img_obj = new Object();
                     img_obj.value = $(this).find("input").val();
-                    img_obj.link = $(this).find("img").attr("src").replace("../../","");
+                    img_obj.link = $(this).find("img").attr("src").replace("../../","");                    
-                    ;
                     img_obj.ht = $(this).find("img").height();
                     img_obj.wd = $(this).find("img").width();
                     img_cont.imgs.push(img_obj);
@@ -257,7 +261,7 @@ function exportData(){
     } else {
         $(".cont").each(function(){
             var cont_obj = new Object();
-            cont_obj.style = $(".style_select").find("option:selected").val();
+            cont_obj.style = $("#style_select").find("option:selected").val();
             cont_obj.mode = "display";
             cont_obj.conts = [];
             $(this).find(".imgs_cont").each(function(){
@@ -269,8 +273,7 @@ function exportData(){
                 $(this).find(".img_block").each(function(){
                     var img_obj = new Object();
                     img_obj.value = $(this).find("input").val();
-                    img_obj.link = $(this).find("img").attr("src").replace("../../","");
+                    img_obj.link = $(this).find("img").attr("src").replace("../../","");                    
-                    ;
                     img_obj.ht = $(this).find("img").height();
                     img_obj.wd = $(this).find("img").width();
                     img_cont.imgs.push(img_obj);
@@ -281,8 +284,7 @@ function exportData(){
             $(this).find(".all_imgs .img_block").each(function(){
                 var img = new Object();
                 img.value = $(this).find("input").val();
-                img.link = $(this).find("img").attr("src").replace("../../","");
+                img.link = $(this).find("img").attr("src").replace("../../","");                
-                ;
                 img.ht = $(this).find("img").height();
                 img.wd = $(this).find("img").width();
                 cont_obj.all_imgs.push(img);
@@ -293,7 +295,7 @@ function exportData(){
     
     if($(".cont").size() == 0){
         var cont_obj = new Object();
-        cont_obj.style = $(".style_select").find("option:selected").val();
+        cont_obj.style = $("#style_select").find("option:selected").val();
         cont_obj.tmp = "clear";
         array_to_export.push(cont_obj);
     }
@@ -308,11 +310,11 @@ function importData(data){
     for(var i in data){
         if(data[i].tmp){
             changeStyle(data[i].style);
-            $(".style_select").val(data[i].style);
+            $("#style_select").val(data[i].style);
         } else {
             if(i == 0){
                 changeStyle(data[i].style);
-                $(".style_select").val(data[i].style);
+                $("#style_select").val(data[i].style);
             }
             if(data[i].mode == "edit"){          
                 var tmp_array = [];
@@ -640,10 +642,10 @@ function changeStyle(val){
             $("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
             $("#wgt_help").removeClass("pad_color").removeClass("pad_help");
             $("#wgt_edit").removeClass("pad_color").removeClass("pad_edit");
-            $("#wgt_display").removeClass("pad_color").removeClass("pad_edit");
             $("#wgt_name").removeClass("pad_color");
-            $(".style_select").removeClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").addClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").addClass("radius_ft");
             break;
         case "2":
             $(".b_top_left").addClass("btl_pad").removeClass("without_back");
@@ -657,10 +659,10 @@ function changeStyle(val){
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("pad_select").removeClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").removeClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").removeClass("without_radius").removeClass("radius_ft");
             break;
         case "3":
             $(".b_top_left").addClass("without_back").removeClass("btl_pad");
@@ -674,10 +676,10 @@ function changeStyle(val){
             $("#wgt_help").addClass("pad_color").addClass("pad_help");
             $("#wgt_reload").addClass("pad_color").addClass("pad_reload");
             $("#wgt_edit").addClass("pad_color").addClass("pad_edit");
-            $("#wgt_display").addClass("pad_color").addClass("pad_edit");
             $("#wgt_name").addClass("pad_color");
-            $(".style_select").addClass("none_select").val(val);
+            $("#wgt_display").removeClass("display_wood");
-            $("body, html").addClass("without_radius");
+            $("#style_select").val(val);
+            $("body, html").addClass("without_radius").removeClass("radius_ft");
             break;
     }
 }
@@ -689,7 +691,7 @@ function returnId(){
 }
 
 //a func for checking when smth will drop
-function checkOnDrop(dest){ 
+function checkOnDrop(dest){
     var tmp_count = dest.find("input[name='count']").val();
     var tmp_mask = dest.find("input[name='mask']").val();
     if(dest.find(".img_block").size() == tmp_count){