major rework, new views

wdwnt · May 30, 2019 · 9cb20c5 · 9cb20c5
1 parent e04ba26
commit 9cb20c5
Show file tree

Hide file tree

Showing 37 changed files with 570 additions and 76 deletions.
diff --git a/components/HomeScene.brs b/components/HomeScene.brs
@@ -1,8 +1,7 @@
 sub show(args as Object)
-  m.top.backgroundColor = "0x0960CCFF"
-  m.top.backgroundUri = ""
+  updateTheme("0x0960CCFF")
 
-  m.grid = CreateObject("roSGNode", "GridView")
+  m.grid = m.top.findNode("grid")
   m.grid.setFields({
     style: "hero"
     posterShape: "16x9"
@@ -33,13 +32,38 @@ end sub
 function ShowView(selectedIndex as integer)
   viewToShow = "NTunesScene"
 
-  if selectedIndex = 1 then viewToShow = "TodayScene"
+  if selectedIndex = 0 then
+    updateTheme("0xFFFFFFFF")
+  end if
+
+  if selectedIndex = 1 then viewToShow = "PodcastScene"
+  if selectedIndex = 2 then viewToShow = "TodayScene"
 
   view = CreateObject("roSGNode", viewToShow)
+  view.ObserveField("wasClosed", "onViewWasClosed")
 
   m.top.ComponentController.callFunc("show", {
     view: view
   })
 
   return view
 end function
+
+sub onViewWasClosed(event as Object)
+  updateTheme("0x0960CCFF")
+end sub
+
+function updateTheme(backgroundColor) as void
+  m.top.backgroundColor = backgroundColor
+  m.top.backgroundUri = ""
+  m.top.theme = {
+      global: {
+        OverhangVisible: false
+      }
+      gridView: {
+        backgroundColor: backgroundColor
+        descriptionmaxWidth: 1000
+        rowLabelColor: backgroundColor
+      }
+  }
+end function
diff --git a/components/HomeScene.xml b/components/HomeScene.xml
@@ -1,4 +1,7 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <component name="HomeScene" extends="BaseScene" xsi:noNamespaceSchemaLocation="https://devtools.web.roku.com/schema/RokuSceneGraph.xsd">
     <script type="text/brightscript" uri="pkg:/components/HomeScene.brs" />
+    <children>
+        <GridView id="grid" />
+    </children>
 </component>
diff --git a/components/NTunesScene.brs b/components/NTunesScene.brs
@@ -21,6 +21,10 @@ function setUpLabels() as void
   m.current_track_artist_name = m.top.findNode("current_track_artist_name")
   m.current_show_name = m.top.findNode("current_show_name")
   m.current_show_image_path = m.top.findNode("current_show_image_path")
+  m.next_track_title = m.top.findNode("next_track_title")
+  m.next_track_artist_name = m.top.findNode("next_track_artist_name")
+
+  m.audio_indicator = m.top.findNode("audio_indicator")
 end function
 
 function buildNTunesTask() as void
@@ -40,9 +44,6 @@ function setUpAudio() as void
 
   m.audio = m.top.findNode("audio_player")
   m.audio.content = audiocontent
-
-  m.audiobutton = m.top.findNode("audio_control_button")
-  m.audiobutton.observeField("buttonSelected", "playAudio")
 end function
 
 function refreshData() as void
@@ -52,11 +53,11 @@ end function
 function playAudio() as void
   if (m.is_playing) then
     m.audio.control = "stop"
-    m.audiobutton.text = "Play"
+    ' m.audio_indicator.text = "&#xe037;"
     m.is_playing = false
   else
     m.audio.control = "play"
-    m.audiobutton.text = "Stop"
+    ' m.audio_indicator.text = "&#xe047;"
     m.is_playing = true
   end if
 end function
@@ -78,4 +79,6 @@ sub onCurrentInfoChanged()
   m.current_track_artist_name.text = current_info.current_track_artist_name
   m.current_show_name.text = current_info.current_show_name
   m.current_show_image_path.uri = current_info.current_show_image_path
+  m.next_track_title.text = current_info.next_track_title
+  m.next_track_artist_name.text = current_info.next_track_artist_name
 end sub
diff --git a/components/NTunesScene.xml b/components/NTunesScene.xml
@@ -11,16 +11,76 @@
                     translation="[100, 100]" />
             </Group>
             <Group id="song_info" translation="[700, 100]">
-                <Label id="title" text="Now Playing" font="font:LargeBoldSystemFont" translation="[0, 0]" />
-                <Label id="current_track_title" font="font:MediumBoldSystemFont" text="Loading..." translation="[0, 60]" />
-                <Label id="current_track_artist_name" translation="[0, 120]" />
-                <Label id="current_show_name" translation="[0, 180]" />
+                <Label id="title" text="Now Playing" color="0x000000FF">
+                    <Font
+                        role="font"
+                        uri="pkg:/components/fonts/avenir_85_heavy_latin.ttf"
+                        id="avenir-light"
+                        size="80"
+                    />
+                </Label>
+                <LayoutGroup translation="[0, 120]">
+                    <Label id="current_show_name" color="0x000000FF">
+                        <Font
+                            role="font"
+                            uri="pkg:/components/fonts/avenir_35_light_latin.ttf"
+                            id="avenir-light"
+                            size="30"
+                        />
+                    </Label>
+                    <Label id="current_track_title" text="Loading..." color="0x000000FF" width="1200" wrap="true">
+                        <Font
+                            role="font"
+                            uri="pkg:/components/fonts/avenir_45_book_latin.ttf"
+                            id="avenir-light"
+                            size="65"
+                        />
+                    </Label>
+                    <Label id="current_track_artist_name" color="0x000000FF">
+                        <Font
+                            role="font"
+                            uri="pkg:/components/fonts/avenir_35_light_latin.ttf"
+                            id="avenir-light"
+                            size="40"
+                        />
+                    </Label>
+                </LayoutGroup>
+                <LayoutGroup translation="[0, 400]">
+                    <Label id="next_track_info_title" text="Up Next" color="0x000000FF">
+                        <Font
+                            role="font"
+                            uri="pkg:/components/fonts/avenir_45_book_latin.ttf"
+                            id="avenir-light"
+                            size="45"
+                        />
+                    </Label>
+                    <Label id="next_track_title" color="0x000000FF">
+                        <Font
+                            role="font"
+                            uri="pkg:/components/fonts/avenir_35_light_latin.ttf"
+                            id="avenir-light"
+                            size="30"
+                        />
+                    </Label>
+                    <Label id="next_track_artist_name" color="0x000000FF">
+                        <Font
+                            role="font"
+                            uri="pkg:/components/fonts/avenir_35_light_latin.ttf"
+                            id="avenir-light"
+                            size="30"
+                        />
+                    </Label>
+                </LayoutGroup>
             </Group>
-            <Group>
-                <Button
-                    id="audio_control_button"
-                    translation="[100, 700]"
-                    text="Play" />
+            <Group id="audio_indicator_group" translation="[100, 900]">
+                <Label id="audio_indicator" text="&#xe037;" color="0x000000FF">
+                    <Font
+                        role="font"
+                        uri="pkg:/components/fonts/MaterialIcons-Regular.ttf"
+                        id="materialicons-regular"
+                        size="150"
+                    />
+                </Label>
             </Group>
             <Audio id="audio_player" />
             <Timer id="refresh_timer" repeat="true" duration="10" />

diff --git a/components/PodcastScene.brs b/components/PodcastScene.brs
@@ -0,0 +1,57 @@
+sub Init()
+  m.top.ObserveField("wasShown", "OnWasShown")
+end sub
+
+sub OnWasShown()
+  m.episode_poster = m.top.findNode("episode_poster")
+  m.episode_description = m.top.findNode("episode_description")
+
+  m.audiolist = m.top.findNode("audioLabelList")
+  m.audiolist.observeField("itemFocused", "setaudio")
+  m.audiolist.observeField("itemSelected", "playaudio")
+
+  m.audio = createObject("RoSGNode", "Audio")
+  m.audio.observeField("state", "controlaudioplay")
+
+  m.readAudioContentTask = createObject("RoSGNode", "PodcastTask")
+  m.readAudioContentTask.observeField("content", "showaudiolist")
+  m.readAudioContentTask.control = "RUN"
+end sub
+
+sub showaudiolist()
+  m.audiolist.content = m.readAudioContentTask.content
+  m.audiolist.setFocus(true)
+end sub
+
+sub setaudio()
+  episode = m.audiolist.content.getChild(m.audiolist.itemFocused)
+
+  m.episode_poster.uri = episode.hdPosterUrl
+  m.episode_description.text = episode.Description
+  m.audio.content = episode
+end sub
+
+sub playaudio()
+  m.audio.control = "stop"
+  m.audio.control = "none"
+  m.audio.control = "play"
+end sub
+
+sub controlaudioplay()
+  if (m.audio.state = "finished")
+    m.audio.control = "stop"
+    m.audio.control = "none"
+  end if
+end sub
+
+function onKeyEvent(key as String,press as Boolean) as Boolean
+  if press then
+    if key = "back"
+      if (m.audio.state = "playing")
+        m.audio.control = "stop"
+        return true
+      end if
+    end if
+  end if
+  return false
+end function
diff --git a/components/PodcastScene.xml b/components/PodcastScene.xml
@@ -0,0 +1,23 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<component name="PodcastScene" extends="SGDEXComponent" xsi:noNamespaceSchemaLocation="https://devtools.web.roku.com/schema/RokuSceneGraph.xsd">
+    <script type="text/brightscript" uri="pkg:/components/PodcastScene.brs" />
+    <children>
+        <Group>
+            <LabelList
+                id="audioLabelList"
+                translation="[180, 100]"
+                itemSize="[500, 60]" />
+            <Poster
+                id="episode_poster"
+                uri="pkg:/images/channeltv-poster-hd.png"
+                height="250"
+                width="250"
+                translation="[800, 100]" />
+            <Label
+                id="episode_description"
+                width="800"
+                wrap="true"
+                translation="[800, 400]" />
+        </Group>
+  </children>
+</component>