0

How to best view a list of videos in Hybrid App?

I have a json data which contains the details I need in viewing the video.

   [
      {
        "video_id":"1",
        "video_youtube_title":"Title 1",
        "video_youtube_description":"Description1",
        "video_youtube_thumbnail":"https:\/\/i.ytimg.com\/vi\/kPDnw3_1GOI/hqdefault.jpg",
        "video_youtube_date_published":"2016-03-07 15:00:00",
        "video_youtube_duration":"PT1M16S",
        "video_youtube_link":"kPDnw3_1GOI",
        "video_fb_link":"example\/posts\/1666877406894939",
        "video_date_added":"2016-03-09 07:00:00"
    }
        ,

        {
        "video_id":"2",
        "video_youtube_title":"Title 2",
        "video_youtube_description":"Description2",
        "video_youtube_thumbnail":"https:\/\/i.ytimg.com\/vi\/kPDnw3_1GOI/hqdefault.jpg",
        "video_youtube_date_published":"2016-03-08 16:00:00",
        "video_youtube_duration":"PT1M16S",
        "video_youtube_link":"kPDnw3_1GOI",
        "video_fb_link":"example\/posts\/1666877406894939",
        "video_date_added":"2016-03-09 06:00:00"
    },
     { more videos here...}
]

So using the youtube link I show and play the video(newly added) like this:

<iframe width="100%" height="200" src="https://www.youtube.com/embed/kPDnw3_1GOI" frameborder="0" allowfullscreen></iframe>

Below this is a comment box from fb comment plugin.

Now, I am stuck on how to view all other videos in thumbnails below the newly added video and when clicked it will display it on top and able to play. Just like youtube website.

Can someone give me an idea on how to best implement this? or how it supposed to be done?

c.k
  • 1,075
  • 1
  • 18
  • 35
  • see https://stackoverflow.com/questions/2068344/how-do-i-get-a-youtube-video-thumbnail-from-the-youtube-api?rq=1 to get the thumbnails. – Offbeatmammal Jul 26 '16 at 14:10
  • @Offbeatmammal I already have thumbnails link. – c.k Jul 27 '16 at 00:24
  • so you want to know how to replace the primary video with the new video URL when the thumbnail is clicked? Easiest way would be to change the source for the iframe with the relevant youTube link – Offbeatmammal Jul 27 '16 at 00:34
  • @Offbeatmammal, Yes. I am having hard time. Especially it is my first time to develop hybrid app. Do you have any reference so that I could follow? – c.k Jul 27 '16 at 00:59

0 Answers0