Roku Community

keeganlanier · ‎12-10-2015

I am looking to do a very simple channel that will remain private. I run operations for a restaurant chain and I want to utilize a tv at each location for showing marketing initiatives and merchandise. I have images hosted publicly on our web host.

I am a complete noob when it comes to developing on roku. This seems like the best way to accomplish what I am looking to do. I want to point the channel to a folder on our server and have the channel load all the images in the folder and show them in a slideshow.

**Problem I am trying to solve**
Our teams currently have jump drives plugged in to their tv's and the images are outdated and hard to manage. I would like to load the new images into a folder on our host and the channel would read the images on the server and play them as a slideshow.

I hope this is clear and any help would be greatly appreciated!

I have my developer account setup, I have developer mode enabled on my Roku 3 and I am at the point where I am unclear on how to structure files and build the channel to point it at the folder on my server. From their, I am able to zip the folder and upload to my roku for testing. Thanks again in advance for any help provided.

belltown · ‎12-10-2015

Here's a simple channel to get you started.

Create an Xml file containing the list of image urls on your server, e.g:

kittens.xml:


<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<feed>
    <Period>10</Period>
    <TextOverlayIsVisible>True</TextOverlayIsVisible>
    <TextOverlayHoldTime>2000</TextOverlayHoldTime>
    <item>
        <TextOverlayBody>Cute Kitten #1</TextOverlayBody>
        <Url>http://r.ddmcdn.com/s_f/o_1/APL/uploads/2014/05/128942088217813223400601197_MilkMoustache.jpg</Url>
    </item>
    <item>
        <TextOverlayBody>Cute Kitten #2</TextOverlayBody>
        <Url>http://www.welikeviral.com/files/2014/12/8325_8_site.jpeg</Url>
    </item>
    <item>
        <TextOverlayBody>Cute Kitten #3</TextOverlayBody>
        <Url>http://rosegalaxy.com/wp-content/uploads/2015/08/Beautiful-kittens-Wallpaper.jpg</Url>
    </item>
    <item>
        <TextOverlayBody>Cute Kitten #4</TextOverlayBody>
        <Url>https://i.ytimg.com/vi/3dzUgmpXPX0/hqdefault.jpg</Url>
    </item>
    <item>
        <TextOverlayBody>Cute Kitten #5</TextOverlayBody>
        <Url>http://vignette3.wikia.nocookie.net/clubpenguinpookie/images/d/d0/Extremely-cute-kitten_large.jpg</Url>
    </item>
    <item>
        <TextOverlayBody>Cute Kitten #6</TextOverlayBody>
        <Url>http://static.tumblr.com/vlykcdf/lN2l9mwte/cute-kitten-303.jpg</Url>
    </item>
</feed>

Use this channel code to read the Xml file from your server (or from your local channel pkg: directory), and display the images in a slideshow:

main.brs:


Sub Main ()
    'content = getContent ("pkg:/xml/kittens.xml")'
    content = getContent ("http://belltown.tk/kittens.xml")
    displayUI (content)
End Sub

Function getContent (path As String) As Object
    content = {}
    content.period = 0
    content.textOverlayIsVisible = False
    content.textOverlayHoldTime = 0
    content.contentList = []
    contentData = getPath (path)
    xml = CreateObject ("roXmlElement")
    If xml.Parse (contentData)
        content.period = getXml (xml, "period").ToInt ()
        content.textOverlayIsVisible = LCase (getXml (xml, "TextOverlayIsVisible")) = "true"
        content.textOverlayHoldTime = getXml (xml, "TextOverlayHoldTime").ToInt ()
        For Each item In xml.item
            content.contentList.Push ({
                Url:                getXml (item, "Url")
                TextOverlayBody:    getXml (item, "TextOverlayBody")
                TextOverlayUL:      ""
                TextOverlayUR:      ""
            })
        End For
    Else
        Print "Xml failed to parse"
    End If
    Return content
End Function

Function getXml (xml As Object, elementName As String) As String
    returnValue = ""
    elementList = xml.GetNamedElementsCI (elementName)
    If elementList.Count () > 0
        returnValue = elementList [0].GetText ()
    End If
    Return returnValue
End Function

