@joint/core 4.2.0-alpha.0 → 4.2.0-beta.1

package/src/layout/ports/port.mjs

@@ -1,6 +1,28 @@
 import * as g from '../../g/index.mjs';
 import * as util from '../../util/index.mjs';
 
+function parseCoordinate(coordinate, dimension, bbox, value) {
+
+    if (util.isPercentage(value)) {
+        return parseFloat(value) / 100 * bbox[dimension];
+    }
+
+    if (util.isCalcExpression(value)) {
+        return Number(util.evalCalcExpression(value, bbox));
+    }
+
+    if (typeof value === 'string') {
+        const num = Number(value);
+        if (isNaN(num)) {
+            throw new TypeError(
+                `Cannot convert port coordinate ${coordinate}: "${value}" to a number`
+            );
+        }
+        return num;
+    }
+    return value;
+}
+
 function portTransformAttrs(point, angle, opt) {
 
     var trans = point.toJSON();
@@ -52,20 +74,14 @@ function ellipseLayout(ports, elBBox, startAngle, stepFn) {
     });
 }
 
-
 function argTransform(bbox, args) {
     let { x, y, angle } = args;
-    if (util.isPercentage(x)) {
-        x = parseFloat(x) / 100 * bbox.width;
-    } else if (util.isCalcExpression(x)) {
-        x = Number(util.evalCalcExpression(x, bbox));
-    }
-    if (util.isPercentage(y)) {
-        y = parseFloat(y) / 100 * bbox.height;
-    } else if (util.isCalcExpression(y)) {
-        y = Number(util.evalCalcExpression(y, bbox));
-    }
-    return { x, y, angle };
+
+    return {
+        x: parseCoordinate('x', 'width', bbox, x),
+        y: parseCoordinate('y', 'height', bbox, y),
+        angle
+    };
 }
 
 // Creates a point stored in arguments
@@ -74,14 +90,13 @@ function argPoint(bbox, args) {
     return new g.Point(x || 0, y || 0);
 }
 
-
 /**
  * @param {Array<Object>} ports
  * @param {g.Rect} elBBox
  * @param {Object=} opt opt Group options
  * @returns {Array<g.Point>}
  */
