applied maxim changes

preferencesAboutTextFull
Claudio Valerio 12 years ago
parent 4dc6465f51
commit 8724a01a71
  1. 454
      resources/library/interactivities/Train.wgt/js/lib/ubw-main.js
  2. 160
      resources/library/interactivities/Train.wgt/js/main.js
  3. 1
      resources/nonDistributed/Cadran.wgt/css/main.css
  4. 345
      resources/nonDistributed/Transformation.wgt/js/main.js

@ -13,257 +13,267 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
function log(object) {
console.log(object);
console.log(object);
}
function initAfterI18nMessagesLoaded(reload, templates, callbacks) {
document.title = fr.njin.i18n.document.title;
document.title = fr.njin.i18n.document.title;
var ubwidget = $("#ubwidget");
var ubwidget = $("#ubwidget");
var parameters = Object.create(Parameters,{
container: {
value: ubwidget
},
delegate: {
value: window.sankore || Object.create(ParametersDelegate)
}
});
var parameters = Object.create(Parameters,{
container: {
value: ubwidget
},
delegate: {
value: window.sankore || Object.create(ParametersDelegate)
}
});
var app = Object.create(App, {
container: {
value: ubwidget
},
parameters: {
value: parameters
},
reload: {
value: reload
}
});
var app = Object.create(App, {
container: {
value: ubwidget
},
parameters: {
value: parameters
},
reload: {
value: reload
}
});
app.init();
app.onEdit = false;
app.init();
app.onEdit = false;
if(templates.toolbar) {
$("#toolbar").html(Mustache.render(templates.toolbar, window));
}
if(templates.parameters) {
$("#parameters").html(Mustache.render(templates.parameters, window));
}
if(templates.toolbar) {
$("#toolbar").html(Mustache.render(templates.toolbar, window));
}
if(templates.parameters) {
$("#parameters").html(Mustache.render(templates.parameters, window));
}
if(callbacks.onTemplatesLoaded && typeof callbacks.onTemplatesLoaded === 'function') {
callbacks.onTemplatesLoaded(app);
}
if(callbacks.onTemplatesLoaded && typeof callbacks.onTemplatesLoaded === 'function') {
callbacks.onTemplatesLoaded(app);
}
log("Update setting views with stored parameters");
$("#parameters (input|select)[role=parameter]").each(function(i, input) {
(function(input){
var key = input.name;
var type = input.type;
var isRadioOrcheckbox = (type !== undefined && (type === "checkbox" || type === "radio"));
var stored = parameters.value(key);
if(isRadioOrcheckbox)
$(input).attr("checked", (typeof stored === "string" ? stored === "true" : stored));
else
$(input).val(stored);
$(input).change(function(){
var val = (isRadioOrcheckbox ? $(this).is(":checked") : $(this).val());
parameters.value(key, val);
});
})(input);
});
log("Update setting views with stored parameters");
$("#parameters (input|select)[role=parameter]").each(function(i, input) {
(function(input){
var key = input.name;
var type = input.type;
var isRadioOrcheckbox = (type !== undefined && (type === "checkbox" || type === "radio"));
var stored = parameters.value(key);
if(isRadioOrcheckbox)
$(input).attr("checked", (typeof stored === "string" ? stored === "true" : stored));
else
$(input).val(stored);
$(input).change(function(){
var val = (isRadioOrcheckbox ? $(this).is(":checked") : $(this).val());
parameters.value(key, val);
if(key != "themes"){
parameters.value("show", "3");
app.reload();
}
});
})(input);
});
log("Toobar Initialisation");
$("button[role=edit]").click(function(){
app.onEdit = true;
$(document.body).addClass("onEdit");
if(callbacks.onEdit && typeof callbacks.onEdit === 'function') {
callbacks.onEdit(app);
}
});
$("button[role=view]").click(function(){
app.onEdit = false;
$(document.body).removeClass("onEdit");
if(callbacks.onView && typeof callbacks.onView === 'function') {
callbacks.onView(app);
}
});
$("button[role=reload]").click(function(){
app.reload();
});
$("button[role=help]").click(function(){
$("body").toggleClass("showHelp");
});
log("Toobar Initialisation");
$("button[role=edit]").click(function(){
app.onEdit = true;
$(document.body).addClass("onEdit");
if(callbacks.onEdit && typeof callbacks.onEdit === 'function') {
parameters.value("show", "1");
callbacks.onEdit(app);
}
});
$("button[role=view]").click(function(){
app.onEdit = false;
$(document.body).removeClass("onEdit");
if(callbacks.onView && typeof callbacks.onView === 'function') {
parameters.value("show", "2");
callbacks.onView(app);
}
});
$("button[role=reload]").click(function(){
parameters.value("show", "3");
app.reload();
});
$("button[role=help]").click(function(){
$("body").toggleClass("showHelp");
});
$("select[name='themes']").change(function() {
$("body").get(0).className = $("body")[0].className.replace(/\btheme-[^\s]*\b/gi, '');
$("body").addClass("theme-"+$(this).val());
});
$("body").addClass("theme-"+$("select[name='themes']").val());
$("select[name='themes']").change(function() {
$("body").get(0).className = $("body")[0].className.replace(/\btheme-[^\s]*\b/gi, '');
$("body").addClass("theme-"+$(this).val());
});
$("body").addClass("theme-"+$("select[name='themes']").val());
}
function init(reload, templates, callbacks){
var locale = window.sankore ? sankore.locale() : "";
$.i18n.properties({
name: 'Messages',
path: 'i18n/',
language: locale,
callback: function(){
initAfterI18nMessagesLoaded(reload, templates, callbacks);
}
});
var locale = window.sankore ? sankore.locale() : "";
$.i18n.properties({
name: 'Messages',
path: 'i18n/',
language: locale,
callback: function(){
initAfterI18nMessagesLoaded(reload, templates, callbacks);
}
});
}
var Parameters = (function(){
var self = Object.create({}, {
container: {
value: null
},
delegate: {
value: null
},
value: {
value: function(key, value) {
if(value === undefined) {
var val = this.delegate.preference(key);
log("Retrieve parameter value ["+val+"] as type ["+(typeof val)+"] for key : ["+key+"]");
return (val !== undefined && (typeof val !== "string" || val)) ? val : $("#ubwidget").data(key);
}
else {
log("Set parameter value ["+value+"] for key : ["+key+"]");
this.delegate.setPreference(key, value);
this.container.trigger("preferenceChange", {key: key, value: value});
}
}
}
});
return self;
var self = Object.create({}, {
container: {
value: null
},
delegate: {
value: null
},
value: {
value: function(key, value) {
if(value === undefined) {
var val = this.delegate.preference(key);
log("Retrieve parameter value ["+val+"] as type ["+(typeof val)+"] for key : ["+key+"]");
return (val !== undefined && (typeof val !== "string" || val)) ? val : $("#ubwidget").data(key);
}
else {
log("Set parameter value ["+value+"] for key : ["+key+"]");
this.delegate.setPreference(key, value);
this.container.trigger("preferenceChange", {
key: key,
value: value
});
}
}
}
});
return self;
})();
var ParametersDelegate = (function(){
var self = Object.create({}, {
preference: {
value: function(key) {
return this[key];
}
},
setPreference: {
value: function(key, value) {
this[key] = value;
}
}
});
return self;
var self = Object.create({}, {
preference: {
value: function(key) {
return this[key];
}
},
setPreference: {
value: function(key, value) {
this[key] = value;
}
}
});
return self;
})();
var App = (function() {
var self = Object.create({}, {
container: {
value: null
},
parameters: {
value: null
},
container: {
value: null
},
parameters: {
value: null
},
init: {
value: function() {
var that = this;
this.container.bind("preferenceChange", function(evt, parameter) {
that.reload(parameter);
});
this.reload();
}
value: function() {
var that = this;
this.container.bind("preferenceChange", function(evt, parameter) {
that.reload(parameter);
});
this.reload();
}
},
reload: {
value: function(parameter) {
if(parameter === undefined)
log("Reload");
else
log("Update");
}
},
reload: {
value: function(parameter) {
if(parameter === undefined)
log("Reload");
else
log("Update");
}
},
utils: {
value: Object.create({}, {
shuffle: {
value: function(array) {
var unpickedSize = array.length;
while(unpickedSize > 0) {
var n = Math.floor(Math.random()*unpickedSize);
var temp = array[unpickedSize-1];
array[unpickedSize-1] = array[n];
array[n] = temp;
unpickedSize--;
}
}
},
guid: {
value: function() {
var S4 = function() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
};
return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
},
droppable: {
value: function($e, callback) {
$e.bind("dragover", function(){
$(this).addClass("hover");
return false;
});
$e.bind("dragleave", function(){
$(this).removeClass("hover");
return false;
});
$e.bind("drop", function(e){
$(this).removeClass("hover");
e = e || window.event;
e.preventDefault();
// jQuery wraps the originalEvent, so we try to detect that here...
e = e.originalEvent || e;
utils: {
value: Object.create({}, {
shuffle: {
value: function(array) {
var unpickedSize = array.length;
while(unpickedSize > 0) {
var n = Math.floor(Math.random()*unpickedSize);
var temp = array[unpickedSize-1];
array[unpickedSize-1] = array[n];
array[n] = temp;
unpickedSize--;
}
}
},
guid: {
value: function() {
var S4 = function() {
return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
};
return (S4()+S4()+"-"+S4()+"-"+S4()+"-"+S4()+"-"+S4()+S4()+S4());
}
},
droppable: {
value: function($e, callback) {
$e.bind("dragover", function(){
$(this).addClass("hover");
return false;
});
$e.bind("dragleave", function(){
$(this).removeClass("hover");
return false;
});
$e.bind("drop", function(e){
$(this).removeClass("hover");
e = e || window.event;
e.preventDefault();
// jQuery wraps the originalEvent, so we try to detect that here...
e = e.originalEvent || e;
if(window.sankore) {
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;
}
var file = stringToXML(e.dataTransfer.getData("text/plain"));
callback({
src: $(file).find("path:eq(0)").text()
});
return false;
}
if(window.sankore) {
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;
}
var file = stringToXML(e.dataTransfer.getData("text/plain"));
callback({
src: $(file).find("path:eq(0)").text()
});
return false;
}
// Using e.files with fallback because e.dataTransfer is immutable and can't be overridden in Polyfills (http://sandbox.knarly.com/js/dropfiles/).
var files = (e.files || e.dataTransfer.files);
for (var i = 0; i < files.length; i++) {
// Loop through our files with a closure so each of our FileReader's are isolated.
(function (i) {
if(typeof FileReader !== "undefined") {
var reader = new FileReader();
reader.onload = function (event) {
callback({
src: event.target.result,
title: (files[i].name),
alt: (files[i].name)
});
};
reader.readAsDataURL(files[i]);
}
})(i);
}
return false;
});
}
}
})
}
// Using e.files with fallback because e.dataTransfer is immutable and can't be overridden in Polyfills (http://sandbox.knarly.com/js/dropfiles/).
var files = (e.files || e.dataTransfer.files);
for (var i = 0; i < files.length; i++) {
// Loop through our files with a closure so each of our FileReader's are isolated.
(function (i) {
if(typeof FileReader !== "undefined") {
var reader = new FileReader();
reader.onload = function (event) {
callback({
src: event.target.result,
title: (files[i].name),
alt: (files[i].name)
});
};
reader.readAsDataURL(files[i]);
}
})(i);
}
return false;
});
}
}
})
}
});
return self;
})();

