Skip to content

O
OpenBoard
Commit f3461198 authored by maximXbs's avatar maximXbs
Browse files
Options

updated 'Cat images' app

parent 3bec5c84
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 209 additions and 177 deletions
resources/library/interactivities/Cat images.wgt/css/basic.css
View file @ f3461198
......@@ -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-size: 24px;
color: #8c5730;
font-family: Arial,Helvetica,sans-serif;
font-size: 24px;
line-height: 32px;
}
#wgt_display{
padding-left: 40px;
background-image: url(../img/slate-edit.png);
background-repeat: no-repeat;
background-position: top 0;
padding-left: 35px;
background: url(../img/toolbar-edit.png) left -32px no-repeat;
color: white;
display: none;
}
#wgt_edit{
padding-left: 40px;
background-image: url(../img/slate-edit.png);
background-repeat: no-repeat;
background-position: top 0;
padding-left: 35px;
background: url(../img/slate-toolbar-edit.png) left top no-repeat;
color: #7F613F;
text-shadow: #FFDCA9 0 1px 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;
padding-left: 35px;
background: url(../img/slate-toolbar-reload.png) left top no-repeat;
color: #7F613F;
text-shadow: #FFDCA9 0 1px 0;
}
.btl_pad{
......@@ -349,51 +324,50 @@ body{
background-image: url(../img/pad-bottom-right.png) !important;
}
.pad_color{
color: white !important;
.without_radius{
border-radius: 0 !important;
}
.pad_reload{
background-image: url(../img/slate-toolbar-reload-white.png) !important;
.without_back{
background: none !important;
}
.pad_edit{
background-image: url(../img/slate-display.png) !important;
.pad_color{
color: #FC9 !important;
text-shadow: none !important;
}
.pad_select{
background-color: black !important;
color: white !important;
background-image: url(../img/ar_down_white.png) !important;
.pad_reload{
background: url(../img/toolbar-reload.png) left top no-repeat !important;
}
.without_radius{
border-radius: 0 !important;
.pad_edit{
background: url(../img/toolbar-edit.png) left top no-repeat !important;
}
.without_back{
background: none !important;
.pad_help{
background: url(../img/toolbar-help.png) left top no-repeat !important;
}
.none_select{
background-color: #333 !important;
.help_wood{
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{
background-image: url(../img/slate-help-white.png) !important;
.help_pad{
background: url(../img/toolbar-help.png) left -32px no-repeat !important;
color: white !important;
}
#wgt_help{
padding-left: 32px;
background-image: url(../img/slate-help.png);
background-repeat: no-repeat;
background-position: top 0;
padding-left: 35px;
background: url(../img/slate-toolbar-help.png) left top no-repeat;
color: #7F613F;
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;
}
\ No newline at end of file
resources/library/interactivities/Cat images.wgt/index.html
View file @ f3461198
......@@ -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>
<select class="style_select">
<option value="1"></option>
<option value="2"></option>
<option value="3"></option>
</select>
<div id="wgt_edit"></div>
</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
View file @ f3461198
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='2']").text(sankoreLang.pad);
$(".style_select option[value='3']").text(sankoreLang.none);
$("#style_select option[value='1']").text(sankoreLang.slate);
$("#style_select option[value='2']").text(sankoreLang.pad);
$("#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);
$("body, html").removeClass("without_radius");
$("#wgt_display").addClass("display_wood");
$("#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);
$("body, html").removeClass("without_radius");
$("#wgt_display").removeClass("display_wood");
$("#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);
$("body, html").addClass("without_radius");
$("#wgt_display").removeClass("display_wood");
$("#style_select").val(val);
$("body, html").addClass("without_radius").removeClass("radius_ft");
break;
}
}
......
resources/library/interactivities/Cat images.wgt/locales/fr/index.html
View file @ f3461198
......@@ -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>
<select class="style_select">
<option value="1"></option>
<option value="2"></option>
<option value="3"></option>
</select>
<div id="wgt_edit"></div>
</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/index.html
View file @ f3461198
......@@ -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
View file @ f3461198
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='2']").text(sankoreLang.pad);
$(".style_select option[value='3']").text(sankoreLang.none);
$("#style_select option[value='1']").text(sankoreLang.slate);
$("#style_select option[value='2']").text(sankoreLang.pad);
$("#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);
$("body, html").removeClass("without_radius");
$("#wgt_display").addClass("display_wood");
$("#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);
$("body, html").removeClass("without_radius");
$("#wgt_display").removeClass("display_wood");
$("#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);
$("body, html").addClass("without_radius");
$("#wgt_display").removeClass("display_wood");
$("#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){
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment