0

I'm trying to set up a web page that uses HTML5 Google TV Template 2 that can be found at https://developers.google.com/tv/web/docs/gtv-templates#template2. I'm at a lost though because the template randomizes the thumbnail ids (for some odd reason).

I have 11 videos and I want to tie each video to a specific thumbnail. Any suggestions?

At http://pastebin.com/L2U54DPZ is the "dataprovider.js" that powers the template. Any help is much appreciated. Thanks

Ace
  • 566
  • 6
  • 19

2 Answers2

1

On line 46 change: var num = getRandom(15); to var num = small;

On line 168 change: var videoInfo = sources[getRandom(sources.length)]; to var videoInfo = sources[j];

On line 170 change:

    thumb: 'images/thumbs/thumb' + getThumbId() + '.jpg',

to thumb: 'images/thumbs/thumb' + getThumbId(j) + '.jpg',

Les Vogel - Google DevRel
  • 7,092
  • 1
  • 25
  • 39
  • Unfortunately that didn't work. It ceased all thumbnails and videos from loading – Ace Jan 29 '12 at 04:16
  • If its not fixed now I'll ask someone to fix the code in library. – Les Vogel - Google DevRel Jan 31 '12 at 01:37
  • Thanks Les that worked. Justa quick note to others: you have to adjust line 167 if you have a different number of videos. Since I have 11 videos I changed it to for (var j=0; j<11; j++) – Ace Jan 31 '12 at 07:12
0

Keep in mind that the Google Examples are to illustrate functionality. I suspect that is where the random comes in. They are just generating some data for the example.

I changed dataprovider.js to be more understandable and to have more control.

Here is what the changed version looks like:

 var gtv = gtv || {
  jq: {}
};

/**
 * DataProvider class. Defines a provider for all data (Categories, Images & Videos) shown in the template.
 */
gtv.jq.DataProvider = function() {
};

/**
 * Returns all data shown in the template..
 * @return {object} with the following structure:
 *    - categories -> [category1, category2, ..., categoryN].
 *    - category -> {name, videos}.
 *    - videos -> {thumb, title, subtitle, description, sources}
 *    - sources -> [source1, source2, ..., sourceN]
 *    - source -> string with the url | {src, type, codecs}
 */
gtv.jq.DataProvider.prototype.getData = function() {
  var event_videos = [
    {
      sources: ['http://commondatastorage.googleapis.com/gtv_template_assets/IO2010-Keynote-day1.mp4'],
      title: '2010 Day 1 Keynote',
      thumb: 'images/thumbs/thumb01.jpg',
      description: ['With Vic Gundotra'],
      subtitle: 'Moscone Center'
    },
    {
      sources:['http://commondatastorage.googleapis.com/gtv_template_assets/IO2010-Keynote-day2-android.mp4'],
      title: '2010 Day 2 Keynote',
      thumb: 'images/thumbs/thumb02.jpg',
      description: ['Spider - what spider?'],
      subtitle: 'Moscone Center'
    }
];

 var buck_videos = [
    {
      sources:['http://bffmedia.com/trailer_400p.ogg'],
      title: 'Big Buck 400p Video Trailer',
      thumb: 'http://www.bffmedia.com/buck1.png',
      description: ['Common Creative Project Movie'],
      subtitle: 'Smaller Version'
    },
    {
      sources:['http://bffmedia.com/trailer_1080p.ogg'],
      title: 'Big Buck 1080p Video Trailer',
      thumb: 'http://www.bffmedia.com/buck2.png',
      description:['Common Creative Project Movie'],
      subtitle: 'Big Buck is a Rabbit'
    }
];



 var data = {
    categories: [
    {
      name: 'Dev Events',
      videos: event_videos
    },
    {
      name: 'Big Buck',
      videos: buck_videos
   }
   ]
 };
  return data;
};
Carmen Delessio
  • 61
  • 2