@ -1,95 +1,117 @@
var just_a_flag = false;
function onTemplateLoadedCallback() {
}
function revert($e) {
var elmt = $e.css("left","auto").css("top", "auto").removeClass("inBox").get(0);
if(elmt)
elmt.className = elmt.className.replace(/(d(\d+))/, "");
var elmt = $e.css("left","auto").css("top", "auto").removeClass("inBox").get(0);
if(elmt)
elmt.className = elmt.className.replace(/(d(\d+))/, "");
}
function getN(range) {
if(range > 1)
return Math.floor(Math.random()*range);
else if(range == 1)
return Math.round(Math.random()*10)/10;
else if(range == 0.1)
return Math.round(Math.random()*0.1*100)/100;
if(range > 1)
return Math.floor(Math.random()*range);
else if(range == 1)
return Math.round(Math.random()*10)/10;
else if(range == 0.1)
return Math.round(Math.random()*0.1*100)/100;
}
function reloadApp(app) {
var operator = app.parameters.value("operator");
var range = parseFloat(app.parameters.value("range"));
var count = parseInt(app.parameters.value("count"));
$scene = $("#scene");
$scene.empty();
var operator = app.parameters.value("operator");
var range = parseFloat(app.parameters.value("range"));
var count = parseInt(app.parameters.value("count"));
var show = app.parameters.value("show");
if(!just_a_flag){
just_a_flag = true;
show = "3";
}
switch(show){
case "1":
$("#labels div div").each(function(){
$(this).css("top","auto").css("left","auto")
})
break;
case "2":
break;
default:
$scene = $("#scene");
$scene.empty();
$labels = $("<div id='labels'></div>");
$scene.append($labels);
$labels = $("<div id='labels'></div>");
$scene.append($labels);
$drops = $("<div id='drops'></div>");
$scene.append($drops);
$drops = $("<div id='drops'></div>");
$scene.append($drops);
var meeted = [];
var meeted = [];
for (var i = 0; i < count; i++) {
for (var i = 0; i < count; i++) {
var n = getN(range);
var n = getN(range);
while($.inArray(n, meeted) != -1)
n = getN(range);
while($.inArray(n, meeted) != -1)
n = getN(range);
meeted.push(n);
$label = $("<div id='l"+i+"' class='label'>"+n+"</div>");
$labels.append($label);
$label.wrap("<div/>");
$label.draggable({
containment: "#scene",
scroll: false,
snap: ".drop",
snapMode: "inner"
});
$drop = $("<div id='d"+i+"' class='drop'></div>");
$drops.append($drop);
$drop.droppable({
hoverClass: "ui-state-hover",
activeClass: "ui-state-active",
greedy: true,
drop: function(event, ui) {
var id = $(this).attr("id");
var $current = $(".inBox."+id);
if($current.size() > 0 && $current.attr("id") != ui.draggable.attr("id"))
revert($current);
ui.draggable.get(0).className = ui.draggable.get(0).className.replace(/(d(\d+))/, "");
ui.draggable.addClass("inBox").addClass(id);
}
});
if(i != count-1) {
$("<div class='operator'>"+operator+"</div>").appendTo($drops);
}
}
meeted.push(n);
$scene.droppable({
drop: function(event, ui) {
revert(ui.draggable);
}
});
break;
}
$label = $("<div id='l"+i+"' class='label'>"+n+"</div>");
$labels.append($label);
$label.wrap("<div/>");
$label.draggable({
containment: "#scene",
scroll: false,
snap: ".drop",
snapMode: "inner"
});
$drop = $("<div id='d"+i+"' class='drop'></div>");
$drops.append($drop);
$drop.droppable({
hoverClass: "ui-state-hover",
activeClass: "ui-state-active",
greedy: true,
drop: function(event, ui) {
var id = $(this).attr("id");
var $current = $(".inBox."+id);
if($current.size() > 0 && $current.attr("id") != ui.draggable.attr("id"))
revert($current);
ui.draggable.get(0).className = ui.draggable.get(0).className.replace(/(d(\d+))/, "");
ui.draggable.addClass("inBox").addClass(id);
}
});
if(i != count-1) {
$("<div class='operator'>"+operator+"</div>").appendTo($drops);
}
};
$scene.droppable({
drop: function(event, ui) {
revert(ui.draggable);
}
});
}
function reloadCallback(parameter) {
if(parameter === undefined)
reloadApp(this);
if(parameter === undefined)
reloadApp(this);
}
$(document).ready(function(){
var callbacks = {
onTemplatesLoaded: onTemplateLoadedCallback,
onEdit: reloadApp,
onView: reloadApp
};
init(reloadCallback, {toolbar: toolbarTemplate, parameters: parametersTemplate}, callbacks);
var callbacks = {
onTemplatesLoaded: onTemplateLoadedCallback,
onEdit: reloadApp,
onView: reloadApp
};
init(reloadCallback, {
toolbar: toolbarTemplate,
parameters: parametersTemplate
}, callbacks);
});

