MOS
/
OpenBoard
5
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fixed selectionner widget

Browse Source
preferencesAboutTextFull
unknown 13 years ago
parent 9812871776
commit f8c6aee7a2
12 changed files with 1870 additions and 0 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 420
      resources/library/interactivities/Selectionner.wgt/css/basic.css
  2. BIN
      resources/library/interactivities/Selectionner.wgt/img/add_block.png
  3. BIN
      resources/library/interactivities/Selectionner.wgt/img/circle.png
  4. BIN
      resources/library/interactivities/Selectionner.wgt/img/close_cont.png
  5. BIN
      resources/library/interactivities/Selectionner.wgt/img/green_point.png
  6. BIN
      resources/library/interactivities/Selectionner.wgt/img/play.png
  7. BIN
      resources/library/interactivities/Selectionner.wgt/img/red_point.png
  8. BIN
      resources/library/interactivities/Selectionner.wgt/img/replay.png
  9. BIN
      resources/library/interactivities/Selectionner.wgt/img/stop.png
  10. 492
      resources/library/interactivities/Selectionner.wgt/js/script.js
  11. 480
      resources/library/interactivities/Selectionner.wgt/locales/fr/js/script.js
  12. 478
      resources/library/interactivities/Selectionner.wgt/locales/ru/js/script.js

420
resources/library/interactivities/Selectionner.wgt/css/basic.css
Unescape View File

@ -0,0 +1,420 @@
html, body{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
border-radius: 50px;
}
body{
background-image: url(../img/bg.png);
}
.toggle_mode{
width: 100%;
height: 25px;
border-bottom: 1px solid black;
background-color: #ccc;
position: fixed;
top: 0;
left: 0;
z-index: 2;
}
#display_img, #edit_img{
width: 15px;
height: 15px;
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;
}
.selected{
}
#display:hover, #edit:hover{
background-color: #999;
}
.cont{
width: 100%;
border-bottom: 1px solid black;
margin: 0;
padding: 0;
position: relative;
}
.sub_cont{
width: 100%;
padding: 0;
margin: 20px 0 0 0;
min-height: 60px;
}
.imgs_cont{
width: 100%;
margin: 0;
}
.number_cont{
width: 40px;
height: 33px;
margin-left: 40px;
margin-right: 10px;
background-image: url(../img/circle.png);
background-repeat: no-repeat;
text-align: center;
float: left;
font-size: 130%;
padding-top: 7px;
font-weight: bold;
}
.text_cont{
width: 80%;
min-height: 40px;
float: right;
background-color: #ccc;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
padding-left: 10px;
}
.close_cont{
width: 20px;
height: 20px;
background-image: url(../img/close_cont.png);
cursor: pointer;
position: absolute;
top: -15px;
left: 5px;
}
.add_img{
width: 120px;
height: 120px;
margin: 10px 20px;
background-image: url(../img/add_text.png);
background-position: center;
background-repeat: no-repeat;
cursor: pointer;
float: left;
display: inline-block;
}
.img_block{
display: inline-block;
}
.img_block, .text_block{
width: 120px;
height: 120px;
margin: 10px 20px;
cursor: pointer;
float: left;
position: relative;
border: 1px solid #ccc;
-moz-box-shadow: #ccc -1px 0 4px;
-webkit-box-shadow: #ccc -1px 0 4px;
box-shadow: #ccc -1px 0 4px;
background-color: white;
}
.text_block{
display: table;
text-align: center;
}
.audio_block{
width: 120px;
height: 30px;
margin: 44px 5px;
position: relative;
float: left;
display: inline-block;
}
.text_subblock{
display: table-cell;
vertical-align: middle;
font-size: 120%;
}
.close_img, .clear_img, .numb_img {
width: 30px;
height: 30px;
background-repeat: no-repeat;
position: absolute;
right: -15px;
cursor: pointer;
}
.close_img{
background-image: url(../img/close_img.png);
top: -15px;
}
.clear_img{
background-image: url(../img/clear_img.png);
top: 15px;
}
.numb_img{
background-image: url(../img/numb_img.png);
left: -15px;
top: -15px;
color: white;
font-weight: bold;
font-size: 130%;
}
.add_block{
margin: 20px 0 0 20px;
width: 110px;
height: 25px;
background-image: url(../img/add_block.png);
background-repeat: no-repeat;
padding-left: 40px;
padding-top: 5px;
cursor: pointer;
background-color: #ccc;
-webkit-border-radius: 15px;
border-radius: 15px;
}
.ch_box{
margin: 0;
padding: 0;
position: absolute;
bottom: 0;
right: 0;
}
.right{
background-color: #9f9;
}
.clear{
clear: both;
}
.over{
background-color: #ccc;
}
.play, .stop{
height: 30px;
width: 70px;
float: left;
cursor: pointer;
}
.play{
background-image: url(../img/play.png);
}
.stop{
background-image: url(../img/stop.png);
}
.replay{
height: 30px;
width: 32px;
margin-left: 10px;
float: left;
background-image: url(../img/replay.png);
background-repeat: no-repeat;
cursor: pointer;
}
/*new design*/
.body_table{
width: 100%;
height: 100%;
border-spacing: 0;
}
/*top*/
.b_top_left{
width: 54px;
background-image: url(../img/top_left.png);
background-repeat: no-repeat;
}
.b_top_right{
width: 54px;
background-image: url(../img/top_right.png);
background-repeat: no-repeat;
}
.b_top_center{
height: 54px;
background-image: url(../img/top.png);
background-repeat: repeat-x;
}
/*bottom*/
.b_bottom_left{
width: 54px;
background-image: url(../img/bottom_left.png);
background-repeat: no-repeat;
}
.b_bottom_right{
width: 54px;
background-image: url(../img/bottom_right.png);
background-repeat: no-repeat;
}
.b_bottom_center{
background-image: url(../img/bottom.png);
background-repeat: repeat-x;
}
/*center*/
.b_center_left{
width: 54px;
background-image: url(../img/left.png);
background-repeat: repeat-y;
}
.b_center_right{
width: 54px;
background-image: url(../img/right.png);
background-repeat: repeat-y;
}
#data{
width: 100%;
height: 100%;
min-height: 250px;
overflow: auto;
}
#wgt_name{
height: 44px;
width: 200px;
margin: 10px 10px 0 10px;
padding: 0;
float: left;
/*font-family: "Lobster13Regular";*/
font-size: 24px;
color: #8c5730;
}
#wgt_reload, #wgt_edit, #wgt_display{
cursor: pointer;
width: 80px;
height: 44px;
margin: 10px 10px 0 0;
float: right;
/*font-family: "Lobster13Regular";*/
font-size: 24px;
color: #8c5730;
}
#wgt_display{
width: 100px;
padding-left: 40px;
background-image: url(../img/slate-edit.png);
background-repeat: no-repeat;
background-position: top 0;
display: none;
}
#wgt_edit{
width: 100px;
padding-left: 40px;
background-image: url(../img/slate-edit.png);
background-repeat: no-repeat;
background-position: top 0;
}
#wgt_reload{
padding-left: 40px;
background-image: url(../img/slate-toolbar-reload.png);
background-repeat: no-repeat;
background-position: top 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;
}
.btc_pad{
background-image: url(../img/pad-top.png) !important;
}
.btr_pad{
background-image: url(../img/pad-top-right.png) !important;
}
.bcl_pad{
background-image: url(../img/pad-left.png) !important;
}
.bcr_pad{
background-image: url(../img/pad-right.png) !important;
}
.bbl_pad{
background-image: url(../img/pad-bottom-left.png) !important;
}
.bbc_pad{
background-image: url(../img/pad-bottom.png) !important;
}
.bbr_pad{
background-image: url(../img/pad-bottom-right.png) !important;
}
.pad_color{
color: white !important;
}
.pad_reload{
background-image: url(../img/slate-toolbar-reload-white.png) !important;
}
.pad_edit{
background-image: url(../img/slate-display.png) !important;
}
.pad_select{
background-color: black !important;
color: white !important;
background-image: url(../img/ar_down_white.png) !important;
}

