Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(341)

Side by Side Diff: sky/examples/touch-demo.sky

Issue 1005393006: Clean up examples directory (Closed) Base URL: git@github.com:domokit/mojo.git@master
Patch Set: Created 5 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « sky/examples/stocks/pubspec.yaml ('k') | sky/examples/widgets-fn/main.sky » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
(Empty)
1 #!mojo mojo:sky_viewer
2 <sky>
3 <import src="/sky/framework/debug/shake-to-reload.sky" />
4 <style>
5 dot {
6 position: absolute;
7 height: 10px;
8 width: 10px;
9 background-color: #00FF00;
10 border-radius: 5px;
11 opacity: .75;
12 }
13 </style>
14 <log>Ready!</log>
15 <script>
16 import "dart:sky";
17
18 // Material design colors. :p
19 List<String> colors = [
20 "#009688",
21 "#FFC107",
22 "#9C27B0",
23 "#03A9F4",
24 "#673AB7",
25 "#CDDC39",
26 ];
27
28 Element whichDot(event) {
29 return document.querySelector('dot[id="${event.pointer}"]');
30 }
31
32 void moreDots(event) {
33 Element dot = document.createElement('dot');
34 dot.setAttribute('id', "${event.pointer}");
35 dot.style['background-color'] = colors[event.pointer.remainder(colors.length)] ;
36 document.querySelector('sky').appendChild(dot);
37 runToTheCenter(event);
38 }
39
40 void goAway(event) {
41 whichDot(event).remove();
42 }
43
44 void stopDots(event) {
45 for (Element e in document.querySelectorAll('dot'))
46 e.remove();
47 }
48
49 void runToTheCenter(event) {
50 double radius = (5 + (95 * event.pressure));
51 Element dot = whichDot(event);
52 dot.style["transform"] = "translate(${event.x-radius}px,${event.y-radius}px)";
53 dot.style["width"] = "${2 * radius}px";
54 dot.style["height"] = "${2 * radius}px";
55 dot.style["border-radius"] = "${radius}px";
56 }
57
58 void main() {
59 document.addEventListener("pointerdown", moreDots);
60 document.addEventListener("pointermove", runToTheCenter);
61 document.addEventListener("pointerup", goAway);
62 document.addEventListener("pointercancel", stopDots);
63 }
64 </script>
65 </sky>
OLDNEW
« no previous file with comments | « sky/examples/stocks/pubspec.yaml ('k') | sky/examples/widgets-fn/main.sky » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698