gb.event.js

Plotter = {};
Plotter.HOVER_SCALE = 1.5;
Plotter.EVENT_CORNER_RADIUS = 5;

Raphael.fn.gb = {};
Raphael.fn.gb.event = function(event,x,y,w,h){
  console.debug('event', event, x,y,w,h);
  var set = this.set();
  set.rect = this.rect(x,y,w,h,5).attr({
    fill:'red',
    "fill-opacity":0.8
  });;
  set.rect.orig = {x:x,y:y,w:w,h:h};
  set.event = event;
  var padding = Plotter.EVENT_CORNER_RADIUS / 3;
  set.text = this.text(x + padding + (w/2), y + padding + 5, event.text).attr({
    "font-size":"10px"
  });
  Event.observe(set.rect.node, 'mouseenter', function(event){
      set.rect.scale(Plotter.HOVER_SCALE);
      set.rect.attr({"fill-opacity":1.0});
      set.text.attr({"font-size":"15px"});
    });
  Event.observe(set.rect.node, 'mouseleave', function(event){
      set.rect.scale(1,1);
      set.rect.attr({"fill-opacity":0.8, x:set.rect.orig.x, y:set.rect.orig.y});
      set.text.attr({"font-size":"10px"});
    });
  set.push(set.rect, set.text);
  //set.rect.node.appendChild(set.text.node);
  //set.text.toFront();
  return set;
};