From 68e322b1caca5e867156d38b726ab47a50057a34 Mon Sep 17 00:00:00 2001
From: Neil Burrows <neil.burrows@nvable.com>
Date: Wed, 10 Jun 2020 17:43:32 +0100
Subject: [PATCH 1/2] Updated design and functionality of ItemGrid for Movies

---
 components/ItemGrid2/GridItem.brs       |  40 +++++++
 components/ItemGrid2/GridItem.xml       |  12 +++
 components/ItemGrid2/ItemGrid2.brs      | 133 ++++++++++++++++++++++++
 components/ItemGrid2/ItemGrid2.xml      |  37 +++++++
 components/ItemGrid2/LoadItemsTask2.brs |  54 ++++++++++
 components/ItemGrid2/LoadItemsTask2.xml |  20 ++++
 components/data/JFContentItem.xml       |  12 +++
 components/data/MovieData.brs           |  38 ++++++-
 components/data/MovieData.xml           |  11 +-
 components/movies/Movies.brs            |  14 ---
 components/movies/Movies.xml            |  14 ---
 images/PosterFailed.png                 | Bin 0 -> 3687 bytes
 images/PosterLoading.png                | Bin 0 -> 3842 bytes
 source/Main.brs                         |   4 +-
 source/ShowScenes.brs                   |  32 +-----
 15 files changed, 351 insertions(+), 70 deletions(-)
 create mode 100644 components/ItemGrid2/GridItem.brs
 create mode 100644 components/ItemGrid2/GridItem.xml
 create mode 100644 components/ItemGrid2/ItemGrid2.brs
 create mode 100644 components/ItemGrid2/ItemGrid2.xml
 create mode 100644 components/ItemGrid2/LoadItemsTask2.brs
 create mode 100644 components/ItemGrid2/LoadItemsTask2.xml
 create mode 100644 components/data/JFContentItem.xml
 delete mode 100644 components/movies/Movies.brs
 delete mode 100644 components/movies/Movies.xml
 create mode 100644 images/PosterFailed.png
 create mode 100644 images/PosterLoading.png

