suzanne.soy/2011-grunt-lang
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Nettoyage du code, blocs déplacables.

Browse Source 
* Nouvelle "forme" boundingRect : crée un rectangle contenant toutes les formes passées en paramètre, avec une marge optionnelle.
* Nouvelle "forme" marginText : crée un texte dont le coin en haut à gauche est à la position demandée, + marge. Peu utile maintenant qu'on a boundingRect.
* Drag'n'drop, qui fonctionne sur le set grâce aux paramètres non documentés de drag() :)
* Masquage du message indiquant que JavaScript est nécessaire au fonctionnement de l'application.
This commit is contained in:
Georges Dupéron 2011-02-13 22:52:42 +01:00
parent 9c653e23b3
commit 9275b37787
1 changed files with 47 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
grunt.js
View File

@ -1,32 +1,66 @@
function drawText(x,y,text,margin) {
margin = (margin == null) ? 10 : margin;
var t = r.text(0,0,text);
Raphael.fn.marginText = function (x,y,text,margin) {
margin = isNaN(+margin) ? 10 : margin;
var t = this.text(0,0,text);
var size = t.getBBox();
var marginRect = r.rect(size.x - margin, size.y - margin, size.width + 2*margin, size.height + 2*margin).hide().attr("stroke-width", 0);
return r.set().push(t,marginRect).translate(margin+x-size.x, margin+y-size.y);
}
t.translate(margin+x-size.x, margin+y-size.y);
// TODO : surcharger les méthodes permettant de faire un set! sur x et y.
var getBBox = t.getBBox;
t.getBBox = function() {
var bBox = getBBox.call(this);
bBox.x -= margin;
bBox.y -= margin;
bBox.width += 2*margin;
bBox.height += 2*margin;
return bBox
};
return t;
};
Raphael.fn.boundingRect = function(margin) {
margin = +margin || 0;
var set = this.set();
set.push.apply(set,arguments);
var size = set.getBBox();
var rect = this.rect(size.x-margin, size.y-margin, size.width+2*margin, size.height+2*margin);
rect.set = set.push(rect);
return rect;
};
function Block(name) {
this.name = name;
this.draw = function(x,y) {
var name = drawText(x,y,this.name);
var size = name.getBBox();
var block = r.rect(x, y, size.width, 50 + size.height).insertBefore(name).attr({
var name = r.text(x,y,this.name);
var block = r.boundingRect(10, name).insertBefore(name).attr({
stroke: this.borderColor,
fill: this.fillColor
});
return r.set().push(block, name);
var start = function () {
this.oldDx = 0;
this.oldDy = 0;
this.attr({opacity: 0.5});
};
var move = function (dx, dy) {
this.translate(dx-this.oldDx, dy-this.oldDy);
this.oldDx = dx;
this.oldDy = dy;
};
var up = function () {
this.attr({opacity: 1});
};
block.set.drag(move, start, up, block.set, block.set, block.set);
return block.set;
};
}
};
// Colors
Block.prototype.borderColor = "#000";
Block.prototype.fillColor = "#ff8";
function init() {
$('noscript').hide();
r = Raphael("ide", 640, 480);
new Block("Block 1").draw(150, 100);
new Block("My pretty block").draw(30, 200);
b1 = new Block("Block 1").draw(150, 100);
b2 = new Block("My pretty block").draw(30, 200);
}
new Event.observe(window, 'load', init);