blob: 28c8d65f62079053824508ce77bf9a90feb2cc5a (
plain) (
blame)
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
50
51
52
53
54
|
package mavigator.dashboard.ui.instruments
import org.scalajs.dom
import org.scalajs.dom.html
import scalatags.JsDom.all._
import mavigator.util.Environment
/** An instrument backed by an SVG image. */
trait SvgInstrument[A] extends Instrument[A] {
/** SVG object element that contains the rendered instrument */
val element: html.Object
/** Retrieves an element of the underlying SVG document by ID. */
protected def part(id: String) = element.contentDocument.getElementById(id).asInstanceOf[html.Element]
/** Movable parts of the instrument */
protected def moveable: Seq[html.Element]
/** Called when element has been loaded. */
protected def load(event: dom.Event): Unit = {
for (part <- moveable) {
part.style.transition = "transform 50ms ease-out"
}
ready()
}
element.addEventListener("load", (e: dom.Event) => load(e))
}
/** Contains helpers for SVG instruments. */
object SvgInstrument {
/** Retrieves an SVG object element by its instrument's name. */
def svgObject(name: String)(implicit app: Environment): html.Object = {
val path = app.asset("images/instruments/" + name + ".svg")
`object`(`type` := "image/svg+xml", "data".attr := path, width := 100.pct)(
"Error loading instrument " + name).render
}
/** Applies translation styling to an element. */
def translate(elem: html.Element, x: Int, y: Int): Unit = {
elem.style.transform = "translate(" + x + "px, " + y + "px)";
}
/** Applies rotation styling to an element. */
def rotate(elem: html.Element, rad: Double): Unit = {
elem.style.transform = "rotateZ(" + rad + "rad)";
}
}
|
