Challenge Overview
This application should be prototyped using AppleTV's TVML with a javascript backend. Here is the Apple TV markup Language Reference. Apple has provided us with a library of templates to use to build the UIs. Please use those templates and follow guidelines. We have referenced the templates we expect below. Please build the UIs for these screens, include the interactions, page transitions, etc. I have included a base project to work off. This project includes an xcode project container and a separate project for the markup. The iOS container is currently setup to reference to markup running on your localhost:8080. The markup package has a tvml template for the main catalogTemplate already and javascript files to manage running the application. The attached code packages are based off of the This TVML Tutorial - please use this as a starting point.
On all Lists of data in the specifications below, Please create a json file in a data folder in the markup package and use Javascript to call that json. You will need to build the json to match the requirements below (for example: A video should have a title, subtitle, description, date, duration, video link, image link). Create each list to show 20 records and create the json long enough to demo scrolling. Please also include "infinite scrolling" in all lists, meaning that if the user gets NEAR the bottom of the list, it will load another 20 results. Sort all lists by "most recent date first."
Please implement the example URLs and get them to play correctly in the application. The example for "Performances" already works. Please get the "Featured" and radio broadcast URLs to work in the application. (Webcams will come later).
Interlochen Apple TV Templates :
01 - loadingTemplate
-- title : Loading Content
02 - catalogTemplate
First screen user sees after the app loads
Left Side:
-- list item names:
---- Featured (example: https://livestream.com/accounts/11307406/events/3805293/player?width=560&height=315&autoPlay=true&mute=false)
---- Performances (example: https://player.vimeo.com/external/135871105.hd.mp4?s=04f3bcc100d2bcf485d3a72369d614e3a7fbe6f2)
---- Radio Broadcasts (examples: )
-
WIAA IPR Classical Radio - http://pubint.ic.llnwd.net/stream/pubint_wiaa
-
WICA IPR News Radio - http://pubint.ic.llnwd.net/stream/pubint_wica
---- Web Cams (example: https://player.vimeo.com/external/135871105.hd.mp4?s=04f3bcc100d2bcf485d3a72369d614e3a7fbe6f2)
-- Selecting a list item name populates the Related Content area with videos or audio content
Right Side:
-- each item in Related Content will show:
---- Screenshot
---- Title
---- Date in this format: May 22, 2015
-- Selecting a screenshot displays compilationTemplate
03 - compilationTemplate
displayed when user selects content on catalogTemplate
Left Side:
-- Header displays Title of content
-- Subtitle displays list item name from compilationTemplate, e.g. Featured
-- display row of text showing content date
----- date is displayed in this format: May 22, 2015 (include the time for Featured content that is in the future)
-- Duration: (30 min.)
-- Description displays content description
-- Display a Section of the content’s list items showing Title and playing time
Right Side:
-- Screenshot
-- selecting the Screenshot plays the content
04 - alertTemplate
displayed when user selects content that is not yet available
-- Title: Live Webcast Not Yet Available
-- Description : This webcast will be available on December 24, 2015
-- Button : OK
Final Submission Guidelines
- Please adhere to the coding standards outlined in the Apple TV markup Language Reference.
- Use AppleTV templates for all UIs
- Use the javascript modules included in the package (explained in This TVML Tutorial).