-
Notifications
You must be signed in to change notification settings - Fork 16
/
entry.js
122 lines (101 loc) · 2.94 KB
/
entry.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import * as Vec2 from 'vec2';
import Network from '../../../core/Network';
import { getRandomAttractors, getGridOfAttractors, applyNoise, getPhyllotaxisAttractors, getWaveOfAttractors } from '../../../core/AttractorPatterns';
import Node from '../../../core/Node';
import { random } from '../../../core/Utilities';
import { setupKeyListeners } from '../../../core/KeyboardInteractions';
import Settings from './Settings';
let canvas, ctx;
let network;
let showHelp = true;
// Create initial conditions for simulation
let setup = () => {
// Initialize canvas and context
canvas = document.getElementById('sketch');
ctx = canvas.getContext('2d');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
// Setup Network with initial conditions
setupNetwork();
// Begin animation loop
requestAnimationFrame(update);
}
// Create the network with initial conditions
let setupNetwork = () => {
// Initialize simulation object
network = new Network(ctx, Settings);
// Set up the attractors using pre-made patterns
let randomAttractors = getRandomAttractors(500, ctx, 10);
let gridAttractors = getGridOfAttractors(150, 100, ctx, 10);
let phyllotaxisAttractors = getPhyllotaxisAttractors(ctx);
let waveAttractors = getWaveOfAttractors(ctx);
network.attractors = gridAttractors;
// Add a set of random root nodes throughout scene
for(let i=0; i<10; i++) {
network.addNode(
new Node(
null,
new Vec2(
random(window.innerWidth),
random(window.innerHeight)
),
true,
ctx,
Settings
)
)
}
// Set up common keyboard interaction listeners
setupKeyListeners(network);
}
let drawText = () => {
let text = [
'No colors, no fancy vein thickness, just',
'randomly placed attractors and randomly',
'placed root nodes.',
'',
'Space = toggle pause',
'r = reset',
'c = toggle canalization',
'p = toggle opacity blending',
'b = toggle branch visibility',
'a = toggle attractor visibility',
'z = toggle attraction zones',
'k = toggle kill zones',
't = toggle tips',
'i = toggle influence lines',
'h = toggle this help text'
];
ctx.font = 'bold 24px sans-serif';
ctx.fillStyle = 'rgba(0,0,0,1)';
ctx.fillText('Basic', 20, 40);
ctx.font = '16px sans-serif';
ctx.fillStyle = 'rgba(0,0,0,.5)';
for(let i=0; i<text.length; i++) {
ctx.fillText(text[i], 20, 22*i + 80);
}
}
// Main program loop
let update = (timestamp) => {
network.update();
network.draw();
if(showHelp) {
drawText();
}
requestAnimationFrame(update);
}
// Key commands specific to this sketch
document.addEventListener('keypress', (e) => {
switch(e.key) {
// r = reset simulation by reinitializing the network with initial conditions
case "r":
setupNetwork();
break;
// h = toggle help text
case 'h':
showHelp = !showHelp;
break;
}
});
// Kick off the application
setup();