(function (global, doc) {

'use strict';

var videoHead = {
    options: {
        el: '.js-background-video'
    },
    init: function () {
        this.$element = doc.querySelector(this.options.el);

        if (!this.$element) {
            return false;
        }

        this.$elementVideoId = this.$element.getAttribute('data-video');
        this.$videoOverlay = doc.querySelector('.js-video-overlay');

        this.addListeners();
    },
    addListeners: function () {
        var $elementVideoId = this.$elementVideoId;
        var $videoOverlay = this.$videoOverlay;

        global.onYouTubeIframeAPIReady = function () {
            return new global.YT.Player('yt-player', {
                width: '1920',
                height: '1080',
                videoId: $elementVideoId,
                playerVars: {
                    autoplay: 1,
                    mute: 1,
                    autohide: 1,
                    modestbranding: 1,
                    rel: 0,
                    showinfo: 0,
                    controls: 0,
                    disablekb: 1,
                    enablejsapi: 1,
                    iv_load_policy: 3,
                    loop: 1,
                    playlist: $elementVideoId
                },
                events: {
                    'onReady': global.onPlayerReady,
                    'onStateChange': global.onPlayerStateChange
                }
            });
        };

        global.onPlayerReady = function (event) {
            event.target.playVideo();
        };

        global.onPlayerStateChange = function (event) {
            if (event.data === global.YT.PlayerState.PLAYING) {
                $videoOverlay.classList.add('video-head__overlay--fadeOut');
            }
        }
    }
};

var ready = function (fn) {
    if (document.readyState !== 'loading') {
        fn();
    } else {
        document.addEventListener('DOMContentLoaded', fn);
    }
};

ready(function () {
    videoHead.init();
});

}(window, document));