Roku Developer Program

[armagedon79]

I am working on customvideoplayer example that comes with ROKU sdk examples. I want to add scroll functionality in the list of text and limit quantity view text. example.. on front view 5 text with list 20 text.
Any suggestions about how I can create those scroll to perform required functionality , would be really appreciated.

Here is the code I am using:

Sub RunUserInterface()

    o = Setup()
    o.setup()
    o.paint()
    o.eventloop()
    

        
End Sub

Sub Setup() As Object
    this = {
        port:      CreateObject("roMessagePort")
        progress:  0 'buffering progress
        position:  0 'playback position (in seconds)
        paused:    false 'is the video currently paused?
        fonts: CreateObject("roFontRegistry") 'global font registry
        feedData:  invalid
        playing:   0
        playingPrev: 0
        playlistSize: 0
        canvas:    CreateObject("roImageCanvas") 'user interface
        player:    CreateObject("roVideoPlayer")
        load:      LoadFeed
        setup:     SetupFullscreenCanvas
        paint:     PaintFullscreenCanvas
        create_playlist_text: CreatePlaylistText
		drawtext:  true
        eventloop: EventLoop
         
  
   ' Do lots of initialization stuff
   
   ' Display the main UI roScreen
    }


    this.targetRect = this.canvas.GetCanvasRect()
    this.textRect = {x: 520, y: 480, w: 300, h:200} 

    this.load()
    
    'Resolution-specific settings:
    mode = CreateObject("roDeviceInfo").GetDisplayMode()
    if mode = "720p"
        this.layout = {
            full:   this.canvas.GetCanvasRect()
            top:    { x:   0, y:   0, w:1280, h: 130 }
            left:   { x: 249, y: 177, w: 391, h: 291 }
            right:  { x: 700, y: 177, w: 350, h: 291 }
            bottom: { x: 249, y: 500, w: 780, h: 300 }
        }
        this.background = "pkg:/images/back-hd.jpg"
        this.headerfont = this.fonts.get("lmroman10 caps", 50, 50, false)
    else
        this.layout = {
            full:   this.canvas.GetCanvasRect()
            top:    { x:   0, y:   0, w: 720, h:  80 }
            left:   { x: 100, y: 100, w: 280, h: 210 }
            right:  { x: 400, y: 100, w: 220, h: 210 }
            bottom: { x: 100, y: 340, w: 520, h: 140 }
        }
        this.background = "pkg:/images/back-sd.jpg"
        this.headerfont = this.fonts.get("lmroman10 caps", 30, 50, false)
    end if
    
    
    
    
    'Static help text:
    this.help = "Press the right or left arrow buttons on the remote control "
    this.help = this.help + "to seek forward or back through the video at "
    this.help = this.help + "approximately one minute intervals.  Press down "
    this.help = this.help + "to toggle fullscreen."
    
    'Register available fonts:
    this.fonts.Register("pkg:/fonts/caps.otf")
    this.textcolor = "#406040"
    Print "font"
    print this.fonts.getfamilies()
    
    'Setup image canvas:
    this.canvas.SetMessagePort(this.port)
    this.canvas.SetLayer(0, { Color: "#000000" })
    this.canvas.Show()

    this.player.SetMessagePort(this.port)
    this.player.SetLoop(true)
    this.player.SetPositionNotificationPeriod(1)
    this.player.SetDestinationRect(this.targetRect)
    
    this.player.Play()
    this.playingPrev = this.playing

    return this
End Sub

Sub EventLoop()
    while true
        msg = wait(0, m.port)
        if msg <> invalid
            if msg.isStatusMessage() and msg.GetMessage() = "startup progress"
                m.paused = false
                print "Raw progress: " + stri(msg.GetIndex())
                progress% = msg.GetIndex() / 10
                if m.progress <> progress%
                    m.progress = progress%
                    m.paint()
                end if

            'Playback progress (in seconds):
            else if msg.isPlaybackPosition()
                m.position = msg.GetIndex()
                print "Playback position: " + stri(m.position)

            else if msg.isRemoteKeyPressed()
                index = msg.GetIndex()
                print "Remote button pressed: " + index.tostr()
                if index = 4  '<LEFT>
                    m.playing = m.playing - 1
                    if (m.playing < 0)
                        m.playing = 2
                    endif
                    m.player.SetNext(m.playing)
                    m.player.Play()
                    m.playingPrev = m.playing
                else if index = 8 '<REV>
                    m.position = m.position - 60
                    m.player.Seek(m.position * 1000)                
                else if index = 5 '<RIGHT>
                    m.playing = m.playing + 1
                    if (m.playing > 2)
                        m.playing = 0
                    endif
                    m.player.SetNext(m.playing)                    
                    m.player.Play()
                    m.playingPrev = m.playing                    
                else if index = 9 '<REV>
                    m.position = m.position + 60
                    m.player.Seek(m.position * 1000)
                else if index = 2 '<Up>
                    if m.drawtext
                        m.playing = m.playing - 1
                        if (m.playing < 0)
                            m.playing = m.playlistSize-1
                        endif
                        m.paint()
                    endif                
                else if index = 3 '<Down>
                    if m.drawtext
                        m.playing = m.playing + 1
                        if (m.playing > m.playlistSize-1)
                            m.playing = 0
                        endif
                        m.paint()
                    endif                
                else if index = 13  '<PAUSE/PLAY>
                    if m.paused m.player.Resume() else m.player.Pause()
				else if index = 6 'OK
					if m.drawtext
					   m.drawtext = false					
					   if m.playing <> m.playingPrev
                            m.player.SetNext(m.playing)						
						  m.player.Play()
						  m.playingPrev = m.playing
					   endif
					else
						m.drawtext = true
					endif
					m.paint()
                end if

            else if msg.isPaused()
                m.paused = true
                m.paint()

            else if msg.isResumed()
                m.paused = false
                m.paint()

            end if
        endif
    end while
