Permalink
Browse files

Reacts on window resize

-updated raphael.js (v2.0.1)
  • Loading branch information...
1 parent a0f70d5 commit 4a35b3123f6eb03e1bba2c0a5a19fd8fa58acad7 @marcelklehr committed Dec 31, 2011
Showing with 41 additions and 138 deletions.
  1. +21 −13 buzzmap.js
  2. +12 −12 buzzmap.min.js
  3. +8 −113 raphael.min.js
View
34 buzzmap.js
@@ -380,8 +380,8 @@
var y = parseInt(this.parent.el.css('top'));
}else
{// root
- var x = this.obj.options.mapArea.x/2;
- var y = this.obj.options.mapArea.y/2;
+ var x = this.obj.width/2;
+ var y = this.obj.height/2;
}
this.setPosition(x,y);
}
@@ -430,8 +430,8 @@
//apply velocity vector
this.x += this.dx * this.obj.options.acceleration;
this.y += this.dy * this.obj.options.acceleration;
- this.x = Math.min(this.obj.options.mapArea.x,Math.max(1,this.x));
- this.y = Math.min(this.obj.options.mapArea.y,Math.max(1,this.y));
+ this.x = Math.min(this.obj.width,Math.max(1,this.x));
+ this.y = Math.min(this.obj.height,Math.max(1,this.y));
// display
var showx = this.x - ($(this.el).width() / 2);
@@ -490,14 +490,14 @@
var f = (this.obj.options.wallrepulse * 500) / (xdist * xdist);
fx += Math.min(2, f);
//right wall
- var rightdist = (this.obj.options.mapArea.x - xdist);
+ var rightdist = (this.obj.width - xdist);
var f = -(this.obj.options.wallrepulse * 500) / (rightdist * rightdist);
fx += Math.max(-2, f);
//top wall
var f = (this.obj.options.wallrepulse * 500) / (this.y * this.y);
fy += Math.min(2, f);
//bottom wall
- var bottomdist = (this.obj.options.mapArea.y - this.y);
+ var bottomdist = (this.obj.height - this.y);
var f = -(this.obj.options.wallrepulse * 500) / (bottomdist * bottomdist);
fy += Math.max(-2, f);
@@ -631,26 +631,34 @@
this.fps = 0;
window.setInterval(function() {
- var fps = obj.fps;
+ var fps = obj.fps * 2;
obj.fps = 0;
obj.trigger('fps', fps);
- }, 1000);
+ }, 500);
// root node
this.root = this.nodes[0] = new Node(this, null, '<span>__ROOT__</span>');
$(window).resize(function () {
- obj.animate();
+ obj.createCanvas();
+ obj.animate();
});
- //create drawing area (canvas)
- if (this.options.mapArea.x==-1) this.options.mapArea.x = $(window).width();
- if (this.options.mapArea.y==-1) this.options.mapArea.y = $(window).height();
- this.canvas = Raphael(0, 0, this.options.mapArea.x, this.options.mapArea.y);
+ obj.createCanvas();
};
MicroEvent.mixin(Buzzmap);
+ Buzzmap.prototype.createCanvas = function() {
+ this.height = (this.options.mapArea.y == -1) ? $(window).height() : this.options.mapArea.y;
+ this.width = (this.options.mapArea.x == -1) ? $(window).width() : this.options.mapArea.x;
+ if(!this.canvas){
+ this.canvas = Raphael(0, 0, this.width, this.height);
+ }else{
+ this.canvas.setSize(this.width, this.height);
+ }
+ };
+
Buzzmap.prototype.addNode = function (parent, label)
{
var node = this.nodes[this.nodes.length] = new Node(this, parent, label);
View
24 buzzmap.min.js
@@ -6,15 +6,15 @@ this.el.addClass("active");this.el.mouseup(function(){if(i.editing==!0||i.draggi
b+"</span>");a.editing=a.obj.editing=!1;a.obj.animate()},i=d('<input class="edit-field" type="text" />').val(b);i.keyup(function(b){b=b.which;if(b===27)e();else if(b===13)b=i.val(),a.label("<span>"+b+"</span>"),a.obj.trigger("onchange",a,a.obj.serialize()),a.obj.editing=a.editing=!1,a.obj.animate();return!0});i.appendTo(a.el).focus().select();d('<button class="edit-button">+</button>').click(function(){e();a.el.addClass("active");a.obj.addNode(a).edit();return!1}).appendTo(a.el);a!==this.obj.root&&
d('<button class="edit-button">x</button>').click(function(){e();a.removeNode();a.obj.animate();return!1}).appendTo(a.el);return!1};g.prototype.removeNode=function(){this.obj.trigger("onremove",this);for(var a=0;a<this.children.length;a++)this.children[a].removeNode();this.parent&&this.parent.children.splice(this.parent.children.indexOf(this),1);this.obj.nodes.splice(this.obj.nodes.indexOf(this),1);var b=this.obj.lines;this.obj.lines=[];for(a=0;a<b.length;a++)b[a].start===this||b[a].end===this||this.obj.lines.push(b[a]);
d(this.el).remove();this.obj.trigger("onchange",this,this.obj.serialize());this.obj.animate()};g.prototype.findEquilibrium=function(){for(var a=!this.parent?!0:this.display(),b=0;b<this.children.length;b++)if(this.children[b].visible||this.el.hasClass("active"))a=this.children[b].findEquilibrium()&&a;return a};g.prototype.hide=function(){this.obj.trigger("onhide",this);this.el.removeClass("active");this.el.hide();this.hasPosition=this.visible=!1};g.prototype.show=function(){this.el.show();this.visible=
-!0;this.obj.trigger("onshow",this)};g.prototype.setPosition=function(a,b){this.x=a;this.y=b;this.el.css("left",a+"px");this.el.css("top",b+"px");this.hasPosition=!0};g.prototype.display=function(){this.visible?this.parent.el.hasClass("active")||this.hide():(this.parent.parent===null||this.parent.el.hasClass("active"))&&this.show();if(!this.visible)return!0;if(!this.hasPosition){if(this.parent.parent!==null)var a=parseInt(this.parent.el.css("left")),b=parseInt(this.parent.el.css("top"));else a=this.obj.options.mapArea.x/
-2,b=this.obj.options.mapArea.y/2;this.setPosition(a,b)}var e=Math.PI*2/this.children.length,i=this;d.each(this.children,function(a){if(!this.visible){var b=a*e,a=50*Math.cos(b)+i.x,b=50*Math.sin(b)+i.y;this.setPosition(a,b)}});return this.updatePosition()};g.prototype.updatePosition=function(){if(d(this.el).hasClass("ui-draggable-dragging"))return this.x=parseInt(this.el.css("left"))+d(this.el).width()/2,this.y=parseInt(this.el.css("top"))+d(this.el).height()/2,this.dy=this.dx=0,!1;var a=this.getForceVector();
-this.dx+=a.x*this.obj.options.acceleration;this.dy+=a.y*this.obj.options.acceleration;this.dx*=this.obj.options.damping;this.dy*=this.obj.options.damping;if(Math.abs(this.dx)<this.obj.options.minSpeed)this.dx=0;if(Math.abs(this.dy)<this.obj.options.minSpeed)this.dy=0;if(Math.abs(this.dx)+Math.abs(this.dy)==0)return!0;this.x+=this.dx*this.obj.options.acceleration;this.y+=this.dy*this.obj.options.acceleration;this.x=Math.min(this.obj.options.mapArea.x,Math.max(1,this.x));this.y=Math.min(this.obj.options.mapArea.y,
-Math.max(1,this.y));var a=this.x-d(this.el).width()/2,b=this.y-d(this.el).height()/2-10;this.el.css("left",a+"px");this.el.css("top",b+"px");return!1};g.prototype.getForceVector=function(){for(var a=0,b=0,e=this.obj.nodes,d=this.obj.lines,f=0;f<e.length;f++)if(e[f]!==this&&(!this.obj.options.showSublines||e[f].hasPosition)&&e[f].visible){var c=e[f].x-this.x,h=e[f].y-this.y,j=c/Math.abs(c);Math.abs(h);var g=Math.sqrt(c*c+h*h),h=Math.atan(h/c);c===0&&(h=Math.PI/2,j=0);c=this.obj.options.repulse*500/
-(g*g);Math.abs(g)<500&&(a+=-c*Math.cos(h)*j,b+=-c*Math.sin(h)*j)}f=this.x+this.el.width();c=this.obj.options.wallrepulse*500/(f*f);a+=Math.min(2,c);f=this.obj.options.mapArea.x-f;c=-(this.obj.options.wallrepulse*500)/(f*f);a+=Math.max(-2,c);c=this.obj.options.wallrepulse*500/(this.y*this.y);b+=Math.min(2,c);f=this.obj.options.mapArea.y-this.y;c=-(this.obj.options.wallrepulse*500)/(f*f);b+=Math.max(-2,c);for(f=0;f<d.length;f++){e=null;if(d[f].start===this)e=d[f].end;else if(d[f].end===this)e=d[f].start;
-else continue;e.visible&&(c=e.x-this.x,h=e.y-this.y,g=Math.sqrt(c*c+h*h),j=c/Math.abs(c),h=Math.atan(h/c),c==0&&(h=Math.PI/2,j=0),c=this.obj.options.attract*g/1E4,Math.abs(g)>0&&(a+=c*Math.cos(h)*j,b+=c*Math.sin(h)*j))}if(!this.parent)e=this.obj.options.mapArea,c=e.x/2-this.obj.options.centerOffset-this.x,h=e.y/2-this.y,g=Math.sqrt(c*c+h*h),j=c/Math.abs(c),h=Math.atan(h/c),c===0&&(h=Math.PI/2,j=0),c=0.1*this.obj.options.attract*g*this.obj.options.centerAttraction/1E3,Math.abs(g)>0&&(a+=c*Math.cos(h)*
-j,b+=c*Math.sin(h)*j);Math.abs(a)>this.obj.options.maxForce&&(a=this.obj.options.maxForce*(a/Math.abs(a)));Math.abs(b)>this.obj.options.maxForce&&(b=this.obj.options.maxForce*(b/Math.abs(b)));return{x:a,y:b}};d.fn.buzzmap=function(a){var b=d(this).filter("ul");b.hasClass("buzzmap-active")||b.each(function(){var b=new k(d(this),a);b.el.addClass("buzzmap-active");b.el[0].obj=b;if(b.options.loadData){var g=d.parseJSON(a.loadData),f=function(a,c){d.each(c,function(c,d){node=b.addNode(a,decodeURI(d.label));
-f(node,d.children)})};d.each(g.children,function(a,c){node=b.addNode(b.root,decodeURI(c.label));f(node,c.children)})}else{var c=function(){var a=d(this).parents("li").get(0),a=typeof a==="undefined"?b.root:a.mynode;this.mynode=b.addNode(a,d("div:eq(0)",this).html());d(this).hide();d(">ul>li",this).each(c)};d(">li",b.el).each(c)}b.animate()});return b[0].obj};var k=function(a,b){var e=this;this.el=a;this.nodes=[];this.lines=[];this.parseOptions(b);this.movementStopped=this.editing=this.moving=!1;this.fps=
-0;window.setInterval(function(){var a=e.fps;e.fps=0;e.trigger("fps",a)},1E3);this.root=this.nodes[0]=new g(this,null,"<span>__ROOT__</span>");d(window).resize(function(){e.animate()});if(this.options.mapArea.x==-1)this.options.mapArea.x=d(window).width();if(this.options.mapArea.y==-1)this.options.mapArea.y=d(window).height();this.canvas=Raphael(0,0,this.options.mapArea.x,this.options.mapArea.y)};l.mixin(k);k.prototype.addNode=function(a,b){var d=this.nodes[this.nodes.length]=new g(this,a,b);this.animate();
-return d};k.prototype.serialize=function(){return this.root.serialize()};k.prototype.animate=function(){var a=this;if(a.options.timeout!=0){var b=a.editing==!0?1.5:a.options.timeout;clearTimeout(a.moveTimer);a.moveTimer=setTimeout(function(){a.movementStopped=!0},b*1E3)}if(!a.moving)a.moving=!0,a.movementStopped=!1,a.animateLoop()};k.prototype.animateLoop=function(){var a=this;this.canvas.clear();for(var b=0;b<this.lines.length;b++)this.lines[b].updatePosition();this.root.findEquilibrium()||this.movementStopped?
-this.moving=!1:window.setTimeout(function(){a.fps++;a.animateLoop()},1E3/a.options.maxFps)};k.prototype.parseOptions=function(a){this.options=d.extend({mapArea:{x:-1,y:-1},loadData:null,editable:!1,onchange:function(){},ondrag:function(){},onshow:function(){},onhide:function(){},onremove:function(){},attract:3,repulse:2.5,maxForce:0.15,damping:0.9,acceleration:4,lineWidth:"5px",lineColor:"#FFF",lineOpacity:0.3,wallrepulse:0.5,centerOffset:100,centerAttraction:0,minSpeed:0.05,frameRate:50,timeout:5},
-a);this.bind("onchange",this.options.onchange);this.bind("ondrag",this.options.ondrag);this.bind("onshow",this.options.onshow);this.bind("onhide",this.options.onhide);this.bind("onremove",this.options.onremove)}})(jQuery);
+!0;this.obj.trigger("onshow",this)};g.prototype.setPosition=function(a,b){this.x=a;this.y=b;this.el.css("left",a+"px");this.el.css("top",b+"px");this.hasPosition=!0};g.prototype.display=function(){this.visible?this.parent.el.hasClass("active")||this.hide():(this.parent.parent===null||this.parent.el.hasClass("active"))&&this.show();if(!this.visible)return!0;if(!this.hasPosition){if(this.parent.parent!==null)var a=parseInt(this.parent.el.css("left")),b=parseInt(this.parent.el.css("top"));else a=this.obj.width/
+2,b=this.obj.height/2;this.setPosition(a,b)}var e=Math.PI*2/this.children.length,i=this;d.each(this.children,function(a){if(!this.visible){var b=a*e,a=50*Math.cos(b)+i.x,b=50*Math.sin(b)+i.y;this.setPosition(a,b)}});return this.updatePosition()};g.prototype.updatePosition=function(){if(d(this.el).hasClass("ui-draggable-dragging"))return this.x=parseInt(this.el.css("left"))+d(this.el).width()/2,this.y=parseInt(this.el.css("top"))+d(this.el).height()/2,this.dy=this.dx=0,!1;var a=this.getForceVector();
+this.dx+=a.x*this.obj.options.acceleration;this.dy+=a.y*this.obj.options.acceleration;this.dx*=this.obj.options.damping;this.dy*=this.obj.options.damping;if(Math.abs(this.dx)<this.obj.options.minSpeed)this.dx=0;if(Math.abs(this.dy)<this.obj.options.minSpeed)this.dy=0;if(Math.abs(this.dx)+Math.abs(this.dy)==0)return!0;this.x+=this.dx*this.obj.options.acceleration;this.y+=this.dy*this.obj.options.acceleration;this.x=Math.min(this.obj.width,Math.max(1,this.x));this.y=Math.min(this.obj.height,Math.max(1,
+this.y));var a=this.x-d(this.el).width()/2,b=this.y-d(this.el).height()/2-10;this.el.css("left",a+"px");this.el.css("top",b+"px");return!1};g.prototype.getForceVector=function(){for(var a=0,b=0,e=this.obj.nodes,d=this.obj.lines,f=0;f<e.length;f++)if(e[f]!==this&&(!this.obj.options.showSublines||e[f].hasPosition)&&e[f].visible){var c=e[f].x-this.x,h=e[f].y-this.y,j=c/Math.abs(c);Math.abs(h);var g=Math.sqrt(c*c+h*h),h=Math.atan(h/c);c===0&&(h=Math.PI/2,j=0);c=this.obj.options.repulse*500/(g*g);Math.abs(g)<
+500&&(a+=-c*Math.cos(h)*j,b+=-c*Math.sin(h)*j)}f=this.x+this.el.width();c=this.obj.options.wallrepulse*500/(f*f);a+=Math.min(2,c);f=this.obj.width-f;c=-(this.obj.options.wallrepulse*500)/(f*f);a+=Math.max(-2,c);c=this.obj.options.wallrepulse*500/(this.y*this.y);b+=Math.min(2,c);f=this.obj.height-this.y;c=-(this.obj.options.wallrepulse*500)/(f*f);b+=Math.max(-2,c);for(f=0;f<d.length;f++){e=null;if(d[f].start===this)e=d[f].end;else if(d[f].end===this)e=d[f].start;else continue;e.visible&&(c=e.x-this.x,
+h=e.y-this.y,g=Math.sqrt(c*c+h*h),j=c/Math.abs(c),h=Math.atan(h/c),c==0&&(h=Math.PI/2,j=0),c=this.obj.options.attract*g/1E4,Math.abs(g)>0&&(a+=c*Math.cos(h)*j,b+=c*Math.sin(h)*j))}if(!this.parent)e=this.obj.options.mapArea,c=e.x/2-this.obj.options.centerOffset-this.x,h=e.y/2-this.y,g=Math.sqrt(c*c+h*h),j=c/Math.abs(c),h=Math.atan(h/c),c===0&&(h=Math.PI/2,j=0),c=0.1*this.obj.options.attract*g*this.obj.options.centerAttraction/1E3,Math.abs(g)>0&&(a+=c*Math.cos(h)*j,b+=c*Math.sin(h)*j);Math.abs(a)>this.obj.options.maxForce&&
+(a=this.obj.options.maxForce*(a/Math.abs(a)));Math.abs(b)>this.obj.options.maxForce&&(b=this.obj.options.maxForce*(b/Math.abs(b)));return{x:a,y:b}};d.fn.buzzmap=function(a){var b=d(this).filter("ul");b.hasClass("buzzmap-active")||b.each(function(){var b=new k(d(this),a);b.el.addClass("buzzmap-active");b.el[0].obj=b;if(b.options.loadData){var g=d.parseJSON(a.loadData),f=function(a,c){d.each(c,function(c,d){node=b.addNode(a,decodeURI(d.label));f(node,d.children)})};d.each(g.children,function(a,c){node=
+b.addNode(b.root,decodeURI(c.label));f(node,c.children)})}else{var c=function(){var a=d(this).parents("li").get(0),a=typeof a==="undefined"?b.root:a.mynode;this.mynode=b.addNode(a,d("div:eq(0)",this).html());d(this).hide();d(">ul>li",this).each(c)};d(">li",b.el).each(c)}b.animate()});return b[0].obj};var k=function(a,b){var e=this;this.el=a;this.nodes=[];this.lines=[];this.parseOptions(b);this.movementStopped=this.editing=this.moving=!1;this.fps=0;window.setInterval(function(){var a=e.fps*2;e.fps=
+0;e.trigger("fps",a)},500);this.root=this.nodes[0]=new g(this,null,"<span>__ROOT__</span>");d(window).resize(function(){e.createCanvas();e.animate()});e.createCanvas()};l.mixin(k);k.prototype.createCanvas=function(){this.height=this.options.mapArea.y==-1?d(window).height():this.options.mapArea.y;this.width=this.options.mapArea.x==-1?d(window).width():this.options.mapArea.x;this.canvas?this.canvas.setSize(this.width,this.height):this.canvas=Raphael(0,0,this.width,this.height)};k.prototype.addNode=
+function(a,b){var d=this.nodes[this.nodes.length]=new g(this,a,b);this.animate();return d};k.prototype.serialize=function(){return this.root.serialize()};k.prototype.animate=function(){var a=this;if(a.options.timeout!=0){var b=a.editing==!0?1.5:a.options.timeout;clearTimeout(a.moveTimer);a.moveTimer=setTimeout(function(){a.movementStopped=!0},b*1E3)}if(!a.moving)a.moving=!0,a.movementStopped=!1,a.animateLoop()};k.prototype.animateLoop=function(){var a=this;this.canvas.clear();for(var b=0;b<this.lines.length;b++)this.lines[b].updatePosition();
+this.root.findEquilibrium()||this.movementStopped?this.moving=!1:window.setTimeout(function(){a.fps++;a.animateLoop()},1E3/a.options.maxFps)};k.prototype.parseOptions=function(a){this.options=d.extend({mapArea:{x:-1,y:-1},loadData:null,editable:!1,onchange:function(){},ondrag:function(){},onshow:function(){},onhide:function(){},onremove:function(){},attract:3,repulse:2.5,maxForce:0.15,damping:0.9,acceleration:4,lineWidth:"5px",lineColor:"#FFF",lineOpacity:0.3,wallrepulse:0.5,centerOffset:100,centerAttraction:0,
+minSpeed:0.05,frameRate:50,timeout:5},a);this.bind("onchange",this.options.onchange);this.bind("ondrag",this.options.ondrag);this.bind("onshow",this.options.onshow);this.bind("onhide",this.options.onhide);this.bind("onremove",this.options.onremove)}})(jQuery);
View
121 raphael.min.js
8 additions, 113 deletions not shown because the diff is too large. Please use a local Git client to view these changes.

0 comments on commit 4a35b31

Please sign in to comment.