Skip to content

Commit 0421566

Browse files
arfarhadiarfarhadi
authored
Merge pull request #5 from maarten1001/reo-online-editor
Reo online editor
2 parents f652b1a + df5f691 commit 0421566

File tree

15 files changed

+15701
-0
lines changed

15 files changed

+15701
-0
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,4 @@
44
/**/target
55
/**/build.properties
66
/**/docs/_build
7+
.idea

‎reo-online-editor/channels.js

Lines changed: 286 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,286 @@
1+
function createSync(sync, x1, y1, x2, y2) {
2+
// create a channel...
3+
sync.name = 'sync';
4+
sync.end1 = 'source';
5+
sync.end2 = 'sink';
6+
7+
// ...a line...
8+
var line = new fabric.Line([x1, y1, x2, y2], {
9+
fill: lineFillColour,
10+
stroke: lineStrokeColour,
11+
strokeWidth: lineStrokeWidth,
12+
hasBorders: false,
13+
hasControls: false,
14+
selectable: false,
15+
hoverCursor: 'default',
16+
originX: 'center',
17+
originY: 'center',
18+
});
19+
sync.components.push(line);
20+
21+
// ...and an arrowhead
22+
var a = new fabric.Triangle({
23+
left: x2 - arrowOffsetOut,
24+
top: y2,
25+
width: arrowFactor * lineStrokeWidth,
26+
height: arrowFactor * lineStrokeWidth,
27+
baseAngle: 90,
28+
angle: 90,
29+
rotate: true,
30+
scale: false,
31+
fill: lineFillColour,
32+
hasBorders: false,
33+
hasControls: false,
34+
selectable: false,
35+
hoverCursor: 'default',
36+
referencePoint: 'node2',
37+
referenceDistance: arrowOffsetOut,
38+
referenceAngle: 270
39+
});
40+
sync.components.push(a);
41+
42+
return sync;
43+
} //createSync
44+
45+
function createLossySync(lossysync, x1, y1, x2, y2) {
46+
// create a channel...
47+
lossysync.name = 'lossysync';
48+
lossysync.end1 = 'source';
49+
lossysync.end2 = 'sink';
50+
51+
// ...a line...
52+
var line = new fabric.Line([x1, y1, x2, y2], {
53+
fill: lineFillColour,
54+
stroke: lineStrokeColour,
55+
strokeWidth: lineStrokeWidth,
56+
strokeDashArray: [8,8],
57+
hasBorders: false,
58+
hasControls: false,
59+
selectable: false,
60+
hoverCursor: 'default',
61+
originX: 'center',
62+
originY: 'center',
63+
});
64+
lossysync.components.push(line);
65+
66+
// ...and an arrowhead
67+
var a = new fabric.Triangle({
68+
left: x2 - arrowOffsetOut,
69+
top: y2,
70+
width: arrowFactor * lineStrokeWidth,
71+
height: arrowFactor * lineStrokeWidth,
72+
baseAngle: 90,
73+
angle: 90,
74+
rotate: true,
75+
scale: false,
76+
fill: lineFillColour,
77+
hasBorders: false,
78+
hasControls: false,
79+
selectable: false,
80+
hoverCursor: 'default',
81+
referencePoint: 'node2',
82+
referenceDistance: arrowOffsetOut,
83+
referenceAngle: 270
84+
});
85+
lossysync.components.push(a);
86+
87+
return lossysync;
88+
} //createLossySync
89+
90+
function createSyncDrain(syncdrain, x1, y1, x2, y2) {
91+
// create a channel...
92+
syncdrain.name = 'syncdrain';
93+
syncdrain.end1 = 'source';
94+
syncdrain.end2 = 'source';
95+
96+
// ...a line...
97+
var line = new fabric.Line([x1, y1, x2, y2], {
98+
fill: lineFillColour,
99+
stroke: lineStrokeColour,
100+
strokeWidth: lineStrokeWidth,
101+
hasBorders: false,
102+
hasControls: false,
103+
selectable: false,
104+
hoverCursor: 'default',
105+
originX: 'center',
106+
originY: 'center',
107+
});
108+
syncdrain.components.push(line);
109+
110+
// ...and an arrowhead
111+
var a1 = new fabric.Triangle({
112+
left: x1 + arrowOffsetIn,
113+
top: y2,
114+
width: arrowFactor * lineStrokeWidth,
115+
height: arrowFactor * lineStrokeWidth,
116+
baseAngle: 90,
117+
angle: 90,
118+
rotate: true,
119+
scale: false,
120+
fill: lineFillColour,
121+
hasBorders: false,
122+
hasControls: false,
123+
selectable: false,
124+
hoverCursor: 'default',
125+
referencePoint: 'node1',
126+
referenceDistance: arrowOffsetIn,
127+
referenceAngle: 90
128+
});
129+
syncdrain.components.push(a1);
130+
131+
// ...and an arrowhead
132+
var a2 = new fabric.Triangle({
133+
left: x2 - arrowOffsetIn,
134+
top: y2,
135+
width: arrowFactor * lineStrokeWidth,
136+
height: arrowFactor * lineStrokeWidth,
137+
baseAngle: 270,
138+
angle: 270,
139+
rotate: true,
140+
scale: false,
141+
fill: lineFillColour,
142+
hasBorders: false,
143+
hasControls: false,
144+
selectable: false,
145+
hoverCursor: 'default',
146+
referencePoint: 'node2',
147+
referenceDistance: arrowOffsetIn,
148+
referenceAngle: 270
149+
});
150+
syncdrain.components.push(a2);
151+
152+
return syncdrain;
153+
} //createSyncDrain
154+
155+
function createSyncSpout(syncspout, x1, y1, x2, y2) {
156+
// create a channel...
157+
syncspout.name = 'syncspout';
158+
syncspout.end1 = 'sink';
159+
syncspout.end2 = 'sink';
160+
161+
// ...a line...
162+
var line = new fabric.Line([x1, y1, x2, y2], {
163+
fill: lineFillColour,
164+
stroke: lineStrokeColour,
165+
strokeWidth: lineStrokeWidth,
166+
hasBorders: false,
167+
hasControls: false,
168+
selectable: false,
169+
hoverCursor: 'default',
170+
originX: 'center',
171+
originY: 'center',
172+
});
173+
syncspout.components.push(line);
174+
175+
// ...and an arrowhead
176+
var a1 = new fabric.Triangle({
177+
left: x1 + arrowOffsetOut,
178+
top: y2,
179+
width: arrowFactor * lineStrokeWidth,
180+
height: arrowFactor * lineStrokeWidth,
181+
baseAngle: 270,
182+
angle: 270,
183+
rotate: true,
184+
scale: false,
185+
fill: lineFillColour,
186+
hasBorders: false,
187+
hasControls: false,
188+
selectable: false,
189+
hoverCursor: 'default',
190+
referencePoint: 'node1',
191+
referenceDistance: arrowOffsetOut,
192+
referenceAngle: 90
193+
});
194+
syncspout.components.push(a1);
195+
196+
// ...and an arrowhead
197+
var a2 = new fabric.Triangle({
198+
left: x2 - arrowOffsetOut,
199+
top: y2,
200+
width: arrowFactor * lineStrokeWidth,
201+
height: arrowFactor * lineStrokeWidth,
202+
baseAngle: 90,
203+
angle: 90,
204+
rotate: true,
205+
scale: false,
206+
fill: lineFillColour,
207+
hasBorders: false,
208+
hasControls: false,
209+
selectable: false,
210+
hoverCursor: 'default',
211+
referencePoint: 'node2',
212+
referenceDistance: arrowOffsetOut,
213+
referenceAngle: 270
214+
});
215+
syncspout.components.push(a2);
216+
217+
return syncspout;
218+
} //createSyncSpout
219+
220+
function createFIFO1(FIFO1, x1, y1, x2, y2) {
221+
// create a channel...
222+
FIFO1.name = 'sync';
223+
FIFO1.end1 = 'source';
224+
FIFO1.end2 = 'sink';
225+
226+
var diffX = Math.abs(x1-x2);
227+
var diffY = Math.abs(y1-y2);
228+
229+
// ...a line...
230+
var line = new fabric.Line([x1, y1, x2, y2], {
231+
fill: lineFillColour,
232+
stroke: lineStrokeColour,
233+
strokeWidth: lineStrokeWidth,
234+
hasBorders: false,
235+
hasControls: false,
236+
selectable: false,
237+
hoverCursor: 'default',
238+
originX: 'center',
239+
originY: 'center',
240+
});
241+
FIFO1.components.push(line);
242+
243+
// ...an arrowhead...
244+
var a = new fabric.Triangle({
245+
left: x2 - arrowOffsetOut,
246+
top: y2,
247+
width: arrowFactor * lineStrokeWidth,
248+
height: arrowFactor * lineStrokeWidth,
249+
baseAngle: 90,
250+
angle: 90,
251+
rotate: true,
252+
scale: false,
253+
fill: lineFillColour,
254+
hasBorders: false,
255+
hasControls: false,
256+
selectable: false,
257+
hoverCursor: 'default',
258+
referencePoint: 'node2',
259+
referenceDistance: arrowOffsetOut,
260+
referenceAngle: 270
261+
});
262+
FIFO1.components.push(a);
263+
264+
// ...and a rectangle
265+
var rect = new fabric.Rect({
266+
left: Math.min(x1,x2) + diffX / 2,
267+
top: Math.min(y1,y2) + diffY / 2,
268+
width: fifoWidth,
269+
height: fifoHeight,
270+
baseAngle: 90,
271+
angle: 90,
272+
rotate: true,
273+
scale: false,
274+
fill: fifoFillColour,
275+
stroke: lineStrokeColour,
276+
strokeWidth: lineStrokeWidth,
277+
hasBorders: false,
278+
hasControls: false,
279+
selectable: false,
280+
originX: 'center',
281+
originY: 'center'
282+
});
283+
FIFO1.components.push(rect);
284+
285+
return FIFO1;
286+
} //createFIFO1

0 commit comments

Comments
 (0)