Constants to own file and tighten up UI UX

This commit is contained in:
Neil Burrows 2020-08-16 15:44:03 +01:00
parent e898a171ff
commit 5d3dc87d62
12 changed files with 246 additions and 134 deletions

View File

@ -13,6 +13,9 @@ sub init()
m.focusAnimWidth = m.top.findNode("focusWidth")
m.focusAnimHeight = m.top.findNode("focusHeight")
' Set button color to global
m.focusRing.color = m.global.constants.colors.button
m.buttonCount = 0
m.selectedFocusedIndex = 1

View File

@ -6,7 +6,7 @@
<!-- Background Bar -->
<Poster id="menubg" uri="pkg:/images/option-menu-bg.9.png" width="800" height="100" />
<rectangle id="focus" color="#006fab" />
<rectangle id="focus" />
<LayoutGroup id="buttonGroup" layoutDirection="horiz" itemSpacings = "[75]" translation="[50,20]">
</LayoutGroup>

View File

@ -13,7 +13,7 @@ end sub
sub itemContentChanged()
' Set Randmom background colors from pallet
posterBackgrounds = m.global.poster_bg_pallet
posterBackgrounds = m.global.constants.poster_bg_pallet
m.backdrop.color = posterBackgrounds[rnd(posterBackgrounds.count()) - 1]
itemData = m.top.itemContent

View File

@ -2,7 +2,6 @@ sub init()
m.options = m.top.findNode("options")
m.itemGrid = m.top.findNode("itemGrid")
m.backdrop = m.top.findNode("backdrop")
m.newBackdrop = m.top.findNode("backdropTransition")
@ -10,7 +9,7 @@ sub init()
m.swapAnimation = m.top.findNode("backroundSwapAnimation")
m.swapAnimation.observeField("state", "swapDone")
m.loadedRows = 0
m.loadedItems = 0
@ -26,20 +25,27 @@ sub init()
'Background Image Queued for loading
m.queuedBGUri = ""
'Item sort - maybe load defaults from user prefs?
m.sortField = "SortName"
m.sortAscending = true
m.loadItemsTask = createObject("roSGNode", "LoadItemsTask2")
m.loadItemsTask.observeField("content", "ItemDataLoaded")
end sub
'
'Load initial set of Data
sub loadInitialItems()
sub loadInitialItems()
if m.top.parentItem.backdropUrl <> invalid then
SetBackground(m.top.parentItem.backdropUrl)
end if
m.loadItemsTask.itemId = m.top.parentItem.Id
m.loadItemsTask.observeField("content", "ItemDataLoaded")
m.loadItemsTask.sortField = m.sortField
m.loadItemsTask.sortAscending = m.sortAscending
m.loadItemsTask.startIndex = 0
if m.top.parentItem.collectionType = "movies" then
m.loadItemsTask.itemType = "Movie"
@ -48,18 +54,63 @@ sub loadInitialItems()
end if
m.loadItemsTask.control = "RUN"
SetUpOptions()
end sub
sub SetUpOptions()
options = {}
if m.top.parentItem.collectionType = "movies" then
options.views = [{ "Title": tr("Movies"), "Name": "movies" }]
options.sort = [
{ "Title": tr("Name"), "Name": "SortName" },
{ "Title": tr("IMDb Rating"), "Name": "CommunityRating" },
{ "Title": tr("Critic Rating"), "Name": "CriticRating" },
{ "Title": tr("Date Added"), "Name": "DateCreated" },
{ "Title": tr("Date Played"), "Name": "DatePlayed" },
{ "Title": tr("Parental Rating"), "Name": "OfficialRating" },
{ "Title": tr("Play Count"), "Name": "PlayCount" },
{ "Title": tr("Release Date"), "Name": "PremiereDate" },
{ "Title": tr("Run Time"), "Name": "Runtime" }
]
else if m.top.parentItem.collectionType = "tvshows" then
options.views = [{ "Title": tr("Shows"), "Name": "shows" }]
options.sort = [
{ "Title": tr("Name"), "Name": "SortName" },
{ "Title": tr("IMDb Rating"), "Name": "CommunityRating" },
{ "Title": tr("Date Added"), "Name": "DateCreated" },
{ "Title": tr("Date Played"), "Name": "DatePlayed" },
{ "Title": tr("Parental Rating"), "Name": "OfficialRating" },
{ "Title": tr("Release Date"), "Name": "PremiereDate" },
]
end if
for each o in options.sort
if o.Name = m.sortField then
o.Selected = true
o.Ascending = m.sortAscending
end if
end for
m.options.options = options
end sub
'
'Handle loaded data, and add to Grid
sub ItemDataLoaded(msg)
itemData = msg.GetData()
data = msg.getField()
if itemData = invalid then
if itemData = invalid then
m.Loading = false
return
return
end if
for each item in itemData
@ -67,7 +118,7 @@ sub ItemDataLoaded(msg)
end for
'Update the stored counts
m.loadedItems = m.itemGrid.content.getChildCount()
m.loadedItems = m.itemGrid.content.getChildCount()
m.loadedRows = m.loadedItems / m.itemGrid.numColumns
m.Loading = false
@ -114,7 +165,7 @@ sub onItemFocused()
if focusedRow >= m.loadedRows - 3 and m.loadeditems < m.loadItemsTask.totalRecordCount then
loadMoreData()
end if
end sub
end sub
'
'When Image Loading Status changes
@ -130,16 +181,16 @@ end sub
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 = ""
if m.newBackdrop.uri <> m.queuedBGUri and m.queuedBGUri <> "" then
SetBackground(m.queuedBGUri)
m.queuedBGUri = ""
end if
end if
end sub
@ -162,22 +213,41 @@ sub onItemSelected()
end sub
function onKeyEvent(key as string, press as boolean) as boolean
' print "IG KeyPress " key
if not press then return false
'
'Check if options updated and any reloading required
sub optionsClosed()
if m.options.sortField <> m.sortField or m.options.sortAscending <> m.sortAscending then
m.sortField = m.options.sortField
m.sortAscending = m.options.sortAscending
m.loadedRows = 0
m.loadedItems = 0
m.data = CreateObject("roSGNode", "ContentNode")
m.itemGrid.content = m.data
loadInitialItems()
end if
m.itemGrid.setFocus(true)
end sub
if key = "options"
print "OPTIONS!!!!!!!!!"
if m.options.visible = true then
m.options.visible = false
m.itemGrid.setFocus(true)
else
m.options.visible = true
m.options.setFocus(true)
end if
return true
end if
function onKeyEvent(key as string, press as boolean) as boolean
if not press then return false
if key = "options"
if m.options.visible = true then
m.options.visible = false
optionsClosed()
else
m.options.visible = true
m.options.setFocus(true)
end if
return true
else if key = "back" then
if m.options.visible = true then
m.options.visible = false
optionsClosed()
return true
end if
end if
return false
end function

