OLD | NEW |
---|---|
(Empty) | |
1 // Copyright 2015 The Chromium Authors. All rights reserved. | |
2 // Use of this source code is governed by a BSD-style license that can be | |
3 // found in the LICENSE file. | |
4 | |
5 // TODO(tengs): This page is just a placeholder. The real page still needs to be | |
6 // built. | |
7 | |
8 function LSystem(rules, startState, iterations) { | |
9 symbols = startState.split('').map(function(character) { | |
10 return { c: character, i: 0 }; | |
11 }); | |
12 | |
13 while (true) { | |
14 var index = -1; | |
15 for (var i = 0; i < symbols.length; ++i) { | |
16 var symbol = symbols[i]; | |
17 if (symbol.i < iterations && rules[symbol.c] != null) { | |
18 index = i; | |
19 break; | |
20 } | |
21 } | |
22 if (index == -1) | |
23 break; | |
24 | |
25 var symbol = symbols[index]; | |
26 var newSymbols = rules[symbol.c].apply(symbol).split('').map(function(c) { | |
27 return { c: c, i: symbol.i + 1 }; | |
28 }); | |
29 | |
30 Array.prototype.splice.apply(symbols, [index, 1].concat(newSymbols)); | |
31 } | |
32 | |
33 return symbols.map(function(symbol) { | |
34 return symbol.c; | |
35 }); | |
36 }; | |
37 | |
38 var rules = { | |
39 'X': function(x) { return 'X+YF'; }, | |
40 'Y': function(y) { return 'FX-Y'; }, | |
41 } | |
42 var startState = 'FX+FX+'; | |
43 var iterations = 10; | |
44 | |
45 function draw() { | |
46 var canvas = document.getElementById('canvas'); | |
47 canvas.width = canvas.offsetWidth; | |
48 canvas.height = canvas.offsetHeight; | |
49 | |
50 var canvasWidth = canvas.offsetWidth; | |
51 var canvasHeight = canvas.offsetHeight; | |
52 var context = canvas.getContext('2d'); | |
53 | |
54 context.lineWidth = 2; | |
55 var segmentWidth = 0.015 * canvasHeight; | |
56 var pos = { | |
57 x: 0.5 * canvasWidth, | |
58 y: 0.25 * canvasHeight, | |
59 }; | |
60 var dir = { x: 1, y: 0, }; | |
61 | |
62 var commands = LSystem(rules, startState, iterations); | |
63 var drawCommand = function() { | |
64 var command = commands.shift(); | |
65 if (command === 'F') { | |
66 context.beginPath(); | |
67 context.moveTo(pos.x, pos.y); | |
68 | |
69 pos = { | |
70 x: pos.x + dir.x * segmentWidth, | |
71 y: pos.y + dir.y * segmentWidth, | |
72 }; | |
73 | |
74 context.lineTo(pos.x, pos.y); | |
75 var r = Math.round(pos.x / canvasWidth * 256); | |
76 var b = Math.round(pos.y / canvasHeight * 256); | |
77 var g = 180; | |
78 context.strokeStyle = 'rgb(' + r + ',' + g + ',' + b + ')'; | |
79 context.stroke(); | |
80 } else if (command === '+') { | |
81 dir = { x: -dir.y, y: dir.x } | |
82 } else if (command === '-') { | |
83 dir = { x: dir.y, y: -dir.x } | |
84 } | |
85 } | |
86 | |
87 window.setInterval(drawCommand, 10); | |
88 //while (commands.length) drawCommand(); | |
89 } | |
90 | |
91 document.addEventListener("DOMContentLoaded", draw); | |
Ilya Sherman
2015/04/14 00:25:44
Can we leave this file essentially empty, rather t
Tim Song
2015/04/14 06:00:12
This is a placeholder to confirm that chrome://pro
| |
OLD | NEW |