seekTo() is not a function YouTube iframe API error

Question

I am using a Wordpress plugin to add timestamp links of videos that will seek the video automatically to a certain timeframe.

Javascript:

        function onYouTubeIframeAPIReady(){

    console.log('Confirmation of call to onYouTubeIframeAPIReady()');

    var STT = {
        settings: STTSettings,
        media: undefined,
        skipTo: undefined,
        isHTML5: false,
        isYoutube: true,

        doHTML5Skip: function() {
            STT.media.removeEventListener('canplaythrough', STT.doHTML5Skip);
            STT.media.currentTime = STT.skipTo;
            STT.media.play();
        },

        doYoutubeSkip: function() {

            STT.media.seekTo(STT.skipTo);
            STT.media.playVideo();
        }

    };




    STTSkipTo = function(time) {
        var audio       = document.getElementsByTagName('audio'),
            video       = document.getElementsByTagName('video'),
            iframe      = document.getElementsByTagName('iframe'),
            timeArray   = time.split(':').reverse(),
            seconds     = parseInt(timeArray[0]),
            minutes     = timeArray.length > 1 ? parseInt(timeArray[1]) : 0,
            hours       = timeArray.length > 2 ? parseInt(timeArray[2]) : 0;

        STT.skipTo = seconds + (minutes * 60) + (hours * 3600);

        if (STT.media) {
            console.log(STT.media.seekTo);
            STT.doSkip();

            return;
        }

        if ((parseInt(STT.settings.link_audio) && audio.length) ||
            (parseInt(STT.settings.link_video) && video.length))
        {
            STT.doSkip = STT.doHTML5Skip;

            if (parseInt(STT.settings.link_audio) && audio.length) {
                STT.media = audio[0];
            } else {
                STT.media = video[0];
            }

            STT.media.addEventListener('canplaythrough', STT.doHTML5Skip);
            STT.media.load();
            STT.media.play();
            return;
        } else if (parseInt(STT.settings.link_youtube && iframe.length)) {
            // Inspect the iframes, looking for a src with youtube in the URI
            for (var i = 0; i < iframe.length; i++) {
                if (iframe[i].src.search('youtube') !== -1) {
                    // Set up the JS interface
                    STT.doSkip = STT.doYoutubeSkip;

                    iframe[0].id = 'stt-youtube-player';
                    STT.media = new YT.Player('stt-youtube-player', {
                        events: {
                            onReady: STT.doYoutubeSkip
                        }
                    });
                    return;
                }
            }
        }

        console.log('Skip to Timestamp: No media player found!');
        return;
    }

    }

On my localhost, the plugin works seamlessly but on my hosted website, I get the following error with the stack as follows:

Uncaught TypeError: STT.media.seekTo is not a function

I think for some reason the website is unable to load the www-widgetapi.js which is a dependency for YouTube iframe API and thus is unable to generate the required function definition. However, I did try to include the script manually in the header but it still didn't work.

If anyone knows of any other wordpress plugin, please advice.

Answer 1

Based from this documentation, you need to set both the two parameter of the player.seekTo(seconds:Number, allowSeekAhead:Boolean).

Seeks to a specified time in the video. If the player is paused when the function is called, it will remain paused. If the function is called from another state (playing, video cued, etc.), the player will play the video.

• The seconds parameter identifies the time to which the player should advance.

  The player will advance to the closest keyframe before that time unless the player has already downloaded the portion of the video to which the user is seeking.

• The allowSeekAhead parameter determines whether the player will make a new request to the server if the seconds parameter specifies a time outside of the currently buffered video data.

It should be like: Player.seekTo(120, true)//120 seconds