Gitiles
Code Review Sign In
gerrit-public.fairphone.software / platform / external / skia / a276975a62ef4d9941e40c831fdfe7852e0e243e / . / experimental / Intersection / op.htm
blob: a1f390c6cf49a19c480609294614d4e9d0e1a51b [file] [log] [blame]
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]1<html>
2<head>
3<div style="height:0">
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]4
5<div id="testSimplifyQuadratic1">
6 SkPath path, out;
7 path.moveTo(0, 0);
8 path.quadTo(1, 0, 1, 1);
9 path.close();
10 path.moveTo(1, 0);
11 path.quadTo(0, 0, 0, 1);
12 path.close();
13 testSimplify(path, true, out, bitmap);
14}
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]15</div>
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]16
17<div id="testSimplifyQuadratic2">
18 SkPath path, out;
19 path.moveTo(0, 0);
20 path.quadTo(20, 0, 20, 20);
21 path.close();
22 path.moveTo(20, 0);
23 path.quadTo(0, 0, 0, 20);
24 path.close();
25 testSimplify(path, true, out, bitmap);
26}
caryclark@google.comd88e0892012-03-27 13:23:51 +0000[diff] [blame]27</div>
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]28
29<div id="testSimplifyQuadratic3">
30 SkPath path, out;
31 path.moveTo(0, 0);
32 path.quadTo(20, 0, 20, 20);
33 path.close();
34 path.moveTo(0, 20);
35 path.quadTo(0, 0, 20, 0);
36 path.close();
37 testSimplify(path, true, out, bitmap);
38}
caryclark@google.comd88e0892012-03-27 13:23:51 +0000[diff] [blame]39</div>
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]40
41<div id="testSimplifyQuadratic4">
42 SkPath path, out;
43 path.moveTo(0, 20);
44 path.quadTo(20, 0, 40, 20);
45 path.close();
46 path.moveTo(40, 10);
47 path.quadTo(20, 30, 0, 10);
48 path.close();
49 testSimplify(path, true, out, bitmap);
50 drawAsciiPaths(path, out, true);
51}
caryclark@google.comd88e0892012-03-27 13:23:51 +0000[diff] [blame]52</div>
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]53
54<div id="testSimplifyQuadratic5">
55 SkPath path, out;
56 path.moveTo(0, 0);
57 path.quadTo(0, 0, 0, 0);
58 path.lineTo(0, 0);
59 path.close();
60 path.moveTo(0, 0);
61 path.lineTo(0, 0);
62 path.quadTo(0, 0, 0, 1);
63 path.close();
64 testSimplify(path, true, out, bitmap);
65 drawAsciiPaths(path, out, true);
66}
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]67</div>
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]68
69<div id="testSimplifyQuadratic6">
70 SkPath path, out;
71 path.moveTo(0, 0);
72 path.quadTo(0, 0, 0, 0);
73 path.lineTo(1, 0);
74 path.close();
75 path.moveTo(0, 0);
76 path.lineTo(0, 0);
77 path.quadTo(1, 0, 0, 1);
78 path.close();
79 testSimplify(path, true, out, bitmap);
80 drawAsciiPaths(path, out, true);
81}
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]82</div>
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]83
84<div id="testSimplifyQuadratic7">
85 SkPath path, out;
86 path.moveTo(0, 0);
87 path.quadTo(0, 0, 0, 0);
88 path.lineTo(0, 1);
89 path.close();
90 path.moveTo(0, 0);
91 path.lineTo(0, 0);
92 path.quadTo(1, 0, 0, 2);
93 path.close();
94 testSimplify(path, true, out, bitmap);
95 drawAsciiPaths(path, out, true);
96}
97</div>
98
99<div id="testSimplifyQuadratic8">
100 SkPath path, out;
101 path.moveTo(0, 0);
102 path.quadTo(0, 0, 0, 0);
103 path.lineTo(0, 0);
104 path.close();
105 path.moveTo(0, 0);
106 path.lineTo(0, 0);
107 path.quadTo(1, 0, 0, 2);
108 path.close();
109 testSimplify(path, true, out, bitmap);
110 drawAsciiPaths(path, out, true);
111}
112</div>
113
114<div id="testSimplifyQuadratic9">
115 SkPath path, out;
116 path.moveTo(0, 0);
117 path.quadTo(0, 0, 0, 0);
118 path.lineTo(1, 1);
119 path.close();
120 path.moveTo(0, 0);
121 path.lineTo(0, 0);
122 path.quadTo(1, 0, 2, 2);
123 path.close();
124 testSimplify(path, true, out, bitmap);
125 drawAsciiPaths(path, out, true);
126}
127</div>
128
129<div id="testSimplifyQuadratic10">
130 SkPath path, out;
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]131 path.moveTo(0, 0);
132 path.quadTo(0, 0, 0, 0);
133 path.lineTo(0, 0);
134 path.close();
135 path.moveTo(0, 0);
136 path.lineTo(0, 1);
137 path.quadTo(1, 1, 1, 2);
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]138 path.close();
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]139 testSimplify(path, true, out, bitmap);
140 drawAsciiPaths(path, out, true);
141}
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]142</div>
143
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]144<div id="testSimplifyQuadratic11">
145 SkPath path, out;
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]146 path.moveTo(0, 0);
147 path.quadTo(0, 0, 0, 0);
148 path.lineTo(0, 2);
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]149 path.close();
150 path.moveTo(0, 0);
151 path.lineTo(2, 1);
152 path.quadTo(2, 2, 3, 3);
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]153 path.close();
154 testSimplify(path, true, out, bitmap);
155 drawAsciiPaths(path, out, true);
156}
157</div>
158
159<div id="testSimplifyQuadratic12">
160 SkPath path, out;
161 path.moveTo(0, 0);
162 path.lineTo(0, 2);
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]163 path.lineTo(0, 0);
164 path.close();
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]165 path.moveTo(3, 0);
166 path.quadTo(1, 1, 0, 2);
167 path.lineTo(3, 0);
168 path.close();
169 testSimplify(path, true, out, bitmap);
170 drawAsciiPaths(path, out, true);
171}
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]172</div>
173
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]174<div id="testSimplifyQuadratic13">
175 SkPath path, out;
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]176path.moveTo(0, 0);
177path.quadTo(0, 0, 1, 0);
178path.lineTo(1, 1);
179path.lineTo(0, 0);
180path.close();
181path.moveTo(0, 0);
182path.quadTo(3, 0, 1, 1);
183path.lineTo(0, 0);
184path.close();
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]185 testSimplify(path, true, out, bitmap);
186 drawAsciiPaths(path, out, true);
187}
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]188</div>
189
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]190<div id="testSimplifyQuadratic14">
191 SkPath path, out;
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]192 path.moveTo(0, 0);
193 path.quadTo(0, 0, 0, 0);
194 path.lineTo(1, 1);
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]195 path.close();
196 path.moveTo(0, 0);
197 path.lineTo(0, 0);
198 path.quadTo(0, 1, 2, 1);
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]199 path.close();
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]200 testSimplify(path, true, out, bitmap);
201 drawAsciiPaths(path, out, true);
202}
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]203</div>
204
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]205<div id="testSimplifyQuadratic15">
206 SkPath path, out;
207 path.moveTo(0, 0);
208 path.quadTo(0, 0, 1, 3);
209 path.lineTo(3, 3);
210 path.close();
211 path.moveTo(0, 1);
212 path.lineTo(1, 1);
213 path.quadTo(0, 3, 3, 3);
214 path.close();
215 testSimplify(path, true, out, bitmap);
216 drawAsciiPaths(path, out, true);
217}
218</div>
219
220<div id="testSimplifyQuadratic16">
221 SkPath path, out;
222 path.moveTo(0, 0);
223 path.quadTo(0, 0, 0, 0);
224 path.lineTo(0, 1);
225 path.close();
226 path.moveTo(0, 0);
227 path.lineTo(0, 0);
228 path.quadTo(1, 0, 0, 1);
229 path.close();
230 testSimplify(path, true, out, bitmap);
231 drawAsciiPaths(path, out, true);
232}
233</div>
234
235<div id="testSimplifyQuadratic17">
236 SkPath path, out;
caryclark@google.comb45a1b42012-05-18 20:50:33 +0000[diff] [blame]237 path.moveTo(8, 8);
238 path.quadTo(10, 10, 8, -10);
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]239 path.close();
caryclark@google.comb45a1b42012-05-18 20:50:33 +0000[diff] [blame]240 path.moveTo(8, 8);
241 path.quadTo(12, 12, 14, 4);
242 path.close();
243 path.moveTo(8, 8);
244 path.quadTo(9, 9, 10, 8);
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]245 path.close();
246 testSimplify(path, true, out, bitmap);
247 drawAsciiPaths(path, out, true);
248}
caryclark@google.com78e17132012-04-17 11:40:34 +0000[diff] [blame]249</div>
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]250
caryclark@google.comb45a1b42012-05-18 20:50:33 +0000[diff] [blame]251<div id="testSimplifyQuadratic18">
252 SkPath path, out;
253 path.moveTo(8.0000000000000071, 8.0000000000000071);
254 path.quadTo(8.7289570079366854, 8.7289570079366889, 9.3914917259458743, 9.0593802763083691);
255 path.close();
256 path.moveTo(8.0000000000000142, 8.0000000000000142);
257 path.quadTo(8.1250000000000107, 8.1250000000000071, 8.2500000000000071, 8.2187500000000053);
258 path.close();
259 testSimplify(path, true, out, bitmap);
260 drawAsciiPaths(path, out, true);
261</div>
caryclark@google.com8dcf1142012-07-02 20:27:02 +0000[diff] [blame]262
263<div id="testSimplifyQuadratic19">
264 SkPath path, simple;
265 path.moveTo(0,4);
266 path.lineTo(6,4);
267 path.lineTo(3,1);
268 path.close();
269 path.moveTo(2,3);
270 path.lineTo(3,2);
271 path.lineTo(4,3);
272 path.close();
273 testSimplifyx(path);
274</div>
275
276<div id="testSimplifyQuadratic20">
277 SkPath path, simple;
278 path.moveTo(0,4);
279 path.lineTo(6,4);
280 path.lineTo(3,1);
281 path.close();
282 path.moveTo(2,3);
283 path.lineTo(4,3);
284 path.lineTo(3,2);
285 path.close();
286 testSimplifyx(path);
287</div>
288
289<div id="testSimplifyQuadratic21">
290 SkPath path, simple;
291 path.moveTo(0,4);
292 path.lineTo(8,4);
293 path.lineTo(4,0);
294 path.close();
295 path.moveTo(2,2);
296 path.lineTo(3,3);
297 path.lineTo(4,2);
298 path.close();
299 testSimplifyx(path);
300</div>
301
302<div id="testLine6">
303 SkPath path, simple;
304 path.moveTo(0,0);
305 path.lineTo(4,0);
306 path.lineTo(2,2);
307 path.close();
308 path.moveTo(2,0);
309 path.lineTo(6,0);
310 path.lineTo(4,2);
311 path.close();
312 testSimplifyx(path);
313</div>
314
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]315<div id="testLine7">
316 SkPath path, simple;
317 path.moveTo(0,0);
318 path.lineTo(4,0);
319 path.lineTo(2,2);
320 path.close();
321 path.moveTo(6,0);
322 path.lineTo(2,0);
323 path.lineTo(4,2);
324 path.close();
325 testSimplifyx(path);
326</div>
327
328<div id="testLine9">
329 SkPath path, simple;
330 path.moveTo(0,4);
331 path.lineTo(4,4);
332 path.lineTo(2,2);
333 path.close();
334 path.moveTo(6,4);
335 path.lineTo(2,4);
336 path.lineTo(4,2);
337 path.close();
338 testSimplifyx(path);
339</div>
340
caryclark@google.com8dcf1142012-07-02 20:27:02 +0000[diff] [blame]341<div id="testLine17">
342 SkPath path, simple;
343 path.addRect(0, 0, 12, 12, (SkPath::Direction) 0);
344 path.addRect(4, 12, 13, 13, (SkPath::Direction) 0);
345 testSimplifyx(path);
346</div>
347
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]348<div id="testLine28">
349 SkPath path, simple;
350 path.addRect(0, 6, 12, 12, (SkPath::Direction) 0);
351 path.addRect(0, 0, 9, 9, (SkPath::Direction) 0);
352 testSimplifyx(path);
353</div>
354
355<div id="testLine29">
356 SkPath path, simple;
357 path.addRect(0, 18, 12, 12, (SkPath::Direction) 0);
358 path.addRect(12, 12, 21, 21, (SkPath::Direction) 0);
359 testSimplifyx(path);
360</div>
361
362<div id="testLine30">
363 path.addRect(0, 0, 20, 20, (SkPath::Direction) 0);
364 path.addRect(0, 0, 12, 12, (SkPath::Direction) 0);
365 path.addRect(4, 4, 13, 13, (SkPath::Direction) 0);
366</div>
367
368<div id="testLine31">
369 path.addRect(0, 0, 20, 20, (SkPath::Direction) 0);
370 path.addRect(0, 0, 12, 12, (SkPath::Direction) 0);
371 path.addRect(0, 4, 9, 9, (SkPath::Direction) 0);
372</div>
373
374<div id="testLine32">
375 path.addRect(0, 0, 20, 20, (SkPath::Direction) 0);
376 path.addRect(0, 0, 12, 12, (SkPath::Direction) 0);
377 path.addRect(4, 12, 13, 13, (SkPath::Direction) 0);
378</div>
379
caryclark@google.com9764cc62012-07-12 19:29:45 +0000[diff] [blame]380<div id="testLine33">
381 path.addRect(0, 0, 20, 20, (SkPath::Direction) 0);
382 path.addRect(0, 0, 12, 12, (SkPath::Direction) 0);
383 path.addRect(4, 16, 13, 13, (SkPath::Direction) 0);
384</div>
385
caryclark@google.com210acaf2012-07-12 21:05:13 +0000[diff] [blame]386<div id="testLine34">
387 path.addRect(0, 0, 20, 20, (SkPath::Direction) 0);
388 path.addRect(0, 6, 12, 12, (SkPath::Direction) 0);
389 path.addRect(4, 12, 13, 13, (SkPath::Direction) 0);
390</div>
391
392<div id="testLine35">
393 path.addRect(0, 0, 20, 20, (SkPath::Direction) 0);
394 path.addRect(6, 0, 18, 18, (SkPath::Direction) 0);
395 path.addRect(4, 16, 13, 13, (SkPath::Direction) 0);
396</div>
397
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]398<div id="testLine36">
399 path.addRect(0, 10, 20, 20, (SkPath::Direction) 0);
400 path.addRect(6, 12, 18, 18, (SkPath::Direction) 0);
401 path.addRect(4, 16, 13, 13, (SkPath::Direction) 0);
402</div>
403
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]404</div>
405
406<script type="text/javascript">
407
408var testDivs = [
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]409 testLine36,
caryclark@google.com210acaf2012-07-12 21:05:13 +0000[diff] [blame]410 testLine35,
411 testLine34,
caryclark@google.com9764cc62012-07-12 19:29:45 +0000[diff] [blame]412 testLine33,
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]413 testLine9,
414 testLine7,
415 testLine30,
416 testLine32,
417 testLine31,
418 testLine29,
419 testLine28,
420 testLine17,
caryclark@google.com8dcf1142012-07-02 20:27:02 +0000[diff] [blame]421 testSimplifyQuadratic21,
422 testSimplifyQuadratic20,
423 testSimplifyQuadratic19,
caryclark@google.comb45a1b42012-05-18 20:50:33 +0000[diff] [blame]424 testSimplifyQuadratic18,
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]425 testSimplifyQuadratic17,
426 testSimplifyQuadratic16,
427 testSimplifyQuadratic15,
428 testSimplifyQuadratic14,
429 testSimplifyQuadratic13,
430 testSimplifyQuadratic12,
431 testSimplifyQuadratic11,
432 testSimplifyQuadratic10,
433 testSimplifyQuadratic9,
434 testSimplifyQuadratic8,
435 testSimplifyQuadratic7,
436 testSimplifyQuadratic6,
437 testSimplifyQuadratic5,
438 testSimplifyQuadratic4,
439 testSimplifyQuadratic3,
440 testSimplifyQuadratic2,
441 testSimplifyQuadratic1,
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]442];
443
444var scale, columns, rows, xStart, yStart;
445
446var ticks = 0.1;
447var at_x = 13 + 0.5;
448var at_y = 13 + 0.5;
449
450var tests = [];
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]451var testTitles = [];
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]452var testIndex = 0;
453
454var ctx;
455
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]456function parse(test, title) {
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]457 var contours = [];
458 var contourStrs = test.split("path.close();");
caryclark@google.comd88e0892012-03-27 13:23:51 +0000[diff] [blame]459 var pattern = /-?\d+\.*\d*/g;
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]460 for (var c in contourStrs) {
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]461 var contour = contourStrs[c];
462 var verbStrs = contour.split("path");
463 var verbs = [];
464 for (var v in verbStrs) {
465 var verbStr = verbStrs[v];
466 var points = verbStr.match(pattern);
467 var pts = [];
468 for (var wd in points) {
469 var num = parseFloat(points[wd]);
470 if (isNaN(num)) continue;
471 pts.push(num);
472 }
473 if (pts.length > 0)
474 verbs.push(pts);
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]475 }
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]476 if (verbs.length > 0) {
477 var lastIndex = verbs.length - 1;
478 var lastVerb = verbs[lastIndex];
479 var lastLen = lastVerb.length;
480 if (verbs[0][0] != lastVerb[lastLen - 2] && verbs[0][1] != lastVerb[lastLen - 1]) {
481 var lastPts = [];
482 lastPts.push(verbs[0][0]);
483 lastPts.push(verbs[0][1]);
484 verbs.push(lastPts);
485 }
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]486 contours.push(verbs);
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]487 }
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]488 }
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]489 if (contours.length > 0) {
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]490 tests.push(contours);
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]491 testTitles.push(title);
492 }
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]493}
494
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]495function parseRect(test, title) {
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]496 var contours = [];
497 var rectStrs = test.split("path.addRect");
498 var pattern = /-?\d+\.*\d*/g;
499 for (var r in rectStrs) {
500 var rect = rectStrs[r];
501 var sideStrs = rect.match(pattern);
502 var sides = [];
503 for (var wd in sideStrs) {
504 var num = parseFloat(sideStrs[wd]);
505 if (isNaN(num)) continue;
506 sides.push(num);
507 }
508 if (sides.length == 0)
509 continue;
510 var verbs = [];
511 var topLeft = [];
512 topLeft.push(sides[0]); topLeft.push(sides[1]);
513 var topRight = [];
514 topRight.push(sides[2]); topRight.push(sides[1]);
515 var botLeft = [];
516 botLeft.push(sides[0]); botLeft.push(sides[3]);
517 var botRight = [];
518 botRight.push(sides[2]); botRight.push(sides[3]);
519 verbs.push(topLeft);
520 if (sides[4] == 0) {
521 verbs.push(topRight);
522 verbs.push(botRight);
523 verbs.push(botLeft);
524 } else {
525 verbs.push(botLeft);
526 verbs.push(botRight);
527 verbs.push(topRight);
528 }
529 verbs.push(topLeft);
530 contours.push(verbs);
531 }
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]532 if (contours.length > 0) {
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]533 tests.push(contours);
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]534 testTitles.push(title);
535 }
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]536}
537
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]538function init(test) {
539 var canvas = document.getElementById('canvas');
540 if (!canvas.getContext) return;
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]541 canvas.width = document.width;
542 canvas.height = document.height;
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]543 ctx = canvas.getContext('2d');
544 var xmin = Infinity;
545 var xmax = -Infinity;
546 var ymin = Infinity;
547 var ymax = -Infinity;
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]548 for (var contours in test) {
549 var contour = test[contours];
550 for (var verbs in contour) {
551 var verb = contour[verbs];
552 var last = verb.length;
caryclark@google.comb45a1b42012-05-18 20:50:33 +0000[diff] [blame]553 for (var idx = 0; idx < last; idx += 2) {
554 xmin = Math.min(xmin, verb[idx]);
555 xmax = Math.max(xmax, verb[idx]);
556 ymin = Math.min(ymin, verb[idx + 1]);
557 ymax = Math.max(ymax, verb[idx + 1]);
558 }
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]559 }
560 }
561 var subscale = 1;
562 while ((xmax - xmin) * subscale < 0.1 && (ymax - ymin) * subscale < 0.1) {
563 subscale *= 10;
564 }
565 columns = Math.ceil(xmax) - Math.floor(xmin) + 1;
566 rows = Math.ceil(ymax) - Math.floor(ymin) + 1;
567 xStart = Math.floor(xmin);
568 yStart = Math.floor(ymin);
569 var hscale = ctx.canvas.width / columns / ticks;
570 var vscale = ctx.canvas.height / rows / ticks;
571 scale = Math.floor(Math.min(hscale, vscale)) * subscale;
572}
573
574function drawPoint(px, py, xoffset, yoffset, unit) {
caryclark@google.comd88e0892012-03-27 13:23:51 +0000[diff] [blame]575 var label = px.toFixed(3) + ", " + py.toFixed(3);
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]576 var _px = px * unit + xoffset;
577 var _py = py * unit + yoffset;
578 ctx.beginPath();
579 ctx.arc(_px, _py, 3, 0, Math.PI*2, true);
580 ctx.closePath();
581 ctx.fill();
582 ctx.fillText(label, _px + 5, _py);
583}
584
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]585function draw(test, title, _at_x, _at_y, scale) {
586 ctx.fillStyle = "rgba(0,0,0, 0.1)";
587 ctx.font = "normal 50px Arial";
588 ctx.fillText(title, 50, 50);
589 ctx.font = "normal 10px Arial";
590
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]591 var unit = scale * ticks;
592 ctx.lineWidth = 1;
593 var i;
594 for (i = 0; i <= rows * ticks; ++i) {
595 ctx.strokeStyle = (i % ticks) != 0 ? "rgb(160,160,160)" : "black";
596 ctx.beginPath();
597 ctx.moveTo(_at_x + 0, _at_y + i * scale);
598 ctx.lineTo(_at_x + unit * columns, _at_y + i * scale);
599 ctx.stroke();
600 }
601 for (i = 0; i <= columns * ticks; ++i) {
602 ctx.strokeStyle = (i % ticks) != 0 ? "rgb(160,160,160)" : "black";
603 ctx.beginPath();
604 ctx.moveTo(_at_x + i * scale, _at_y + 0);
605 ctx.lineTo(_at_x + i * scale, _at_y + unit * rows);
606 ctx.stroke();
607 }
608
609 var xoffset = xStart * -unit + _at_x;
610 var yoffset = yStart * -unit + _at_y;
611
612 ctx.fillStyle = "rgb(40,80,60)"
613 for (i = 0; i <= columns; i += (1 / ticks))
614 {
615 num = (xoffset - _at_x) / -unit + i;
616 ctx.fillText(num.toFixed(0), i * unit + _at_y - 5, 10);
617 }
618 for (i = 0; i <= rows; i += (1 / ticks))
619 {
620 num = (yoffset - _at_x) / -unit + i;
621 ctx.fillText(num.toFixed(0), 0, i * unit + _at_y + 0);
622 }
623 ctx.strokeStyle = "red";
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]624 var contours, verbs, pts;
caryclark@google.com8dcf1142012-07-02 20:27:02 +0000[diff] [blame]625 ctx.beginPath();
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]626 for (contours in test) {
627 var contour = test[contours];
628 if (contours == 2) ctx.strokeStyle = "blue";
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]629 var first = true;
630 for (verbs in contour) {
631 var verb = contour[verbs];
632 switch (verb.length) {
633 case 2:
634 if (first) {
635 ctx.moveTo(xoffset + verb[0] * unit, yoffset + verb[1] * unit);
636 first = false;
637 } else
638 ctx.lineTo(xoffset + verb[0] * unit, yoffset + verb[1] * unit);
639 break;
640 case 4:
641 ctx.quadraticCurveTo(xoffset + verb[0] * unit, yoffset + verb[1] * unit,
642 xoffset + verb[2] * unit, yoffset + verb[3] * unit);
643 break;
644 case 6:
645 ctx.bezierCurveTo(xoffset + verb[0] * unit, yoffset + verb[1] * unit,
646 xoffset + verb[2] * unit, yoffset + verb[3] * unit,
647 xoffset + verb[4] * unit, yoffset + verb[5] * unit);
648 break;
649 }
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]650 }
caryclark@google.com8dcf1142012-07-02 20:27:02 +0000[diff] [blame]651 ctx.closePath();
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]652 }
caryclark@google.com8dcf1142012-07-02 20:27:02 +0000[diff] [blame]653 ctx.stroke();
654 ctx.fillStyle="rgba(192,192,255, 0.3)";
655 ctx.fill();
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]656
657 ctx.fillStyle="blue";
caryclark@google.comfb173422012-04-10 18:28:55 +0000[diff] [blame]658 for (contours in test) {
659 var contour = test[contours];
660 for (verbs in contour) {
661 var verb = contour[verbs];
662 for (i = 0; i < verb.length; i += 2) {
663 x = verb[i];
664 y = verb[i + 1];
665 drawPoint(x, y, xoffset, yoffset, unit);
666 }
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]667 }
668 }
669}
670
671var mouseX = Infinity, mouseY;
672
673function calcXY() {
674 var e = window.event;
675 var tgt = e.target || e.srcElement;
676 var left = tgt.offsetLeft;
677 var top = tgt.offsetTop;
678 var unit = scale * ticks;
679 mouseX = (e.clientX - left - Math.ceil(at_x) + 1) / unit + xStart;
680 mouseY = (e.clientY - top - Math.ceil(at_y)) / unit + yStart;
681}
682
683function handleMouseOver() {
684 calcXY();
685 var num = mouseX.toFixed(3) + ", " + mouseY.toFixed(3);
686 ctx.beginPath();
687 ctx.rect(300,100,200,10);
688 ctx.fillStyle="white";
689 ctx.fill();
690 ctx.fillStyle="black";
691 ctx.fillText(num, 300, 108);
692}
693
694function handleMouseClick() {
695 calcXY();
696// drawInset();
697}
698
699function drawTop() {
700 init(tests[testIndex]);
701 redraw();
702}
703
704function redraw() {
705 ctx.beginPath();
706 ctx.rect(0, 0, ctx.canvas.width, ctx.canvas.height);
707 ctx.fillStyle="white";
708 ctx.fill();
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]709 draw(tests[testIndex], testTitles[testIndex], at_x, at_y, scale);
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]710// if (insetScale != scale && mouseX != Infinity)
711// drawInset();
712}
713
714function doKeyPress(evt) {
715 var char = String.fromCharCode(evt.charCode);
716 switch (char) {
717 case 'N':
718 case 'n':
719 if (++testIndex >= tests.length)
720 testIndex = 0;
caryclark@google.comfa0588f2012-04-26 21:01:06 +0000[diff] [blame]721 mouseX = Infinity;
722 drawTop();
723 break;
724 case 'P':
725 case 'p':
726 if (--testIndex < 0)
727 testIndex = tests.length - 1;
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]728 mouseX = Infinity;
729 drawTop();
730 break;
731 case 'T':
732 case 't':
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]733 break;
734 case '-':
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]735 redraw();
736 break;
737 case '=':
738 case '+':
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]739 redraw();
740 break;
741 }
742}
743
744function start() {
745 for (i = 0; i < testDivs.length; ++i) {
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]746 var title = testDivs[i].id.toString();
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]747 var str = testDivs[i].firstChild.data;
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]748 if (str.split("addRect").length > 1) {
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]749 parseRect(str, title);
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]750 } else {
caryclark@google.com0e08a192012-07-13 21:07:52 +0000[diff] [blame]751 parse(str, title);
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]752 }
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]753 }
754 drawTop();
755 window.addEventListener('keypress', doKeyPress, true);
756}
757
758</script>
759</head>
760
761<body onLoad="start();">
caryclark@google.comfa4a6e92012-07-11 17:52:32 +0000[diff] [blame]762<canvas id="canvas" width="750" height="500"
caryclark@google.com752b60e2012-03-22 21:11:17 +0000[diff] [blame]763 onmousemove="handleMouseOver()"
764 onclick="handleMouseClick()"
765 ></canvas >
766</body>
767</html>