End Sub

Sub SetupFullscreenCanvas()


    m.canvas.AllowUpdates(false)
    m.paint()
    m.canvas.AllowUpdates(true)
End Sub

Sub PaintFullscreenCanvas()
    splash = []
    list = []
    
    
    
color = "#00000000" ' fully transparent
    if m.progress < 100 then
        color = "#00a0a0a0"
        screen = m.canvas.GetCanvasRect()
        topBar% = (screen.h - 12) / 2
        leftBar% = (screen.w - 532) / 2
        progress_bar = {
            TargetRect: { x: leftBar%, y: topBar%, w: 532, h: 12 },
            url: "pkg:/images/loading_bar.png"
        }

        padding% = 20

        topLogo% = topBar% - (79 + padding%)
        leftLogo% = (screen.w - 81) / 2
        list.Push({
            TargetRect: { x: leftLogo%, y: topLogo%, w: 81, h: 79 },
            url: "pkg:/images/loading_logo.png"
        })

        topText% = topBar% + (12 + padding%)
        leftText% = (screen.w - 300) / 2
        list.Push({
            Text: "Loading..."
            TextAttrs: { font: "large", color: "#707070" }
            TargetRect: { x: leftText%, y: topText%, w: 300, h: 100 }
        })
        if m.progress > 0 and m.progress <= 13 then
            progress_bar.url = "pkg:/images/loading_bar_1.png"
        else if m.progress > 13 and m.progress <= 25 then
            progress_bar.url = "pkg:/images/loading_bar_2.png"
        else if m.progress > 25 and m.progress <= 38 then
            progress_bar.url = "pkg:/images/loading_bar_3.png"
        else if m.progress > 38 and m.progress <= 50 then
            progress_bar.url = "pkg:/images/loading_bar_4.png"
        else if m.progress > 50 and m.progress <= 63 then
            progress_bar.url = "pkg:/images/loading_bar_5.png"
        else if m.progress > 63 and m.progress <= 75 then
            progress_bar.url = "pkg:/images/loading_bar_6.png"
        else if m.progress > 75 and m.progress <= 88 then
            progress_bar.url = "pkg:/images/loading_bar_7.png"
        else
            progress_bar.url = "pkg:/images/loading_bar_8.png"
        end if
        list.Push(progress_bar)
    else if m.status = "paused" then
        print "Painting the paused text"
        color = "#80000000" ' semi-transparent black
        list.push({
            Text: "Paused"
            TextAttrs: { font: "huge" }
            TargetRect: m.canvas.GetCanvasRect()
        })
    end if

	if m.drawtext
      textArr = m.create_playlist_text()
      yTxt = 40
      color = "#00000000"
      index = 0
      for each str in textArr
          if index = m.playing
            textColor = "#3399FF"
            else
            textColor = "#dddddd"
          endif
          list.Push({
             Text: str
             TextAttrs: {color: textColor, Font:"small", HAlign:"left", VAlign:"top", Direction:"LeftToRight"}
             TargetRect: {x:100, y:yTxt, w: 300, h: 250}
             
             
          })



          yTxt = yTxt + 20
          index = index + 1
      end for
   else
      color = "#00000000"
      list.Push({
         Text: ""
         TextAttrs: {font: "medium"}
         TargetRect: {x:900, y:600, w: 300, h: 100}
        
           
        
      })
      
      
   endif
   

    'Clear previous contents
    m.canvas.ClearLayer(0)
    m.canvas.ClearLayer(1)
    m.canvas.ClearLayer(2)    
    m.canvas.SetLayer(0, { Color: color, CompositionMode: "Source" })
    if (splash.Count() > 0)
        m.canvas.SetLayer(1, splash)
        m.canvas.SetLayer(2, list)
    else
        m.canvas.SetLayer(1, list)
    endif
    list.Clear()
    splash.Clear()
    
    End Sub
    
    
    
    
       
    

Function LoadFeed() as void
    jsonAsString = ReadAsciiFile("pkg:/json/feed.json")
    m.feedData = ParseJSON(jsonAsString)
    m.playlistSize = m.feedData.Videos.Count()
    contentList = []
    for each video in m.feedData.Videos
        contentList.Push({
            Stream: { url: video.url }
            StreamFormat: "hls"
        })
    end for    
    m.player.SetContentList(contentList)    
End Function

Function CreatePlaylistText() as object
    textArr = []
    for each video in m.feedData.Videos
        textArr.Push(video.title)
    end for
    return textArr
End Function

[armagedon79]

to reference where look in , PaintFullscreenCanvas or eventloop.