Function getPath (path As String) As String
    data = ""
    http = "http"
    If LCase (Left (path, Len (http))) = http
        ut = CreateObject ("roUrlTransfer")
        ut.SetUrl (path)
        data = ut.GetToString ()
    Else
        data = ReadAsciiFile (path)
    End If
    Return data
End Function

Function displayUI (content As Object) As Void
    port = CreateObject ("roMessagePort")
    ui = CreateObject ("roSlideShow")
    ui.SetMessagePort (port)
    If content.textOverlayIsVisible
        ui.SetTextOverlayHoldTime (content.textOverlayHoldTime)
    End If
    ui.SetPeriod (content.period)
    ui.SetContentList (content.contentList)
    ui.Show ()
    While True
        msg = Wait (0, port)
        If Type (msg) = "roSlideShowEvent"
            If msg.IsScreenClosed ()
                Exit While
            Else If msg.IsRemoteKeyPressed ()
                key = msg.GetIndex ()
                If key = 0              ' Back Button '
                    ui.Close ()
                Else If key = 6         ' OK Button '
                    ui.Close ()
                EndIf
            EndIf   
        EndIf
    End While
End Function

It shouldn't be too hard to write a script on your server to read a folder and generate the Xml file from its contents.

keeganlanier · ‎12-11-2015

Thank you very much. Will test this out today. I will also look in to how I can make a script to generate the xml based on images in a folder.

belltown · ‎12-11-2015

"keeganlanier" wrote:
I will also look in to how I can make a script to generate the xml based on images in a folder.

If your server has php you can use the following script. Make sure you set up the $server and $folder variables correctly, then change your main.brs file so that it points to the php script on your server.

imglist.php


<?php
// Define your server name here
$server = 'http://localhost';

// Define the path to your image folder here, relative to your server's document root
$folder = '/blahblah/blah';

// Get the path to your server's document root
$documentRoot = $_SERVER ['DOCUMENT_ROOT'];

// Get a list of all file names in your image folder
$fileArray = scandir ($documentRoot.$folder);

$xml = new XMLWriter();  
$xml->openURI('php://output');  
$xml->startDocument('1.0','UTF-8');  
$xml->setIndent(true);          // For testing  
$xml->startElement('root');  
    $xml->writeElement('Period', '10');  
    $xml->writeElement('TextOverlayIsVisible', 'True');  
    $xml->writeElement('TextOverlayHoldTime', '2000');  
    foreach ($fileArray as $fileName) {
        $ext = pathinfo($fileName, PATHINFO_EXTENSION);
        // Only handle image files
        if ($ext === 'jpg' || $ext === 'jpeg' || $ext ==='png' || $ext === 'gif') {
            $xml->startElement('item');
                $xml->writeElement('TextOverlayBody', $fileName);
                $xml->writeElement('Url', "$server$folder/$fileName");
            $xml->endElement();
        }
    }
$xml->endElement();  
$xml->endDocument();   
$xml->flush();
?>

RIDGELINETV · ‎01-11-2016

Hey Belltown, thanks for this code, it works GREAT!!

I wondering if there's any way to reload the XML file periodically so that new items in the XML would show up?? I realize this will happen if I exit the channel and re-enter it, but it would be nice to have a solution that would run automatically.

Thanks!!

calengineer · ‎12-12-2016

Hi guys,

Great advise and tutorial. I have a similar issue. However my need is different.

The restaurant owner has several TVs, and I need to create a channel with several options within. Theoretically, each option will select a different slideshow (from web server folders) remotely. Also, some options might have a non ending video playing looping.

I need the options to be in a grid style. Is this possible, any advice.

belltown · ‎12-12-2016

"calengineer" wrote:
Is this possible, any advice.

Yes, it's certainly possible. My advice would be to start learning how to develop Roku channels.

calengineer · ‎12-12-2016

"belltown" wrote:
"calengineer" wrote:
Is this possible, any advice.

Yes, it's certainly possible. My advice would be to start learning how to develop Roku channels.

Hi, I got everything ready but I'm having difficulties with the .brs file. Any suggestions on how to set it up correctly?

Roku Community

Roku Developer Program

Building Slideshow Channel

Re: Building Slideshow Channel

Re: Building Slideshow Channel

Re: Building Slideshow Channel

Re: Building Slideshow Channel

Re: Building Slideshow Channel

Re: Building Slideshow Channel

Re: Building Slideshow Channel