Almost-joint NPM

almostjs-joint

ALMOsT is an AgiLe MOdel Transformation framework for JavaScript

ALMOsT_Joint is an opinionated plug-in for JointJs which facilitates the development of Model Editors.

ALMOsT_Joint is built on top of JointJs concepts like:

Graph: the structure of the diagram see
Cell: a component of the diagram see
Element: a Cell with position, size and a graphical representation see
Link: a Cell with a line-ish graphical representation (line, arrow, ...) connecting two elements see

It just adds the concept of Board, an abstraction over the Paper concept in JoinJs which provides you a set of functionalities out of the box.

The minimum required code is the following:

var model = new joint.dia.Graph(),
var board = almost.plugins.joint.createBoard({
    el: '#board',
    model: model
});

This will create a Graph and initialize a board.

The createBoard constructor function has the following options:

el: [dom node, jquery collection, a jquery selector string] the dom element in the page where the board will be created.
model: [joint.dia.Graph] the Graph which contains the displayed diagram.
optional isValidParent: [function (elementView, parentElementView)] a function which validates the parent/child relationship between elements, a negative response will reject the previous operation by the user. The parent can be undefined if the element is in a free area of the Board, at least one element must have no parent.
optional defaultLink: [function (elementView, magnet)] this function serves the same functionality as the JointJs counterpart.