You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
325 lines
8.0 KiB
325 lines
8.0 KiB
var weighValues = [500,200,100,50,20,10];
|
|
|
|
function onTemplateLoadedCallback(app) {
|
|
$.each(weighValues, function(){
|
|
$("#weights").append($(Mustache.render(weightTemplate, {weight: this})));
|
|
});
|
|
|
|
$("#weights > .weight").draggable({helper: "clone"});
|
|
|
|
$("#leftScale").droppable({
|
|
accept: ".object",
|
|
drop: function(event, ui) {
|
|
if($(ui.draggable).hasClass("inScale"))
|
|
return;
|
|
|
|
var object = $(ui.draggable).clone();
|
|
object.data("weight", $(ui.draggable).data("weight"));
|
|
|
|
object.addClass("inScale");
|
|
$("#leftScale").append(object);
|
|
|
|
placeObject($("#leftScale"), object);
|
|
|
|
refreshScales();
|
|
|
|
object.draggable({
|
|
stop: function(event, ui) {
|
|
if($(ui.helper).hasClass("onOut")) {
|
|
$(ui.helper).remove();
|
|
refreshScales();
|
|
}
|
|
}
|
|
});
|
|
},
|
|
out: function(event, ui) {
|
|
$(ui.draggable).addClass("onOut");
|
|
},
|
|
over: function(event, ui) {
|
|
$(ui.draggable).removeClass("onOut");
|
|
}
|
|
});
|
|
|
|
$("#rightScale").droppable({
|
|
accept: ".weight.right",
|
|
drop: function(event, ui) {
|
|
if($(ui.draggable).hasClass("inScale"))
|
|
return;
|
|
var object = createWeight(app, $(ui.draggable).data("weight"));
|
|
|
|
$("#rightScale").append(object);
|
|
|
|
placeObject($("#rightScale"), object);
|
|
|
|
refreshScales();
|
|
},
|
|
out: function(event, ui) {
|
|
$(ui.draggable).addClass("onOut");
|
|
},
|
|
over: function(event, ui) {
|
|
$(ui.draggable).removeClass("onOut");
|
|
}
|
|
});
|
|
|
|
$("#objects button[role=add]").click(function(){
|
|
var object = createObject(app);
|
|
$(this).before(object);
|
|
});
|
|
}
|
|
|
|
function addObjectWithId(app, id) {
|
|
var objects = app.parameters.value("Objects");
|
|
app.parameters.value("Objects", objects === undefined ? id : objects+","+id);
|
|
}
|
|
|
|
function removeObjectWithId(app, id) {
|
|
var objects = app.parameters.value("Objects");
|
|
objects = objects.split(",");
|
|
for(var i=0 ; i<objects.length ; i++) {
|
|
if(id === objects[i]) {
|
|
objects.splice(i, 1);
|
|
break;
|
|
}
|
|
}
|
|
app.parameters.value("Objects", objects.join(","));
|
|
}
|
|
|
|
function addWeightWithId(app, id) {
|
|
var objects = app.parameters.value("Weights");
|
|
app.parameters.value("Weights", objects === undefined ? id : objects+","+id);
|
|
}
|
|
|
|
function removeWeightWithId(app, id) {
|
|
var objects = app.parameters.value("Weights");
|
|
objects = objects.split(",");
|
|
for(var i=0 ; i<objects.length ; i++) {
|
|
if(id === objects[i]) {
|
|
objects.splice(i, 1);
|
|
break;
|
|
}
|
|
}
|
|
app.parameters.value("Weights", objects.join(","));
|
|
}
|
|
|
|
function objectForGUID(app, guid) {
|
|
window.object = guid;
|
|
var objectUi = $(Mustache.render(objectTemplate, window));
|
|
var weight = getWeightFor(app.parameters, guid);
|
|
|
|
if(!app.onEdit && (weight == undefined || $.trim(weight) == ""))
|
|
weight = weighValues[Math.floor(Math.random()*weighValues.length)];
|
|
|
|
if(weight !== undefined) {
|
|
objectUi.data("weight", weight);
|
|
objectUi.find("input[name=weight]").val(weight);
|
|
}
|
|
if(app.onEdit) {
|
|
objectUi.find("input[name=weight]").change(function(event) {
|
|
var o = objectUi;
|
|
o.data("weight", $(this).val());
|
|
setWeightFor(app.parameters, o.attr("id"), $(this).val());
|
|
});
|
|
objectUi.find("button[role=remove]").click(function(){
|
|
removeObjectWithId(app, guid);
|
|
objectUi.remove();
|
|
});
|
|
objectUi.find("button[role=duplicate]").click(function(){
|
|
$("#objects button[role=add]").before(createObject(app, guid));
|
|
});
|
|
}else{
|
|
objectUi.find("input[name=weight]").attr("disabled","disabled");
|
|
objectUi.draggable({
|
|
containment: "#scene",
|
|
scroll: false,
|
|
helper: "clone"
|
|
});
|
|
}
|
|
return objectUi;
|
|
}
|
|
|
|
function weightForGUID(app, guid) {
|
|
var weight = getWeightValueFor(app.parameters, guid);
|
|
window.object = guid;
|
|
window.weight = weight;
|
|
var objectUi = $(Mustache.render(weightTemplate, window));
|
|
var position = getPositionFor(app.parameters, guid);
|
|
objectUi.css("left", position.left);
|
|
objectUi.css("top", position.top);
|
|
objectUi.addClass("inScale");
|
|
if(app.onEdit) {
|
|
objectUi.draggable({
|
|
stop: function(event, ui) {
|
|
if($(ui.helper).hasClass("onOut")) {
|
|
removeWeightWithId(app, $(ui.helper).attr('id'));
|
|
$(ui.helper).remove();
|
|
refreshScales();
|
|
}else{
|
|
var id = ui.helper.attr("id");
|
|
var left = ui.position.left ;
|
|
var top = ui.position.top;
|
|
log(left+"-"+top);
|
|
setPositionFor(app.parameters, id, ui.position);
|
|
}
|
|
}
|
|
});
|
|
}else{
|
|
}
|
|
return objectUi;
|
|
}
|
|
|
|
function placeObject($container, $object) {
|
|
|
|
var width = $object.outerHeight();
|
|
var height = $object.outerHeight()+15;
|
|
|
|
var count = $container.children().size() - 1;
|
|
|
|
var left = width * (count % 4) + 5;
|
|
var bottom = height * (Math.floor(count / 4)) + 12;
|
|
|
|
log("Place at ["+left+" , "+bottom+"]");
|
|
$object.css("left", left+"px").css("bottom", bottom+"px");
|
|
}
|
|
|
|
function createObject(app, duplicateID) {
|
|
var id = app.utils.guid();
|
|
addObjectWithId(app, id);
|
|
|
|
//TODO Duplication : Recupérer les images du dupliqué
|
|
|
|
return objectForGUID(app, id);
|
|
}
|
|
|
|
function createWeight(app, weight) {
|
|
var id = app.utils.guid();
|
|
addWeightWithId(app, id);
|
|
setWeightValueFor(app.parameters, id, weight);
|
|
return weightForGUID(app, id);
|
|
}
|
|
|
|
function getWeightFor(parameters, id) {
|
|
return parameters.value("Object#"+id+"Weight");
|
|
}
|
|
|
|
function setWeightFor(parameters, id, weight) {
|
|
parameters.value("Object#"+id+"Weight", weight);
|
|
}
|
|
|
|
function getWeightValueFor(parameters, id) {
|
|
return parameters.value("Weight#"+id+"Weight");
|
|
}
|
|
|
|
function setWeightValueFor(parameters, id, weight) {
|
|
parameters.value("Weight#"+id+"Weight", weight);
|
|
}
|
|
|
|
function getPositionFor(parameters, id) {
|
|
var left = parameters.value("Weight#"+id+"left");
|
|
var top = parameters.value("Weight#"+id+"top");
|
|
return {left: parseInt(left), top: parseInt(top)};
|
|
}
|
|
|
|
function setPositionFor(parameters, id, position) {
|
|
parameters.value("Weight#"+id+"left", position.left);
|
|
parameters.value("Weight#"+id+"top", position.top);
|
|
}
|
|
|
|
function reloadApp(app) {
|
|
$("#leftScale, #rightScale").empty();
|
|
$("#objects > .object").remove();
|
|
|
|
refreshScales();
|
|
|
|
var objects = app.parameters.value("Objects");
|
|
if(objects !== undefined) {
|
|
objects = objects.split(",");
|
|
for(var i=0 ; i<objects.length ; i++) {
|
|
var id = objects[i];
|
|
var object = objectForGUID(app, id);
|
|
$("#objects button[role=add]").before(object);
|
|
}
|
|
}
|
|
|
|
var weights = app.parameters.value("Weights");
|
|
if(weights !== undefined) {
|
|
weights = weights.split(",");
|
|
for(var i=0 ; i<weights.length ; i++) {
|
|
var id = weights[i];
|
|
var weight = weightForGUID(app, id);
|
|
$("#rightScale").append(weight);
|
|
placeObject($("#rightScale"), weight);
|
|
}
|
|
}
|
|
|
|
refreshScales();
|
|
|
|
if(app.onEdit) {
|
|
|
|
}
|
|
}
|
|
|
|
function refreshScales() {
|
|
var leftWeight = getLeftWeight();
|
|
var rightWeight = getRightWeight();
|
|
var dWeight = rightWeight - leftWeight;
|
|
var angle = maxAngle * dWeight / maxWeight;
|
|
angle = angle >= 0 ? Math.min(maxAngle, angle) : Math.max(-maxAngle, angle);
|
|
var rad = angle * Math.PI / 180;
|
|
|
|
var w = $("#tray").width()/2;
|
|
var dx = w - (w * Math.cos(rad));
|
|
var dy = -(w * Math.sin(rad));
|
|
|
|
log("Rotate to "+angle);
|
|
log("Tanslate to ["+dx+" , "+dy+"]");
|
|
|
|
var rotate = "rotate("+angle+"deg)";
|
|
var leftTranslate = "translate("+dx+"px, "+dy+"px)";
|
|
var rightTranslate = "translate("+(-dx)+"px, "+(-dy)+"px)";
|
|
|
|
$("#tray").css("transform", rotate);
|
|
$("#leftScale").css("transform", leftTranslate);
|
|
$("#rightScale").css("transform", rightTranslate);
|
|
}
|
|
|
|
function getWeightForSelector(selector) {
|
|
var weight = 0;
|
|
$(selector).each(function(){
|
|
var temp = $(this).data("weight");
|
|
if(temp !== undefined)
|
|
weight += parseInt(temp);
|
|
});
|
|
return weight;
|
|
}
|
|
|
|
function getLeftWeight() {
|
|
return getWeightForSelector("#leftScale > div");
|
|
}
|
|
|
|
function getRightWeight() {
|
|
return getWeightForSelector("#rightScale > div");
|
|
}
|
|
|
|
function reloadCallback(parameter) {
|
|
if(parameter === undefined)
|
|
reloadApp(this);
|
|
}
|
|
|
|
var maxAngle;
|
|
var maxWeight;
|
|
|
|
$(document).ready(function(){
|
|
var w = $("#scales").width();
|
|
var h = $("#scales").height();
|
|
maxAngle = 17;//Math.atan((h/2)/(w/2)) * (180/Math.PI);
|
|
maxWeight = 10;
|
|
|
|
log(w+"-"+h+":"+maxAngle);
|
|
|
|
var callbacks = {
|
|
onTemplatesLoaded: onTemplateLoadedCallback,
|
|
onEdit: reloadApp,
|
|
onView: reloadApp
|
|
};
|
|
init(reloadCallback, {toolbar: toolbarTemplate, parameters: parametersTemplate}, callbacks);
|
|
}); |