Give the Roku wall a stronger TV layout

components/MainScene.brs

@@ -32,7 +32,7 @@ sub loadConfig()
     m.config = config
 
     if config.doesExist("backend") and config.backend.doesExist("baseUrl") then
-        m.backend.text = "Frigate snapshot source"
+        m.backend.text = "Direct Frigate"
     end if
 
     if not config.doesExist("cameras") then
@@ -56,7 +56,7 @@ sub renderCameras()
     end if
 
     cameras = m.config.cameras
-    m.status.text = cameras.count().toStr() + " cameras loaded, refreshing every " + m.refreshTimer.duration.toStr() + "s"
+    m.status.text = "Refreshing every " + m.refreshTimer.duration.toStr() + "s"
 
     for i = 0 to m.cameraNodes.count() - 1
         poster = m.cameraPosters[i]

components/MainScene.xml

@@ -6,46 +6,47 @@
         <Rectangle id="bg" color="0x101418FF" width="1920" height="1080" />
         <Label
             id="title"
-            translation="[70, 55]"
+            translation="[60, 30]"
-            width="1760"
+            width="900"
             height="60"
             text="visionLabs"
             font="font:LargeBoldSystemFont"
             color="0xFFFFFFFF" />
         <Label
             id="subtitle"
-            translation="[70, 108]"
+            translation="[60, 78]"
-            width="1760"
+            width="900"
             height="40"
-            text="Snapshot wall for Roku"
+            text="Camera wall"
-            font="font:MediumSystemFont"
+            font="font:SmallSystemFont"
             color="0xC9D1D9FF" />
         <Label
             id="backend"
-            translation="[70, 145]"
+            translation="[1320, 34]"
-            width="1760"
+            width="540"
             height="40"
-            text="Direct Frigate snapshots"
+            text="Direct Frigate"
             font="font:SmallSystemFont"
             color="0x8B949EFF" />
         <Label
             id="status"
-            translation="[70, 175]"
+            translation="[1320, 68]"
-            width="1760"
+            width="540"
             height="40"
-            text="Loading camera wall..."
+            text="Refreshing..."
             font="font:SmallSystemFont"
             color="0x8B949EFF" />
         <Timer id="refreshTimer" repeat="true" duration="15" />
         <Poster
             id="poster1"
-            translation="[70, 230]"
+            translation="[60, 130]"
-            width="820"
+            width="860"
-            height="280"
+            height="360"
-            loadDisplayMode="scaleToFit" />
+            loadDisplayMode="scaleToZoom" />
+        <Rectangle id="cam1Bg" translation="[60, 440]" width="860" height="50" color="0x000000B8" />
         <Label
             id="cam1"
-            translation="[70, 520]"
+            translation="[80, 452]"
             width="820"
             height="40"
             text="Cam slot 1"
@@ -53,13 +54,14 @@
             color="0xFFFFFFFF" />
         <Poster
             id="poster2"
-            translation="[1030, 230]"
+            translation="[1000, 130]"
-            width="820"
+            width="860"
-            height="280"
+            height="360"
-            loadDisplayMode="scaleToFit" />
+            loadDisplayMode="scaleToZoom" />
+        <Rectangle id="cam2Bg" translation="[1000, 440]" width="860" height="50" color="0x000000B8" />
         <Label
             id="cam2"
-            translation="[1030, 520]"
+            translation="[1020, 452]"
             width="820"
             height="40"
             text="Cam slot 2"
@@ -67,13 +69,14 @@
             color="0xFFFFFFFF" />
         <Poster
             id="poster3"
-            translation="[70, 590]"
+            translation="[60, 540]"
-            width="820"
+            width="860"
-            height="280"
+            height="360"
-            loadDisplayMode="scaleToFit" />
+            loadDisplayMode="scaleToZoom" />
+        <Rectangle id="cam3Bg" translation="[60, 850]" width="860" height="50" color="0x000000B8" />
         <Label
             id="cam3"
-            translation="[70, 880]"
+            translation="[80, 862]"
             width="820"
             height="40"
             text="Cam slot 3"
@@ -81,13 +84,14 @@
             color="0xFFFFFFFF" />
         <Poster
             id="poster4"
-            translation="[1030, 590]"
+            translation="[1000, 540]"
-            width="820"
+            width="860"
-            height="280"
+            height="360"
-            loadDisplayMode="scaleToFit" />
+            loadDisplayMode="scaleToZoom" />
+        <Rectangle id="cam4Bg" translation="[1000, 850]" width="860" height="50" color="0x000000B8" />
         <Label
             id="cam4"
-            translation="[1030, 880]"
+            translation="[1020, 862]"
             width="820"
             height="40"
             text="Cam slot 4"

manifest

@@ -2,5 +2,5 @@ title=visionLabs
 subtitle=Labs home camera viewer
 major_version=0
 minor_version=1
-build_version=2
+build_version=3
 ui_resolutions=hd,fhd