Roku Developer Program

Developers and content creators—a complete solution for growing an audience directly.
cancel
Showing results for 
Search instead for 
Did you mean: 
keeganlanier
Level 7

Building Slideshow Channel

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.
0 Kudos
7 Replies
belltown
Level 7

Re: Building Slideshow Channel

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.
https://github.com/belltown/
0 Kudos
keeganlanier
Level 7

Re: Building Slideshow Channel

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.
0 Kudos
belltown
Level 7

Re: Building Slideshow Channel

"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();
?>
https://github.com/belltown/
0 Kudos
RIDGELINETV
Level 7

Re: Building Slideshow Channel

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!!
0 Kudos
calengineer
Level 7

Re: Building Slideshow Channel

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.
0 Kudos
belltown
Level 7

Re: Building Slideshow Channel

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

Yes, it's certainly possible. My advice would be to start learning how to develop Roku channels.
https://github.com/belltown/
0 Kudos
calengineer
Level 7

Re: Building Slideshow Channel

"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?
0 Kudos