CODEWITHSUNDEEP
javascriptvideoyoutube
Abhinav Yashkar
Abhinav Yashkar

Reputation: 21

Play Youtube video in Basic HTML player with user control

I have a bunch of youtube urls which i would like to play. I want like to play only the audio content in a basic HTML player with user controls like Play, pause, next. I am unable to add user control functionality(Nor able to play the videos in a HTML player, i am embedding the youtube video), thus the user has to click on the play button of the next video every time a video is completed. Any help will be appreciated.

Upvotes: 2

Views: 547

Answers (2)

mido
mido

Reputation: 25054

this should get you started:

// change this list to whatever you want
    var urls = ['http://upload.wikimedia.org/wikipedia/en/f/f9/Beatles_eleanor_rigby.ogg',
                'http://upload.wikimedia.org/wikipedia/commons/5/5b/Ludwig_van_Beethoven_-_Symphonie_5_c-moll_-_1._Allegro_con_brio.ogg'];
    var idx=0;
    var aud= document.getElementById('aud');
    aud.src=urls[idx];
    aud.addEventListener('ended', next); // for automatically starting the next.
    
    function play(){
        aud.play();
    }
    
    function pause(){
        aud.pause();
    }
    
    function next(){
        idx++;
        if(idx === urls.length) idx=0;
        aud.src = urls[idx];
        aud.play();
    }
            <audio id = 'aud'></audio>
    <button onclick="play();">play</button>
    <button onclick="pause();">pause</button>
    <button onclick="next();">next</button>

Upvotes: 0

Jonas Grumann
Jonas Grumann

Reputation: 10786

..continuing from the comments:

That's right you need to use js. I'll help you start: you can create an array with all your youtube urls:

var youtube_urls = ['https://www.youtube.com/watch?v=vpoi_l4jkyU', 'https://www.youtube.com/watch?v=Lml2SkB68ag', 'https://www.youtube.com/watch?v=awMiY-Ve1As'];

And then, using the api you listen for when a video is done playing and then start the next one:

Detect end video: How to detect when a youtube video finishes playing?

OR

Just create a playlist on youtube and embed the playlist. It'll loop through all the videos.

Upvotes: 0

Related Questions