diff --git a/goJS/goJS-tests.ts b/goJS/goJS-tests.ts
index dd6266dc7e..4a84eb83cc 100644
--- a/goJS/goJS-tests.ts
+++ b/goJS/goJS-tests.ts
@@ -1,10 +1,87 @@
// Test file for goJS.d.ts
-// This is taken from http://gojs.net/latest/samples/basic.html
+// This is taken and adapted from http://gojs.net/latest/samples/basic.html
-/* Copyright (C) 1998-2015 by Northwoods Software Corporation. */
+/* Copyright (C) 1998-2016 by Northwoods Software Corporation. */
///
+class CustomLink extends go.Link {
+ constructor() {
+ super();
+ this.routing = go.Link.Orthogonal;
+ }
+
+ hasCurviness(): boolean {
+ if (isNaN(this.curviness)) return true;
+ return super.hasCurviness();
+ }
+
+ computeCurviness(): number {
+ if (isNaN(this.curviness)) {
+ var links = this.fromNode.findLinksTo(this.toNode);
+ if (links.count < 2) return 0;
+ var i = 0;
+ while (links.next()) { if (links.value === this) break; i++; }
+ return 10 * (i - (links.count - 1) / 2);
+ }
+ return super.computeCurviness();
+ }
+}
+
+class CustomTreeLayout extends go.TreeLayout {
+ constructor() {
+ super();
+ this.extraProp = 3;
+ }
+
+ extraProp: number;
+
+ // override various methods
+
+ cloneProtected(copy: CustomTreeLayout): void {
+ super.cloneProtected(copy);
+ copy.extraProp = this.extraProp;
+ }
+
+ createNetwork(): CustomTreeNetwork {
+ return new CustomTreeNetwork();
+ }
+
+ assignTreeVertexValues(v: CustomTreeVertex): void {
+ super.assignTreeVertexValues(v);
+ v.someProp = Math.random() * 100;
+ }
+
+ commitNodes(): void {
+ super.commitNodes();
+ // ...
+ }
+
+ commitLinks(): void {
+ super.commitLinks();
+ this.network.edges.each(e => { e.link.path.strokeWidth = ((e)).anotherProp; });
+ }
+}
+
+class CustomTreeNetwork extends go.TreeNetwork {
+ createVertex(): CustomTreeVertex {
+ return new CustomTreeVertex();
+ }
+
+ createEdge(): CustomTreeEdge {
+ return new CustomTreeEdge();
+ }
+}
+
+class CustomTreeVertex extends go.TreeVertex {
+ someProp: number = 17;
+}
+
+class CustomTreeEdge extends go.TreeEdge {
+ anotherProp: number = 1;
+}
+
+
function init() {
var $ = go.GraphObject.make; // for conciseness in defining templates
@@ -20,6 +97,8 @@ function init() {
// allow Ctrl-G to call groupSelection()
"commandHandler.archetypeGroupData": { text: "Group", isGroup: true, color: "blue" },
+ layout: $(CustomTreeLayout, { angle: 90 }),
+
// enable undo & redo
"undoManager.isEnabled": true
});
@@ -30,19 +109,19 @@ function init() {
// To simplify this code we define a function for creating a context menu button:
function makeButton(text: string, action: (e: go.InputEvent, obj: go.GraphObject) => void, visiblePredicate?: (obj: go.GraphObject) => boolean) {
- if (visiblePredicate === undefined) visiblePredicate = function (o) { return true; };
+ if (visiblePredicate === undefined) visiblePredicate = o => true;
return $("ContextMenuButton",
- $(go.TextBlock, text),
- { click: action },
- // don't bother with binding GraphObject.visible if there's no predicate
- visiblePredicate ? new go.Binding("visible", "", visiblePredicate).ofObject() : {});
+ $(go.TextBlock, text),
+ { click: action },
+ // don't bother with binding GraphObject.visible if there's no predicate
+ visiblePredicate ? new go.Binding("visible", "", visiblePredicate).ofObject() : {});
}
// a context menu is an Adornment with a bunch of buttons in them
var partContextMenu =
$(go.Adornment, "Vertical",
makeButton("Properties",
- function (e, obj) { // the OBJ is this Button
+ (e, obj) => { // the OBJ is this Button
var contextmenu = obj.part; // the Button is in the context menu Adornment
var part = contextmenu.adornedPart; // the adornedPart is the Part that the context menu adorns
// now can do something with PART, or with its data, or with the Adornment (the context menu)
@@ -51,29 +130,29 @@ function init() {
else alert(nodeInfo(part.data));
}),
makeButton("Cut",
- function (e, obj) { e.diagram.commandHandler.cutSelection(); },
- function (o) { return o.diagram.commandHandler.canCutSelection(); }),
+ (e, obj) => e.diagram.commandHandler.cutSelection(),
+ o => o.diagram.commandHandler.canCutSelection()),
makeButton("Copy",
- function (e, obj) { e.diagram.commandHandler.copySelection(); },
- function (o) { return o.diagram.commandHandler.canCopySelection(); }),
+ (e, obj) => e.diagram.commandHandler.copySelection(),
+ o => o.diagram.commandHandler.canCopySelection()),
makeButton("Paste",
- function (e, obj) { e.diagram.commandHandler.pasteSelection(e.diagram.lastInput.documentPoint); },
- function (o) { return o.diagram.commandHandler.canPasteSelection(); }),
+ (e, obj) => e.diagram.commandHandler.pasteSelection(e.diagram.lastInput.documentPoint),
+ o => o.diagram.commandHandler.canPasteSelection()),
makeButton("Delete",
- function (e, obj) { e.diagram.commandHandler.deleteSelection(); },
- function (o) { return o.diagram.commandHandler.canDeleteSelection(); }),
+ (e, obj) => e.diagram.commandHandler.deleteSelection(),
+ o => o.diagram.commandHandler.canDeleteSelection()),
makeButton("Undo",
- function (e, obj) { e.diagram.commandHandler.undo(); },
- function (o) { return o.diagram.commandHandler.canUndo(); }),
+ (e, obj) => e.diagram.commandHandler.undo(),
+ o => o.diagram.commandHandler.canUndo()),
makeButton("Redo",
- function (e, obj) { e.diagram.commandHandler.redo(); },
- function (o) { return o.diagram.commandHandler.canRedo(); }),
+ (e, obj) => e.diagram.commandHandler.redo(),
+ o => o.diagram.commandHandler.canRedo()),
makeButton("Group",
- function (e, obj) { e.diagram.commandHandler.groupSelection(); },
- function (o) { return o.diagram.commandHandler.canGroupSelection(); }),
+ (e, obj) => e.diagram.commandHandler.groupSelection(),
+ o => o.diagram.commandHandler.canGroupSelection()),
makeButton("Ungroup",
- function (e, obj) { e.diagram.commandHandler.ungroupSelection(); },
- function (o) { return o.diagram.commandHandler.canUngroupSelection(); })
+ (e, obj) => e.diagram.commandHandler.ungroupSelection(),
+ o => o.diagram.commandHandler.canUngroupSelection())
);
function nodeInfo(d) { // Tooltip info for a node data object
@@ -120,7 +199,7 @@ function init() {
// this context menu Adornment is shared by all nodes
contextMenu: partContextMenu
}
- );
+ );
// Define the appearance and behavior for Links:
@@ -130,7 +209,7 @@ function init() {
// The link shape and arrowhead have their stroke brush data bound to the "color" property
myDiagram.linkTemplate =
- $(go.Link,
+ $(CustomLink,
{ relinkableFrom: true, relinkableTo: true }, // allow the user to relink existing links
$(go.Shape,
{ strokeWidth: 2 },
@@ -148,17 +227,14 @@ function init() {
// the same context menu Adornment is shared by all links
contextMenu: partContextMenu
}
- );
+ );
// Define the appearance and behavior for Groups:
function groupInfo(adornment: go.Adornment) { // takes the tooltip, not a group node data object
var g = adornment.adornedPart; // get the Group that the tooltip adorns
var mems = g.memberParts.count;
- var links = 0;
- g.memberParts.each(function (part) {
- if (part instanceof go.Link) links++;
- });
+ var links = g.memberParts.filter(p => p instanceof go.Link).count;
return "Group " + g.data.key + ": " + g.data.text + "\n" + mems + " members including " + links + " links";
}
@@ -168,7 +244,8 @@ function init() {
$(go.Group, "Vertical",
{
selectionObjectName: "PANEL", // selection handle goes around shape, not label
- ungroupable: true // enable Ctrl-Shift-G to ungroup a selected Group
+ ungroupable: true, // enable Ctrl-Shift-G to ungroup a selected Group
+ layoutConditions: go.Part.LayoutStandard & ~go.Part.LayoutNodeSized
},
$(go.TextBlock,
{
@@ -195,7 +272,7 @@ function init() {
// the same context menu Adornment is shared by all groups
contextMenu: partContextMenu
}
- );
+ );
// Define the behavior for the Diagram background:
@@ -209,21 +286,21 @@ function init() {
$(go.Shape, { fill: "#FFFFCC" }),
$(go.TextBlock, { margin: 4 },
new go.Binding("text", "", diagramInfo))
- );
+ );
// provide a context menu for the background of the Diagram, when not over any Part
myDiagram.contextMenu =
$(go.Adornment, "Vertical",
makeButton("Paste",
- function (e, obj) { e.diagram.commandHandler.pasteSelection(e.diagram.lastInput.documentPoint); },
- function (o) { return o.diagram.commandHandler.canPasteSelection(); }),
+ (e, obj) => e.diagram.commandHandler.pasteSelection(e.diagram.lastInput.documentPoint),
+ o => o.diagram.commandHandler.canPasteSelection()),
makeButton("Undo",
- function (e, obj) { e.diagram.commandHandler.undo(); },
- function (o) { return o.diagram.commandHandler.canUndo(); }),
+ (e, obj) => e.diagram.commandHandler.undo(),
+ o => o.diagram.commandHandler.canUndo()),
makeButton("Redo",
- function (e, obj) { e.diagram.commandHandler.redo(); },
- function (o) { return o.diagram.commandHandler.canRedo(); })
- );
+ (e, obj) => e.diagram.commandHandler.redo(),
+ o => o.diagram.commandHandler.canRedo())
+ );
// Create the Diagram's Model:
var nodeDataArray = [
@@ -240,4 +317,8 @@ function init() {
{ from: 3, to: 1, color: "purple" }
];
myDiagram.model = new go.GraphLinksModel(nodeDataArray, linkDataArray);
+
+ var img = myDiagram.makeImageData({
+ scale: 0.4, position: new go.Point(-10, -10)
+ });
}