diff --git a/components/ItemGrid2/GridItem.brs b/components/ItemGrid2/GridItem.brs
new file mode 100644
index 000000000..9fb84111d
--- /dev/null
+++ b/components/ItemGrid2/GridItem.brs
@@ -0,0 +1,40 @@
+sub init()
+  m.itemPoster = m.top.findNode("itemPoster")
+  m.itemText = m.top.findNode("itemText")
+end sub
+
+sub itemContentChanged()
+
+  itemData = m.top.itemContent
+
+  if itemData = invalid then return
+
+  itemPoster = m.top.findNode("itemPoster")
+
+  if itemData.type = "Movie" then
+    itemPoster.uri = itemData.PosterUrl
+    m.itemText.text = itemData.Title
+    return
+  end if
+
+  print "Unhandled Item Type: " + itemData.type
+
+end sub
+
+'
+'Resize Poster and Title Vivbility on focus change
+sub focusChanged()
+
+  if m.top.itemHasFocus = true then
+    m.itemPoster.width = 295
+    m.itemPoster.height = 440
+    m.itemPoster.translation = [0,0]
+    m.itemText.visible = true
+  else
+    m.itemPoster.width = 250
+    m.itemPoster.height = 375
+    m.itemPoster.translation = [21,35]
+    m.itemText.visible = false
+  end if
+
+end sub
diff --git a/components/ItemGrid2/GridItem.xml b/components/ItemGrid2/GridItem.xml
new file mode 100644
index 000000000..7e885f4c3
--- /dev/null
+++ b/components/ItemGrid2/GridItem.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<component name="GridItem" extends="Group">
+  <children>
+    <Poster id="itemPoster" width="250" height="375" translation="[21,35]" loadDisplayMode="scaleToZoom" loadingBitmapUri="pkg:/images/PosterLoading.png" failedBitmapUri="pkg:/images/PosterFailed.png" />
+    <ScrollingLabel id="itemText" horizAlign="center" font="font:SmallSystemFont" maxWidth="295" translation="[0,442]" repeatCount="-1" visible="false"  />
+  </children>
+  <interface>
+    <field id="itemContent" type="node" onChange="itemContentChanged" />
+    <field id="itemHasFocus" type="boolean" onChange="focusChanged" />
+  </interface>
+  <script type="text/brightscript" uri="GridItem.brs" />
+</component>
diff --git a/components/ItemGrid2/ItemGrid2.brs b/components/ItemGrid2/ItemGrid2.brs
new file mode 100644
index 000000000..cc78bb3fc
--- /dev/null
+++ b/components/ItemGrid2/ItemGrid2.brs
@@ -0,0 +1,133 @@
+sub init()
+
+  m.itemGrid = m.top.findNode("itemGrid")
+  m.backdrop = m.top.findNode("backdrop")
+  m.newBackdrop = m.top.findNode("backdropTransition")
+
+  m.swapAnimation = m.top.findNode("backroundSwapAnimation")
+  m.swapAnimation.observeField("state", "swapDone")
+  
+  m.loadedRows = 0
+  m.loadedItems = 0
+
+  m.data = CreateObject("roSGNode", "ContentNode")
+
+  m.itemGrid.content = m.data
+  m.itemGrid.setFocus(true)
+
+  m.itemGrid.observeField("itemFocused", "onItemFocused")
+  m.itemGrid.observeField("itemSelected", "onItemSelected")
+  m.newBackdrop.observeField("loadStatus", "newBGLoaded")
+
+  'Background Image Queued for loading
+  m.queuedBGUri = ""
+
+  m.loadItemsTask = createObject("roSGNode", "LoadItemsTask2")
+  
+end sub
+
+'
+'Load initial set of Data
+sub loadInitialItems() 
+  m.loadItemsTask.itemId = m.top.itemId
+  m.loadItemsTask.observeField("content", "ItemDataLoaded")
+  m.loadItemsTask.itemType = "Movie"
+  m.loadItemsTask.control = "RUN"
+end sub
+
+'
+'Handle loaded data, and add to Grid
+sub ItemDataLoaded(msg)
+ 
+  itemData = msg.GetData()
+  data = msg.getField()
+
+  if itemData = invalid then 
+    m.Loading = false
+    return 
+  end if
+
+  for each item in itemData
+    m.data.appendChild(item)
+  end for
+
+  'Update the stored counts
+  m.loadedItems = m.itemGrid.content.getChildCount() 
+  m.loadedRows = m.loadedItems / m.itemGrid.numColumns
+  m.Loading = false
+end sub
+
+'
+'Set Background Image
+sub SetBackground(backgroundUri as string)
+
+  'If a new image is being loaded, or transitioned to, store URL to load next
+  if m.swapAnimation.state <> "stopped" or m.newBackdrop.loadStatus = "loading" then
+    m.queuedBGUri = backgroundUri
+    return
+  end if
+
+  m.newBackdrop.uri = backgroundUri
+end sub
+
+'
+'Handle new item being focused
+sub onItemFocused()
+
+  focusedRow = CInt(m.itemGrid.itemFocused / m.itemGrid.numColumns) + 1
+
+  ' Set Background
+  itemInt = m.itemGrid.itemFocused
+
+  SetBackground(m.itemGrid.content.getChild(m.itemGrid.itemFocused).backdropUrl)
+
+  ' Load more data if focus is within last 3 rows, and there are more items to load
+  if focusedRow >= m.loadedRows - 3 and m.loadeditems < m.loadItemsTask.totalRecordCount then
+    loadMoreData()
+  end if
+end sub 
+
+'
+'When Image Loading Status changes
+sub newBGLoaded()
+  'If image load was sucessful, start the fade swap
+  if m.newBackdrop.loadStatus = "ready"
+    m.swapAnimation.control = "start"
+  end if
+end sub
+
+'
+'Swap Complete
+sub swapDone()
+
+  if m.swapAnimation.state = "stopped" then
+  
+    'Set main BG node image and hide transitioning node
+    m.backdrop.uri = m.newBackdrop.uri
+    m.backdrop.opacity = 0.25
+    m.newBackdrop.opacity = 0
+  
+    'If there is another one to load
+    if m.newBackdrop.uri <> m.queuedBGUri and m.queuedBGUri <> ""  then
+        SetBackground(m.queuedBGUri)
+        m.queuedBGUri = ""
+    end if
+  end if
+end sub
+
+'
+'Load next set of items
+sub loadMoreData()
+
+  if m.Loading = true then return
+
+  m.Loading = true
+  m.loadItemsTask.startIndex = m.loadedItems
+  m.loadItemsTask.control = "RUN"
+end sub
+
+'
+'Item Selected
+sub onItemSelected()
+  m.top.selectedItem = m.itemGrid.content.getChild(m.itemGrid.itemSelected)
+end sub
\ No newline at end of file
diff --git a/components/ItemGrid2/ItemGrid2.xml b/components/ItemGrid2/ItemGrid2.xml
new file mode 100644
index 000000000..9070f7cd5
--- /dev/null
+++ b/components/ItemGrid2/ItemGrid2.xml
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<component name="ItemGrid2" extends="JFGroup">
+  <children>
+    <poster id="backdrop" 
+      loadDisplayMode="scaleToFill"
+      width="1920"
+      height="1080" 
+      opacity="0.25"
+      />
+    <poster id="backdropTransition" 
+      loadDisplayMode="scaleToFill"
+      width="1920"
+      height="1080" 
+      opacity="0.25"
+      />
+    <MarkupGrid 
+      id = "itemGrid" 
+      translation = "[ 96, 160 ]" 
+      itemComponentName = "GridItem" 
+      numColumns = "6" 
+      numRows = "5" 
+      vertFocusAnimationStyle = "fixed"
+      itemSize = "[ 290, 425 ]" 
+      itemSpacing = "[ 0, 45 ]" 
+      drawFocusFeedback = "false" />  
+    <OptionsSlider id="options" />
+    <Animation  id="backroundSwapAnimation"  duration="1"  repeat="false"  easeFunction="linear" >
+        <FloatFieldInterpolator id = "fadeinLoading" key="[0.0, 1.0]" keyValue="[ 0.00, 0.25 ]" fieldToInterp="backdropTransition.opacity" />
+        <FloatFieldInterpolator id = "fadeoutLoaded" key="[0.0, 1.0]" keyValue="[ 0.25, 0.00 ]" fieldToInterp="backdrop.opacity" />
+    </Animation>
+  </children>
+  <interface>
+    <field id="itemId" type="string" onChange="loadInitialItems" />
+    <field id="selectedItem" type="node" alwaysNotify="true" />
+  </interface>
+  <script type="text/brightscript" uri="ItemGrid2.brs" />
+</component>
diff --git a/components/ItemGrid2/LoadItemsTask2.brs b/components/ItemGrid2/LoadItemsTask2.brs
new file mode 100644
index 000000000..67533f736
--- /dev/null
+++ b/components/ItemGrid2/LoadItemsTask2.brs
@@ -0,0 +1,54 @@
+sub init()
+  m.top.functionName = "loadItems"
+end sub
+
+sub loadItems()
+
+  results = []
+
+  sort_order = get_user_setting("movie_sort_order", "Ascending")
+  sort_field = get_user_setting("movie_sort_field", "SortName")
+
+
+  params = {
+    limit: m.top.limit,
+    StartIndex: m.top.startIndex,
+    parentid: m.top.itemId,
+    SortBy: sort_field,
+    SortOrder: sort_order,
+    recursive: false
+  }
+
+  if m.top.ItemType <> "" then
+    params.append({ IncludeItemTypes: m.top.ItemType})
+  end if
+
+  url = Substitute("Users/{0}/Items/", get_setting("active_user"))
+  resp = APIRequest(url, params)
+  data = getJson(resp)
+
+  if data.TotalRecordCount <> invalid then
+    m.top.totalRecordCount = data.TotalRecordCount
+  end if
+  
+  for each item in data.Items
+
+    tmp = invalid
+    if item.Type = "Movie" then
+      tmp = CreateObject("roSGNode", "MovieData")
+    else
+      print "Unknown Type: " item.Type
+
+    end if
+  
+    if tmp <> invalid then
+
+      tmp.json = item
+      results.push(tmp)
+
+    end if
+  end for
+
+  m.top.content = results
+
+end sub
\ No newline at end of file
diff --git a/components/ItemGrid2/LoadItemsTask2.xml b/components/ItemGrid2/LoadItemsTask2.xml
new file mode 100644
index 000000000..a4e13cf58
--- /dev/null
+++ b/components/ItemGrid2/LoadItemsTask2.xml
@@ -0,0 +1,20 @@
+<?xml version="1.0" encoding="utf-8" ?>
+
+<component name="LoadItemsTask2" extends="Task">
+  <interface>
+    <field id="itemId" type="string" />
+    <field id="startIndex" type="integer" value="0" />
+    <field id="itemType" type="string" value="" />
+    <field id="limit" type="integer" value="36" />
+    <field id="metadata" type="associativearray" />
+    
+    <!-- Total records available from server-->
+    <field id="totalRecordCount" type="int" value="-1" />
+    <field id="content" type="array" />
+  </interface>
+  <script type="text/brightscript" uri="LoadItemsTask2.brs" />
+  <script type="text/brightscript" uri="pkg:/source/api/Items.brs" />
+  <script type="text/brightscript" uri="pkg:/source/api/baserequest.brs" />
+  <script type="text/brightscript" uri="pkg:/source/utils/config.brs" />
+  <script type="text/brightscript" uri="pkg:/source/api/Image.brs" />
+</component>
\ No newline at end of file
diff --git a/components/data/JFContentItem.xml b/components/data/JFContentItem.xml
new file mode 100644
index 000000000..aec8bc97b
--- /dev/null
+++ b/components/data/JFContentItem.xml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8" ?>
+<component name="JFContentItem" extends="ContentNode">
+    <interface>
+        <field id="favorite" type="boolean" />
+        <field id="watched" type="boolean" />
+        <field id="posterUrl" type="string" />
+        <field id="backdropUrl" type="string" />
+        <field id="SubTitle" type="string" value="" />
+        <field id="Type" type="string" value="" />
+        <field id="json" type="associativearray" onChange="setFields" />
+    </interface>
+</component>
diff --git a/components/data/MovieData.brs b/components/data/MovieData.brs
index ae6df0845..37df060e7 100644
--- a/components/data/MovieData.brs
+++ b/components/data/MovieData.brs
@@ -1,11 +1,27 @@
 sub setFields()
