/* -------------------------------------------------------------------------
    LAZY => CARGA DE IMAGENES
------------------------------------------------------------------------- */
window.lazySizesConfig = {
    addClasses: true
};

$(function() {
    'use strict';

    /* -------------------------------------------------------------------------
        TIME WORD
      ------------------------------------------------------------------------- */
    setInterval(function(){
        $('#divUTCContinental').text(moment.tz('America/Guayaquil').format('HH:mm:ss'));
        $('#divUTCInsular').text(moment.tz('Pacific/Galapagos').format('HH:mm:ss'));
    },1000);

    /* -------------------------------------------------------------------------
        FIRST AND LAST WORD
      ------------------------------------------------------------------------- */  
    $(".firstWord").html(function(){
        var text = $(this).text().trim().split(" ");
        var first = text.shift();
        return (text.length > 0 ? "<span class='bold'>"+ first + "</span> " : first) + text.join(" ");
    });

    $(".lastWord").html(function(){
        var text = $(this).text().trim().split(" ");
        var last = text.pop();
        return text.join(" ") + (text.length > 0 ? " <span class='bold'>" + last + "</span>" : last);
    });

    $(".spanWord").html(function(){
        var text = $(this).text().trim().split(" ");
        var length = text.length;
        var cut = parseInt(length / 2);
        var last = text.splice(cut);
        return text.join(" ") + (text.length > 0 ? "<span class='bold'> " + last.join(" ") + "</span>" : last.join(" "));
    });

    $(".spanWordReverse").html(function(){
        var text = $(this).text().trim().split(" ");
        var length = text.length;
        var cut = parseInt(length / 2);
        var last = text.splice(cut);
        return text.join(" ") + (text.length > 0 ? "<span class='normal'> " + last.join(" ") + "</span>" : last.join(" "));
    });

    $(".qatar-match h3").html(function(){
        var text = $(this).text().trim().split(" ");
        var length = text.length;
        var cut = parseInt(length / 2);
        var last = text.splice(cut);
        return text.join(" ") + (text.length > 0 ? "<span class='normal'> " + last.join(" ") + "</span>" : last.join(" "));
    });

    /* -------------------------------------------------------------------------
        POPUP'S
      ------------------------------------------------------------------------- */
    // Image
    $('.image-popup').magnificPopup({
        type: 'image',
        mainClass: 'mfp-with-zoom',
        preloader: false,
        closeOnContentClick: true,
        image: { verticalFit: true },
        disableOn: function() {
            if ($(window).width() < 600) return false;
            return true;
        }
    });
    // Video
    $('.popup-youtube, .popup-gmaps').magnificPopup({
        type: 'iframe',
        mainClass: 'mfp-fade',
        preloader: false,
        removalDelay: 160,
        fixedContentPos: false,
        disableOn: function() {
            if ($(window).width() < 600) return false;
            return true;
        }
    });
    // Galeria
    $('.popup-modal').magnificPopup({
        type: 'inline',
        mainClass: 'mfp-fade',
        preloader: false
    });   

    /* -------------------------------------------------------------------------
        ÚLTIMA HORA
    ------------------------------------------------------------------------- */
    var domain = location.protocol + "//" + location.host;
    var jsFolder =  domain + "/templates/cronos/images/";
    $("#amazingcarousel-ultimahora").amazingcarousel({
        jsfolder: jsFolder,
        height:50,
        interval: 3000,
        random: false,
        direction: "vertical",
        arrowheight: 24,
        arrowwidth: 24,
        skin: "List",
        responsive: true,        
        navstyle: "bullets",
        enabletouchswipe: false,
        arrowstyle: "always",
        transitionduration: 1000,
        showitembottomshadow: false,
        transitioneasing: "easeOutExpo",
        circular: true,       
        //arrowimage:"arrows-28-28-0.png",
        showbottomshadow: false,
        screenquery: {
            mobile: {
                screenwidth: 500,
                visibleitems: 3
            },
            tablet: {
                screenwidth: 900,
                visibleitems: 3
            }
        },        
        navimage: "bullet-12-12-1.png",
        spacing: 8,
        scrollitems: 1,
        scrollmode: "page",
        navdirection: "horizontal",
        pauseonmouseover: true,
        navmode: "page",
        arrowhideonmouseleave: 1000,
        navwidth: 12,
        navspacing: 4,
        //visibleitems: 4,
        visibleitems: 8,
        navswitchonmouseover: false,
        autoplay: false,
        loop: false,
        navheight: 12
    });

    /* -------------------------------------------------------------------------
        OPINIÓN
    ------------------------------------------------------------------------- */
    var domain = location.protocol + "//" + location.host;
    var jsFolder =  domain + "/templates/cronos/images/";
    $("#amazingcarousel-opinion").amazingcarousel({
        jsfolder: jsFolder,
        interval: 3000,
        random: false,
        direction: "horizontal",
        skin: "List",
        responsive: true,
        navstyle: "bullets",
        enabletouchswipe: false,
        arrowstyle: "always",
        transitionduration: 1000,
        showitembottomshadow: false,
        transitioneasing: "easeOutExpo",
        circular: true,
        arrowwidth:64,
        arrowheight:64,
        //arrowimage: "arrows-72-72-0.png",
        showbottomshadow: false,
        screenquery: {
            mobile: {
                screenwidth: 600,
                visibleitems: 1
            }
        },
        navimage: "bullet.png",
        spacing: 8,
        scrollitems: 1,
        scrollmode: "page",
        navdirection: "horizontal",
        pauseonmouseover: true,
        navmode: "page",
        arrowhideonmouseleave: 1000,
        navwidth: 12,
        navspacing: 4,
        visibleitems: 4,
        navswitchonmouseover: false,
        autoplay: false,
        loop: false,
        navheight: 4
    });


    if ( $(".streaming-tv").length > 0 ) {
        

        /*const player = Stream(document.getElementById('stream-player'));
        player.addEventListener('play', () => {
            console.log('playing!');
        });
        player.play().catch(() => {
            console.log('playback failed, muting to try again');
            player.muted = true;
            player.play();
        });*/



        $('.streaming-tv img').on('click', function(e) {
            //console.log('click tv');
            e.preventDefault();

            let div = $(this).parent().parent();
            let width = $(".streaming-tv").width();//console.log(width);
            let height = width*0.5625;//console.log(height);

            //div.html('<div class="online-streaming now-streaming"><div style="padding:56.25% 0 0 0;position:relative;"><iframe src="https://vimeo.com/event/2508013/embed" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen style="position:absolute;top:0;left:0;width:100%;height:100%;"></iframe></div></div>');

            div.html('<div class="online-streaming now-streaming"><div style="position: relative; padding-top: 56.25%;"><iframe src="https://www.eltelegrafo.com.ec/medios/stream.php" style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%;" allow="accelerometer; gyroscope; autoplay; encrypted-media; picture-in-picture;" allowfullscreen="true" id="stream-player"></iframe></div></div>');

            const player = Stream(document.getElementById('stream-player'));
            player.addEventListener('play', () => {
                console.log('playing!');
            });
            player.play().catch(() => {
                console.log('playback failed, muting to try again');
                player.muted = true;
                player.play();
            });
            /*
            div.html('<div class="online-streaming now-streaming"><div id="aRzklaXf">Cargando el reproductor...</div></div>');

            jwplayer.key = "cLGMn8T20tGvW+0eXPhq4NNmLB57TrscPjd1IyJF84o=";
            var playerInstance = jwplayer("aRzklaXf");
            playerInstance.setup({
                "aspectratio": "16:9",
                "autostart": "viewable",
                "controls": true,
                "displaydescription": false,
                "displaytitle": false,
                "generateSEOMetadata": true,
                "height": height,
                "mute": true,
                "ph": 3,
                "pid": "P7bXj9tL",
                "playbackRateControls": false,
                "file": "https://streaming.ecuadortv.ec/hls/tv_nacional.m3u8",
                "preload": "metadata",
                "repeat": false,
                "stretching": "uniform",
                "visualplaylist": true,
                "width":"100%"
            });
            playerInstance.play();
            */

            //div.html('<div class="online-streaming now-streaming"><video id="video"></video></div>');

            //document.addEventListener("DOMContentLoaded", () => {
                /*const video = document.getElementById('video');
                const source = 'https://streaming.ecuadortv.ec/hls/key-0a1dbc53-65b9-4207-a796-2ad2afff4666lfuQfxKbLr.m3u8';
                const defaultOptions = {};
                if (Hls.isSupported()) {
                    const hls = new Hls();
                    hls.loadSource(source);
                    hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
                        const availableQualities = hls.levels.map((l) => l.height)
                        availableQualities.unshift(0)
                        defaultOptions.quality = {
                            default: 0,
                            options: availableQualities,
                            forced: true,        
                            onChange: (e) => updateQuality(e),
                        }
                        defaultOptions.i18n = {
                            qualityLabel: {
                                0: 'Auto',
                            },
                        }
                        hls.on(Hls.Events.LEVEL_SWITCHED, function (event, data) {
                            const span = document.querySelector(".plyr__menu__container [data-plyr='quality'][value='0'] span")
                            if (hls.autoLevelEnabled) {
                                span.innerHTML = `AUTO (${hls.levels[data.level].height}p)`
                            } else {
                                span.innerHTML = `AUTO`
                            }
                        })
                        const player = new Plyr(video, defaultOptions);
                    });
                    hls.attachMedia(video);
                    window.hls = hls;
                } else {
                    video.src = source;
                    const player = new Plyr(video, defaultOptions);
                }
                function updateQuality(newQuality) {
                    if (newQuality === 0) {
                        window.hls.currentLevel = -1;
                    } else {
                        window.hls.levels.forEach((level, levelIndex) => {
                            if (level.height === newQuality) {
                                console.log("Found quality match with " + newQuality);
                                window.hls.currentLevel = levelIndex;
                            }
                        });
                    }
                }*/
            //});
        });
    }

    //let h = $('.simano-principal .col-12.col-md-3').height();
    //console.log(h);

    /* -------------------------------------------------------------------------
        OPINIÓN
    ------------------------------------------------------------------------- */
    var $myDiv = $('.block-time-a');
    //console.log($myDiv.length);

    const months = ['enero', 'febrero', 'marzo', 'abril', 'mayo', 'junio', 'julio', 'agosto', 'septiembre', 'octubre', 'noviembre', 'diciembre'];

    if ( $myDiv.length > 0) {
        let date = new Date();
        let output = String(date.getDate()).padStart(2, '0') + ' de ' + months[date.getMonth()] + ' de ' + date.getFullYear();
        //console.log("fecha: " + output);

        //$myDiv.html('Ecuador, <?php //echo JHtml::date('now', $dateFormat, true);?>');
        $myDiv.html('<b>Ecuador</b>, ' + output);
    }

    /* -------------------------------------------------------------------------
        CREDITOS API
    ------------------------------------------------------------------------- */
    var $myImageCredits = $('.itemImageCredits');
    
    if ( $myImageCredits.length > 0) {
            if($myImageCredits.text().toLowerCase() == "foto: api") {
                $myImageCredits.html($myImageCredits.text() + " (Este contenido visual es de propiedad de API.)");
            }
    }

    /* -------------------------------------------------------------------------
        CHECK ARTICLE VISITS
      ------------------------------------------------------------------------- */
    if ($(".sppb-addon-k2 ").length > 0) {
        var token = new Date().getTime();
        var domain = location.protocol + "//" + location.host;
        $.post(domain + '/includes/iv.php?t=' + token, {
            y29tX2sy: 'y29tX2sy',
            aXRlbq22: 'aXRlbq22',
            bZRkbq9w: $('#startOfPage').data('id')
        }, function(data, status) {
            //$('#itemHits').html(data);
            console.log('data: ' + data);
        },
        'text');
    }

    /* -------------------------------------------------------------------------
        ONLINE STREAMING
      ------------------------------------------------------------------------- */    
    var $myOnLine = $('.streaming-tv img');
    if ( $myOnLine.length > 0) {
        console.log($myOnLine);
        $myOnLine.before('<div class="online">En Línea</div>');
    }
});