CODEWITHSUNDEEP
jquerymediaelement.jssrc
Alan DeLonga
Alan DeLonga

Reputation: 484

MediaElement.js 2.15.1 setSrc does not work to switch youtube video

I recently started trying to upgrade libraries in a project I am working on. I was attempting to set up the medialelementplayer controls on the ipad for the fallback player we have. I got it set up with the version 2.9.1 that they were using, but the success callback function never triggered... so I decided to update the library.

After some headaches with the change in names and how the objects are instantiated I got the player up and running, and have added the ability to pause/play. But I cannot get the "setSrc" function to work... Even trying the workaround I had to use for 2.9.1 to work. I am at a loss, I need to be able to load different src's for the next/prev buttons as well as to set up looping through the channel.

I have been researching for a while and hacking away trying to get something to work but nothing seems to load, and there are no recent posts on this new version release. None of the demo files show the use of setSrc, only in adding the src to the video element in the html. Any help would be appreciated, below are the 2 code segments I tried

Old code from 2.9.1 

mediaElement.media.pluginApi.loadVideoById(deviceChannelIdList[currentDCVidIdx]);
mediaElement.media.load();
mediaElement.play();

New code for 2.15.1

MediaElement('player1', { 
 success: function(mediaElement) {  
  mediaElement.addEventListener('ended', function(e) {
   mediaElement.setSrc('http://www.youtube.com/watch?v='+deviceChannelIdList[currentDCVidIdx]);
   mediaElement.load();
   mediaElement.play();
  });
 }
});

The error I get in the console debugger is:

[Error] TypeError: undefined is not a function 
(evaluating 'this.pluginApi.setSrc(mejs.Utility.absolutizeUrl(a))')
    setSrc (mediaelement.min.js, line 34)

Upvotes: 0

Views: 1077

Answers (1)

Alan DeLonga
Alan DeLonga

Reputation: 484

I literally JUST posted this... then tried to pull out the "media" element from the chain I used for the 2.9.1 API and it just worked...

Here is the entirety of the mediaelement for reference of creating looping play/pause and next/prev with this current code base:

    MediaElement('player1', { 
    success: function(mediaElement) {   
        mediaElement.addEventListener('ended', function(e) {
            if(deviceChannelIdList.length < currentDCVidIdx + 1){
                currentDCVidIdx = 0;
            } else {
                currentDCVidIdx++;
            }
            mediaElement.pluginApi.loadVideoById(deviceChannelIdList[currentDCVidIdx]);
            mediaElement.load();
            mediaElement.play();
        }, false);

        $("#video_prev").click(function(){  
            if(currentDCVidIdx - 1 < 0){
                currentDCVidIdx = deviceChannelIdList.length;
            } else {
                currentDCVidIdx--;
            }
            if(!mediaElement.paused){ mediaElement.pause(); }
            mediaElement.pluginApi.loadVideoById(deviceChannelIdList[currentDCVidIdx]);
            mediaElement.load();
            mediaElement.play();
        });

        $("#video_play").click(function(){  
            if(mediaElement.paused){
                mediaElement.play();
            } else {
                mediaElement.pause();
            }
        });

        $("#video_next").click(function(){  
            if(deviceChannelIdList.length < currentDCVidIdx + 1){
                currentDCVidIdx = 0;
            } else {
                currentDCVidIdx++;
            }
            if(!mediaElement.paused){ mediaElement.pause(); }
            mediaElement.pluginApi.loadVideoById(deviceChannelIdList[currentDCVidIdx]);
            mediaElement.load();
            mediaElement.play();
        });

        // autoplay... ***DOES NOT WORK FOR IPAD ***
        //mediaElement.play();
        }
    });

Upvotes: 1

Related Questions