новые иконки в OpenBoard
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.
OpenBoard/resources/library/interactivities/Scale.wgt/js/main.js

334 lines
8.3 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) {
var object = createObject(app);
setWeightFor(app.parameters, object.attr("id"), 5);
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) {
createWeight(app, 20);
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);
});