jmls
jmls

Reputation: 2969

dynamically adding a port to a jointjs element

So, I've battled with this most of the evening, and I concede defeat. I ask the question in this forum in the knowledge that someone will say "look here" which could have saved me a few hours :)

I thought I could just add a function to the joint.shapes.devs.Model.extend( like so:

addPort: function(name){ var portsArray = this.attributes.outPorts; portsArray.push(name); }

but obviously not

I have scoured the demos and source to no avail

so, to the question ::

How do I add a new port to an existing element ?

I have also asked the question on the jointjs google groups, but there is so little traffic on there, I'm hoping that SO is the place ;)

thanks

Upvotes: 1

Views: 1197

Answers (1)

Roman
Roman

Reputation: 1674

Please use set to update attributes instead of directly modifying them. This is important because the model can trigger an event and a view can handle it (render the port).

addPort: function(port) {
     // It is also important to clone the array here
     // as we do not want do modify the original attribute value.
     // Setting the same value on the model would trigger no event.
     /*
       var m = new Backbone.Model({ b: [] });
       var array = m.get('b');
       array.push('d');
       m.set('b', array); // -> no event triggered, m.get('b') === array
     */
     var ports = (this.get('outPorts') || []).slice();
     ports.push(port);
     this.set('outPorts', ports);
}

Upvotes: 1

Related Questions