Skip to content

Commit

Permalink
Modernize old examples ts configs. With latest TS it is now much easi…
Browse files Browse the repository at this point in the history 
…er to have it correct.
  • Loading branch information
@Bobris
Bobris committed Feb 5, 2017
1 parent 26a9043 commit 99a18d2
Show file tree
Hide file tree
Showing 58 changed files with 745 additions and 715 deletions.
24 changes: 12 additions & 12 deletions examples/almhours/tsconfig.json
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
{
"version": "1.4.1",
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"declaration": false,
"noImplicitAny": true,
"lib": [
"es5",
"dom",
"es2015.core",
"es2015.promise"
],
"removeComments": false,
"noLib": false
},
"compileOnSave": false,
"filesGlob": [
"./**/*.ts",
"!./node_modules/**/*.ts"
],
"files": [
"./app.ts"
]
"noLib": false,
"preserveConstEnums": false,
"jsx": "react",
"reactNamespace": "b"
}
}
6 changes: 3 additions & 3 deletions examples/automaton/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,14 @@ var Automata;
automaton.addTransition(automaton.states[3], automaton.states[2]);
automaton.addTransition(automaton.states[4], automaton.states[1], new Automata.Models.Point(330, 100));
automaton.addTransition(automaton.states[4], automaton.states[4], new Automata.Models.Point(510, 150));
b.init(() => [
b.init(function () { return [
{
tag: 'h2',
children: 'Automaton (Bobril Demo)'
},
Automata.Components.Canvas.Get({
content: Automata.Components.Graph.Get({ automaton })
content: Automata.Components.Graph.Get({ automaton: automaton })
}),
Automata.Components.Help.Get()
]);
]; });
})(Automata || (Automata = {}));
4 changes: 2 additions & 2 deletions examples/automaton/components/canvas.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ var Automata;
var Canvas;
(function (Canvas) {
var Component = {
render(ctx, me, oldMe) {
render: function (ctx, me, oldMe) {
me.tag = 'div';
me.className = 'canvas';
me.style = {
Expand All @@ -18,7 +18,7 @@ var Automata;
}
};
function Get(data) {
return { component: Component, data };
return { component: Component, data: data };
}
Canvas.Get = Get;
})(Canvas = Components.Canvas || (Components.Canvas = {}));
Expand Down
22 changes: 11 additions & 11 deletions examples/automaton/components/edge.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,13 @@ var Automata;
var fromMid = new Automata.Models.Vector(fromPoint, midPoint).getLength();
var midTo = new Automata.Models.Vector(midPoint, toPoint).getLength();
if (Math.abs(fromMid + midTo - fromTo) < 0.001) {
return `M${fromPoint}L${toPoint}`;
return "M" + fromPoint + "L" + toPoint;
}
else {
var scale = fromTo / (fromMid + midTo) / 2;
var c1 = new Automata.Models.Point(midPoint.x, midPoint.y).addVector(vectFromTo, -fromMid * scale / fromTo);
var c2 = new Automata.Models.Point(midPoint.x, midPoint.y).addVector(vectFromTo, midTo * scale / fromTo);
return `M${fromPoint}Q${c1},${midPoint}Q${c2},${toPoint}`;
return "M" + fromPoint + "Q" + c1 + "," + midPoint + "Q" + c2 + "," + toPoint;
}
}
function getLoopPath(transition) {
Expand All @@ -28,19 +28,19 @@ var Automata;
var perpendicuar = new Automata.Models.Vector(fromPoint, midPoint).getPerpendicular();
var c1 = new Automata.Models.Point(midPoint.x, midPoint.y).addVector(perpendicuar, -0.4);
var c2 = new Automata.Models.Point(midPoint.x, midPoint.y).addVector(perpendicuar, 0.4);
return `M${fromPoint}Q${c1},${midPoint}Q${c2},${fromPoint}`;
return "M" + fromPoint + "Q" + c1 + "," + midPoint + "Q" + c2 + "," + fromPoint;
}
function getEdgePath(transition) {
return transition.isLoop() ? getLoopPath(transition) : getStandardPath(transition);
}
function getEdgeLine(className, d) {
return {
tag: 'path',
className,
className: className,
style: {
markerEnd: 'url(#arrow)'
},
attrs: { d }
attrs: { d: d }
};
}
function getEdgeLines(transition) {
Expand All @@ -51,28 +51,28 @@ var Automata;
];
}
var Component = {
render(ctx, me, oldMe) {
render: function (ctx, me, oldMe) {
var transition = ctx.data.transition;
me.tag = 'g';
me.className = ctx.data.isSelected ? 'edge selected' : 'edge';
me.children = [
getEdgeLines(transition),
Components.MidPoint.Get({
midPoint: transition.midPoint,
resetMidPoint: () => transition.resetMidPoint(),
moveMidPoint: (point) => transition.moveMidPoint(point)
resetMidPoint: function () { return transition.resetMidPoint(); },
moveMidPoint: function (point) { return transition.moveMidPoint(point); }
}),
Components.EdgeText.Get({ transition })
Components.EdgeText.Get({ transition: transition })
];
},
onClick(ctx, event) {
onClick: function (ctx, event) {
ctx.data.transitionSelected(ctx.data.transition);
b.invalidate();
return true;
}
};
function Get(data) {
return { component: Component, data };
return { component: Component, data: data };
}
Edge.Get = Get;
})(Edge = Components.Edge || (Components.Edge = {}));
Expand Down
16 changes: 8 additions & 8 deletions examples/automaton/components/edgeText.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ var Automata;
var EdgeText;
(function (EdgeText) {
var Component = {
render(ctx, me, oldMe) {
render: function (ctx, me, oldMe) {
var transition = ctx.data.transition;
me.tag = 'g';
me.children = [
Expand All @@ -16,7 +16,7 @@ var Automata;
x: transition.midPoint.x + transition.textPosition.x,
y: transition.midPoint.y + transition.textPosition.y
},
children: `${transition.from.name} → ${transition.to.name}`
children: transition.from.name + " \u2192 " + transition.to.name
},
{
tag: 'path',
Expand All @@ -27,20 +27,20 @@ var Automata;
}
];
},
onPointerDown(ctx, event) {
onPointerDown: function (ctx, event) {
b.registerMouseOwner(ctx);
ctx.downPoint = new Automata.Models.Point(event.x, event.y);
var textPosition = ctx.data.transition.textPosition;
ctx.prevPoint = new Automata.Models.Point(textPosition.x, textPosition.y);
return true;
},
onPointerUp(ctx, event) {
onPointerUp: function (ctx, event) {
if (b.isMouseOwner(ctx)) {
b.releaseMouseOwner();
}
return true;
},
onPointerMove(ctx, event) {
onPointerMove: function (ctx, event) {
if (!b.isMouseOwner(ctx)) {
return false;
}
Expand All @@ -51,7 +51,7 @@ var Automata;
b.invalidate();
return true;
},
postUpdateDom(ctx, me, element) {
postUpdateDom: function (ctx, me, element) {
var midPoint = ctx.data.transition.midPoint;
var bbox = element.getBBox();
var x;
Expand All @@ -65,11 +65,11 @@ var Automata;
y = midPoint.y;
}
var textLine = element.childNodes[1];
textLine.setAttribute('d', `M${midPoint}L${x},${y}`);
textLine.setAttribute('d', "M" + midPoint + "L" + x + "," + y);
}
};
function Get(data) {
return { component: Component, data };
return { component: Component, data: data };
}
EdgeText.Get = Get;
})(EdgeText = Components.EdgeText || (Components.EdgeText = {}));
Expand Down
46 changes: 23 additions & 23 deletions examples/automaton/components/graph.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,10 @@ var Automata;
if (!transitions || !transitions.length) {
return null;
}
return transitions.map((transition) => {
return transitions.map(function (transition) {
return Components.Edge.Get({
transition,
transitionSelected,
transition: transition,
transitionSelected: transitionSelected,
isSelected: selectedTransition === transition
});
});
Expand All @@ -40,7 +40,7 @@ var Automata;
var scr = transition.screenPoint;
var trTo = transition.to ? transition.to.point : new Automata.Models.Point(scr.x - rect.left, scr.y - rect.top);
transition.midPoint = null;
return `M${transition.from.point}L${trTo}`;
return "M" + transition.from.point + "L" + trTo;
}
function getLoop(rect, transition) {
var from = transition.from.point;
Expand All @@ -52,7 +52,7 @@ var Automata;
var c1 = new Automata.Models.Point(point.x, point.y).addVector(perpendicuar, -0.4);
var c2 = new Automata.Models.Point(point.x, point.y).addVector(perpendicuar, 0.4);
transition.midPoint = point;
return `M${from}Q${c1},${point}Q${c2},${from}`;
return "M" + from + "Q" + c1 + "," + point + "Q" + c2 + "," + from;
}
function getNewEdge(rect, transition) {
if (!transition || !transition.from) {
Expand All @@ -73,12 +73,12 @@ var Automata;
if (!states || !states.length) {
return null;
}
return states.map((state) => {
return states.map(function (state) {
return Components.Vertex.Get({
state,
onMove,
addTransition,
stateSelected,
state: state,
onMove: onMove,
addTransition: addTransition,
stateSelected: stateSelected,
newTransition: ctx.newTransition,
dragMode: ctx.dragMode,
isSelected: ctx.selectedState == state
Expand All @@ -95,19 +95,19 @@ var Automata;
}
}
var Component = {
init(ctx, me) {
init: function (ctx, me) {
ctx.dragMode = Automata.Models.DragMode.Move;
b.invalidate();
},
render(ctx, me, oldMe) {
render: function (ctx, me, oldMe) {
var automaton = ctx.data.automaton;
me.tag = 'svg';
me.attrs = { tabindex: 0 };
me.style = { width: '100%', height: '100%', outline: 'none' };
me.children = [
getEdges(automaton.transitions, ctx.selectedTransition, (transition) => { ctx.selectedTransition = transition; ctx.selectedState = null; }),
getEdges(automaton.transitions, ctx.selectedTransition, function (transition) { ctx.selectedTransition = transition; ctx.selectedState = null; }),
getNewEdge(ctx.rectangle, ctx.newTransition),
getVertices(ctx, (state, toPoint) => automaton.moveState(state, toPoint), () => addTransition(ctx), (state) => { ctx.selectedState = state; ctx.selectedTransition = null; }),
getVertices(ctx, function (state, toPoint) { return automaton.moveState(state, toPoint); }, function () { return addTransition(ctx); }, function (state) { ctx.selectedState = state; ctx.selectedTransition = null; }),
{
tag: 'defs',
children: [
Expand All @@ -117,7 +117,7 @@ var Automata;
}
];
},
onClick(ctx, event) {
onClick: function (ctx, event) {
if (ctx.dragMode === Automata.Models.DragMode.NewEdge) {
return true;
}
Expand All @@ -126,20 +126,20 @@ var Automata;
b.invalidate();
return true;
},
onDoubleClick(ctx, event) {
onDoubleClick: function (ctx, event) {
var automaton = ctx.data.automaton;
var state = automaton.addState(new Automata.Models.Point(event.x - ctx.rectangle.left, event.y - ctx.rectangle.top));
ctx.selectedState = state;
ctx.selectedTransition = null;
b.invalidate();
return true;
},
postInitDom(ctx, me, element) {
postInitDom: function (ctx, me, element) {
if (element.focus) {
element.focus();
}
},
postUpdateDom(ctx, me, element) {
postUpdateDom: function (ctx, me, element) {
ctx.rectangle = element.getBoundingClientRect();
if (b.ieVersion() === undefined) {
return;
Expand All @@ -148,7 +148,7 @@ var Automata;
element.removeChild(defs);
element.appendChild(defs);
},
onPointerMove(ctx, event) {
onPointerMove: function (ctx, event) {
if (ctx.dragMode === Automata.Models.DragMode.NewEdge) {
ctx.newTransition.to = null;
ctx.newTransition.screenPoint = new Automata.Models.Point(event.x, event.y);
Expand All @@ -160,21 +160,21 @@ var Automata;
}
return false;
},
onPointerUp(ctx, event) {
onPointerUp: function (ctx, event) {
if (ctx.dragMode === Automata.Models.DragMode.NewEdge) {
ctx.newTransition.from = null;
}
return true;
},
onKeyDown(ctx, event) {
onKeyDown: function (ctx, event) {
if (event.ctrl && ctx.dragMode === Automata.Models.DragMode.Move) {
ctx.dragMode = Automata.Models.DragMode.NewEdge;
ctx.newTransition = new Automata.Models.NewTransition(null, null);
b.invalidate();
}
return true;
},
onKeyUp(ctx, event) {
onKeyUp: function (ctx, event) {
if (!event.ctrl && ctx.dragMode === Automata.Models.DragMode.NewEdge) {
ctx.dragMode = Automata.Models.DragMode.Move;
ctx.newTransition = null;
Expand All @@ -194,7 +194,7 @@ var Automata;
}
};
function Get(data) {
return { component: Component, data };
return { component: Component, data: data };
}
Graph.Get = Get;
})(Graph = Components.Graph || (Components.Graph = {}));
Expand Down
2 changes: 1 addition & 1 deletion examples/automaton/components/help.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ var Automata;
];
}
var Component = {
render(ctx, me, oldMe) {
render: function (ctx, me, oldMe) {
me.tag = 'div';
me.className = 'help';
me.style = {
Expand Down
Loading

0 comments on commit 99a18d2

Please sign in to comment.