+
+'  print "Setting Fields in MovieData - " m.top.json.name
   json = m.top.json
 
   m.top.id = json.id
-  m.top.title = json.name
-  m.top.overview = json.overview
+  m.top.Title = json.name
+  m.top.Description = json.overview
   m.top.favorite = json.UserData.isFavorite
   m.top.watched = json.UserData.played
+  m.top.Type = "Movie"  
+  
+  if json.ProductionYear <> invalid then
+    m.top.SubTitle = json.ProductionYear
+  end if
+
+  if json.OfficialRating <> invalid and json.OfficialRating <> "" then
+    m.top.Rating = json.OfficialRating
+    if m.top.SubTitle <> "" then
+      m.top.SubTitle = m.top.SubTitle + " - " + m.top.Rating
+    else
+      m.top.SubTitle = m.top.Rating
+    end if
+  end if
 
   setPoster()
   setContainer()
@@ -15,9 +31,23 @@ sub setPoster()
   if m.top.image <> invalid
     m.top.posterURL = m.top.image.url
   else
-    m.top.posterURL = ""
-  end if
 
+    if m.top.json.ImageTags.Primary <> invalid then
+        
+      imgParams = { "maxHeight": 440, "maxWidth": 295, "Tag" : m.top.json.ImageTags.Primary }
+      m.top.posterURL = ImageURL(m.top.json.id, "Primary", imgParams)
+    else if m.top.json.BackdropImageTags <> invalid then
+      imgParams = { "maxHeight": 440, "Tag" : m.top.json.BackdropImageTags[0] }
+      m.top.posterURL = ImageURL(m.top.json.id, "Backdrop", imgParams)
+    end if
+
+    ' Add Backdrop Image
+    if m.top.json.BackdropImageTags <> invalid then
+      imgParams = { "maxHeight": 720, "maxWidth": 1280, "Tag" : m.top.json.BackdropImageTags[0] }
+      m.top.backdropURL = ImageURL(m.top.json.id, "Backdrop", imgParams)
+    end if
+
+  end if
 end sub
 
 sub setContainer()
diff --git a/components/data/MovieData.xml b/components/data/MovieData.xml
index 912841cef..18790cdc9 100644
--- a/components/data/MovieData.xml
+++ b/components/data/MovieData.xml
@@ -1,16 +1,13 @@
 <?xml version="1.0" encoding="utf-8" ?>
