/* Copyright (C) 2014 Romo Fabrics */

$(function(){
    'use strict';

    function setVideoHeight() {
        const $video = $('iframe#video');
        $video.height( Math.round($video.width() * 0.5625) ); // 16:9

        // also set the position of the dialog on the screen
        $('.overlayDialog.video').css('top', (($(window).height() - $video.height()) / 3) + 'px' );
    }


    $('a[href="#video"]').click(function(event) {  // @todo [DS] Check this (Vimeo)
        event.preventDefault();

        const videoId = $(this).attr('data-videoId');
        const cfCode = $('[data-asset="videojs"]').attr('data-cf-code');
        const videoParams = 'autoplay=true'; // @see https://developers.cloudflare.com/stream/viewing-videos/using-the-stream-player/
        const videoUrl = `https://customer-${cfCode}.cloudflarestream.com/${videoId}/iframe${videoParams ? '?' + videoParams : ''}`;

        $(window).on( 'resize.video', setVideoHeight );

        const $html = $( '<iframe id="video" style="width:100%;height:100%;" ' +
            //'src="//player.vimeo.com/video/'+videoId+'?autoplay=1" ' +
            'frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen ></iframe>' );
        $html.attr('src', videoUrl);

        window.overlayDialog.open( $html, true, 'video', setVideoHeight );
    });

    $('body').on( 'dialogHide', function() {
        const $video = $('iframe#video');

        if( $video.length ) {
            $video.remove();
        }

        $(window).off( 'resize.video', setVideoHeight );
    });

    if( window.location.hash === '#video' ) {
        $('a[href="#video"]').click();
        window.moveTo(0,0);
    }

});