preferencesAboutTextFull
shibakaneki 12 years ago
commit 473b251514
  1. BIN
      resources/library/interactivities/Transformation.wgt/css/images/trgDown.png
  2. BIN
      resources/library/interactivities/Transformation.wgt/css/images/trgLeft.png
  3. BIN
      resources/library/interactivities/Transformation.wgt/css/images/trgRight.png
  4. BIN
      resources/library/interactivities/Transformation.wgt/css/images/trgUp.png
  5. 57
      resources/library/interactivities/Transformation.wgt/css/ubw-main.css
  6. 481
      resources/library/interactivities/Transformation.wgt/js/lib/ubw-main.js
  7. 339
      resources/library/interactivities/Transformation.wgt/js/main.js

Binary file not shown.

After

Width:  |  Height:  |  Size: 475 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 434 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 447 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 448 B

@ -6,6 +6,63 @@ html, body {
color: #666666; color: #666666;
} }
::-webkit-scrollbar {
width: 14px;
}
::-webkit-scrollbar-thumb {
/*border-radius: 10px; */
background-color:lightgray;
border: 2px solid gray;
}
::-webkit-scrollbar-button:vertical:start{
border-top-right-radius: 10px;
border-top-left-radius: 10px;
background-color:lightgray;
background-image: url(images/trgUp.png);
background-size: 8px auto;
background-position: center;
background-repeat: no-repeat;
border: 2px solid gray;
}
::-webkit-scrollbar-button:vertical:end{
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
background-color:lightgray;
background-image: url(images/trgDown.png);
background-size: 8px auto;
background-position: center;
background-repeat: no-repeat;
border: 2px solid gray;
}
::-webkit-scrollbar-button:horizontal:start{
width: 14px;
border-bottom-left-radius: 10px;
border-top-left-radius: 10px;
background-color:lightgray;
background-image: url(images/trgLeft.png);
background-size: 8px auto;
background-position: center;
background-repeat: no-repeat;
border: 2px solid gray;
}
::-webkit-scrollbar-button:horizontal:end{
width: 14px;
border-bottom-right-radius: 10px;
border-top-right-radius: 10px;
background-color:lightgray;
background-image: url(images/trgRight.png);
background-size: 8px auto;
background-position: center;
background-repeat: no-repeat;
border: 2px solid gray;
}
#ubwidget { #ubwidget {
position: absolute; position: absolute;
top: 0; top: 0;

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

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