Permalink
June 1, 2015 03:59
October 10, 2015 14:27
June 1, 2015 03:59
October 10, 2015 14:27
June 1, 2015 03:59
May 13, 2021 12:02
January 30, 2020 18:38
June 1, 2015 03:59
December 6, 2020 12:28
June 1, 2015 03:59
June 1, 2015 03:59
March 2, 2018 12:09
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
February 28, 2016 17:42
February 23, 2020 17:46
February 28, 2016 17:42
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
February 23, 2020 17:46
May 11, 2017 14:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
December 29, 2019 01:03
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
February 23, 2020 17:46
September 9, 2015 16:53
February 23, 2020 17:46
December 29, 2019 01:03
February 23, 2020 17:46
December 29, 2019 01:03
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
July 30, 2018 23:13
February 23, 2020 17:46
September 25, 2015 16:45
September 25, 2015 16:45
February 23, 2020 17:46
February 23, 2020 17:46
January 9, 2017 18:33
February 23, 2020 17:46
February 23, 2020 17:46
September 9, 2015 16:53
September 9, 2015 16:53
March 2, 2018 12:09
February 23, 2020 17:46
February 23, 2020 17:46
September 9, 2015 16:53
September 9, 2015 16:53
March 2, 2018 12:09
February 23, 2020 17:46
February 23, 2020 17:46
September 9, 2015 16:53
February 23, 2020 17:46
September 9, 2015 16:53
September 9, 2015 16:53
September 9, 2015 16:53
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
February 16, 2017 02:57
February 16, 2017 02:57
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
June 1, 2015 03:59
February 23, 2020 17:46
February 7, 2020 13:45
February 7, 2020 13:45
November 21, 2020 17:46
February 7, 2020 13:45
May 13, 2021 12:02
February 27, 2023 03:13
February 23, 2020 17:46
February 23, 2020 17:46
February 23, 2020 17:46
February 7, 2020 13:45
February 7, 2020 13:45
February 23, 2020 17:46
February 7, 2020 13:45
February 23, 2020 17:46
February 23, 2020 17:46
February 23, 2020 17:46
February 23, 2020 17:46
February 23, 2020 17:46
February 7, 2020 13:45
February 23, 2020 17:46
February 7, 2020 13:45
February 7, 2020 13:45
February 7, 2020 13:45
February 7, 2020 13:45
February 23, 2020 17:46
June 27, 2020 23:55
February 23, 2020 17:46
April 9, 2020 02:20
February 23, 2020 17:46
February 7, 2020 13:45
September 15, 2020 08:31
February 23, 2020 17:46
February 7, 2020 13:45
February 23, 2020 17:46
February 7, 2020 13:45
February 7, 2020 13:45
February 7, 2020 13:45
February 23, 2020 17:46
February 7, 2020 13:45
February 23, 2020 17:46
February 7, 2020 13:45
February 7, 2020 13:45
Newer
100644
1786 lines (1566 sloc)
49.5 KB
2
//
3
// This program is free software; you can redistribute it and/or
4
// modify it under the terms of the The GNU Affero General Public
5
// License as published by the Free Software Foundation; either
6
// version 3 of the License, or (at your option) any later version.
7
//
8
// You should have received a copy of the GNU Affero General Public
9
// License along with this library; if not, write to the Free Software
10
// Foundation, 51 Franklin Street, Suite 500 Boston, MA 02110-1335 USA
11
12
/*
13
global
14
15
createjs, SVG, DEFAULTBLOCKSCALE, STANDARDBLOCKHEIGHT
16
*/
17
18
/*
19
exported
20
21
ProtoBlock, ValueBlock, BooleanBlock, BooleanSensorBlock,
22
LeftBlock, FlowClampBlock, StackClampBlock
23
*/
24
25
// The ProtoBlock class is defined in this file. Protoblocks are the
26
// prototypes from which Blocks are created.
27
28
// Note that protoblocks.js is largely deprecated. It is only used to
29
// generate palette blocks.
30
31
// Protoblock contain generic information about blocks and some
32
// methods common to all blocks.
33
class ProtoBlock {
34
constructor(name) {
35
// Name is used run-dictionary index, and palette label.
36
this.name = name;
37
// The palette to which this block is assigned.
38
this.palette = null;
39
// The graphic style used by the block.
40
this.style = null;
41
// The generator function used to create the artwork
42
this.generator = null;
43
// Does the block expand (or collapse) when other blocks are
44
// attached? e.g., start, repeat...
45
this.expandable = false;
46
// Is this block a parameter? Parameters have their labels
47
// overwritten with their current value.
48
this.parameter = false;
49
// How many "non-flow" arguments does a block have? (flow is
50
// vertical down a stack; args are horizontal. The pendown block
51
// has 0 args; the forward block has 1 arg; the setxy block has 2
52
// args.
53
this.args = 0;
54
// Default values for block parameters, e.g., forward 100 or right 90.
55
this.defaults = [];
56
// What is the size of the block prior to any expansion?
57
this.size = 1.0;
58
// Dock types are a list of the types associated with the docking points.
59
this.dockTypes = [];
60
// Static labels are generated as part of the inline SVG.
61
this.staticLabels = [];
62
// Default fontsize used for static labels.
63
this.fontsize = null;
64
// Extra block width for long labels
65
this.extraWidth = 0;
66
// Block scale
67
this.scale = DEFAULTBLOCKSCALE;
68
// The filepath of the image.
69
this.image = null;
70
// Hidden: don't show on any palette
71
this.hidden = false;
72
// Disabled: use inactive colors
73
this.disabled = false;
74
// Deprecated
75
this.deprecated = false;
76
//Stores the width of the text component
77
this.textWidth = 0;
78
this.labelOffset = 0;
79
this.beginnerModeBlock = false;
80
}
81
82
adjustWidthToLabel() {
84
return;
85
}
97
98
// What follows are the initializations for different block
99
// styles.
100
101
// The generator methods return the svg artwork, the dock
102
// positions, and the width and height, and the height used to
103
// calculate the hit area for the block. (Note that clamp blocks
104
// only extend their hit area to the top of the clamp.)
105
106
// E.g., penup, pendown
108
this.args = 0;
111
this.generator = this.zeroArgBlockGenerator;
113
116
svg.setScale(this.scale);
117
svg.setTab(true);
118
svg.setSlot(true);
119
if (this.fontsize) {
120
svg.setFontSize(this.fontsize);
121
}
122
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
125
svg.docks,
126
svg.getWidth(),
127
svg.getHeight(),
128
svg.getHeight()
129
];
152
svg.setScale(this.scale);
153
svg.setSlot(true);
154
svg.setTab(true);
155
if (this.fontsize) {
156
svg.setFontSize(this.fontsize);
157
}
158
// We need to generate the artwork in order to generate the dock.
162
'<svg xmlns="http://www.w3.org/2000/svg" width="1" height="1"><text style="font-size:10px;fill:#000000;font-family:sans-serif;text-anchor:end"><tspan x="46.333333333333336" y="13.5">block_label</tspan></text></svg>';
163
// And bring the last dock position to the top.
164
svg.docks[1][1] = svg.docks[0][1];
167
168
// E.g., break
170
this.args = 0;
173
this.generator = this.basicBlockNoFlowGenerator;
175
178
svg.setScale(this.scale);
179
svg.setSlot(true);
180
svg.setTail(true);
182
if (this.fontsize) {
183
svg.setFontSize(this.fontsize);
184
}
186
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
189
svg.docks,
190
svg.getWidth(),
191
svg.getHeight(),
192
svg.getHeight()
193
];
195
196
// E.g., collapsed
198
this.args = 0;
199
this.dockTypes.push("unavailable");
200
this.dockTypes.push("unavailable");
201
this.generator = this.basicBlockCollapsedGenerator;
203
206
svg.setScale(this.scale);
207
svg.setCap(true);
208
svg.setTail(true);
210
if (this.fontsize) {
211
svg.setFontSize(this.fontsize);
212
}
214
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
217
svg.docks,
218
svg.getWidth(),
219
svg.getHeight(),
220
svg.getHeight()
221
];
223
224
// E.g., forward, right
226
this.args = 1;
227
this.dockTypes.push("out");
228
this.dockTypes.push("numberin");
229
this.dockTypes.push("in");
230
this.generator = this.oneArgBlockGenerator;
232
235
svg.setScale(this.scale);
236
svg.setTab(true);
237
svg.setInnies([true]);
238
svg.setSlot(true);
240
if (this.fontsize) {
241
svg.setFontSize(this.fontsize);
242
}
244
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
247
svg.docks,
248
svg.getWidth(),
249
svg.getHeight(),
250
svg.getHeight()
251
];
253
254
// E.g., wait for
256
this.args = 1;
258
this.dockTypes.push("out");
259
this.dockTypes.push("booleanin");
260
this.dockTypes.push("in");
261
this.generator = this.oneBooleanArgBlockGenerator;
263
266
svg.setScale(this.scale);
267
svg.setTab(true);
268
svg.setSlot(true);
269
svg.setBoolean(true);
270
svg.setClampCount(0);
272
if (this.fontsize) {
273
svg.setFontSize(this.fontsize);
274
}
276
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
279
svg.docks,
280
svg.getWidth(),
281
svg.getHeight(),
282
svg.getHeight()
283
];
285
286
// E.g., setxy. These are expandable.
288
this.expandable = true;
290
this.size = 2;
291
this.args = 2;
292
this.dockTypes.push("out");
293
this.dockTypes.push("numberin");
294
this.dockTypes.push("numberin");
295
this.dockTypes.push("in");
296
this.generator = this.twoArgBlockGenerator;
298
301
svg.setScale(this.scale);
302
svg.setTab(true);
303
svg.setInnies([true, true]);
304
svg.setSlot(true);
306
if (expandY) {
310
} else {
311
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
312
}
314
if (this.fontsize) {
315
svg.setFontSize(this.fontsize);
316
}
320
svg.docks,
321
svg.getWidth(),
322
svg.getHeight(),
323
svg.getHeight()
324
];
326
327
// E.g., ??? These are expandable.
329
this.expandable = true;
331
this.size = 3;
332
this.args = 3;
333
this.dockTypes.push("out");
334
this.dockTypes.push("numberin");
335
this.dockTypes.push("numberin");
336
this.dockTypes.push("numberin");
337
this.dockTypes.push("in");
338
this.generator = this.threeArgBlockGenerator;
340
343
svg.setScale(this.scale);
344
svg.setTab(true);
345
svg.setInnies([true, true, true]);
346
svg.setSlot(true);
348
if (expandY) {
352
} else {
362
svg.docks,
363
svg.getWidth(),
364
svg.getHeight(),
365
svg.getHeight()
366
];
374
this.dockTypes.push("out");
375
this.dockTypes.push("numberin");
376
this.dockTypes.push("numberin");
377
this.dockTypes.push("numberin");
378
this.dockTypes.push("numberin");
379
this.dockTypes.push("in");
385
svg.setScale(this.scale);
386
svg.setTab(true);
387
svg.setInnies([true, true, true, true]);
388
svg.setSlot(true);
395
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
396
}
398
if (this.fontsize) {
399
svg.setFontSize(this.fontsize);
400
}
404
svg.docks,
405
svg.getWidth(),
406
svg.getHeight(),
407
svg.getHeight()
408
];
410
411
// E.g., sqrt, box
414
this.size = 1;
415
this.args = 1;
416
this.parameter = true;
419
this.generator = this.oneArgMathBlockGenerator;
421
424
svg.setScale(this.scale);
425
svg.setSlot(false);
426
svg.setInnies([true]);
427
svg.setOutie(true);
428
svg.setTab(false);
430
if (this.fontsize) {
431
svg.setFontSize(this.fontsize);
432
}
434
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
437
svg.docks,
438
svg.getWidth(),
439
svg.getHeight(),
440
svg.getHeight()
441
];
443
444
// E.g., plus, minus, multiply, divide, power,distance. These are also expandable.
446
this.expandable = true;
448
this.size = 2;
449
this.args = 2;
450
this.parameter = true;
451
this.dockTypes.push("numberout");
452
this.dockTypes.push("numberin");
453
this.dockTypes.push("numberin");
454
this.generator = this.twoArgMathBlockGenerator;
456
459
svg.setScale(this.scale);
460
svg.setSlot(false);
461
svg.setInnies([true, true]);
462
svg.setOutie(true);
463
svg.setTab(false);
465
if (expandY) {
469
} else {
470
svg.setExpand(30 + this.extraWidth, 0, 0, 0);
471
}
473
if (this.fontsize) {
474
svg.setFontSize(this.fontsize);
475
}
479
svg.docks,
480
svg.getWidth(),
481
svg.getHeight(),
482
svg.getHeight()
483
];
485
493
this.dockTypes.push("numberout");
494
this.dockTypes.push("numberin");
495
this.dockTypes.push("numberin");
496
this.dockTypes.push("numberin");
502
svg.setScale(this.scale);
503
svg.setSlot(false);
504
svg.setInnies([true, true, true]);
505
svg.setOutie(true);
506
svg.setTab(false);
522
svg.docks,
523
svg.getWidth(),
524
svg.getHeight(),
525
svg.getHeight()
526
];
528
// E.g., distance . Distance block will calculate geometrical distance between two pointa
529
// by default (cursor x ,cursor y ) and x and y
536
this.dockTypes.push("numberout");
537
this.dockTypes.push("numberin");
538
this.dockTypes.push("numberin");
539
this.dockTypes.push("numberin");
540
this.dockTypes.push("numberin");
546
svg.setScale(this.scale);
547
svg.setSlot(false);
548
svg.setInnies([true, true, true, true]);
549
svg.setOutie(true);
550
svg.setTab(false);
551
552
if (expandY) {
566
svg.docks,
567
svg.getWidth(),
568
svg.getHeight(),
569
svg.getHeight()
570
];
573
// E.g., number, string. Value blocks get DOM textareas associated
574
// with them so their values can be edited by the user.
577
this.size = 1;
578
this.args = 0;
580
this.generator = this.valueBlockGenerator;
582
585
svg.setScale(this.scale);
586
// Extra room for parameter label
587
svg.setExpand(60 + this.extraWidth, 0, 0, 0);
588
svg.setOutie(true);
590
if (this.fontsize) {
591
svg.setFontSize(this.fontsize);
592
}
596
svg.docks,
597
svg.getWidth(),
598
svg.getHeight(),
599
svg.getHeight()
600
];
602
603
// E.g., media. Media blocks invoke a chooser and a thumbnail
604
// image is overlayed to represent the data associated with the
605
// block.
609
this.args = 0;
611
this.generator = this.mediaBlockGenerator;
613
616
svg.setScale(this.scale);
617
// Extra room for graphics
618
svg.setExpand(60 + this.extraWidth, 23, 0, 0);
619
svg.setOutie(true);
621
if (this.fontsize) {
622
svg.setFontSize(this.fontsize);
623
}
627
svg.docks,
628
svg.getWidth(),
629
svg.getHeight(),
630
svg.getHeight()
631
];
633
634
// E.g., start. A "child" flow is docked in an expandable clamp.
635
// There are no additional arguments and no flow above or below.
638
this.expandable = true;
639
this.size = 3;
640
this.args = 1;
641
this.dockTypes.push("unavailable");
642
this.dockTypes.push("in");
643
this.dockTypes.push("unavailable");
644
this.generator = this.stackClampZeroArgBlockGenerator;
646
649
svg.setScale(this.scale);
650
svg.setCap(true);
651
svg.setTail(true);
652
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
655
if (slots) {
656
svg.setClampSlots(0, slots);
657
} else {
658
svg.setClampSlots(0, 1);
659
}
661
if (this.fontsize) {
662
svg.setFontSize(this.fontsize);
663
}
667
svg.docks,
668
svg.getWidth(),
669
svg.getHeight(),
670
svg.docks[1][1]
671
];
673
674
// E.g., emptyclamp. Unlike start, there is a flow above and below.
677
this.expandable = true;
678
this.size = 2;
679
this.args = 1;
680
this.dockTypes.push("out");
681
this.dockTypes.push("in");
682
this.dockTypes.push("in");
683
this.generator = this.flowClampBlockGenerator;
685
688
svg.setScale(this.scale);
689
svg.setTab(true);
691
svg.setSlot(true);
692
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
694
if (slots) {
695
svg.setClampSlots(0, slots);
696
} else {
697
svg.setClampSlots(0, 1);
698
}
700
if (this.fontsize) {
701
svg.setFontSize(this.fontsize);
702
}
706
svg.docks,
707
svg.getWidth(),
708
svg.getHeight(),
709
svg.docks[1][1]
710
];
712
713
// E.g., repeat. Unlike action, there is a flow above and below.
716
this.expandable = true;
717
this.size = 2;
718
this.args = 2;
719
this.dockTypes.push("out");
720
this.dockTypes.push("numberin");
721
this.dockTypes.push("in");
722
this.dockTypes.push("in");
723
this.generator = this.flowClampOneArgBlockGenerator;
725
728
svg.setScale(this.scale);
729
svg.setTab(true);
730
svg.setSlot(true);
731
svg.setInnies([true]);
733
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
735
if (slots) {
736
svg.setClampSlots(0, slots);
737
} else {
738
svg.setClampSlots(0, 1);
739
}
741
if (this.fontsize) {
742
svg.setFontSize(this.fontsize);
743
}
747
svg.docks,
748
svg.getWidth(),
749
svg.getHeight(),
750
svg.docks[2][1]
751
];
753
754
// E.g., tuplet, which takes two args plus an interior flow.
755
// There is a flow above and below.
761
this.dockTypes.push("out");
762
this.dockTypes.push("numberin");
763
this.dockTypes.push("numberin");
764
this.dockTypes.push("in");
765
this.dockTypes.push("in");
771
svg.setScale(this.scale);
772
svg.setTab(true);
773
svg.setSlot(true);
774
svg.setInnies([true, true]);
775
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
777
if (slots) {
778
svg.setClampSlots(0, slots);
779
} else {
780
svg.setClampSlots(0, 1);
781
}
789
svg.docks,
790
svg.getWidth(),
791
svg.getHeight(),
792
svg.docks[3][1]
793
];
801
this.dockTypes.push("out");
802
this.dockTypes.push("numberin");
803
this.dockTypes.push("numberin");
804
this.dockTypes.push("textin");
805
this.dockTypes.push("in");
806
this.dockTypes.push("in");
818
if (slots) {
819
svg.setClampSlots(0, slots);
820
} else {
821
svg.setClampSlots(0, 1);
822
}
830
svg.docks,
831
svg.getWidth(),
832
svg.getHeight(),
833
svg.docks[4][1]
834
];
843
this.dockTypes.push("out");
844
this.dockTypes.push("textin");
845
this.dockTypes.push("anyin");
846
this.dockTypes.push("in");
852
svg.setScale(this.scale);
853
svg.setTab(true);
854
svg.setSlot(true);
855
svg.setInnies([true]);
856
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
858
if (slots) {
859
svg.setClampSlots(0, slots);
860
} else {
861
svg.setClampSlots(0, [1]);
862
}
868
// The hit area extends halfway between the label dock and the
869
// first innie arg dock.
872
svg.docks,
873
svg.getWidth(),
874
svg.getHeight(),
875
(svg.docks[1][1] + svg.docks[2][1]) / 2
876
];
885
this.dockTypes.push("anyout");
886
this.dockTypes.push("textin");
887
this.dockTypes.push("anyin");
893
svg.setScale(this.scale);
894
svg.setInnies([true]);
895
svg.setOutie(true);
896
svg.setTab(false);
897
svg.setSlot(false);
898
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
900
if (slots) {
901
svg.setClampSlots(0, slots);
902
} else {
903
svg.setClampSlots(0, [1]);
904
}
910
// The hit area extends halfway between the label dock and the
911
// first innie arg dock.
914
svg.docks,
915
svg.getWidth(),
916
svg.getHeight(),
917
(svg.docks[1][1] + svg.docks[2][1]) / 2
918
];
927
this.dockTypes.push("out");
928
this.dockTypes.push("anyin");
929
this.dockTypes.push("in");
935
svg.setScale(this.scale);
936
svg.setTab(true);
937
svg.setSlot(true);
938
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
939
if (slots) {
940
svg.setClampSlots(0, slots);
941
} else {
942
svg.setClampSlots(0, [1]);
943
}
951
svg.docks,
952
svg.getWidth(),
953
svg.getHeight(),
954
(svg.docks[1][1] * 2) / 3
955
];
957
958
// E.g., named calculate with args: innies instead of interior slots.
971
svg.setScale(this.scale);
972
svg.setOutie(true);
973
svg.setTab(false);
974
svg.setSlot(false);
975
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
977
if (slots) {
978
svg.setClampSlots(0, slots);
979
} else {
980
svg.setClampSlots(0, [1]);
981
}
989
svg.docks,
990
svg.getWidth(),
991
svg.getHeight(),
992
(svg.docks[1][1] * 2) / 3
993
];
996
// E.g., if. A "child" flow is docked in an expandable clamp. The
997
// additional argument is a boolean. There is flow above and below.
1000
this.expandable = true;
1001
this.size = 3;
1002
this.args = 2;
1003
this.dockTypes.push("out");
1004
this.dockTypes.push("booleanin");
1005
this.dockTypes.push("in");
1006
this.dockTypes.push("in");
1007
this.generator = this.flowClampBooleanArgBlockGenerator;
1009
1012
svg.setScale(this.scale);
1013
svg.setTab(true);
1014
svg.setBoolean(true);
1015
svg.setSlot(true);
1016
svg.setExpand(this.extraWidth, 0, 0, 0);
1018
if (slots) {
1019
svg.setClampSlots(0, slots);
1020
} else {
1021
svg.setClampSlots(0, 1);
1022
}
1024
if (this.fontsize) {
1025
svg.setFontSize(this.fontsize);
1026
}
1030
svg.docks,
1031
svg.getWidth(),
1032
svg.getHeight(),
1033
svg.docks[2][1]
1034
];
1036
1037
// E.g., if then else. Two "child" flows are docked in expandable
1038
// clamps. The additional argument is a boolean. There is flow
1039
// above and below.
1042
this.expandable = true;
1043
this.size = 4;
1044
this.args = 3;
1045
this.dockTypes.push("out");
1046
this.dockTypes.push("booleanin");
1047
this.dockTypes.push("in");
1048
this.dockTypes.push("in");
1049
this.dockTypes.push("in");
1052
1055
svg.setScale(this.scale);
1056
svg.setTab(true);
1057
svg.setSlot(true);
1058
svg.setBoolean(true);
1061
if (topSlots) {
1062
svg.setClampSlots(0, topSlots);
1063
} else {
1064
svg.setClampSlots(0, 1);
1065
}
1067
if (bottomSlots) {
1068
svg.setClampSlots(1, bottomSlots);
1069
} else {
1070
svg.setClampSlots(1, 1);
1071
}
1073
svg.setExpand(this.extraWidth, 0, 0, 0);
1075
if (this.fontsize) {
1076
svg.setFontSize(this.fontsize);
1077
}
1081
svg.docks,
1082
svg.getWidth(),
1083
svg.getHeight(),
1084
svg.docks[2][1]
1085
];
1087
1088
// E.g., forever. Unlike start, there is flow above and below.
1091
this.expandable = true;
1092
this.size = 2;
1093
this.args = 1;
1094
this.dockTypes.push("out");
1095
this.dockTypes.push("in");
1096
this.dockTypes.push("in");
1097
this.generator = this.flowClampZeroArgBlockGenerator;
1099
1102
svg.setScale(this.scale);
1103
svg.setTab(true);
1104
svg.setSlot(true);
1105
svg.setExpand(10 + this.extraWidth, 0, 0, 0);
1107
if (slots) {
1108
svg.setClampSlots(0, slots);
1109
} else {
1110
svg.setClampSlots(0, 1);
1111
}
1113
if (this.fontsize) {
1114
svg.setFontSize(this.fontsize);
1115
}
1119
svg.docks,
1120
svg.getWidth(),
1121
svg.getHeight(),
1122
svg.docks[1][1]
1123
];
1125
1139
svg.setScale(this.scale);
1140
svg.setSlot(false);
1141
svg.setOutie(true);
1142
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
1144
if (slots) {
1145
svg.setClampSlots(0, slots);
1146
} else {
1147
svg.setClampSlots(0, [1]);
1148
}
1156
svg.docks,
1157
svg.getWidth(),
1158
svg.getHeight(),
1159
svg.docks[1][1]
1160
];
1163
// E.g., action. A "child" flow is docked in an expandable clamp.
1164
// The additional argument is a name. Again, no flow above or below.
1167
this.expandable = true;
1168
this.size = 3;
1170
this.dockTypes.push("unavailable");
1171
this.dockTypes.push("anyin");
1172
this.dockTypes.push("in");
1173
this.dockTypes.push("unavailable");
1174
this.generator = this.stackClampOneArgBlockGenerator;
1176
1179
svg.setScale(this.scale);
1180
svg.setCap(true);
1181
svg.setTail(true);
1182
svg.setInnies([true]);
1183
svg.setExpand(10 + this.extraWidth, 0, 0, 0);
1186
if (slots) {
1187
svg.setClampSlots(0, slots);
1188
} else {
1189
svg.setClampSlots(0, 1);
1190
}
1192
if (this.fontsize) {
1193
svg.setFontSize(this.fontsize);
1194
}
1198
svg.docks,
1199
svg.getWidth(),
1200
svg.getHeight(),
1201
svg.docks[2][1]
1202
];
1204
1205
// E.g., mouse button.
1208
this.size = 1;
1209
this.args = 0;
1211
this.generator = this.booleanZeroArgBlockGenerator;
1216
svg.setScale(this.scale);
1217
svg.setExpand(60 + this.extraWidth, 0, 0, 4);
1219
if (this.fontsize) {
1220
svg.setFontSize(this.fontsize);
1221
}
1225
svg.docks,
1226
svg.getWidth(),
1227
svg.getHeight(),
1228
svg.getHeight()
1229
];
1231
1232
// E.g., named sensor blocks
1235
this.size = 2;
1236
this.args = 1;
1237
this.parameter = true;
1240
this.generator = this.booleanOneArgBlockGenerator;
1242
1245
svg.setScale(this.scale);
1246
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
1248
if (this.fontsize) {
1249
svg.setFontSize(this.fontsize);
1250
}
1252
svg.setInnies([true]);
1255
svg.docks,
1256
svg.getWidth(),
1257
svg.getHeight(),
1258
svg.getHeight()
1259
];
1261
1262
// E.g., not
1265
this.size = 2;
1266
this.args = 1;
1267
this.parameter = true;
1268
this.dockTypes.push("booleanout");
1269
this.dockTypes.push("booleanin");
1270
this.generator = this.booleanOneBooleanArgBlockGenerator;
1272
1275
svg.setScale(this.scale);
1276
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
1278
if (this.fontsize) {
1279
svg.setFontSize(this.fontsize);
1280
}
1284
svg.docks,
1285
svg.getWidth(),
1286
svg.getHeight(),
1287
svg.getHeight()
1288
];
1290
1291
// E.g., and, or
1294
this.size = 3;
1295
this.args = 2;
1296
this.parameter = true;
1297
this.dockTypes.push("booleanout");
1298
this.dockTypes.push("booleanin");
1299
this.dockTypes.push("booleanin");
1300
this.generator = this.booleanTwoBooleanArgBlockGenerator;
1302
1305
svg.setScale(this.scale);
1306
svg.setExpand(20 + this.extraWidth, 0, 0, 0);
1308
if (this.fontsize) {
1309
svg.setFontSize(this.fontsize);
1310
}
1314
svg.docks,
1315
svg.getWidth(),
1316
svg.getHeight(),
1317
svg.getHeight()
1318
];
1320
1321
// E.g., greater, less, equal
1324
this.size = 2;
1325
this.args = 2;
1326
this.parameter = true;
1327
this.expandable = true;
1328
this.dockTypes.push("booleanout");
1329
this.dockTypes.push("numberin");
1330
this.dockTypes.push("numberin");
1331
this.generator = this.booleanTwoArgBlockGenerator;
1333
1336
svg.setScale(this.scale);
1338
if (expandY) {
1342
} else {
1343
svg.setExpand(10 + this.extraWidth, 0, 0, 0);
1344
}
1346
if (this.fontsize) {
1347
svg.setFontSize(this.fontsize);
1348
}
1352
svg.docks,
1353
svg.getWidth(),
1354
svg.getHeight(),
1355
svg.getHeight()
1356
];
1358
1359
// E.g., color, shade, pensize, ...
1362
this.parameter = true;
1363
this.size = 1;
1364
this.args = 0;
1366
this.generator = this.parameterBlockGenerator;
1368
1371
svg.setScale(this.scale);
1372
// Extra room for parameter label
1373
svg.setExpand(70 + this.extraWidth, 0, 0, 0);
1374
svg.setOutie(true);
1376
if (this.fontsize) {
1377
svg.setFontSize(this.fontsize);
1378
}
1382
svg.docks,
1383
svg.getWidth(),
1384
svg.getHeight(),
1385
svg.getHeight()
1386
];
1395
// From https://stackoverflow.com/a/34749873
1396
if (!sources.length) return target;
1397
const source = sources.shift();
1398
1399
if (isObject(target) && isObject(source)) {
1400
for (const key in source) {
1401
if (isObject(source[key])) {
1402
if (!target[key]) Object.assign(target, { [key]: {} });
1403
mergeDeep(target[key], source[key]);
1404
} else {
1405
Object.assign(target, { [key]: source[key] });
1406
}
1407
}
1408
}
1409
1410
return mergeDeep(target, ...sources);
1412
1413
class BaseBlock extends ProtoBlock {
1414
constructor(name) {
1415
super(name);
1416
1417
this.macroFunc = null;
1423
this.piemenuValuesC1 = [];
1424
this.piemenuValuesC2 = [];
1425
this.piemenuValuesC3 = [];
1427
1428
// Just for brevity
1429
this.lang = localStorage.languagePreference || navigator.language;
1430
}
1431
1432
setPalette(palette, activity) {
1433
this.palette = activity.palettes.dict[palette];
1442
this._style.args ||= 0;
1443
this._style.argTypes ||= [];
1444
this._style.argLabels ||= [];
1445
this._style.defaults ||= [];
1446
this._style.flows ||= {};
1447
this._style.flows.labels ||= [];
1454
if (this._style.flows.type === "arg") this.style = "argclamp";
1455
else if (this._style.flows.type === "value") this.style = "value";
1468
if (this._style.flows.type === "value" && this._style.args === 2)
1469
this.expandable = true;
1474
}
1475
if (this._style.argTypes[0] === "booleanin") this.size++;
1476
else if (this._style.argTypes[1] === "booleanin") this.size++;
1479
if (this._style.image) {
1480
this.size++;
1481
this.image = this._style.image;
1482
}
1483
1485
this.dockTypes = [];
1486
this.defaults = [];
1487
this._style.argLabels.forEach(i => this.staticLabels.push(i));
1488
this._style.flows.labels.forEach(i => this.staticLabels.push(i));
1489
1490
if (this._style.flows.left)
1493
this.dockTypes.push(
1494
this._style.flows.top === "cap" ? "unavailable" : "out"
1495
);
1496
if (typeof this._style.args === "number")
1499
if (i < this._style.defaults.length)
1500
this.defaults.push(this._style.defaults[i]);
1501
}
1508
this.dockTypes.push(
1509
this._style.flows.bottom === "tail" ? "unavailable" : "in"
1510
);
1516
if (this._style.flows.top === "cap") svg.setCap(true);
1517
else svg.setSlot(this._style.flows.top);
1519
if (this._style.flows.bottom === "tail") svg.setTail(true);
1520
else if (this._style.flows.bottom) svg.setTab(true);
1521
if (this._style.flows.left) svg.setOutie(true);
1525
if (this._style.outType === "booleanout" && this._style.args === 2)
1526
pad -= 30;
1527
else if (this._style.argTypes[0] === "booleanin") pad -= 5;
1529
svg.setExpand(
1530
pad + this.extraWidth,
1531
this.image ? 23 : 0,
1532
0,
1533
this._style.outType === "booleanout" && !this._style.args
1534
? 4
1535
: 0
1536
);
1537
1538
for (
1539
let i = arguments.length;
1540
i < this._style.flows.labels.length;
1541
i++
1542
)
1543
svg.setClampSlots(i, 1);
1544
svg.setClampCount(this._style.flows.labels.length);
1545
1546
for (let i = 0; i < arguments.length; i++) {
1547
if (this._style.flows.type == undefined) {
1548
svg.setExpand(
1549
30 + this.extraWidth,
1550
((arguments[arguments.length - i - 1] - 1) *
1551
STANDARDBLOCKHEIGHT) /
1552
2,
1553
0,
1554
0
1555
);
1556
} else if (this._style.flows.type == "value") {
1557
svg.setExpand(
1558
60 + this.extraWidth,
1559
((arguments[arguments.length - i - 1] - 1) *
1560
STANDARDBLOCKHEIGHT) /
1561
2,
1562
0,
1563
0
1564
);
1565
} else {
1566
svg.setClampSlots(
1567
i,
1568
arguments[arguments.length - i - 1] || 1
1569
);
1570
}
1571
}
1572
1573
if (this._style.argTypes[0] === "booleanin") {
1574
svg.setBoolean(true);
1575
} else if (typeof this._style.args === "number") {
1576
svg.setInnies(Array(this._style.args).fill(true));
1577
}
1578
1579
// Make space for the expand icon
1590
if (this._style.args === 1 || !this._style.args) {
1591
artwork = svg.booleanNot(!this._style.args);
1593
artwork = svg.booleanAndOr();
1594
} else {
1595
artwork = svg.booleanCompare();
1596
}
1598
artwork = svg.basicBox();
1599
} else {
1600
artwork = svg.basicBlock();
1601
}
1602
// If the block has 0 size, clear out the artwork
1603
if (this.size === 0) {
1604
artwork =
1605
'<svg xmlns="http://www.w3.org/2000/svg" width="1" height="1"><text style="font-size:10px;fill:#000000;font-family:sans-serif;text-anchor:end"><tspan x="46.333333333333336" y="13.5">block_label</tspan></text></svg>';
1609
this.isLeftClamp = this.style === "clamp" &&
1610
this._style.flows.left == true &&
1611
this._style.args === 0 &&
1612
this._style.flows.type == "flow" ;
1613
1615
clickHeight =
1616
svg.docks[
1617
svg.docks.length - this._style.flows.labels.length - 1
1618
][1];
1626
1627
// Special case for one argument boolean output blocks e.g found mouse
1628
1629
if(this._style.flows.left === "bool") {
1630
artwork = svg.booleanNot(true); // OneArg
1631
}
1632
1633
return [
1634
artwork,
1635
svg.docks,
1636
svg.getWidth(),
1637
svg.getHeight(),
1638
clickHeight
1639
];
1640
};
1641
}
1642
1643
makeMacro(macroFunc) {
1644
this.macroFunc = macroFunc;
1645
}
1646
1647
updateDockValue(slot, value) {
1648
this.dockTypes[slot] = value;
1649
}
1650
1669
console.warn("Block " + this.name + " was not added to a palette!");
1670
else this.palette.add(this);
1671
}
1672
}
1673
1674
class ValueBlock extends BaseBlock {
1675
constructor(name, displayName) {
1676
super(name);
1679
this.formBlock(
1680
{
1681
name: displayName,
1682
flows: {
1683
left: true,
1684
type: "value"
1685
}
1686
},
1687
!!displayName
1688
);
1689
}
1690
}
1691
1692
class BooleanBlock extends BaseBlock {
1693
constructor(name) {
1694
super(name);
1695
1696
this.formBlock({
1697
flows: {
1702
});
1703
}
1704
}
1705
1706
class BooleanSensorBlock extends BaseBlock {
1707
constructor(name, displayName) {
1708
super(name);
1718
});
1719
}
1720
}
1721
1722
class FlowBlock extends BaseBlock {
1723
constructor(name, displayName) {
1724
super(name);
1727
this.formBlock(
1728
{
1729
name: displayName,
1730
flows: {
1731
top: true,
1732
bottom: true
1733
}
1734
},
1735
!!displayName
1736
);
1737
}
1738
}
1739
1740
class LeftBlock extends BaseBlock {
1741
constructor(name, displayName) {
1742
super(name);
1745
this.formBlock(
1746
{
1747
name: displayName,
1748
flows: {
1749
left: true,
1750
type: null
1751
}
1752
},
1753
!!displayName
1754
);
1755
}
1756
}
1757
1758
class FlowClampBlock extends FlowBlock {
1759
constructor(name) {
1760
super(name);
1761
1762
this.extraWidth = 20;
1763
this.formBlock({
1764
flows: {
1767
}
1768
});
1769
}
1770
}
1771
1772
class StackClampBlock extends BaseBlock {
1773
constructor(name) {
1774
super(name);
1775
1776
this.extraWidth = 40;
1777
this.formBlock({
1778
flows: {