View File

@ -6,9 +6,13 @@ sub loadItems()
results = []
sort_order = get_user_setting("movie_sort_order", "Ascending")
sort_field = get_user_setting("movie_sort_field", "SortName")
sort_field = m.top.sortField
if m.top.sortAscending = true then
sort_order = "Ascending"
else
sort_order = "Descending"
end if
params = {
limit: m.top.limit,

View File

@ -7,6 +7,8 @@
<field id="itemType" type="string" value="" />
<field id="limit" type="integer" value="36" />
<field id="metadata" type="associativearray" />
<field id="sortField" type="string" value="SortName" />
<field id="sortAscending" type="boolean" value="true" />
<!-- Total records available from server-->
<field id="totalRecordCount" type="int" value="-1" />

View File

@ -6,7 +6,7 @@ sub init()
m.backdrop = m.top.findNode("backdrop")
' Randmomise the background colors
posterBackgrounds = m.global.poster_bg_pallet
posterBackgrounds = m.global.constants.poster_bg_pallet
m.backdrop.color = posterBackgrounds[rnd(posterBackgrounds.count()) - 1]
updateSize()

View File

@ -19,7 +19,7 @@ sub itemContentChanged()
' Randmomise the background colors
m.backdrop = m.top.findNode("backdrop")
posterBackgrounds = m.global.poster_bg_pallet
posterBackgrounds = m.global.constants.poster_bg_pallet
m.backdrop.color = posterBackgrounds[rnd(posterBackgrounds.count()) - 1]
m.backdrop.width = imageWidth

View File

@ -1,12 +1,10 @@
sub init()
sub init()
m.buttons = m.top.findNode("buttons")
m.buttons.buttons = ["View", "Sort", "Filter"]
m.buttons = m.top.findNode("buttons")
m.buttons.buttons = [tr("View"), tr("Sort"), tr("Filter")]
m.buttons.setFocus(true)
m.ascending = true
m.selectedSortIndex = 0
m.selectedItem = 1
m.menus = []
@ -14,79 +12,122 @@ sub init()
m.menus.push(m.top.findNode("sortMenu"))
m.menus.push(m.top.findNode("filterMenu"))
m.viewNames = []
m.sortNames = []
m.buttons.observeField("focusedIndex", "buttonFocusChanged")
end sub
sub optionsSet()
sub buttonFocusChanged()
' Views Tab
if m.top.options.views <> invalid then
viewContent = CreateObject("roSGNode", "ContentNode")
index = 0
selectedViewIndex = 0
print "Button focus changed to index ", m.buttons.focusedIndex
for each view in m.top.options.views
entry = viewContent.CreateChild("ContentNode")
entry.title = view.Title
m.viewNames.push(view.Name)
if view.selected <> invalid and view.selected = true then
selectedViewIndex = index
end if
index = index + 1
end for
m.menus[0].content = viewContent
m.menus[0].checkedItem = selectedViewIndex
end if
if m.buttons.focusedIndex = m.selectedItem then return
' Sort Tab
if m.top.options.sort <> invalid then
sortContent = CreateObject("roSGNode", "ContentNode")
index = 0
m.selectedSortIndex = 0
print "Hiding " m.selectedItem
m.menus[m.selectedItem].visible = false
for each sortItem in m.top.options.sort
entry = sortContent.CreateChild("ContentNode")
entry.title = sortItem.Title
m.sortNames.push(sortItem.Name)
if sortItem.Selected <> invalid and sortItem.Selected = true then
m.selectedSortIndex = index
if sortItem.Ascending <> invalid and sortItem.Ascending = false then
m.top.sortAscending = 0
else
m.top.sortAscending = 1
end if
end if
index = index + 1
end for
m.menus[1].content = sortContent
m.menus[1].checkedItem = m.selectedSortIndex
print "Showing " m.buttons.focusedIndex
m.menus[m.buttons.focusedIndex].visible = true
m.selectedItem = m.buttons.focusedIndex
if m.top.sortAscending = 1 then
m.menus[1].focusedCheckedIconUri = m.global.constants.icons.ascending_black
m.menus[1].checkedIconUri = m.global.constants.icons.ascending_white
else
m.menus[1].focusedCheckedIconUri = m.global.constants.icons.descending_black
m.menus[1].checkedIconUri = m.global.constants.icons.descending_white
end if
end if
end sub
sub buttonFocusChanged()
if m.buttons.focusedIndex = m.selectedItem then return
m.menus[m.selectedItem].visible = false
m.menus[m.buttons.focusedIndex].visible = true
m.selectedItem = m.buttons.focusedIndex
end sub
function onKeyEvent(key as string, press as boolean) as boolean
' print "OS KeyPress " key
if not press then
' print "OS Not Press!!"
' return false
end if
if key = "down"
if key = "down" OR (key = "OK" AND m.top.findNode("buttons").hasFocus()) then
m.top.findNode("buttons").setFocus(false)
m.menus[m.selectedItem].setFocus(true)
m.menus[m.selectedItem].drawFocusFeedback = true
return true
else if key = "OK"
print "OS Key OK"
else if key = "OK"
' Handle Sort screen
if(m.selectedItem = 1) then
if m.menus[1].itemSelected <> m.selectedSortIndex then
print "OS - Resetting to ASC"
m.menus[1].focusedCheckedIconUri = "pkg:/images/icons/up_black.png"
m.menus[1].checkedIconUri="pkg:/images/icons/up_white.png"
m.selectedSortIndex = m.menus[1].itemSelected
m.ascending = true
else
if m.ascending = true then
print "Setting ascending to false"
m.ascending = false
m.menus[1].focusedCheckedIconUri = "pkg:/images/icons/down_black.png"
m.menus[1].checkedIconUri="pkg:/images/icons/down_white.png"
if(m.menus[m.selectedItem].isInFocusChain()) then
if(m.selectedItem = 1) then
if m.menus[1].itemSelected <> m.selectedSortIndex then
m.menus[1].focusedCheckedIconUri = m.global.constants.icons.ascending_black
m.menus[1].checkedIconUri = m.global.constants.icons.ascending_white
m.selectedSortIndex = m.menus[1].itemSelected
m.top.sortAscending = true
m.top.sortField = m.sortNames[m.selectedSortIndex]
else
print "Setting ascending to true"
m.ascending = true
m.menus[1].focusedCheckedIconUri = "pkg:/images/icons/up_black.png"
m.menus[1].checkedIconUri="pkg:/images/icons/up_white.png"
if m.top.sortAscending = true then
m.top.sortAscending = false
m.menus[1].focusedCheckedIconUri = m.global.constants.icons.descending_black
m.menus[1].checkedIconUri = m.global.constants.icons.descending_white
else
m.top.sortAscending = true
m.menus[1].focusedCheckedIconUri = m.global.constants.icons.ascending_black
m.menus[1].checkedIconUri = m.global.constants.icons.ascending_white
end if
end if
end if
end if
return true
else if key = "back" OR key = "up"
else if key = "back" or key = "up"
if m.menus[m.selectedItem].isInFocusChain() then
m.buttons.setFocus(true)
m.menus[m.selectedItem].drawFocusFeedback = false
return true
end if
else
' print "Key Unhandled"
else if key = "options"
m.menus[m.selectedItem].drawFocusFeedback = false
return false
end if
print "Moo?????"
return false
end function

View File

@ -2,68 +2,32 @@
<component name="OptionsScreen" extends="Group">
<children>
<Rectangle width="1920" height="1080" color="#000000" opacity="0.75" />
<!-- <MaskGroup maskUri="pkg:/images/dialog.9.png" maskSize="[1000,700]" maskBitmapWidth="26" maskBitmapHeight="26" translation="[460,190]"> -->
<Group translation="[100,100]">
<Poster width="1720" height="880" uri="pkg:/images/dialog.9.png" />
<LayoutGroup horizAlignment="center" translation="[860,50]" itemSpacings="[50]">
<JFButtons id="buttons" />
<!-- <LabelList id = "moviemenu" translation = "[100,180]" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" focusedCheckedIconUri="pkg:/images/icons/up_black.png" checkedIconUri="pkg:/images/icons/up_white.png" focusFootprintBitmapUri="pkg:/images/dialog.9.png" checkedItem="1"> -->
<Group>
<RadiobuttonList id = "viewMenu" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" visible="false">
<ContentNode id = "viewMenuContent" role = "content">
<ContentNode title = "Movies" />
<ContentNode title = "Collections" />
</ContentNode>
<RadiobuttonList id = "viewMenu" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" visible="false" drawFocusFeedback="false">
</RadiobuttonList>
<RadiobuttonList id = "sortMenu" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" visible="true" numRows="8" focusedCheckedIconUri="pkg:/images/icons/up_black.png" checkedIconUri="pkg:/images/icons/up_white.png">
<ContentNode id = "sortMenuContent" role = "content">
<ContentNode title = "Name" />
<ContentNode title = "IMDb Rating" />
<ContentNode title = "Critic Rating" />
<ContentNode title = "Date Added" />
<ContentNode title = "Date Played" />
<ContentNode title = "Parental Rating" />
<ContentNode title = "Play Count" />
<ContentNode title = "Release Date" />
<ContentNode title = "Runtime" />
</ContentNode>
<RadiobuttonList id = "sortMenu" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" visible="true" numRows="8" drawFocusFeedback="false">
</RadiobuttonList>
<LabelList id = "filterMenu" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" visible="false">
<LabelList id = "filterMenu" itemspacing="[0,10]" vertFocusAnimationStyle="floatingFocus" visible="false" drawFocusFeedback="false">
<ContentNode id = "filterMenuContent" role = "content">
<ContentNode title = "Filter..." />
<ContentNode title = "Suggestions" />
<ContentNode title = "Latest" />
<ContentNode title = "Upcoming" />
<ContentNode title = "Genres" />
<ContentNode title = "Networks" />
<ContentNode title = "Episodes" />
<ContentNode title = "Coming Soon..." />
</ContentNode>
</LabelList>
</Group>
<!-- <RadiobuttonList id = "moviemenu" itemspacing="[0,10]" itemSize = "[300,55]" vertFocusAnimationStyle="floatingFocus">
<ContentNode id = "moviemenucontent" role = "content">
<ContentNode title = "Ascending" />
<ContentNode title = "Decending" />
</ContentNode>
</RadiobuttonList> -->
</LayoutGroup>
</Group>
<!-- </MaskGroup> -->
<!-- <Poster width="1000" height="700" translation="[460,190]" uri="pkg:/images" -->
</children>
<interface>
<field id="buttons" type="nodearray" />
<field id="options" type="nodearray" />
<field id="options" type="associativearray" onChange="optionsSet" />
<field id="view" type="string" />
<field id="sortField" type="string" value="SortName" />
<field id="sortAscending" type="boolean" value="false" />
</interface>
<script type="text/brightscript" uri="OptionsScreen.brs" />
</component>

View File

@ -6,9 +6,8 @@ sub Main()
' The main function that runs when the application is launched.
m.screen = CreateObject("roSGScreen")
' Set Global Constants
m.global = m.screen.getGlobalNode()
m.global.addFields({ poster_bg_pallet : [ "#00455c", "#44bae1", "#00a4db", "#1c4c5c", "#007ea8" ] })
' Set global constants
setConstants()
m.port = CreateObject("roMessagePort")
m.screen.setMessagePort(m.port)

29
source/api/constants.brs Normal file
View File

@ -0,0 +1,29 @@
' Set global constants
sub setConstants()
globals = m.screen.getGlobalNode()
' Set Global Constants
globals.addFields({
constants: {
poster_bg_pallet: ["#00455c", "#44bae1", "#00a4db", "#1c4c5c", "#007ea8"],
colors: {
button: "#006fab"
},
icons: {
ascending_black: "pkg:/images/icons/up_black.png",
ascending_white: "pkg:/images/icons/up_white.png",
descending_black: "pkg:/images/icons/down_black.png",
descending_white: "pkg:/images/icons/down_white.png"
}
}
})
end sub