-<component name="MovieData" extends="ContentNode">
+<component name="MovieData" extends="JFContentItem">
   <interface>
-    <field id="title" type="string" />
     <field id="image" type="node" onChange="setPoster" />
-    <field id="posterUrl" type="string" />
     <field id="movieID" type="string" />
-    <field id="overview" type="string" />
-    <field id="favorite" type="boolean" />
-    <field id="watched" type="boolean" />
     <field id="seasons" type="associativearray" />
     <field id="container" type="string" />
-    <field id="json" type="associativearray" onChange="setFields" />
   </interface>
   <script type="text/brightscript" uri="MovieData.brs" />
+  <script type="text/brightscript" uri="pkg:/source/api/Image.brs" />
+  <script type="text/brightscript" uri="pkg:/source/api/baserequest.brs" />
+  <script type="text/brightscript" uri="pkg:/source/utils/config.brs" />
 </component>
diff --git a/components/movies/Movies.brs b/components/movies/Movies.brs
deleted file mode 100644
index 2d379bc48..000000000
--- a/components/movies/Movies.brs
+++ /dev/null
@@ -1,14 +0,0 @@
-sub init()
-
-end sub
-
-function onKeyEvent(key as string, press as boolean) as boolean
-  if not press then return false
-
-  if key = "down"
-    m.top.lastFocus = m.top.focusedChild
-    m.top.findNode("paginator").setFocus(true)
-  end if
-
-  return false
-end function
\ No newline at end of file
diff --git a/components/movies/Movies.xml b/components/movies/Movies.xml
deleted file mode 100644
index 76ad96b3a..000000000
--- a/components/movies/Movies.xml
+++ /dev/null
@@ -1,14 +0,0 @@
-<?xml version="1.0" encoding="utf-8" ?>
-<component name="Movies" extends="JFGroup">
-  <children>
-    <ItemGrid id="picker" visible="true" itemsPerRow="6" />
-    <OptionsSlider id="options" />
-    <Rectangle translation="[0,981]" width="1920" height="100" color="#101010" />
-  </children>
-  <interface>
-    <field id="movieSelected" alias="picker.itemSelected" />
-    <field id="objects" alias="picker.objects" />
-    <field id="pageNumber" type="integer" />
-  </interface>
-  <script type="text/brightscript" uri="Movies.brs" />
-</component>
diff --git a/images/PosterFailed.png b/images/PosterFailed.png
new file mode 100644
index 0000000000000000000000000000000000000000..49c58baa33d7606b939638a9ea24756861d466b2
GIT binary patch
literal 3687
zcmdT{X;>3!63#%luW$wAP*g%VRKNoxazsu+2;m+gS5QzQS3<bYs6YsZB3DL1A`Ap%
z1EYed5ETg`xPX`-ihyeXoq&K`0|<d_9G@9?c6N5=$NtzK-A{FW)o*=Y)mvTFnP`-)
zl(>pG2n3R{J8I<u0(}Dqt~;W_fJOwjeE@h!3%0aG+gVy_L=eJ*f<pp9Anm-QJkz6X
zNVRr9*Tx-+vU+61$!ZkT%9@z33vIOs)@zvXC-5?!eZSofk5}-PkWSv^q3&H06&0Zf
zZk2(+ZQ<5RI<qNu*Q~QeI{2|MGx#NG2o6?tIrK#8buXK}P{n<(6b(O8q`}X!lK+16
z@0`(^wEZR>1Ez_I%&d>QW+GE^!(gZOK7`Bl?j8PtJdjB@+Fd$th9@h+(w0kNIW!45
zbAnIwN={@emUJpTn@Gq-SnYyhz74~A?04hZaepYs73iPz_CSQ=J&q~9xC2kY8qjys
z@1P<@4R`Ix1zSC-_7{YGOMZ4eFJOn=s<X@nZPe-FF|7e%<wNhB)5SYy&uz5Mgmtg6
z?p#sG7MRk%%{P<;N0Z|FZ$G#Y+MFz~Tt?Dk@bm{#c}~x39d{>!7eWM;1{@tn1oy<G
zlHfjjHErkE3UhJ);Ah|0kyscO@Tm<8&q*pV0|iguc)|z-*haj7`EGW)=f%jnDf`D6
zk>Uoz?Zu5xyMVk12OP7t0v!d}fUF9Fh9m)vSj17UNDyex&duwa*h=&0&GZrN9IZvh
zghgbvl`gIgi2$lCMC)&fmf@kHfnh|DB_R+?3_Ph36HGj<VQc4z_9RIwfk2XGc2-B+
zVh5*&&$wc|ps8=u1VnBKz4b4*TUyBYZl!GA^Hi1AMV!8@ijYEyj2I;;OG!FpEY2*-
zrC-adF=_IH5RO;2vApU7(hTYl1>prCaAXOHB?f{2MrMiqs{br+ngTYzD}OcxZhryp
zi_1R;_t&8Rzjm5Bqo>;XG|&sWy1G~$*jVk>b)&giwbG^2e}vZD+)PE$@sW|L6|>su
zZP@G%`E#=LhW#ozr;Vh`F$|T*McRe-&U=b0y!UjB`0mDJWEg(uP;Rcw8V`Jv$_i%w
zw6wG{ys6x!Mp@XI;Zc$QzAt1y_ruzb^tNl)$m|LAC}aFHglMr*a;-}ZYjtTR;Mq2o
zKAkRnQxnQ{iXafwq_Eujx+K}Y(`u}Y{1a^ux?&n{88MNNAl#b&VQNaO0Ks^t>sc=$
z-z&p$rk{Xt-Lm<7KH{{RGFYGR3_<4e?;Rnt=f<as)aCU(DCCx5BT+o2E~w(|lt2rn
z(j_yf0t?|bm`DvADuLnc9g6}-R=S_N)%HKx``)gk=%HNxcv(%7C4@du+mB0sNa%HY
z=a9*kbL+Zao&hVXq3na9j{VTwd`1-E$}QOX=7QKM`(Nn%yWIMk!hb~D%;IJy^T2sB
z5P!o`l$1ru(bo22{n?p~wSzVleJ?V2u1!j1_n3E>irV;qDXg*i12UPsku(t&N~>ZA
z6PuY-2d&Lqyq;`lzyT9J_VVk;$nG-g<NQwkjH6cmkI@Nrv0N*0>>!|S+wUdH4xpI<
z@yxTKZWY0`G-Bnn@jF@#Ou-ZED@kWDLxxEg^sXZE(A1GR#c<<No2I3ezFc0y<2OZP
z0x;CB!wyQlGVJ4$oB@Ny0F&hP!YGrUz%Z29Ayd-?RVN1}rTS0G;oH$N*vl=;C$fEJ
zSvrcv{N$3WrR~E|pYe5L^p(4sel}FFeaUkPPM~>DZ_mL!=%<owOPW!*UGjqy7>mud
zOY`G%dwY6}-cvlSs7AAtB}mn{`D~KUr4*<(-hNbUf+#59ev)dWgSJlRnW0B-cmj?}
zk)@@j;Zanh?dV!j0PsGu+uvwjYzIord$xxy!O?A7K%j$ncY1EAvL)R-Cr8&5ScEZ<
zjGYcLB>Pi#_j3(Q?{i-r$;?N>WUC75VkaemP{jj>?gZm<4p%EYDzKorh_Z)HuY&_c
zV5l=Pobh;pLKo_bE!D3=piHYr3qMi@rrI57ES*dw<0GXwU^Bu8u2H*#`lfyg*pHei
zogAHAo@_cU3mk$=X*!FnRIAEBDn8IG(^9KyM=rKd;HVn#^(PS_7E}*>`<0%czR61U
zs=IlxyNJs2>eLVyDn*hLVwC0E)a2}U-bAKAy#T?yi)6lAHB541cx2^|E(wX?4sF+o
z?*PooUxg?@tLu==mtiAe8&8#sh|0DV<YqFH$sEX-E`Mp@UfW+iGu7_@@yzy=9)AP!
zCtuU9al&)##8@0>auL{fTFa-Hgap;mzLzqFi(>^(<T-keT*lnPwpIb5UiC{^TfX)X
zUR|u;Nx$Vqlo&EpH@cGdeuZB@Z*rk6=+;H^$@r%!u{DTFh3c$gAzUH$-UfeH);0+#
z&U_4d>FJC!-pOIAMZGfZjh?mD;c%tscFU6I;+%aJw{i`-1HC*x%5&I)2aX@18po|`
zJ7ke2#_l3B*+t&7S0N=)>A|yNxM9-e?s|ey1~0)lZfkcsuxbRJ(65WtIUn3eQmKbI
zWMp*1(*TO7JE6G^Fwd4Ob5S>YEXIeH{6KR<rK&eAT_?P$jK47+dKgH`Q4a=m4&SSP
zpVi)8{C!(PuHJ|xl@ez?S&5~Pflr{H;5elTI`V!&)ttX<SXWmsvGV-fWS_RZGo>%K
zAcXo32p<qRWl7<*HB*suemkGuL>xBN+vCt3G#0n&zOBMd*P7{jfk(W@DSLMoPJcfT
zA9K*GL``WK9F><y^;iV=PbTg8V2XSy$}X=!!Buhu%QUzR>&Q|C<!VP!_H_aGm+oPi
zSd3%=P^4mR0@y(ok{Q&opb!@ZP*R}KiV786Ji#UD8av4TT(NdSy2td<wc>2=A|RZ)
zj~2Air6wvO(P%C}=iCdx4jEFeU7juOn}sBcCvq|cNpkf40*ht<iS-<GgmLOv43X2x
z1h^?sXaV3iPOH03evDvXFZ<0Je@=*qZXuAbGm?PXU~tMqE)t@RADlo|LaU;Lbt?_{
zMrgoYgFDIo0FXpXzqD?<!EWJ+Qh?Q=$7n7xZ2p@_A(H(ehpgO|Ze)pzxEmuC8EOx>
za_1=4_YY<p4ExP))<!3IVl1|XG}vIU+jq7|z1m~aV36^`ru!{cWbvF61do~5h>0$O
zRy#_$%93#EVZH!F6o<!Zl>w?aTmyY&D^O)gYY}sw3>uHCnr67vD9ntguZ%%}^F}2S
z)EWop1s6RYH7w7>@h&CiM>~+&k6#YI${ZbiFEqhO<E_70JgYaNHBE)kbHq8F@_=z$
zLu`8jj&@!QkLgpKNg%~fV&hRXqqvnEL}&yJcU%?l$bTi>l?xagr;V74b8c_q@I^?t
zCd^d;NI{^H0pydjMi~feEbliaB9}{V%Kps^J-;y$<W<z(o3g6Y6=(~=+iRf{4<|l4
ze@0yc1>%Cq@~Mb#xZwXR1IxeIe3n0(YM{Qz$H%6pdms^2EFDuekMpx|@L*GVD$we9
zTXJl_2+|o}gbQ$>%}AcD-0U}74?A%iH2LcfArVEu`@jc&XlO_oTu+FMlrQGr2RbpK
zw6rWEhW^nd=1mXKcZqFp-6c&f&2uNc&C}cT&Ozt_YlL_ePtO72)?3~_ejPmCcSp#s
zH|{Zgy?rDUoMc>^Uhe}MxHAoCeIJ&lXv?lKvx|j?u$ZeiWlg$yJTGrQKiiQo+e#Nh
z$n@~g5bM>-UG;nfqc<W}5%Bfv<kAJb;-J;HO_DqJ{Iw8EN0y&#{)wM_((3>)vQ!lH
zm%He6Oizau*uw<lvj%Se>l}0~COOOX-s2N~mqFGyAR@o?`9JFCKTo)yO}`#Jzm|VH
uH~x3HuZQP<gZ?etpPfAZcRRg0wc$In)4L0vIS%}8fb6VMR&^HsXa5P@K`5*M

