blob: 4ec695e3f2ac64948449aa79d6a806af87a83583 (
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
55
56
57
58
|
package vfd.dashboard.ui
import org.scalajs.dom.html
import scalatags.JsDom.all.ExtendedString
import scalatags.JsDom.all.Int2CssNumber
import scalatags.JsDom.all.bindNode
import scalatags.JsDom.all.`class`
import scalatags.JsDom.all.div
import scalatags.JsDom.all.height
import scalatags.JsDom.all.iframe
import scalatags.JsDom.all.p
import scalatags.JsDom.all.src
import scalatags.JsDom.all.stringAttr
import scalatags.JsDom.all.stringFrag
import scalatags.JsDom.all.stringPixelStyle
import scalatags.JsDom.all.style
import scalatags.JsDom.all.width
import vfd.dashboard.Environment
import vfd.dashboard.MavlinkSocket
import vfd.dashboard.ui.panels.Communication
import vfd.dashboard.ui.panels.Primary
class Layout(socket: MavlinkSocket) {
val map = iframe(
width := 100.pct,
height := 350.px,
"frameborder".attr := "0",
"scrolling".attr := "no",
"marginheight".attr := "0",
"marginwidth".attr := "0",
src := "http://www.openstreetmap.org/export/embed.html?bbox=6.5611016750335684%2C46.51718501017836%2C6.570038795471191%2C46.520577350893525&layer=mapnik")
val feed = div(style := "width: 100%; height: 460px; color: #ffffff; background-color: #c2c2c2; text-align: center;")(
p(style := "padding-top: 220px")("video feed"))
def element(implicit env: Environment): html.Element = div(`class` := "container-fluid")(
div(`class` := "row")(
div(`class` := "col-xs-12")(
div(`class` := "panel panel-default")(
div(`class` := "panel-body")()))),
div(`class` := "row")(
div(`class` := "col-xs-4")(
div(`class` := "panel panel-default")(
div(`class` := "panel-body")(
map))),
div(`class` := "col-xs-5")(
div(`class` := "panel panel-default")(
div(`class` := "panel-body")(
feed)),
div(`class` := "panel panel-default")(
div(`class` := "panel-body")(Primary(socket)))),
div(`class` := "col-xs-3")(
div(`class` := "panel panel-default")(
div(`class` := "panel-body")(Communication(socket)))))).render
}
|