Mouse events

[Swg]

In the list of triggered events for element.on there are no mouse events? Normal syntax of element.mousedown or element.click don't work either. Were mouse events removed in the update?

[Swg]

I've tried myObject.on('pointerdown', function() {  foo  }); and tried looking through the source code. I can't find any mouse event functions for any shapes.

[dave]

Models don't trigger mouse events. Only views trigger them. There is more ways how you can react on mouse events. The easiest one is using the joint.dia.Paper that triggers abstracted pointer events:

paper.on('cell:pointerdown', function(evt, cellView, x, y) {});

paper.on('cell:pointermove', function(evt, cellView, x, y) {});

paper.on('cell:pointerup', function(evt, cellView) {});

If you need a better control over mouse events, please take a look at this post: https://groups.google.com/forum/#!topic/jointjs/TigaktJ4wFM.

[Javitsel]

How do you react on a mouse event on a certain element, say a path or a link? 

Using paper.on('cell:pointerdown', function(evt, cellView, x, y) {}); reacts when clicked on any part of the paper

[dave]

The cell:pointerdown event is triggered when a mouse pointer is pressed on an element (represented by a JointJS view), not when any part of the paper is clicked. If that's not the case for you, could you please create an example on e.g. http://jsfiddle.net demonstrating the issue so that we can see if it is a bug in JointJS? Thanks!

[Javitsel]

Sorry I meant it happens when I click on any element on the paper, I want to create events for specific elements.

[dave]

Right, I see. Probably the easiest way would be to check for the event target inside cell:pointerdown handler:

paper.on('cell:pointerdown', function(cellView, evt, x, y) {

    console.log(evt.target.tagName);   // prints the tag name of the DOM element that was under the mouse cursor when pressed

});

There are other ways, it all depends on your specific use case. Another way would be defining a custom view and declaring event handlers on it the Backbone way. Please see this post for an example on how to do that: https://groups.google.com/forum/#!topic/jointjs/TigaktJ4wFM.