BIN
resources/library/interactivities/Selectionner.wgt/img/add_block.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.6 KiB

BIN
resources/library/interactivities/Selectionner.wgt/img/circle.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
resources/library/interactivities/Selectionner.wgt/img/close_cont.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 772 B

BIN
resources/library/interactivities/Selectionner.wgt/img/green_point.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 721 B

BIN
resources/library/interactivities/Selectionner.wgt/img/play.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
resources/library/interactivities/Selectionner.wgt/img/red_point.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 740 B

BIN
resources/library/interactivities/Selectionner.wgt/img/replay.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
resources/library/interactivities/Selectionner.wgt/img/stop.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

492
resources/library/interactivities/Selectionner.wgt/js/script.js
Unescape View File

@ -0,0 +1,492 @@
var sankoreLang = {
display: "Display",
edit: "Edit",
short_desc: "Select animals from the following list:",
add: "Add new block",
enter: "Enter your instruction here ...",
cat: "cat",
ball: "ball",
shovel: "shovel",
dog: "dog",
tree: "tree",
wgt_name: "Select the desired",
reload: "Reload",
slate: "Wood",
pad: "Pad"
};
//main function
function start(){
$("#wgt_display").text(sankoreLang.display);
$("#wgt_edit").text(sankoreLang.edit);
$("#wgt_name").text(sankoreLang.wgt_name);
$("#wgt_reload").text(sankoreLang.reload);
$(".style_select option[value='1']").text(sankoreLang.slate);
$(".style_select option[value='2']").text(sankoreLang.pad);
if(window.sankore){
if(sankore.preference("selectionner","")){
var data = jQuery.parseJSON(sankore.preference("selectionner",""));
importData(data);
} else
showExample();
if(sankore.preference("sel_style","")){
changeStyle(sankore.preference("sel_style",""));
$(".style_select").val(sankore.preference("sel_style",""));
} else
changeStyle(1)
}
else
showExample();
//events
if (window.widget) {
window.widget.onleave = function(){
exportData();
sankore.setPreference("sel_style", $(".style_select").find("option:selected").val());
}
}
$("#wgt_reload").click(function(){
if($("#wgt_display").hasClass("selected")){
$(".cont").each(function(){
var container = $(this);
container.find(".img_block, .text_block").each(function(){
$(this).find("input:checkbox").removeAttr("checked");
$(this).find("input:checkbox").parent().parent().removeClass("right");
});
});
}
else
$("#wgt_display").trigger("click");
});
$(".style_select").change(function (event){
changeStyle($(this).find("option:selected").val());
})
$("#wgt_display, #wgt_edit").click(function(event){
if(this.id == "wgt_display"){
if(!$(this).hasClass("selected")){
if(window.sankore)
sankore.enableDropOnWidget(false);
$(this).addClass("selected");
$("#wgt_edit").removeClass("selected");
$(".style_select").css("display","none");
$(".add_block").remove();
$(".cont").each(function(){
var container = $(this);
container.find(".text_cont").removeAttr("contenteditable");
container.find(".add_img").remove();
container.find(".close_cont").remove();
container.find(".imgs_cont").removeAttr("ondragenter")
.removeAttr("ondragleave")
.removeAttr("ondragover")
.removeAttr("ondrop");
container.find(".img_block, .text_block").each(function(){
$(this).find(".close_img").remove();
$(this).find(".text_subblock").removeAttr("contenteditable");
$(this).find("input:checkbox").removeAttr("checked")
});
});
$(this).css("display", "none");
$("#wgt_edit").css("display", "block");
}
} else {
if(!$(this).hasClass("selected")){
if(window.sankore)
sankore.enableDropOnWidget(true);
$(this).addClass("selected");
$("#wgt_display").removeClass("selected");
$(".style_select").css("display","block");
$(".cont").each(function(){
var container = $(this);
$("<div class='close_cont'>").appendTo(container);
container.find(".text_cont").attr("contenteditable","true");
container.find(".imgs_cont").removeClass("right")
.attr("ondragenter", "return false;")
.attr("ondragleave", "$(this).removeClass('over'); return false;")
.attr("ondragover", "$(this).addClass('over'); return false;")
.attr("ondrop", "$(this).removeClass('over'); return onDropTarget(this,event);");
var add_img = $("<div class='add_img'>");
container.find(".img_block, .text_block").each(function(){
$("<div class='close_img'>").appendTo($(this));
if($(this).find("input:hidden").val() == 0)
$(this).find("input:checkbox").attr('checked', false);
else
$(this).find("input:checkbox").attr('checked', true);
$(this).find(".text_subblock").attr("contenteditable","true");
});
add_img.insertBefore(container.find(".clear"));
});
$("<div class='add_block'>" + sankoreLang.add + "</div>").appendTo("#data");
$(this).css("display", "none");
$("#wgt_display").css("display", "block");
}
}
});
//add new block
$(".add_block").live("click", function(){
addContainer();
});
//checkbox events
$("input:checkbox").live("click", function(){
if($("#wgt_display").hasClass("selected")){
var flag = true;
var block = $(this).parent().parent();
block.find(".text_block, .img_block, .audio_block").each(function(){
if($(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 0)
flag = false;
else if(!$(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 1)
flag = false;
});
if(flag)
block.addClass("right");
else
block.removeClass("right");
} else {
if($(this).is(":checked"))
$(this).parent().find("input:hidden").val(1);
else
$(this).parent().find("input:hidden").val(0);
}
});
//play/pause event
$(".play, .stop").live("click", function(){
var tmp_audio = $(this);
var audio = tmp_audio.parent().find("audio").get(0);
if($(this).hasClass("play")){
if(tmp_audio.parent().find("source").attr("src")){
tmp_audio.removeClass("play").addClass("stop");
var id = setInterval(function(){
if(audio.currentTime == audio.duration){
clearInterval(id);
tmp_audio.removeClass("stop").addClass("play");
}
}, 10);
tmp_audio.parent().find("input").val(id);
audio.play();
}
} else {
$(this).removeClass("stop").addClass("play");
clearInterval( tmp_audio.parent().find("input").val())
audio.pause();
}
});
$(".replay").live("click", function(){
var tmp_audio = $(this).prev();
var audio = $(this).parent().find("audio").get(0);
if(tmp_audio.parent().find("source").attr("src")){
$(this).prev().removeClass("play").addClass("stop");
clearInterval($(this).parent().find("input").val());
var id = setInterval(function(){
if(audio.currentTime == audio.duration){
clearInterval(id);
tmp_audio.removeClass("stop").addClass("play");
}
}, 10);
tmp_audio.parent().find("input").val(id);
audio.currentTime = 0;
audio.play();
}
});
//adding new img
$(".add_img").live("click", function(){
addTextBlock($(this));
});
//deleting a block
$(".close_cont").live("click",function(){
$(this).parent().remove();
refreshBlockNumbers();
});
//deleting the img block
$(".close_img").live("click", function(){
$(this).parent().remove();
});
$("#wgt_reload, #wgt_display, #wgt_edit").live("mouseover",function(){
exportData();
})
}
//export
function exportData(){
var array_to_export = [];
$(".cont").each(function(){
var cont_obj = new Object();
cont_obj.text = $(this).find(".text_cont").text();
cont_obj.blocks = [];
$(this).find(".img_block, .audio_block, .text_block").each(function(){
var tmp_block = new Object();
if($("#wgt_display").hasClass("selected"))
tmp_block.state = "display";
else
tmp_block.state = "edit";
if($(this).hasClass("img_block")){
if($(this).find(".audio_block").size() == 0){
tmp_block.src = $(this).find("img").attr("src");
tmp_block.hidden = $(this).find("input:hidden").val();
tmp_block.h = $(this).find("img").height();
tmp_block.w = $(this).find("img").width();
tmp_block.type = "img";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
}
if($(this).hasClass("audio_block")){
tmp_block.src = $(this).find("source").attr("src");
tmp_block.hidden = $(this).parent().find("input:hidden").val();
tmp_block.type = "audio";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
if($(this).hasClass("text_block")){
tmp_block.text = $(this).find(".text_subblock").text();
tmp_block.hidden = $(this).find("input:hidden").val();
tmp_block.type = "text";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
cont_obj.blocks.push(tmp_block);
});
array_to_export.push(cont_obj);
});
sankore.setPreference("selectionner", JSON.stringify(array_to_export));
}
//import
function importData(data){
var tmp = 0;
for(var i in data){
var container = $("<div class='cont'>").appendTo("#data");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
$("<div class='clear'>").appendTo(imgs_container);
$("<div class='number_cont'>" + (++tmp) + "</div>").appendTo(sub_container);
$("<div class='text_cont'>" + data[i].text + "</div>").appendTo(sub_container);
for(var j in data[i].blocks){
switch(data[i].blocks[j].type){
case "text":
var text_block = $("<div class='text_block'>").insertBefore(imgs_container.find(".clear"));
$("<div class='text_subblock'>" + data[i].blocks[j].text + "</div>").appendTo(text_block);
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(text_block);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(text_block);
break;
case "img":
var img_block = $("<div class='img_block' style='text-align: center;'></div>").insertBefore(imgs_container.find(".clear"));
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(img_block);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(img_block)
$("<img src=\"" + data[i].blocks[j].src + "\" width='" + data[i].blocks[j].w + "' height='" + data[i].blocks[j].h + "' style=\"display: inline;\"/>").appendTo(img_block);
break;
case "audio":
var img_tmp = $("<div class='img_block'>").insertBefore(imgs_container.find(".clear"));
var audio_block = $("<div class='audio_block'>").appendTo(img_tmp);
$("<div class='play'>").appendTo(audio_block);
$("<div class='replay'>").appendTo(audio_block);
var source = $("<source/>").attr("src", data[i].blocks[j].src);
var audio = $("<audio>").appendTo(audio_block);
audio.append(source);
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(img_tmp);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(img_tmp)
break;
}
}
}
var block = $("input:checkbox").parent().parent();
block.each(function(){
var flag = true;
$(this).find(".text_block, .img_block, .audio_block").each(function(){
if($(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 0)
flag = false;
else if(!$(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 1)
flag = false;
});
if(flag)
$(this).addClass("right");
else
$(this).removeClass("right");
})
}
//example
function showExample(){
var container = $("<div class='cont'>");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
$("<div class='number_cont'>1</div>").appendTo(sub_container);
$("<div class='text_cont'>" + sankoreLang.short_desc + "</div>").appendTo(sub_container);
var tmp1 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.cat + "</div>").appendTo(tmp1);
$("<input type='hidden' value='1'/>").appendTo(tmp1);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp1)
var tmp2 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.ball + "</div>").appendTo(tmp2);
$("<input type='hidden' value='0'/>").appendTo(tmp2);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp2)
var tmp3 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.shovel + "</div>").appendTo(tmp3);
$("<input type='hidden' value='0'/>").appendTo(tmp3);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp3)
var tmp4 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.dog + "</div>").appendTo(tmp4);
$("<input type='hidden' value='1'/>").appendTo(tmp4);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp4)
var tmp5 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.tree + "</div>").appendTo(tmp5);
$("<input type='hidden' value='0'/>").appendTo(tmp5);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp5)
$("<div class='clear'>").appendTo(imgs_container);
container.appendTo("#data")
}
//add new container
function addContainer(){
var container = $("<div class='cont'>");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
imgs_container.attr("ondragenter", "return false;")
.attr("ondragleave", "$(this).removeClass('over'); return false;")
.attr("ondragover", "$(this).addClass('over'); return false;")
.attr("ondrop", "$(this).removeClass('over'); return onDropTarget(this,event);");
$("<div class='close_cont'>").appendTo(container);
$("<div class='number_cont'>"+ ($(".cont").size() + 1) +"</div>").appendTo(sub_container);
var text = $("<div class='text_cont' contenteditable>" + sankoreLang.enter + "</div>").appendTo(sub_container);
$("<div class='add_img'>").appendTo(imgs_container);
$("<div class='clear'>").appendTo(imgs_container);
container.insertBefore($(".add_block"));
}
//add new img block
function addTextBlock(dest){
var tmp = $("<div class='text_block'>").insertBefore(dest)
$("<div class='text_subblock' contenteditable='true'>" + sankoreLang.enter + "</div>").appendTo(tmp);
$("<input type='hidden' value='0'/>").appendTo(tmp);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp);
$("<div class='close_img'>").appendTo(tmp);
}
function refreshBlockNumbers(){
var i = 0;
$(".cont").each(function(){
$(this).find(".number_cont").text(++i);
})
}
function stringToXML(text){
if (window.ActiveXObject){
var doc=new ActiveXObject('Microsoft.XMLDOM');
doc.async='false';
doc.loadXML(text);
} else {
var parser=new DOMParser();
doc=parser.parseFromString(text,'text/xml');
}
return doc;
}
//changing the style
function changeStyle(val){
if(val == 1){
$(".b_top_left").removeClass("btl_pad");
$(".b_top_center").removeClass("btc_pad");
$(".b_top_right").removeClass("btr_pad");
$(".b_center_left").removeClass("bcl_pad");
$(".b_center_right").removeClass("bcr_pad");
$(".b_bottom_right").removeClass("bbr_pad");
$(".b_bottom_left").removeClass("bbl_pad");
$(".b_bottom_center").removeClass("bbc_pad");
$("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
$("#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");
} else {
$(".b_top_left").addClass("btl_pad");
$(".b_top_center").addClass("btc_pad");
$(".b_top_right").addClass("btr_pad");
$(".b_center_left").addClass("bcl_pad");
$(".b_center_right").addClass("bcr_pad");
$(".b_bottom_right").addClass("bbr_pad");
$(".b_bottom_left").addClass("bbl_pad");
$(".b_bottom_center").addClass("bbc_pad");
$("#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("pad_select");
}
}
function onDropTarget(obj, event) {
if (event.dataTransfer) {
var format = "text/plain";
var textData = event.dataTransfer.getData(format);
if (!textData) {
alert(":(");
}
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"){
var img_tmp = $("<div class='img_block'>").insertBefore($(obj).find(".add_img"));
var audio_block = $("<div class='audio_block'>").appendTo(img_tmp)
$("<div class='close_img'>").appendTo(img_tmp);
$("<div class='play'>").appendTo(audio_block);
$("<div class='replay'>").appendTo(audio_block);
var source = $("<source/>").attr("src", tmp);
var audio = $("<audio>").appendTo(audio_block);
audio.append(source);
$("<input type='hidden' value='0'/>").appendTo(img_tmp);
$("<input type='checkbox' class='ch_box'/>").appendTo(img_tmp)
} else {
var img_block = $("<div class='img_block' style='text-align: center;'></div>").insertBefore($(obj).find(".add_img"));
$("<div class='close_img'>").appendTo(img_block);
$("<input type='hidden' value='0'/>").appendTo(img_block);
$("<input type='checkbox' class='ch_box'/>").appendTo(img_block)
var tmp_img = $("<img src=\"" + tmp + "\" style=\"display: inline;\"/>").appendTo(img_block);
setTimeout(function(){
if(tmp_img.height() >= tmp_img.width())
tmp_img.attr("height", "120");
else{
tmp_img.attr("width","120");
tmp_img.css("margin",(120 - tmp_img.height())/2 + "px 0");
}
}, 6);
}
}
else {
alert ("Your browser does not support the dataTransfer object.");
}
if (event.stopPropagation) {
event.stopPropagation ();
}
else {
event.cancelBubble = true;
}
return false;
}

480
resources/library/interactivities/Selectionner.wgt/locales/fr/js/script.js
Unescape View File

@ -0,0 +1,480 @@
var sankoreLang = {
display: "Afficher",
edit: "Modifier",
short_desc: "Sélectionner les animaux dans la liste suivante:",
add: "Nouveau bloc",
enter: "Saisir votre consigne ici ...",
cat: "chat",
ball: "balle",
shovel: "pelle",
dog: "chien",
tree: "arbre",
wgt_name: "Sélectionner",
reload: "Recharger",
slate: "Bois",
pad: "Pad"
};
//main function
function start(){
$("#wgt_display").text(sankoreLang.display);
$("#wgt_edit").text(sankoreLang.edit);
$("#wgt_name").text(sankoreLang.wgt_name);
$("#wgt_reload").text(sankoreLang.reload);
$(".style_select option[value='1']").text(sankoreLang.slate);
$(".style_select option[value='2']").text(sankoreLang.pad);
if(window.sankore){
if(sankore.preference("selectionner","")){
var data = jQuery.parseJSON(sankore.preference("selectionner",""));
importData(data);
} else
showExample();
if(sankore.preference("sel_style","")){
changeStyle(sankore.preference("sel_style",""));
$(".style_select").val(sankore.preference("sel_style",""));
} else
changeStyle(1)
}
else
showExample();
//events
if (window.widget) {
window.widget.onleave = function(){
exportData();
sankore.setPreference("sel_style", $(".style_select").find("option:selected").val());
}
}
$("#wgt_reload").click(function(){
window.location.reload();
});
$(".style_select").change(function (event){
changeStyle($(this).find("option:selected").val());
})
$("#wgt_display, #wgt_edit").click(function(event){
if(this.id == "wgt_display"){
if(!$(this).hasClass("selected")){
if(window.sankore)
sankore.enableDropOnWidget(false);
$(this).addClass("selected");
$("#wgt_edit").removeClass("selected");
$(".style_select").css("display","none");
$(".add_block").remove();
$(".cont").each(function(){
var container = $(this);
container.find(".text_cont").removeAttr("contenteditable");
container.find(".add_img").remove();
container.find(".close_cont").remove();
container.find(".imgs_cont").removeAttr("ondragenter")
.removeAttr("ondragleave")
.removeAttr("ondragover")
.removeAttr("ondrop");
container.find(".img_block, .text_block").each(function(){
$(this).find(".close_img").remove();
$(this).find(".text_subblock").removeAttr("contenteditable");
$(this).find("input:checkbox").removeAttr("checked")
});
});
$(this).css("display", "none");
$("#wgt_edit").css("display", "block");
}
} else {
if(!$(this).hasClass("selected")){
if(window.sankore)
sankore.enableDropOnWidget(true);
$(this).addClass("selected");
$("#wgt_display").removeClass("selected");
$(".style_select").css("display","block");
$(".cont").each(function(){
var container = $(this);
$("<div class='close_cont'>").appendTo(container);
container.find(".text_cont").attr("contenteditable","true");
container.find(".imgs_cont").removeClass("right")
.attr("ondragenter", "return false;")
.attr("ondragleave", "$(this).removeClass('over'); return false;")
.attr("ondragover", "$(this).addClass('over'); return false;")
.attr("ondrop", "$(this).removeClass('over'); return onDropTarget(this,event);");
var add_img = $("<div class='add_img'>");
container.find(".img_block, .text_block").each(function(){
$("<div class='close_img'>").appendTo($(this));
if($(this).find("input:hidden").val() == 0)
$(this).find("input:checkbox").attr('checked', false);
else
$(this).find("input:checkbox").attr('checked', true);
$(this).find(".text_subblock").attr("contenteditable","true");
});
add_img.insertBefore(container.find(".clear"));
});
$("<div class='add_block'>" + sankoreLang.add + "</div>").appendTo("#data");
$(this).css("display", "none");
$("#wgt_display").css("display", "block");
}
}
});
//add new block
$(".add_block").live("click", function(){
addContainer();
});
//checkbox events
$("input:checkbox").live("click", function(){
if($("#wgt_display").hasClass("selected")){
var flag = true;
var block = $(this).parent().parent();
block.find(".text_block, .img_block, .audio_block").each(function(){
if($(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 0)
flag = false;
else if(!$(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 1)
flag = false;
});
if(flag)
block.addClass("right");
else
block.removeClass("right");
} else {
if($(this).is(":checked"))
$(this).parent().find("input:hidden").val(1);
else
$(this).parent().find("input:hidden").val(0);
}
});
//play/pause event
$(".play, .stop").live("click", function(){
var tmp_audio = $(this);
var audio = tmp_audio.parent().find("audio").get(0);
if($(this).hasClass("play")){
if(tmp_audio.parent().find("source").attr("src")){
tmp_audio.removeClass("play").addClass("stop");
var id = setInterval(function(){
if(audio.currentTime == audio.duration){
clearInterval(id);
tmp_audio.removeClass("stop").addClass("play");
}
}, 10);
tmp_audio.parent().find("input").val(id);
audio.play();
}
} else {
$(this).removeClass("stop").addClass("play");
clearInterval( tmp_audio.parent().find("input").val())
audio.pause();
}
});
$(".replay").live("click", function(){
var tmp_audio = $(this).prev();
var audio = $(this).parent().find("audio").get(0);
if(tmp_audio.parent().find("source").attr("src")){
$(this).prev().removeClass("play").addClass("stop");
clearInterval($(this).parent().find("input").val());
var id = setInterval(function(){
if(audio.currentTime == audio.duration){
clearInterval(id);
tmp_audio.removeClass("stop").addClass("play");
}
}, 10);
tmp_audio.parent().find("input").val(id);
audio.currentTime = 0;
audio.play();
}
});
//adding new img
$(".add_img").live("click", function(){
addTextBlock($(this));
});
//deleting a block
$(".close_cont").live("click",function(){
$(this).parent().remove();
refreshBlockNumbers();
});
//deleting the img block
$(".close_img").live("click", function(){
$(this).parent().remove();
});
}
//export
function exportData(){
var array_to_export = [];
$(".cont").each(function(){
var cont_obj = new Object();
cont_obj.text = $(this).find(".text_cont").text();
cont_obj.blocks = [];
$(this).find(".img_block, .audio_block, .text_block").each(function(){
var tmp_block = new Object();
if($("#wgt_display").hasClass("selected"))
tmp_block.state = "display";
else
tmp_block.state = "edit";
if($(this).hasClass("img_block")){
if($(this).find(".audio_block").size() == 0){
tmp_block.src = $(this).find("img").attr("src").replace("../../","");
tmp_block.hidden = $(this).find("input:hidden").val();
tmp_block.h = $(this).find("img").height();
tmp_block.w = $(this).find("img").width();
tmp_block.type = "img";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
}
if($(this).hasClass("audio_block")){
tmp_block.src = $(this).find("source").attr("src").replace("../../","");
tmp_block.hidden = $(this).parent().find("input:hidden").val();
tmp_block.type = "audio";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
if($(this).hasClass("text_block")){
tmp_block.text = $(this).find(".text_subblock").text();
tmp_block.hidden = $(this).find("input:hidden").val();
tmp_block.type = "text";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
cont_obj.blocks.push(tmp_block);
});
array_to_export.push(cont_obj);
});
sankore.setPreference("selectionner", JSON.stringify(array_to_export));
}
//import
function importData(data){
var tmp = 0;
for(var i in data){
var container = $("<div class='cont'>").appendTo("#data");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
$("<div class='clear'>").appendTo(imgs_container);
$("<div class='number_cont'>" + (++tmp) + "</div>").appendTo(sub_container);
$("<div class='text_cont'>" + data[i].text + "</div>").appendTo(sub_container);
for(var j in data[i].blocks){
switch(data[i].blocks[j].type){
case "text":
var text_block = $("<div class='text_block'>").insertBefore(imgs_container.find(".clear"));
$("<div class='text_subblock'>" + data[i].blocks[j].text + "</div>").appendTo(text_block);
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(text_block);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(text_block);
break;
case "img":
var img_block = $("<div class='img_block' style='text-align: center;'></div>").insertBefore(imgs_container.find(".clear"));
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(img_block);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(img_block)
$("<img src=\"../../" + data[i].blocks[j].src + "\" width='" + data[i].blocks[j].w + "' height='" + data[i].blocks[j].h + "' style=\"display: inline;\"/>").appendTo(img_block);
break;
case "audio":
var img_tmp = $("<div class='img_block'>").insertBefore(imgs_container.find(".clear"));
var audio_block = $("<div class='audio_block'>").appendTo(img_tmp);
$("<div class='play'>").appendTo(audio_block);
$("<div class='replay'>").appendTo(audio_block);
var source = $("<source/>").attr("src", "../../" + data[i].blocks[j].src);
var audio = $("<audio>").appendTo(audio_block);
audio.append(source);
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(img_tmp);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(img_tmp)
break;
}
}
}
var block = $("input:checkbox").parent().parent();
block.each(function(){
var flag = true;
$(this).find(".text_block, .img_block, .audio_block").each(function(){
if($(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 0)
flag = false;
else if(!$(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 1)
flag = false;
});
if(flag)
$(this).addClass("right");
else
$(this).removeClass("right");
})
}
//example
function showExample(){
var container = $("<div class='cont'>");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
$("<div class='number_cont'>1</div>").appendTo(sub_container);
$("<div class='text_cont'>" + sankoreLang.short_desc + "</div>").appendTo(sub_container);
var tmp1 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.cat + "</div>").appendTo(tmp1);
$("<input type='hidden' value='1'/>").appendTo(tmp1);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp1)
var tmp2 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.ball + "</div>").appendTo(tmp2);
$("<input type='hidden' value='0'/>").appendTo(tmp2);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp2)
var tmp3 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.shovel + "</div>").appendTo(tmp3);
$("<input type='hidden' value='0'/>").appendTo(tmp3);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp3)
var tmp4 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.dog + "</div>").appendTo(tmp4);
$("<input type='hidden' value='1'/>").appendTo(tmp4);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp4)
var tmp5 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.tree + "</div>").appendTo(tmp5);
$("<input type='hidden' value='0'/>").appendTo(tmp5);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp5)
$("<div class='clear'>").appendTo(imgs_container);
container.appendTo("#data")
}
//add new container
function addContainer(){
var container = $("<div class='cont'>");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
imgs_container.attr("ondragenter", "return false;")
.attr("ondragleave", "$(this).removeClass('over'); return false;")
.attr("ondragover", "$(this).addClass('over'); return false;")
.attr("ondrop", "$(this).removeClass('over'); return onDropTarget(this,event);");
$("<div class='close_cont'>").appendTo(container);
$("<div class='number_cont'>"+ ($(".cont").size() + 1) +"</div>").appendTo(sub_container);
var text = $("<div class='text_cont' contenteditable>" + sankoreLang.enter + "</div>").appendTo(sub_container);
$("<div class='add_img'>").appendTo(imgs_container);
$("<div class='clear'>").appendTo(imgs_container);
container.insertBefore($(".add_block"));
}
//add new img block
function addTextBlock(dest){
var tmp = $("<div class='text_block'>").insertBefore(dest)
$("<div class='text_subblock' contenteditable='true'>" + sankoreLang.enter + "</div>").appendTo(tmp);
$("<input type='hidden' value='0'/>").appendTo(tmp);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp);
$("<div class='close_img'>").appendTo(tmp);
}
function refreshBlockNumbers(){
var i = 0;
$(".cont").each(function(){
$(this).find(".number_cont").text(++i);
})
}
function stringToXML(text){
if (window.ActiveXObject){
var doc=new ActiveXObject('Microsoft.XMLDOM');
doc.async='false';
doc.loadXML(text);
} else {
var parser=new DOMParser();
doc=parser.parseFromString(text,'text/xml');
}
return doc;
}
//changing the style
function changeStyle(val){
if(val == 1){
$(".b_top_left").removeClass("btl_pad");
$(".b_top_center").removeClass("btc_pad");
$(".b_top_right").removeClass("btr_pad");
$(".b_center_left").removeClass("bcl_pad");
$(".b_center_right").removeClass("bcr_pad");
$(".b_bottom_right").removeClass("bbr_pad");
$(".b_bottom_left").removeClass("bbl_pad");
$(".b_bottom_center").removeClass("bbc_pad");
$("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
$("#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");
} else {
$(".b_top_left").addClass("btl_pad");
$(".b_top_center").addClass("btc_pad");
$(".b_top_right").addClass("btr_pad");
$(".b_center_left").addClass("bcl_pad");
$(".b_center_right").addClass("bcr_pad");
$(".b_bottom_right").addClass("bbr_pad");
$(".b_bottom_left").addClass("bbl_pad");
$(".b_bottom_center").addClass("bbc_pad");
$("#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("pad_select");
}
}
function onDropTarget(obj, event) {
if (event.dataTransfer) {
var format = "text/plain";
var textData = event.dataTransfer.getData(format);
if (!textData) {
alert(":(");
}
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"){
var img_tmp = $("<div class='img_block'>").insertBefore($(obj).find(".add_img"));
var audio_block = $("<div class='audio_block'>").appendTo(img_tmp)
$("<div class='close_img'>").appendTo(img_tmp);
$("<div class='play'>").appendTo(audio_block);
$("<div class='replay'>").appendTo(audio_block);
var source = $("<source/>").attr("src", "../../" + tmp);
var audio = $("<audio>").appendTo(audio_block);
audio.append(source);
$("<input type='hidden' value='0'/>").appendTo(img_tmp);
$("<input type='checkbox' class='ch_box'/>").appendTo(img_tmp)
} else {
var img_block = $("<div class='img_block' style='text-align: center;'></div>").insertBefore($(obj).find(".add_img"));
$("<div class='close_img'>").appendTo(img_block);
$("<input type='hidden' value='0'/>").appendTo(img_block);
$("<input type='checkbox' class='ch_box'/>").appendTo(img_block)
var tmp_img = $("<img src=\"../../" + tmp + "\" style=\"display: inline;\"/>").appendTo(img_block);
setTimeout(function(){
if(tmp_img.height() >= tmp_img.width())
tmp_img.attr("height", "120");
else{
tmp_img.attr("width","120");
tmp_img.css("margin",(120 - tmp_img.height())/2 + "px 0");
}
}, 6);
}
}
else {
alert ("Your browser does not support the dataTransfer object.");
}
if (event.stopPropagation) {
event.stopPropagation ();
}
else {
event.cancelBubble = true;
}
return false;
}

478
resources/library/interactivities/Selectionner.wgt/locales/ru/js/script.js
Unescape View File

@ -0,0 +1,478 @@
var sankoreLang = {
display: "Показать",
edit: "Изменить",
short_desc: "Выберите животных из следующего списка:",
add: "Новый блок",
enter: "Введите текст ...",
cat: "кот",
ball: "мяч",
shovel: "лопата",
dog: "собака",
tree: "дерево",
wgt_name: "Выбрать верное",
reload: "Обновить",
slate: "Узор",
pad: "Планшет"
};
//main function
function start(){
$("#wgt_display").text(sankoreLang.display);
$("#wgt_edit").text(sankoreLang.edit);
$("#wgt_name").text(sankoreLang.wgt_name);
$("#wgt_reload").text(sankoreLang.reload);
$(".style_select option[value='1']").text(sankoreLang.slate);
$(".style_select option[value='2']").text(sankoreLang.pad);
if(window.sankore){
if(sankore.preference("selectionner","")){
var data = jQuery.parseJSON(sankore.preference("selectionner",""));
importData(data);
} else
showExample();
if(sankore.preference("sel_style","")){
changeStyle(sankore.preference("sel_style",""));
$(".style_select").val(sankore.preference("sel_style",""));
} else
changeStyle(1)
}
else
showExample();
//events
if (window.widget) {
window.widget.onleave = function(){
exportData();
sankore.setPreference("sel_style", $(".style_select").find("option:selected").val());
}
}
$("#wgt_reload").click(function(){
window.location.reload();
});
$(".style_select").change(function (event){
changeStyle($(this).find("option:selected").val());
})
$("#wgt_display, #wgt_edit").click(function(event){
if(this.id == "wgt_display"){
if(!$(this).hasClass("selected")){
if(window.sankore)
sankore.enableDropOnWidget(false);
$(this).addClass("selected");
$("#wgt_edit").removeClass("selected");
$(".style_select").css("display","none");
$(".add_block").remove();
$(".cont").each(function(){
var container = $(this);
container.find(".text_cont").removeAttr("contenteditable");
container.find(".add_img").remove();
container.find(".close_cont").remove();
container.find(".imgs_cont").removeAttr("ondragenter")
.removeAttr("ondragleave")
.removeAttr("ondragover")
.removeAttr("ondrop");
container.find(".img_block, .text_block").each(function(){
$(this).find(".close_img").remove();
$(this).find(".text_subblock").removeAttr("contenteditable");
$(this).find("input:checkbox").removeAttr("checked")
});
});
$(this).css("display", "none");
$("#wgt_edit").css("display", "block");
}
} else {
if(!$(this).hasClass("selected")){
if(window.sankore)
sankore.enableDropOnWidget(true);
$(this).addClass("selected");
$("#wgt_display").removeClass("selected");
$(".style_select").css("display","block");
$(".cont").each(function(){
var container = $(this);
$("<div class='close_cont'>").appendTo(container);
container.find(".text_cont").attr("contenteditable","true");
container.find(".imgs_cont").removeClass("right")
.attr("ondragenter", "return false;")
.attr("ondragleave", "$(this).removeClass('over'); return false;")
.attr("ondragover", "$(this).addClass('over'); return false;")
.attr("ondrop", "$(this).removeClass('over'); return onDropTarget(this,event);");
var add_img = $("<div class='add_img'>");
container.find(".img_block, .text_block").each(function(){
$("<div class='close_img'>").appendTo($(this));
if($(this).find("input:hidden").val() == 0)
$(this).find("input:checkbox").attr('checked', false);
else
$(this).find("input:checkbox").attr('checked', true);
$(this).find(".text_subblock").attr("contenteditable","true");
});
add_img.insertBefore(container.find(".clear"));
});
$("<div class='add_block'>" + sankoreLang.add + "</div>").appendTo("#data");
$(this).css("display", "none");
$("#wgt_display").css("display", "block");
}
}
});
//add new block
$(".add_block").live("click", function(){
addContainer();
});
//checkbox events
$("input:checkbox").live("click", function(){
if($("#wgt_display").hasClass("selected")){
var flag = true;
var block = $(this).parent().parent();
block.find(".text_block, .img_block, .audio_block").each(function(){
if($(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 0)
flag = false;
else if(!$(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 1)
flag = false;
});
if(flag)
block.addClass("right");
else
block.removeClass("right");
} else {
if($(this).is(":checked"))
$(this).parent().find("input:hidden").val(1);
else
$(this).parent().find("input:hidden").val(0);
}
});
//play/pause event
$(".play, .stop").live("click", function(){
var tmp_audio = $(this);
var audio = tmp_audio.parent().find("audio").get(0);
if($(this).hasClass("play")){
if(tmp_audio.parent().find("source").attr("src")){
tmp_audio.removeClass("play").addClass("stop");
var id = setInterval(function(){
if(audio.currentTime == audio.duration){
clearInterval(id);
tmp_audio.removeClass("stop").addClass("play");
}
}, 10);
tmp_audio.parent().find("input").val(id);
audio.play();
}
} else {
$(this).removeClass("stop").addClass("play");
clearInterval( tmp_audio.parent().find("input").val())
audio.pause();
}
});
$(".replay").live("click", function(){
var tmp_audio = $(this).prev();
var audio = $(this).parent().find("audio").get(0);
if(tmp_audio.parent().find("source").attr("src")){
$(this).prev().removeClass("play").addClass("stop");
clearInterval($(this).parent().find("input").val());
var id = setInterval(function(){
if(audio.currentTime == audio.duration){
clearInterval(id);
tmp_audio.removeClass("stop").addClass("play");
}
}, 10);
tmp_audio.parent().find("input").val(id);
audio.currentTime = 0;
audio.play();
}
});
//adding new img
$(".add_img").live("click", function(){
addTextBlock($(this));
});
//deleting a block
$(".close_cont").live("click",function(){
$(this).parent().remove();
refreshBlockNumbers();
});
//deleting the img block
$(".close_img").live("click", function(){
$(this).parent().remove();
});
}
//export
function exportData(){
var array_to_export = [];
$(".cont").each(function(){
var cont_obj = new Object();
cont_obj.text = $(this).find(".text_cont").text();
cont_obj.blocks = [];
$(this).find(".img_block, .audio_block, .text_block").each(function(){
var tmp_block = new Object();
if($("#wgt_display").hasClass("selected"))
tmp_block.state = "display";
else
tmp_block.state = "edit";
if($(this).hasClass("img_block")){
if($(this).find(".audio_block").size() == 0){
tmp_block.src = $(this).find("img").attr("src").replace("../../","");
tmp_block.hidden = $(this).find("input:hidden").val();
tmp_block.h = $(this).find("img").height();
tmp_block.w = $(this).find("img").width();
tmp_block.type = "img";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
}
if($(this).hasClass("audio_block")){
tmp_block.src = $(this).find("source").attr("src").replace("../../","");
tmp_block.hidden = $(this).parent().find("input:hidden").val();
tmp_block.type = "audio";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
if($(this).hasClass("text_block")){
tmp_block.text = $(this).find(".text_subblock").text();
tmp_block.hidden = $(this).find("input:hidden").val();
tmp_block.type = "text";
tmp_block.checked = $(this).find("input:checkbox").attr("checked");
}
cont_obj.blocks.push(tmp_block);
});
array_to_export.push(cont_obj);
});
sankore.setPreference("selectionner", JSON.stringify(array_to_export));
}
//import
function importData(data){
var tmp = 0;
for(var i in data){
var container = $("<div class='cont'>").appendTo("#data");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
$("<div class='clear'>").appendTo(imgs_container);
$("<div class='number_cont'>" + (++tmp) + "</div>").appendTo(sub_container);
$("<div class='text_cont'>" + data[i].text + "</div>").appendTo(sub_container);
for(var j in data[i].blocks){
switch(data[i].blocks[j].type){
case "text":
var text_block = $("<div class='text_block'>").insertBefore(imgs_container.find(".clear"));
$("<div class='text_subblock'>" + data[i].blocks[j].text + "</div>").appendTo(text_block);
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(text_block);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(text_block);
break;
case "img":
var img_block = $("<div class='img_block' style='text-align: center;'></div>").insertBefore(imgs_container.find(".clear"));
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(img_block);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(img_block)
$("<img src=\"../../" + data[i].blocks[j].src + "\" width='" + data[i].blocks[j].w + "' height='" + data[i].blocks[j].h + "' style=\"display: inline;\"/>").appendTo(img_block);
break;
case "audio":
var img_tmp = $("<div class='img_block'>").insertBefore(imgs_container.find(".clear"));
var audio_block = $("<div class='audio_block'>").appendTo(img_tmp);
$("<div class='play'>").appendTo(audio_block);
$("<div class='replay'>").appendTo(audio_block);
var source = $("<source/>").attr("src", "../../" + data[i].blocks[j].src);
var audio = $("<audio>").appendTo(audio_block);
audio.append(source);
$("<input type='hidden' value='" + data[i].blocks[j].hidden + "'/>").appendTo(img_tmp);
$("<input type='checkbox' class='ch_box'/>").attr("checked",(data[i].blocks[j].state == "display")?((data[i].blocks[j].checked == "checked")?true:false):false).appendTo(img_tmp)
break;
}
}
}
var block = $("input:checkbox").parent().parent();
block.each(function(){
var flag = true;
$(this).find(".text_block, .img_block, .audio_block").each(function(){
if($(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 0)
flag = false;
else if(!$(this).find("input:checkbox").is(':checked') && $(this).find("input:hidden").val() == 1)
flag = false;
});
if(flag)
$(this).addClass("right");
else
$(this).removeClass("right");
})
}
//example
function showExample(){
var container = $("<div class='cont'>");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
$("<div class='number_cont'>1</div>").appendTo(sub_container);
$("<div class='text_cont'>" + sankoreLang.short_desc + "</div>").appendTo(sub_container);
var tmp1 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.cat + "</div>").appendTo(tmp1);
$("<input type='hidden' value='1'/>").appendTo(tmp1);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp1)
var tmp2 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.ball + "</div>").appendTo(tmp2);
$("<input type='hidden' value='0'/>").appendTo(tmp2);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp2)
var tmp3 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.shovel + "</div>").appendTo(tmp3);
$("<input type='hidden' value='0'/>").appendTo(tmp3);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp3)
var tmp4 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.dog + "</div>").appendTo(tmp4);
$("<input type='hidden' value='1'/>").appendTo(tmp4);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp4)
var tmp5 = $("<div class='text_block'>").appendTo(imgs_container);
$("<div class='text_subblock'>" + sankoreLang.tree + "</div>").appendTo(tmp5);
$("<input type='hidden' value='0'/>").appendTo(tmp5);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp5)
$("<div class='clear'>").appendTo(imgs_container);
container.appendTo("#data")
}
//add new container
function addContainer(){
var container = $("<div class='cont'>");
var sub_container = $("<div class='sub_cont'>").appendTo(container);
var imgs_container = $("<div class='imgs_cont'>").appendTo(container);
imgs_container.attr("ondragenter", "return false;")
.attr("ondragleave", "$(this).removeClass('over'); return false;")
.attr("ondragover", "$(this).addClass('over'); return false;")
.attr("ondrop", "$(this).removeClass('over'); return onDropTarget(this,event);");
$("<div class='close_cont'>").appendTo(container);
$("<div class='number_cont'>"+ ($(".cont").size() + 1) +"</div>").appendTo(sub_container);
var text = $("<div class='text_cont' contenteditable>" + sankoreLang.enter + "</div>").appendTo(sub_container);
$("<div class='add_img'>").appendTo(imgs_container);
$("<div class='clear'>").appendTo(imgs_container);
container.insertBefore($(".add_block"));
}
//add new img block
function addTextBlock(dest){
var tmp = $("<div class='text_block'>").insertBefore(dest)
$("<div class='text_subblock' contenteditable='true'>" + sankoreLang.enter + "</div>").appendTo(tmp);
$("<input type='hidden' value='0'/>").appendTo(tmp);
$("<input type='checkbox' class='ch_box'/>").appendTo(tmp);
$("<div class='close_img'>").appendTo(tmp);
}
function refreshBlockNumbers(){
var i = 0;
$(".cont").each(function(){
$(this).find(".number_cont").text(++i);
})
}
function stringToXML(text){
if (window.ActiveXObject){
var doc=new ActiveXObject('Microsoft.XMLDOM');
doc.async='false';
doc.loadXML(text);
} else {
var parser=new DOMParser();
doc=parser.parseFromString(text,'text/xml');
}
return doc;
}
//changing the style
function changeStyle(val){
if(val == 1){
$(".b_top_left").removeClass("btl_pad");
$(".b_top_center").removeClass("btc_pad");
$(".b_top_right").removeClass("btr_pad");
$(".b_center_left").removeClass("bcl_pad");
$(".b_center_right").removeClass("bcr_pad");
$(".b_bottom_right").removeClass("bbr_pad");
$(".b_bottom_left").removeClass("bbl_pad");
$(".b_bottom_center").removeClass("bbc_pad");
$("#wgt_reload").removeClass("pad_color").removeClass("pad_reload");
$("#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");
} else {
$(".b_top_left").addClass("btl_pad");
$(".b_top_center").addClass("btc_pad");
$(".b_top_right").addClass("btr_pad");
$(".b_center_left").addClass("bcl_pad");
$(".b_center_right").addClass("bcr_pad");
$(".b_bottom_right").addClass("bbr_pad");
$(".b_bottom_left").addClass("bbl_pad");
$(".b_bottom_center").addClass("bbc_pad");
$("#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("pad_select");
}
}
function onDropTarget(obj, event) {
if (event.dataTransfer) {
var format = "text/plain";
var textData = event.dataTransfer.getData(format);
if (!textData) {
alert(":(");
}
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"){
var img_tmp = $("<div class='img_block'>").insertBefore($(obj).find(".add_img"));
var audio_block = $("<div class='audio_block'>").appendTo(img_tmp)
$("<div class='close_img'>").appendTo(img_tmp);
$("<div class='play'>").appendTo(audio_block);
$("<div class='replay'>").appendTo(audio_block);
var source = $("<source/>").attr("src", "../../" + tmp);
var audio = $("<audio>").appendTo(audio_block);
audio.append(source);
$("<input type='hidden' value='0'/>").appendTo(img_tmp);
$("<input type='checkbox' class='ch_box'/>").appendTo(img_tmp)
} else {
var img_block = $("<div class='img_block' style='text-align: center;'></div>").insertBefore($(obj).find(".add_img"));
$("<div class='close_img'>").appendTo(img_block);
$("<input type='hidden' value='0'/>").appendTo(img_block);
$("<input type='checkbox' class='ch_box'/>").appendTo(img_block)
var tmp_img = $("<img src=\"../../" + tmp + "\" style=\"display: inline;\"/>").appendTo(img_block);
setTimeout(function(){
if(tmp_img.height() >= tmp_img.width())
tmp_img.attr("height", "120");
else{
tmp_img.attr("width","120");
tmp_img.css("margin",(120 - tmp_img.height())/2 + "px 0");
}
}, 6);
}
}
else {
alert ("Your browser does not support the dataTransfer object.");
}
if (event.stopPropagation) {
event.stopPropagation ();
}
else {
event.cancelBubble = true;
}
return false;
}
Write Preview
Loading…
Cancel
Save