calraijintaiko/caltaiko

View on GitHub
app/assets/javascripts/youtube_videos.js

Summary

Maintainability
A
0 mins
Test Coverage
"use strict";
$(document).on('turbolinks:load', function() {
    $(".youtube").each(function() {
        var id = $(this).data('id');

        // Based on the YouTube ID, we can easily find the thumbnail image
        $(this).css('background-image', 'url(http://i.ytimg.com/vi/' + id + '/sddefault.jpg)');

        // Overlay the Play icon to make it look like a video player
        $(this).append($('<div/>', {'class': 'play'}));

        $(document).delegate('#'+this.id, 'click', function() {
            // Create an iFrame with autoplay set to true
            var iframe_url = "https://www.youtube.com/embed/" + id + "?autoplay=1&autohide=1";
            if ($(this).data('params')) {
                iframe_url += '&' + $(this).data('params');
            }

            // The height and width of the iFrame should be the same as parent
            var iframe = $('<iframe/>', {'frameborder': '0', 'src': iframe_url, 'width': $(this).width(), 'height': $(this).height() });

            // Replace the YouTube thumbnail with YouTube HTML5 Player
            $(this).replaceWith(iframe);
        });
    });
 });