CODEWITHSUNDEEP
typescriptjointjs
Ali-Alrabi
Ali-Alrabi

Reputation: 1708

JointJS event handler in typescript

I'm trying to add event handler for jointjs paper in typescript,But don't found a way to implement it with joint js definition file. 

private paper = new joint.dia.Paper({
          el: $('#paper'),
          width: 650,
          height: 400,
          gridSize: 20,
          model: this.graph,
          markAvailable: true,
          linkConnectionPoint: joint.util.shapePerimeterConnectionPoint,
          snapLinks: true
     });

   this.paper.on('mouseclick', () => {
      console.log('Congratulations, you clicked the mouse!');
   });

get error message

TS1068: Unexpected token. A constructor, method, accessor, or property was expected.

How to add event handler for rect and lines with typescript?

Upvotes: 0

Views: 775

Answers (3)

blueren
blueren

Reputation: 2870

I have this one working for me: 

paper.on('blank:pointerclick', function(evt, x, y) {

  //do whatever

}); //end paper.on

Upvotes: 0

Ali-Alrabi
Ali-Alrabi

Reputation: 1708

this works with me 

   paper.on('cell:pointerup', () => {
      console.log('Congratulations, you clicked the mouse!');
  });

Upvotes: 1

Juliën
Juliën

Reputation: 9572

JointJS leans heavily on other libraries, such as jQuery and Backbone. In this case, the paper.mouseclick() function allows you to pass in an Event should according to the the joint.d.ts definition file:

mouseclick(evt: Event): void;

Calling this, with an Event as parameter, will trigger the event. However, I assume you're actually more interested on handling the event rather than triggering it. In this case, the Paper class extens a Backbone.View where you can act on it as follows:

let paper = new jointjs.dia.Paper();
paper.on('mouseclick', () => {
  console.log('Congratulations, you clicked the mouse!');
});

Hope this is what you're looking for.

Upvotes: 0

Related Questions