@ -132,6 +132,7 @@
position: relative;
overflow: hidden;
height: 100%;
width: 120px;
}
#result > div > div {
position: absolute;

@ -3,200 +3,205 @@ function onTemplateLoadedCallback() {
}
function editRow(app, index) {
var parameters = app.parameters;
var row = $("<div/>");
row.append("<div class='label'><div>"+fr.njin.i18n.transformation.row.label(index+1)+"</div></div>");
var cards = $("<div class='cards'/>");
row.append(cards);
var parameters = app.parameters;
var row = $("<div/>");
row.append("<div class='label'><div>"+fr.njin.i18n.transformation.row.label(index+1)+"</div></div>");
var cards = $("<div class='cards'/>");
row.append(cards);
var beforecontent = parameters.value("#"+index+"before");
var aftercontent = parameters.value("#"+index+"after");
var beforecontent = parameters.value("#"+index+"before");
var aftercontent = parameters.value("#"+index+"after");
var before = $("<div rel='before'><div class='switch'><label>"+fr.njin.i18n.transformation.label.usePicture+"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"+( beforecontent !== undefined ? beforecontent : "" )+"</div></div><div class='picture'><div></div><div class='dropzone'><div>"+fr.njin.i18n.transformation.label.drop+"</div></div></div></div><div class='label'>"+fr.njin.i18n.transformation.label.before+"</div></div>");
var after = $("<div rel='after'><div class='switch'><label>"+fr.njin.i18n.transformation.label.usePicture+"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"+( aftercontent !== undefined ? aftercontent : "" )+"</div></div><div class='picture'><div></div><div class='dropzone'><div>"+fr.njin.i18n.transformation.label.drop+"</div></div></div></div><div class='label'>"+fr.njin.i18n.transformation.label.after+"</div></div>");
var before = $("<div rel='before'><div class='switch'><label>"+fr.njin.i18n.transformation.label.usePicture+"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"+( beforecontent !== undefined ? beforecontent : "" )+"</div></div><div class='picture'><div></div><div class='dropzone'><div>"+fr.njin.i18n.transformation.label.drop+"</div></div></div></div><div class='label'>"+fr.njin.i18n.transformation.label.before+"</div></div>");
var after = $("<div rel='after'><div class='switch'><label>"+fr.njin.i18n.transformation.label.usePicture+"<input type='checkbox' name='switch'></label></div><div class='card'><div class='text'><div>"+( aftercontent !== undefined ? aftercontent : "" )+"</div></div><div class='picture'><div></div><div class='dropzone'><div>"+fr.njin.i18n.transformation.label.drop+"</div></div></div></div><div class='label'>"+fr.njin.i18n.transformation.label.after+"</div></div>");
makeEditable(app, before, index);
makeEditable(app, after, index);
makeEditable(app, before, index);
makeEditable(app, after, index);
cards.append(before);
cards.append(after);
cards.append(before);
cards.append(after);
return row;
return row;
}
function cards(app, index) {
var parameters = app.parameters;
var beforecard = $("<div class='part before closed'/>");
var aftercard = $("<div class='part after'/>");
var beforecontent = parameters.value("#"+index+"before");
var aftercontent = parameters.value("#"+index+"after");
var before = $("<div rel='before'><div class='card'><div class='text'><div>"+( beforecontent !== undefined ? beforecontent : "" )+"</div></div><div class='picture'><div></div></div></div></div>");
var after = $("<div rel='after'><div class='card'><div class='text'><div>"+( aftercontent !== undefined ? aftercontent : "" )+"</div></div><div class='picture'><div></div></div></div></div>");
var usePicture = parameters.value("#UsePicture"+index+"before") === "true"
|| parameters.value("#UsePicture"+index+"before") == true;
if(usePicture) {
before.addClass("usePicture");
var f = $.parseJSON(parameters.value("#Picture"+index+"before"));
if(f !== null) {
var $img = $('<img src="" class="uploadPic" title="" alt="" />').attr(f);
before.find(".picture>div:eq(0)").append($img);
}
}
usePicture = parameters.value("#UsePicture"+index+"after") === "true"
|| parameters.value("#UsePicture"+index+"after") == true;
if(usePicture) {
after.addClass("usePicture");
var f = $.parseJSON(parameters.value("#Picture"+index+"after"));
if(f !== null) {
var $img = $('<img src="" class="uploadPic" title="" alt="" />').attr(f);
after.find(".picture>div:eq(0)").append($img);
}
}
beforecard.append(before);
aftercard.append(after);
return [beforecard, aftercard];
var parameters = app.parameters;
var beforecard = $("<div class='part before closed'/>");
var aftercard = $("<div class='part after'/>");
var beforecontent = parameters.value("#"+index+"before");
var aftercontent = parameters.value("#"+index+"after");
var before = $("<div rel='before'><div class='card'><div class='text'><div>"+( beforecontent !== undefined ? beforecontent : "" )+"</div></div><div class='picture'><div></div></div></div></div>");
var after = $("<div rel='after'><div class='card'><div class='text'><div>"+( aftercontent !== undefined ? aftercontent : "" )+"</div></div><div class='picture'><div></div></div></div></div>");
var usePicture = parameters.value("#UsePicture"+index+"before") === "true"
|| parameters.value("#UsePicture"+index+"before") == true;
if(usePicture) {
before.addClass("usePicture");
var f = $.parseJSON(parameters.value("#Picture"+index+"before"));
if(f !== null) {
var $img = $('<img src="" class="uploadPic" title="" alt="" />').attr(f);
before.find(".picture>div:eq(0)").append($img);
}
}
usePicture = parameters.value("#UsePicture"+index+"after") === "true"
|| parameters.value("#UsePicture"+index+"after") == true;
if(usePicture) {
after.addClass("usePicture");
var f = $.parseJSON(parameters.value("#Picture"+index+"after"));
if(f !== null) {
var $img = $('<img src="" class="uploadPic" title="" alt="" />').attr(f);
after.find(".picture>div:eq(0)").append($img);
}
}
beforecard.append(before);
aftercard.append(after);
return [beforecard, aftercard];
}
function makeEditable(app, row, index) {
var parameters = app.parameters;
var editable = row.find(".text>div").eq(0);
var key = index+editable.parent().parent().parent().attr('rel');
editable.get(0).contentEditable = true;
editable.bind('blur keyup paste', function(){
parameters.value("#"+key, $(this).html());
});
var checkbox = row.find("input[name='switch']");
function setSwicth() {
var val = parameters.value("#UsePicture"+key) === "true"
|| parameters.value("#UsePicture"+key) === true;
if(val) {
row.addClass("usePicture");
}else {
row.removeClass("usePicture");
}
checkbox.attr("checked", val);
}
checkbox.change(function() {
parameters.value("#UsePicture"+key, $(this).is(':checked'));
setSwicth();
});
setSwicth();
var dropzone = row.find(".dropzone");
var pictureHolder = dropzone.parent().find(">div:eq(0)");
var parameters = app.parameters;
var editable = row.find(".text>div").eq(0);
var key = index+editable.parent().parent().parent().attr('rel');
editable.get(0).contentEditable = true;
editable.bind('blur keyup paste', function(){
parameters.value("#"+key, $(this).html());
});
var checkbox = row.find("input[name='switch']");
function setSwicth() {
var val = parameters.value("#UsePicture"+key) === "true"
|| parameters.value("#UsePicture"+key) === true;
if(val) {
row.addClass("usePicture");
}else {
row.removeClass("usePicture");
}
checkbox.attr("checked", val);
}
checkbox.change(function() {
parameters.value("#UsePicture"+key, $(this).is(':checked'));
setSwicth();
});
setSwicth();
var dropzone = row.find(".dropzone");
var pictureHolder = dropzone.parent().find(">div:eq(0)");
function setPicture() {
var f = $.parseJSON(parameters.value("#Picture"+key));
if(f !== null) {
var $img = $('<img src="" class="uploadPic" title="" alt="" />').attr(f);
pictureHolder.empty();
pictureHolder.append($img);
}
}
function setPicture() {
var f = $.parseJSON(parameters.value("#Picture"+key));
if(f !== null) {
var $img = $('<img src="" class="uploadPic" title="" alt="" />').attr(f);
pictureHolder.empty();
pictureHolder.append($img);
}
}
app.utils.droppable(dropzone, function(f) {
parameters.value("#Picture"+key, JSON.stringify(f));
setPicture();
});
setPicture();
app.utils.droppable(dropzone, function(f) {
parameters.value("#Picture"+key, JSON.stringify(f));
setPicture();
});
setPicture();
}
function reloadApp(app) {
var number = app.parameters.value("number");
var scene = $("#scene");
scene.empty();
if(app.onEdit) {
var editcards = $("#edit-cards");
editcards.empty();
for(var i=0 ; i<number ; i++) {
editcards.append(editRow(app, i));
}
return;
}
var table = $("<div id='table'/>");
scene.append(table);
var before = $("<div class='deck before'><div></div></div>");
var box = $("<div class='box'><div></div></div>");
var after = $("<div class='deck after'><div></div></div>");
if(number === 0)
before.addClass("empty");
after.addClass("empty");
table.append(before);
table.append(box);
table.append(after);
box.find(">div").css("z-index", number+1);
var beforeDeck = before.find(">div");
var afterDeck = after.find(">div");
var beforeLeftPosition = box.find(">div").position().left - beforeDeck.position().left + 10 + 40; //10px de padding dans la box + 40px d'ombre dans l'image
function makeCard(i, cards) {
beforeDeck.append(cards[0]);
afterDeck.append(cards[1]);
cards[1].css("left", -beforeLeftPosition+"px");
cards[1].css("z-index", i);
var number = app.parameters.value("number");
var scene = $("#scene");
scene.empty();
if(app.onEdit) {
var editcards = $("#edit-cards");
editcards.empty();
for(var i=0 ; i<number ; i++) {
editcards.append(editRow(app, i));
}
if(window.sankore)
window.sankore.enableDropOnWidget(app.onEdit);
return;
}
var table = $("<div id='table'/>");
scene.append(table);
var before = $("<div class='deck before'><div></div></div>");
var box = $("<div class='box'><div></div></div>");
var after = $("<div class='deck after'><div></div></div>");
if(number === 0)
before.addClass("empty");
after.addClass("empty");
table.append(before);
table.append(box);
table.append(after);
box.find(">div").css("z-index", number+1);
var beforeDeck = before.find(">div");
var afterDeck = after.find(">div");
var beforeLeftPosition = box.find(">div").position().left - beforeDeck.position().left + 10 + 40; //10px de padding dans la box + 40px d'ombre dans l'image
function makeCard(i, cards) {
beforeDeck.append(cards[0]);
afterDeck.append(cards[1]);
cards[1].css("left", -beforeLeftPosition+"px");
cards[1].css("z-index", i);
cards[0].click(function(e) {
var c = $(this);
c.removeClass("closed");
c.unbind(e);
setTimeout(function(){
c.animate({
left : beforeLeftPosition
}, 1000, function(){
setTimeout(function(){
cards[1].animate({
left: 0
}, 1000, function(){
after.removeClass("empty");
});
}, 1000);
c.remove();
});
if(i === 0) {
before.addClass("empty");
}
}, 3000);
cards[0].click(function(e) {
var c = $(this);
c.removeClass("closed");
c.unbind(e);
setTimeout(function(){
c.animate({
left : beforeLeftPosition
}, 1000, function(){
setTimeout(function(){
cards[1].animate({
left: 0
}, 1000, function(){
after.removeClass("empty");
});
}, 1000);
c.remove();
});
if(i === 0) {
before.addClass("empty");
}
}, 3000);
});
}
});
}
for(var i=number ; i>0 ; i--) {
makeCard(i-1, cards(app, i-1));
}
for(var i=number ; i>0 ; i--) {
makeCard(i-1, cards(app, i-1));
}
if(window.sankore)
window.sankore.enableDropOnWidget(app.onEdit);
if(window.sankore)
window.sankore.enableDropOnWidget(app.onEdit);
}
function reloadCallback(parameter) {
if(parameter === undefined || parameter.key === "number" )
reloadApp(this);
if(parameter === undefined || parameter.key === "number" )
reloadApp(this);
}
$(document).ready(function(){
var callbacks = {
onTemplatesLoaded: onTemplateLoadedCallback,
onEdit: reloadApp,
onView: reloadApp
};
init(reloadCallback, {toolbar: toolbarTemplate, parameters: parametersTemplate}, callbacks);
var callbacks = {
onTemplatesLoaded: onTemplateLoadedCallback,
onEdit: reloadApp,
onView: reloadApp
};
init(reloadCallback, {
toolbar: toolbarTemplate,
parameters: parametersTemplate
}, callbacks);
});
Loading…
Cancel
Save