Roku Developer Program

Join our online forum to talk to Roku developers and fellow channel creators. Ask questions, share tips with the community, and find helpful resources.
cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
cesarcarlos
Binge Watcher

Populating a poster grid with data from JSON file

Jump to solution

I'm new to Roku deveopment and I'm trying to set up a posterGrid on my Home Screen:

HomeScreen.xml

 

 

<?xml version="1.0" encoding="UTF-8"?>
<component name="HomeScreen" extends="Group" initialFocus="topics">
    <script type="text/brightscript" uri="HomeScreen.brs" />
    
    <interface>
        <field id="content" type="node" onChange="loadTopics" alwaysNotify="true" />
    </interface>

    <children>
        <PosterGrid 
            id="topics"
            translation="[20,100]"
            basePosterSize="[304,182]"
            itemSpacing = "[10,20]"
            posterDisplayMode = "scaleToFill"
            numColumns = "4"
        />
    </children>
</component>

 

 

 

 I call the RunContentTask sub from MainScene.brs

 

 

sub RunContentTask()
    ' Create task for feed retrieving
    m.contentTask = CreateObject("roSGNode", "HomeLoaderTask")
    ' Observe content so we can know when feed content will be parsed
    m.contentTask.ObserveField("content", "OnMainContentLoaded")
    ' GetContent method is executed (MainLoaderTask.brs)
    m.contentTask.control = "run"
    ' Show loading indicator while content is loading
    m.loadingIndicator.visible = true
end sub

sub OnMainContentLoaded()
    ' invoked when content is ready to be used

    ' set focus to home screen
    m.HomeScreen.SetFocus(true)

    ' hide loading indicator because content was retrieved
    m.loadingIndicator.visible = false

    ' populate HomeScreen with content
    m.HomeScreen.content = m.contentTask.content
    
end sub

 

 

 

HomeLoaderTask.xml

 

 

<?xml version="1.0" encoding="UTF-8"?>
<component name="HomeLoaderTask" extends="Task">
    <interface>
        <field id="content" type="node" />
    </interface>

    <script type="text/brightscript" uri="HomeLoaderTask.brs" />
</component>

 

 

 

HomeLoaderTask.brs

 

 

sub Init()
    m.top.functionName = "GetContent"
end sub


sub GetContent()
    ' request the content feed from API
    xfer = CreateObject("roURLTransfer")
    xfer.SetCertificatesFile("common:/certs/ca-bundle.crt")
    xfer.SetURL("https://my/api/topics")
    rsp = xfer.GetToString()
    rootChildren = []
    rows = {}

    json = ParseJson(rsp)
    
    if json <> invalid
        for each category in json
            value = json.Lookup(category)

            ' if parsed key value having other objects in it
            if Type(value) = "roArray"
                row = {}
                row.title = category
                row.children = []
                for each item in value
                    itemData = GetItemData(item)
                    row.children.Push(itemData)
                end for
                rootChildren.Push(row)
            end if
        end for

        contentNode = CreateObject("roSGNode", "ContentNode")
        contentNode.Update({
            children: rootChildren
        }, true)

        m.top.content = contentNode
        
    end if
end sub

function GetItemData(topic as Object) as object
    item = {}
    item.id = topic.topicId
    item.hdPosterURL = topic.url
    item.title = topic.topicName
    return item
end function

 

 

 

Finally in HomeScreen.brs I have the loadTopics() sub

 

 

sub Init()
    m.topicsList = m.top.FindNode("topics")
    m.topicsContent = createObject("roSGNode","ContentNode")
    m.top.SetFocus(true)
    m.top.ObserveField("visible", "OnVisibleChange")
end sub

sub OnVisibleChange()
    if m.top.visible = true
        m.topicsList.SetFocus(true)
    end if
end sub

sub loadTopics() ' invoked when item metadata retrieved
    

    content = m.top.content
    
    'there is no data in m.top.content
    ...
end sub

 

 

 

The problem is that even though rootChildren is being populated correctly in HomeLoaderTask.brs, m.top.content isn't (if I try to debug, the contentNode is never populated) so when I try to load the content in the loadTopics() sub, I have no data.

I've been testing this for hours, and have no idea why the data is not being saved to the HomeScreen content field.

0 Kudos
1 Solution

Accepted Solutions
joetesta
Roku Guru

Re: Populating a poster grid with data from JSON file

Jump to solution

how are you concluding there's no data; did you check for a child node of the content node?

You're currently setting an array ('rootChildren') of associative arrays as the child of the contentnode, that probably won't work (I believe it expects children to be nodes and not objects like arrays).

If you just want to pass back data, use a field type of "array" or "assocArray" (instead of "node");

in your task xml:

<field id="content" type="array" />

then in your task brs:

m.top.content = rootChildren

aspiring

View solution in original post

2 REPLIES 2
joetesta
Roku Guru

Re: Populating a poster grid with data from JSON file

Jump to solution

how are you concluding there's no data; did you check for a child node of the content node?

You're currently setting an array ('rootChildren') of associative arrays as the child of the contentnode, that probably won't work (I believe it expects children to be nodes and not objects like arrays).

If you just want to pass back data, use a field type of "array" or "assocArray" (instead of "node");

in your task xml:

<field id="content" type="array" />

then in your task brs:

m.top.content = rootChildren

aspiring
cesarcarlos
Binge Watcher

Re: Populating a poster grid with data from JSON file

Jump to solution

Thanks, this worked!

0 Kudos
Need Assistance?
Welcome to the Roku Community! Feel free to search our Community for answers or post your question to get help.

Become a Roku Streaming Expert!

Share your expertise, help fellow streamers, and unlock exclusive rewards as part of the Roku Community. Learn more.