-export const absolute = function(ports, elBBox) {
+export const absolute = function(ports, elBBox, opt) {
     return ports.map(port => {
         const transformation = argPoint(elBBox, port).round().toJSON();
         transformation.angle = port.angle || 0;
@@ -90,6 +105,7 @@ export const absolute = function(ports, elBBox) {
 };
 
 /**
+ * @deprecated
  * @param {Array<Object>} ports
  * @param {g.Rect} elBBox
  * @param {Object=} opt opt Group options
@@ -184,4 +200,3 @@ export const ellipse = function(ports, elBBox, opt) {
         return (index + 0.5 - count / 2) * stepAngle;
     });
 };
-

package/src/layout/ports/portLabel.mjs

@@ -167,7 +167,7 @@ function radialLayout(portCenterOffset, autoOrient, opt) {
     });
 }
 
-export const manual = function(_portPosition, _elBBox, opt) {
+export const manual = function(portPosition, elBBox, opt) {
     return labelAttributes(opt);
 };
 

package/src/mvc/Collection.mjs

@@ -193,7 +193,7 @@ assign(Collection.prototype, Events, {
             for (i = 0; i < toAdd.length; i++) {
                 if (at != null) options.index = at + i;
                 model = toAdd[i];
-                model.trigger('add', model, this, options);
+                model.trigger(model.eventPrefix + 'add', model, this, options);
             }
             if (sort || orderChanged) this.trigger('sort', this, options);
             if (toAdd.length || toRemove.length || toMerge.length) {
@@ -257,9 +257,9 @@ assign(Collection.prototype, Events, {
     // properties, or an attributes object that is transformed through modelId.
     get: function(obj) {
         if (obj == null) return void 0;
-        return this._byId[obj] ||
-        this._byId[this.modelId(this._isModel(obj) ? obj.attributes : obj, obj.idAttribute)] ||
-        obj.cid && this._byId[obj.cid];
+        return this._byId.get(obj) ||
+            this._byId.get(this.modelId(this._isModel(obj) ? obj.attributes : obj, obj.idAttribute)) ||
+            obj.cid && this._byId.get(obj.cid);
     },
 
     // Returns `true` if the model is in the collection.
@@ -304,7 +304,7 @@ assign(Collection.prototype, Events, {
 
     // Define how to uniquely identify models in the collection.
     modelId: function(attrs, idAttribute) {
-        return attrs[idAttribute || this.model.prototype.idAttribute || 'id'];
+        return attrs[idAttribute || this.model.prototype?.idAttribute || 'id'];
     },
 
     // Get an iterator of all models in this collection.
@@ -375,18 +375,18 @@ assign(Collection.prototype, Events, {
     _reset: function() {
         this.length = 0;
         this.models = [];
-        this._byId  = {};
+        this._byId  = new Map();
     },
 
     // Prepare a hash of attributes (or other model) to be added to this
     // collection.
     _prepareModel: function(attrs, options) {
         if (this._isModel(attrs)) {
-            if (!attrs.collection) attrs.collection = this;
+            if (!options.dry && !attrs.collection) attrs.collection = this;
             return attrs;
         }
         options = options ? clone(options) : {};
-        options.collection = this;
+        if (!options.dry) options.collection = this;
 
         var model;
         if (this.model.prototype) {
@@ -414,13 +414,13 @@ assign(Collection.prototype, Events, {
 
             // Remove references before triggering 'remove' event to prevent an
             // infinite loop. #3693
-            delete this._byId[model.cid];
+            this._byId.delete(model.cid);
             var id = this.modelId(model.attributes, model.idAttribute);
-            if (id != null) delete this._byId[id];
+            if (id != null)this._byId.delete(id);
 
             if (!options.silent) {
                 options.index = index;
-                model.trigger('remove', model, this, options);
+                model.trigger(model.eventPrefix + 'remove', model, this, options);
             }
 
             removed.push(model);
@@ -438,18 +438,18 @@ assign(Collection.prototype, Events, {
 
     // Internal method to create a model's ties to a collection.
     _addReference: function(model, options) {
-        this._byId[model.cid] = model;
+        this._byId.set(model.cid, model);
         var id = this.modelId(model.attributes, model.idAttribute);
-        if (id != null) this._byId[id] = model;
+        if (id != null) this._byId.set(id, model);
         model.on('all', this._onModelEvent, this);
     },
 
     // Internal method to sever a model's ties to a collection.
     _removeReference: function(model, options) {
-        delete this._byId[model.cid];
+        this._byId.delete(model.cid);
         var id = this.modelId(model.attributes, model.idAttribute);
-        if (id != null) delete this._byId[id];
-        if (this === model.collection) delete model.collection;
+        if (id != null) this._byId.delete(id);
+        if (!options.dry && this === model.collection) delete model.collection;
         model.off('all', this._onModelEvent, this);
     },
 
@@ -459,12 +459,12 @@ assign(Collection.prototype, Events, {
     // in other collections are ignored.
     _onModelEvent: function(event, model, collection, options) {
         if (model) {
-            if ((event === 'add' || event === 'remove') && collection !== this) return;
+            if ((event === model.eventPrefix + 'add' || event === model.eventPrefix + 'remove') && collection !== this) return;
             if (event === 'changeId') {
                 var prevId = this.modelId(model.previousAttributes(), model.idAttribute);
                 var id = this.modelId(model.attributes, model.idAttribute);
-                if (prevId != null) delete this._byId[prevId];
-                if (id != null) this._byId[id] = model;
+                if (prevId != null) this._byId.delete(prevId);
+                if (id != null) this._byId.set(id, model);
             }
         }
         this.trigger.apply(this, arguments);

package/src/mvc/Model.mjs

@@ -25,17 +25,12 @@ import {
 export var Model = function(attributes, options) {
     var attrs = attributes || {};
     options || (options = {});
+    this.eventPrefix = options.eventPrefix || '';
     this.preinitialize.apply(this, arguments);
     this.cid = uniqueId(this.cidPrefix);
     this.attributes = {};
     if (options.collection) this.collection = options.collection;
-    var attributeDefaults = result(this, 'defaults');
-
-    // Just _.defaults would work fine, but the additional _.extends
-    // is in there for historical reasons. See #3843.
-    attrs = defaults(assign({}, attributeDefaults, attrs), attributeDefaults);
-
-    this.set(attrs, options);
+    this._setDefaults(attrs, options);
     this.changed = {};
     this.initialize.apply(this, arguments);
 };
@@ -137,14 +132,14 @@ assign(Model.prototype, Events, {
         if (this.idAttribute in attrs) {
             var prevId = this.id;
             this.id = this.get(this.idAttribute);
-            this.trigger('changeId', this, prevId, options);
+            this.trigger(this.eventPrefix + 'changeId', this, prevId, options);
         }
 
         // Trigger all relevant attribute changes.
         if (!silent) {
             if (changes.length) this._pending = options;
             for (var i = 0; i < changes.length; i++) {
-                this.trigger('change:' + changes[i], this, current[changes[i]], options);
+                this.trigger(this.eventPrefix + 'change:' + changes[i], this, current[changes[i]], options);
             }
         }
 
@@ -155,7 +150,7 @@ assign(Model.prototype, Events, {
             while (this._pending) {
                 options = this._pending;
                 this._pending = false;
-                this.trigger('change', this, options);
+                this.trigger(this.eventPrefix + 'change', this, options);
             }
         }
         this._pending = false;
@@ -235,6 +230,14 @@ assign(Model.prototype, Events, {
         if (!error) return true;
         this.trigger('invalid', this, error, assign(options, { validationError: error }));
         return false;
+    },
+
+    _setDefaults: function(ctorAttributes, options) {
+        const attributeDefaults = result(this, 'defaults');
+        // Just _.defaults would work fine, but the additional _.extends
+        // is in there for historical reasons. See #3843.
+        const attributes = defaults(assign({}, attributeDefaults, ctorAttributes), attributeDefaults);
+        this.set(attributes, options);
     }
 
 });

package/src/mvc/View.mjs

@@ -18,8 +18,12 @@ export const View = ViewBase.extend({
 
     DETACHABLE: true,
     UPDATE_PRIORITY: 2,
+
+    /** @deprecated is no longer used (moved to Paper) */
     FLAG_INSERT: 1<<30,
+    /** @deprecated is no longer used */
     FLAG_REMOVE: 1<<29,
+    /** @deprecated is no longer used */
     FLAG_INIT: 1<<28,
 
     constructor: function(options) {

package/src/mvc/ViewBase.mjs

@@ -24,7 +24,7 @@ import {
 // Creating a ViewBase creates its initial element outside of the DOM,
 // if an existing element is not provided...
 export var ViewBase = function(options) {
-    this.cid = uniqueId('view');
+    this.cid = (options && options.cid) || uniqueId('view');
     this.preinitialize.apply(this, arguments);
     assign(this, pick(options, viewOptions));
     this._ensureElement();

package/types/geometry.d.ts

@@ -12,12 +12,16 @@ export namespace g {
     }
 
     export type Shape = Path | Point | Line | Polyline | Polygon | Rect | Ellipse;
+
     export interface PlainPoint {
 
         x: number;
         y: number;
     }
 
+    /** Can be understood by `g.Point` constructor */
+    export type PointInit = Partial<PlainPoint> | string;
+
     export interface PlainRect {
 
         x: number;
@@ -77,15 +81,15 @@ export namespace g {
 
         clone(): Segment;
 
-        closestPoint(p: Point, opt?: SubdivisionsOpt): Point;
+        closestPoint(p: PlainPoint, opt?: SubdivisionsOpt): Point;
 
-        closestPointLength(p: Point, opt?: SubdivisionsOpt): number;
+        closestPointLength(p: PlainPoint, opt?: SubdivisionsOpt): number;
 
-        closestPointNormalizedLength(p: Point, opt?: SubdivisionsOpt): number;
+        closestPointNormalizedLength(p: PlainPoint, opt?: SubdivisionsOpt): number;
 
-        closestPointT(p: Point): number;
+        closestPointT(p: PlainPoint): number;
 
-        closestPointTangent(p: Point): Line | null;
+        closestPointTangent(p: PlainPoint): Line | null;
 
         divideAt(ratio: number, opt?: SubdivisionsOpt): [Segment, Segment];
 
@@ -111,7 +115,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         tangentAt(ratio: number): Line | null;
 
@@ -168,7 +172,7 @@ export namespace g {
         end: Point;
         type: types.Curve;
 
-        constructor(p1: PlainPoint | string, p2: PlainPoint | string, p3: PlainPoint | string, p4: PlainPoint | string);
+        constructor(p1: PointInit, p2: PointInit, p3: PointInit, p4: PointInit);
         constructor(curve: Curve);
 
         bbox(): Rect;
@@ -216,7 +220,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         tangentAt(ratio: number, opt?: SubdivisionsOpt): Line | null;
 
@@ -248,7 +252,7 @@ export namespace g {
         b: number;
         type: types.Ellipse;
 
-        constructor(center: PlainPoint | string, a: number, b: number);
+        constructor(center: PointInit, a: number, b: number);
         constructor(ellipse: Ellipse);
 
         bbox(): Rect;
@@ -265,7 +269,7 @@ export namespace g {
 
         intersectionWithLine(l: Line): Point[] | null;
 
-        intersectionWithLineFromCenterToPoint(p: PlainPoint, angle?: number): Point;
+        intersectionWithLineFromCenterToPoint(p: PointInit, angle?: number): Point;
 
         normalizedDistance(point: PlainPoint): number;
 
@@ -284,7 +288,7 @@ export namespace g {
         end: Point;
         type: types.Line;
 
-        constructor(p1: PlainPoint | string, p2: PlainPoint | string);
+        constructor(p1: PointInit, p2: PointInit);
         constructor(line: Line);
         constructor();
 
@@ -298,13 +302,13 @@ export namespace g {
 
         parallel(distance: number): Line;
 
-        closestPoint(p: PlainPoint | string): Point;
+        closestPoint(p: PointInit): Point;
 
-        closestPointLength(p: PlainPoint | string): number;
+        closestPointLength(p: PointInit): number;
 
-        closestPointNormalizedLength(p: PlainPoint | string): number;
+        closestPointNormalizedLength(p: PointInit): number;
 
-        closestPointTangent(p: PlainPoint | string): Line | null;
+        closestPointTangent(p: PointInit): Line | null;
 
         containsPoint(p: PlainPoint): boolean;
 
@@ -332,13 +336,13 @@ export namespace g {
 
         pointAtLength(length: number): Point;
 
-        pointOffset(p: PlainPoint | string): number;
+        pointOffset(p: PointInit): number;
 
         rotate(origin: PlainPoint, angle: number): this;
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         setLength(length: number): this;
 
@@ -377,13 +381,13 @@ export namespace g {
 
         clone(): Path;
 
-        closestPoint(p: Point, opt?: SegmentSubdivisionsOpt): Point | null;
+        closestPoint(p: PlainPoint, opt?: SegmentSubdivisionsOpt): Point | null;
 
-        closestPointLength(p: Point, opt?: SegmentSubdivisionsOpt): number;
+        closestPointLength(p: PlainPoint, opt?: SegmentSubdivisionsOpt): number;
 
-        closestPointNormalizedLength(p: Point, opt?: SegmentSubdivisionsOpt): number;
+        closestPointNormalizedLength(p: PlainPoint, opt?: SegmentSubdivisionsOpt): number;
 
-        closestPointTangent(p: Point, opt?: SegmentSubdivisionsOpt): Line | null;
+        closestPointTangent(p: PlainPoint, opt?: SegmentSubdivisionsOpt): Line | null;
 
         containsPoint(p: PlainPoint, opt?: SegmentSubdivisionsOpt): boolean;
 
@@ -419,7 +423,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         segmentAt(ratio: number, opt?: SegmentSubdivisionsOpt): Segment | null;
 
@@ -446,7 +450,7 @@ export namespace g {
 
         validate(): this;
 
-        private closestPointT(p: Point, opt?: SegmentSubdivisionsOpt): PathT | null;
+        private closestPointT(p: PlainPoint, opt?: SegmentSubdivisionsOpt): PathT | null;
 
         private lengthAtT(t: PathT, opt?: SegmentSubdivisionsOpt): number;
 
@@ -474,17 +478,17 @@ export namespace g {
         type: types.Point;
 
         constructor(x?: number, y?: number);
-        constructor(p: PlainPoint | string);
+        constructor(p: PointInit);
 
-        chooseClosest(points: PlainPoint[]): Point | null;
+        chooseClosest(points: PointInit[]): Point | null;
 
         adhereToRect(r: Rect): this;
 
         angleBetween(p1: PlainPoint, p2: PlainPoint): number;
 
-        bearing(p: Point): CardinalDirection;
+        bearing(p: PlainPoint): CardinalDirection;
 
-        changeInAngle(dx: number, dy: number, ref: PlainPoint | string): number;
+        changeInAngle(dx: number, dy: number, ref: PointInit): number;
 
         clone(): Point;
 
@@ -493,42 +497,42 @@ export namespace g {
         difference(dx?: number, dy?: number): Point;
         difference(p: PlainPoint): Point;
 
-        distance(p: PlainPoint | string): number;
+        distance(p: PlainPoint): number;
 
         dot(p: PlainPoint): number;
 
-        equals(p: Point): boolean;
+        equals(p: PlainPoint): boolean;
 
-        lerp(p: Point, t: number): Point;
+        lerp(p: PlainPoint, t: number): Point;
 
         magnitude(): number;
 
         manhattanDistance(p: PlainPoint): number;
 
-        move(ref: PlainPoint | string, distance: number): this;
+        move(ref: PointInit, distance: number): this;
 
         normalize(length: number): this;
 
         offset(dx?: number, dy?: number): this;
         offset(p: PlainPoint): this;
 
-        reflection(ref: PlainPoint | string): Point;
+        reflection(ref: PointInit): Point;
 
-        rotate(origin: PlainPoint | string, angle: number): this;
+        rotate(origin: PlainPoint, angle: number): this;
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         snapToGrid(gx: number, gy?: number): this;
 
-        squaredDistance(p: PlainPoint | string): number;
+        squaredDistance(p: PlainPoint): number;
 
-        theta(p: PlainPoint | string): number;
+        theta(p: PointInit): number;
 
         toJSON(): PlainPoint;
 
-        toPolar(origin?: PlainPoint | string): this;
+        toPolar(origin?: PointInit): this;
 
         toString(): string;
 
@@ -542,7 +546,7 @@ export namespace g {
 
         vectorAngle(p: PlainPoint): number;
 
-        static fromPolar(distance: number, angle: number, origin?: PlainPoint | string): Point;
+        static fromPolar(distance: number, angle: number, origin?: PointInit): Point;
 
         static random(x1: number, x2: number, y1: number, y2: number): Point;
     }
@@ -554,17 +558,17 @@ export namespace g {
 
         constructor();
         constructor(svgString: string);
-        constructor(points: PlainPoint[]);
+        constructor(points: PointInit[]);
 
         bbox(): Rect | null;
 
-        closestPoint(p: PlainPoint | string): Point | null;
+        closestPoint(p: PlainPoint): Point | null;
 
-        closestPointLength(p: PlainPoint | string): number;
+        closestPointLength(p: PlainPoint): number;
 
-        closestPointNormalizedLength(p: PlainPoint | string): number;
+        closestPointNormalizedLength(p: PlainPoint): number;
 
-        closestPointTangent(p: PlainPoint | string): Line | null;
+        closestPointTangent(p: PlainPoint): Line | null;
 
         containsPoint(p: PlainPoint): boolean;
 
@@ -584,7 +588,7 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
         simplify(opt?: { threshold?: number }): this;
 
@@ -649,7 +653,7 @@ export namespace g {
 
         clone(): Rect;
 
-        containsPoint(p: PlainPoint | string, opt?: StrictOpt): boolean;
+        containsPoint(p: PointInit, opt?: StrictOpt): boolean;
 
         containsRect(r: PlainRect): boolean;
 
@@ -663,7 +667,7 @@ export namespace g {
 
         intersectionWithLine(l: Line): Point[] | null;
 
-        intersectionWithLineFromCenterToPoint(p: PlainPoint | string, angle?: number): Point;
+        intersectionWithLineFromCenterToPoint(p: PointInit, angle?: number): Point;
 
         leftLine(): Line;
 
@@ -675,7 +679,7 @@ export namespace g {
 
         moveAndExpand(r: PlainRect): this;
 
-        moveAroundPoint(origin: PlainPoint | string, angle: number): this;
+        moveAroundPoint(origin: PlainPoint, angle: number): this;
 
         normalize(): this;
 
@@ -684,7 +688,7 @@ export namespace g {
 
         origin(): Point;
 
-        pointNearestToPoint(point: PlainPoint | string): Point;
+        pointNearestToPoint(point: PointInit): Point;
 
         rightLine(): Line;
 
@@ -692,9 +696,9 @@ export namespace g {
 
         round(precision?: number): this;
 
-        scale(sx: number, sy: number, origin?: PlainPoint | string): this;
+        scale(sx: number, sy: number, origin?: PointInit): this;
 
-        sideNearestToPoint(point: PlainPoint | string): RectangleSide;
+        sideNearestToPoint(point: PointInit): RectangleSide;
 
         snapToGrid(gx: number, gy?: number): this;
 
@@ -734,24 +738,24 @@ export namespace g {
             p3: Point;
         }
 
-        export function curveThroughPoints(points: PlainPoint[] | Point[]): string[];
+        export function curveThroughPoints(points: PlainPoint[]): string[];
 
-        export function getCurveControlPoints(points: PlainPoint[] | Point[]): [Point[], Point[]];
+        export function getCurveControlPoints(points: PlainPoint[]): [Point[], Point[]];
 
         export function getCurveDivider(
-            p0: string | PlainPoint,
-            p1: string | PlainPoint,
-            p2: string | PlainPoint,
-            p3: string | PlainPoint
+            p0: PointInit,
+            p1: PointInit,
+            p2: PointInit,
+            p3: PointInit
         ): (t: number) => [IBezierCurve, IBezierCurve];
 
         export function getFirstControlPoints(rhs: number[]): number[];
 
         export function getInversionSolver(
-            p0: PlainPoint,
-            p1: PlainPoint,
-            p2: PlainPoint,
-            p3: PlainPoint
+            p0: PointInit,
+            p1: PointInit,
+            p2: PointInit,
+            p3: PointInit
         ): (p: PlainPoint) => number;
     }