literal 0
HcmV?d00001

diff --git a/images/PosterLoading.png b/images/PosterLoading.png
new file mode 100644
index 0000000000000000000000000000000000000000..88576e1b073f9b62dcf90ac8f9ea81dcff738295
GIT binary patch
literal 3842
zcmb7H30PA37N>G4DRo?+EYmV`Ll841QyWq;6cN+h$)L<7MKN3}P0Deh&D7CRT&hV>
zbFxWukLN-<S~-bIVxXaBX6{=q*t_<<@6EjT=9_u*-S6J-ch5cdch32r|2_OjCg5$i
z$*IYKK%i~d<2ENipba{}S+!XPu*e4P;R81b0oK+8thKdfXjsU(fFNHGNH_Izs^#&f
zZ+CHhoGbRKeq)e?I?KjGY%sJmeMrO60E6<6r^7}QfBkU}mP%Fe2Fu67T-Cjq;o+gG
zQVj}<I<`6(sNQrO_AchSY>Ol+a+10zuNbIZm>qoPO0mZ=V~Fa3URC5&ioDdXjMx{)
zUvv!?C74*W@GUQ0s%K2WCNIR@q-gsY|3gQq!&q3B#7}0K8s^SgQIk})6FxJex(dKb
zN5Y5^OE)ewkmCKmyG{$ciL!w~Jl!cIR}&X8R$O*3FdcE$+Z7c;b+uRRsnUrf8L<pm
zRrm{=k+8itrEFT+r#ET4C;eKSO5TfIaZ>nFFz9&Oem`Gk`=R$v-^u+lef3MjB<1C5
zb5)MY^^N0*rxN5=sfhTP?x&nv!L_j)Kj+6Al#U|!S4JH>OB@U@NzDaqg7O_4M4RA|
zSK@Vu#`|n%cq%i|1Cr~{^uTk%jl>d4$c@WPD^S44z)=|#O6r(gdj0$9iB~<MHA~)y
zN!iTuu&481mSI3&WXSfmHXv=#K9E*0`WgnXYzaN?aRCH^YptIfq8=QHSZ^N<>wu9R
zl9ByJ1NL|-0}7aS&@k>a>yY4JUkVLm9p+1-`JUB`450aI+F~6DZt?Pf)7D<B4caA2
zFfKgrxN}tf`MZ`~xFpjn!Fvs5799E}zoZI^qk>GEWp&>iP`v0<7R1|y4Vum0;lnQ}
z?$mGFE(z<qo*%F}I2q@)@5-Ituq`0!Mn#=(nV{w^iaP&=o45RC|BBaL0iQp_UtNLA
z-=O<f$p4S-?@|9{rUS}{;SK!YkPwzoNQBb6Jz$-%4x%j8^Hq*dEH)S4mvGwm{cQB|
z2xo2lXp~pw(2=l!cYCj(HY6!);z44mBxL}LrT!Ctef%%`Z+L2xMJ4=AQ<HTKCoXhP
z+Z1BnRcm~FyjoFgW2Yw+I`C>s450U<7P4Q`VgwF1jx}+op347exxa7NUpDD~8uM>z
zcaiASfrDz>fZ(S%vEvnrI%`l?JxyRq-9rx-jCWBgy*E?EPrl8Kkd&woefVIcuC89A
zC~nTI6ZF{=!TM*B;euf3QRe4U1+QSbj4f3CF|WFbWNBaI9(=!1e#aR|mq9+dI~-|g
zVG*^VIUw51?2E(wY1AjfQ;S1xh{lwPzS1&o`bhLg-^&O(s`Pm%%5HFapFg_Z&W}Yz
zG|EAp$3Ex|bv)y696jO`pFZan6^axRN%3JCT`3S}0}Arxj0JJdn54v-m)8Gem?vG4
z-t*ciutE%R?k6j;%sJdA1+fuG^#tKkt`|-`Ck6+eMW6ITa<Bd3hZCzjDL8iDB+s4j
zKt7GT55KdvK%~G6HTk)qO|7ti>*9_RyU5&s{f4gp&a0YjG#s5514%<=1fsVYvW@*K
zJxL+MDfh~<nv1T11B1|*!{+8&Yl)g2jIQ?O#(j85y7c@nWVuy4J13Q*%xD80{7H90
z!y-CZkeQ&xxieFq1z{v;#8Qj@L06OKtt>W`NmpP)ruW{mj9yiG1f-*SAP+}}x=3z$
zC0i^EjW&fau*~Axg72Kb#UhP6w(!E<p!YKN)ZzxZnq%WLm^VLhzYU^rZJ-k<JZ8JR
zEfrjRPQd}lFF72>c6ytf9UkRR2Y4TzN8dO`T11bZTy5=dUCAm0iVCK`j@q^6`>xoK
z4Omjd(*-CXnyD7y{$uHr30#xh2aHpWS<L~Ppy`il(k~*n!S+*UAc(W*j3p~}YvMP+
zQZ?s?Op7U9un~I7rR@!aA;W;n-UoBEoOtPs6Q5q!IC3(S_fy4MO|MaN?Tx<fguAw5
zkc9rWWMv;BA+2iX!TV5`q1QDBfVfew=xPs27AMUD(U{$(IU{(eqE240akVH*T6O8&
zVvwnQ{R^^^4vg&xb*@!i_C5r><4#6n`eiGAdQ@X0I=xhtwX4(s5A!uqV?|E>)ClP^
z7l|>k+P<ba9zdqW-u-W-5bW;D9;gM9ln6*+%!A<O1P(k1tm|$Sv)mY<TMt9f#Qtk}
z=gMBBa#Cfv!_gB4dg5jQv<nrAmJFqG9y0<0k;%$AWd*Twt^IGfL;ghS-m_>Tk^5G5
zKI*h^5h#aTlY<wY*2CNU;O&!W1)cN)>(h{`7&TzIY#vTWDMjck@o%o)sJk^fLCKDJ
z)@*=JKZ|zw$^ODyyAPLfm{gfeh;#0zDyf6+gfy(3-UIx|FtnXV&mN9;&zhK+=p2}d
zBq`~%sj)GhKMvwYxL-a=B$9FtN8?G>%u%56`gPp%CTgVorMgvec8r1B8LJD$ee2tW
z(sikqn+{GJw(0iv>Ho2`v{V3R*N&RZuWUk;58L=cyK0vW*%lqV)1jl%PnqmFdQCOf
zt8d<e5E;qq(s0LpuUrv&@uF8gr(IYIbz!ovo_q2GzE&t$y)4?Tk!Y#7fl9_iL`HP>
z2ABaOmj7|Gn^MvFt|1=k&SZZgn;$0jZIZjEt`XTdam<$a8GG1~5l|vR1lJ1f5)&aV
zrE%XA>C11<n>t6{xJA<!(m&Ep+<$$1aJrcha>(gDcYREHZD5QxB`WB3%--fivV;pe
z(oySAcF*nLU9xh#+TPE@AnbX)uybhj$j;aA?rKO;?*%c6`YgA2;AWSAsqwSP$^ko%
zo-bo@oX_-+<xTj08|LRm^78m942F}eX$t%MzW_)3G6`JFqpaNaX6m++Q(_GGW4-|k
z867_?OVDrV<`Y#fzh!RbZ9Rqah`XKQ2;sFr7?_XJ&$#C+g={^1U6t?yH+?=|l2Z)}
zLsvUFGoyOBwAffk*wtYmO^+T&jFZI*N3V%)URKbYd=OD6%<ZyVIv9lXm7v?=G;zKj
zgpgZ@pTS`Ghr!74iNe|0+1rTewGUp^C*W*X1NB{X(^r9SIs!Rv75iLe%I}B}PFNix
zFL%<jzcbWrDNRx~*v1PP@gp%t#XBp(tDop?_n=)n!FEh{a~w;UcKgUht9;hlz|51K
zFgNX)V=pU140WmGBBR_yc%ewZcX)q5x4FnO`(+DPWnl+zz*yLSq^>m|T2pXIMjOA{
zN)}-KSS*132(%vRbKn+O|9w?Pi}bLSE>(P(F*;3>BDLggh4X-4zt;ZxOy2<WZFLH5
zxkKV+H;D5<)8;&gb5~yp2jX%h6ukt`Lro8JX^?1w_W)U+N1q{D029MeK`Y6eSg@5b
z+78yAGTAhOPUaOdtUN1y?s4aq=qW3PA}VXp#(^sM#8tUiPC*3aT3iGs$5J2VaGE#M
zl!gSR$O?TCc`_OuZoW|)pHr1Z7qwkpHKG?MS<LXQm74>!Ozb}!(e;z8C|uySs0Y})
zyE%81qRJ;=AMR$B+==$5qaH5<+iTf~zSj2Yj9^H5_?QE=m`_fz@-!P`Ss((#9hx+<
z2ihCOE)s5e&Z~}B<Xb(4DFULK?OKYmy<wrS%kt2c%iGaTO-32M=tC3?Q-5b+>;3SH
z^+83z1SLSyQQaoE$F^g!E7-blB0>J4vW{I{*6xt97iJSRnc}-!0FR85Po67ivE|k|
z^9>7gX^`qHcudBMU7J88_8<ULm@zu)FD&4iZ1*l)Nt8u2v%rCYz=G{Z?6)2JJ`z2D
z21pVgMwKJtZuS_i(8Govp@O&Dj(HL~JP9{fRau!s{=yWvE)c+32z53KMJ|=TRRXuA
za>Oo++;Y{btW{S^uk>)M54CuZEC<wc4%tmYADVGvx{i(-=-uoo<<sRXXZXP~;&Qo1
zK9eo#rG4%CapjZ%sLKG=U_7E7tcmZQ<45BlJb{fyB^`Cr7+3$0^UVk{c$t2bSzM9z
zbL_ZdS$TmXOYT`ld%`b(v2ETJKI{5w9Stumn5rfyaM}li-6uU^5coCJ^yf!U&l4aw
zZl_iMsWAFma#K+!6ZD5-SKluc0zc|;ijm-U9~a?GcYi57XO4<WQ!9E$mg*CU7W9*p
z9TygT9!Ml^aH%LS*?%j=-xQ%H{ww|}9{&)Bk9dSVTuW^0=(-S15t`xrcqY4UcyD$+
z_jn3NqI$+#AWq~#zq0@S^{<isT%T4;{TBKEa0k>b;J+?&|2p}<r2D;U{vW!syK5kS
Xu;#ct)p`T)PY8s?;B9_7dYb-EKzpo3

literal 0
HcmV?d00001

diff --git a/source/Main.brs b/source/Main.brs
index 9869bfcbd..6ed8bc825 100644
--- a/source/Main.brs
+++ b/source/Main.brs
@@ -235,9 +235,7 @@ sub Main()
     else if isNodeEvent(msg, "pageSelected")
       group.pageNumber = msg.getRoSGNode().pageSelected
       collectionType = group.subType()
-      if collectionType = "Movies"
-        MovieLister(group, m.page_size)
-      else if collectionType = "Collections"
+      if collectionType = "Collections"
         CollectionLister(group, m.page_size)
       else if collectionType = "TVShows"
         SeriesLister(group, m.page_size)
diff --git a/source/ShowScenes.brs b/source/ShowScenes.brs
index 37b003773..1a9dfa795 100644
--- a/source/ShowScenes.brs
+++ b/source/ShowScenes.brs
@@ -196,10 +196,10 @@ function CreateHomeGroup()
 end function
 
 function CreateMovieListGroup(libraryId)
-  group = CreateObject("roSGNode", "Movies")
-  group.id = libraryId
+  group = CreateObject("roSGNode", "ItemGrid2")
+  group.itemId = libraryId
 
-  group.observeField("movieSelected", m.port)
+  group.observeField("selectedItem", m.port)
 
   sidepanel = group.findNode("options")
   movie_options = [
@@ -235,15 +235,7 @@ function CreateMovieListGroup(libraryId)
   sidepanel.options = new_options
   sidepanel.observeField("closeSidePanel", m.port)
 
-  p = CreatePaginator()
-  group.appendChild(p)
-
-  group.pageNumber = 1
-  p.currentPage = group.pageNumber
-
-  MovieLister(group, m.page_size)
-
-  return group
+    return group
 end function
 
 function CreateMovieDetailsGroup(movie)
@@ -397,22 +389,6 @@ function CreateVideoPlayerGroup(video_id)
   return video
 end function
 
-function MovieLister(group, page_size)
-  sort_order = get_user_setting("movie_sort_order", "Ascending")
-  sort_field = get_user_setting("movie_sort_field", "SortName")
-
-  item_list = ItemList(group.id, {"limit": page_size,
-    "StartIndex": page_size * (group.pageNumber - 1),
-    "SortBy": sort_field,
-    "SortOrder": sort_order,
-    "IncludeItemTypes": "Movie"
-  })
-  group.objects = item_list
-
-  p = group.findNode("paginator")
-  p.maxPages = div_ceiling(group.objects.TotalRecordCount, page_size)
-end function
-
 function SeriesLister(group, page_size)
   sort_order = get_user_setting("series_sort_order", "Ascending")
   sort_field = get_user_setting("series_sort_field", "SortName")

From 4fe3e0dac24455311a9d187fba4f1b26916870e3 Mon Sep 17 00:00:00 2001
From: Neil Burrows <neil.burrows@nvable.com>
Date: Thu, 11 Jun 2020 07:57:31 +0100
Subject: [PATCH 2/2] Animate Poster Scaling

---
 components/ItemGrid2/GridItem.brs | 15 ++++++++-------
 components/ItemGrid2/GridItem.xml |  3 ++-
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/components/ItemGrid2/GridItem.brs b/components/ItemGrid2/GridItem.brs
index 9fb84111d..c857f3906 100644
--- a/components/ItemGrid2/GridItem.brs
+++ b/components/ItemGrid2/GridItem.brs
@@ -22,18 +22,19 @@ sub itemContentChanged()
 end sub
 
 '
-'Resize Poster and Title Vivbility on focus change
+'Use FocusPercent to animate scaling of Poser Image
+sub focusChanging()
+  scaleFactor = 1 + (m.top.focusPercent * 0.17333)
+  m.itemPoster.scale = [scaleFactor, scaleFactor]
+end sub
+
+'
+'Display or hide title Visibility on focus change
 sub focusChanged()
 
   if m.top.itemHasFocus = true then
-    m.itemPoster.width = 295
-    m.itemPoster.height = 440
-    m.itemPoster.translation = [0,0]
     m.itemText.visible = true
   else
-    m.itemPoster.width = 250
-    m.itemPoster.height = 375
-    m.itemPoster.translation = [21,35]
     m.itemText.visible = false
   end if
 
diff --git a/components/ItemGrid2/GridItem.xml b/components/ItemGrid2/GridItem.xml
index 7e885f4c3..8fcf9fd99 100644
--- a/components/ItemGrid2/GridItem.xml
+++ b/components/ItemGrid2/GridItem.xml
@@ -1,12 +1,13 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <component name="GridItem" extends="Group">
   <children>
-    <Poster id="itemPoster" width="250" height="375" translation="[21,35]" loadDisplayMode="scaleToZoom" loadingBitmapUri="pkg:/images/PosterLoading.png" failedBitmapUri="pkg:/images/PosterFailed.png" />
+    <Poster id="itemPoster" width="250" height="375" translation="[21,35]" loadDisplayMode="scaleToZoom" loadingBitmapUri="pkg:/images/PosterLoading.png" failedBitmapUri="pkg:/images/PosterFailed.png" scaleRotateCenter="[147.5, 220]" />
     <ScrollingLabel id="itemText" horizAlign="center" font="font:SmallSystemFont" maxWidth="295" translation="[0,442]" repeatCount="-1" visible="false"  />
   </children>
   <interface>
     <field id="itemContent" type="node" onChange="itemContentChanged" />
     <field id="itemHasFocus" type="boolean" onChange="focusChanged" />
+    <field id="focusPercent" type="float" onChange="focusChanging" />
   </interface>
   <script type="text/brightscript" uri="GridItem.brs" />
 </component>