mirror of
https://github.com/flutter/flutter
synced 2024-10-14 04:02:56 +00:00
6f92088fae
double is a built-in type in Dart. float isn't... TBR=eseidel@chromium.org Review URL: https://codereview.chromium.org/968293003
66 lines
1.5 KiB
Plaintext
66 lines
1.5 KiB
Plaintext
#!mojo mojo:sky_viewer
|
|
<sky>
|
|
<import src="/sky/framework/debug/shake-to-reload.sky" />
|
|
<style>
|
|
dot {
|
|
position: absolute;
|
|
height: 10px;
|
|
width: 10px;
|
|
background-color: #00FF00;
|
|
border-radius: 5px;
|
|
opacity: .75;
|
|
}
|
|
</style>
|
|
<log>Ready!</log>
|
|
<script>
|
|
import "dart:sky";
|
|
|
|
// Material design colors. :p
|
|
List<String> colors = [
|
|
"#009688",
|
|
"#FFC107",
|
|
"#9C27B0",
|
|
"#03A9F4",
|
|
"#673AB7",
|
|
"#CDDC39",
|
|
];
|
|
|
|
Element whichDot(event) {
|
|
return document.querySelector('dot[id="${event.pointer}"]');
|
|
}
|
|
|
|
void moreDots(event) {
|
|
Element dot = document.createElement('dot');
|
|
dot.setAttribute('id', "${event.pointer}");
|
|
dot.style['background-color'] = colors[event.pointer.remainder(colors.length)];
|
|
document.querySelector('sky').appendChild(dot);
|
|
runToTheCenter(event);
|
|
}
|
|
|
|
void goAway(event) {
|
|
whichDot(event).remove();
|
|
}
|
|
|
|
void stopDots(event) {
|
|
for (Element e in document.querySelectorAll('dot'))
|
|
e.remove();
|
|
}
|
|
|
|
void runToTheCenter(event) {
|
|
double radius = (5 + (95 * event.pressure));
|
|
Element dot = whichDot(event);
|
|
dot.style["transform"] = "translate(${event.x-radius}px,${event.y-radius}px)";
|
|
dot.style["width"] = "${2 * radius}px";
|
|
dot.style["height"] = "${2 * radius}px";
|
|
dot.style["border-radius"] = "${radius}px";
|
|
}
|
|
|
|
void main() {
|
|
document.addEventListener("pointerdown", moreDots);
|
|
document.addEventListener("pointermove", runToTheCenter);
|
|
document.addEventListener("pointerup", goAway);
|
|
document.addEventListener("pointercancel", stopDots);
|
|
}
|
|
</script>
|
|
</sky>
|