forked from yapcheahshen/brushlib.js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathsin.html
49 lines (41 loc) · 1.36 KB
/
sin.html
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
<!DOCTYPE html>
<SCRIPT src="js/mybrush.js"></SCRIPT>
<BODY bgcolor=silver>
dabs:<span id="dab_count"></span>
<br>getcolor:<span id="getcolor_count"></span>
<br>elapse:<span id="divelapse"></span>
<br><CANVAS width=500 height=500 id=thecanvas></CANVAS>
<SCRIPT>
async function getBrushSetting(pathToBrush) {
const brushGetData = await fetch(`/brushlib.js/${pathToBrush}`);
const brushSetting = await brushGetData.json();
return brushSetting;
}
function drawsinwave(brush, surface) {
var i, steps, xstep;
var p, ydelta;
width = 500; height = 500;
brush.new_stroke();
steps = 20;
xstep = Math.ceil(width / steps);
ydelta = 0;
for (var i = 0; i < steps; i++) {
p = Math.sin((180) * (i / steps) * Math.PI / 180) * 1;
ydelta = Math.sin((-360) * (i / steps) * Math.PI / 180) * (height / 6);
brush.stroke_to(surface, i * xstep, (height / 2) + ydelta, p, 0, 0, 0.1);
}
}
async function init() {
const brushSetting = await getBrushSetting('brushes/charcoal.myb.json')
t1 = (new Date()).getTime();
var surface = new MypaintSurface("thecanvas");
var brush = new MypaintBrush(brushSetting, surface);
drawsinwave(brush, surface);
dab_count.innerHTML = surface.dab_count;
getcolor_count.innerHTML = surface.getcolor_count;
divelapse.innerHTML = (new Date()).getTime() - t1;
}
init()
</SCRIPT>
</BODY>
</HTML>