$(document).ready(function(){

    // Overlay op homepage sluiten
    $('.closeOverlay').click(function(e){
        e.preventDefault();
        hideOverlay();
    });

    $('#slider .overlay').click(function(e){

        // de overlay alleen sluiten als je op de overlay klikt of de closeoverlay button (en dus niet als je op de video player klikt)
        if($(e.target).hasClass('overlay') || $(e.target).hasClass('closeOverlayImg')){
            hideOverlay();
        }

    });


    // Bij het eerste bezoek: video tonen en cookie zetten, zodat bij het volgende bezoek de video niet meer getoond wordt
    if($.cookie("firstvisit") != "false"){
        // cookie zetten
        $.cookie("firstvisit", "false", { path: '/', expires: 365 });

        // Video overlay tonen
        $('#slider .overlay').show();

        // Video starten
        jwplayer().play();
    } else {
        // de player expleciet verwijderen, anders gaat hij in ie alsnog afspelen zodra de overlay geopend wordt
        //hideOverlay();
    }

    // overlay tijdelijk altijd tonen
    //$('#slider .overlay').show();

    // Filter omhoog en omlaag sliden (op de homepage in de slider met formats)
    $('.trigger-filter').toggle(function(){
        // omhoog schuiven
        $('.filter-wrap').animate({'height': 304}, 500, function(){
            $('.filter .arrow').css('background-position', '0 -8px');
        });

    }, function(){
        // omlaag schuiven
        $('.filter-wrap').animate({'height': 25}, 500, function(){
            $('.filter .arrow').css('background-position', '0 0');
        });
    });

    // More info click afvangen in het iframe
    $('.iframe #slider a.info').click(function(e){
        e.preventDefault();
        parent.window.location = $(this).attr('href');
    });

    // Play promo click afvangen in het iframe
    $('.playvideofromiframe').click(function(e){
        e.preventDefault();
        parent.playVideo('catalogue', $(this).attr('rel'));
    });


    // Video in overlay player inladen
    $('.playvideo.local').click(function(e){
        e.preventDefault();
        playVideo('local', $(this).attr('rel'));
    });

    $('.playvideo.catalogue').click(function(e){
        e.preventDefault();
        playVideo('catalogue', $(this).attr('rel'));
    });


    // Tabs in het filter op de homepage
    $(".filter .tabs").tabs(".panes > div");

    // Catalogue filter: als je "check all" aan of uit vinkt ook alle format/category checkboxen aan of uit vinken
    $('#slider #cb_format_all').click(function(){
        $('#slider input:checkbox[name="format[]"]').attr('checked', $(this).attr('checked'));
    });

    $('#slider #cb_category_all').click(function(){
        $('#slider input:checkbox[name="category[]"]').attr('checked', $(this).attr('checked'));
    });

    // Click een van de filter checkboxen aan...
    $('#slider .filter input:checkbox').click(function(){
        filterCarousel();
    });


    // Carousel
    var iPadiPhoneiPod = /iPhone|iPad|iPod/i.test(navigator.userAgent)? true : false;
    var myFantasicFlow = document.getElementById('myFantasicFlow');

    if (myFantasicFlow){

        //console.log('myFantasicFlow!');

        if (iPadiPhoneiPod){

            $.getScript('js/zflow.js', function() {

                //console.log('iPad time!');
                document.body.className = 'zflow';

                // disable normale contentflow
                myFantasicFlow.style.display = 'none';


                // disable filter
                $('.filter-wrap').hide();

                // enable zflow
                document.getElementById('zflow').style.display = 'block';


                var aItems = $('#myFantasicFlow div.item');
                var aZflow = [];
                for (var i=0; i < aItems.length; i++){

                    var oImg = aItems[i].getElementsByTagName('span')[0];

                    var sImage = oImg.innerHTML.replace('reflection/', 'resizedcropped/');
                    sImage = sImage.replace('-r.jpg', '-c.jpg');

                    aZflow.push({   img     : sImage,
                                    id      : 'zflow_' + aItems[i].id,
                                    caption : aItems[i].getElementsByTagName('div')[0].innerHTML});
                }



                myFantasicFlow.parentNode.removeChild(myFantasicFlow);
                delete myFantasicFlow;

                $(window).load(function() {
                    zflow(aZflow, '#tray');



                });

            });
        }

    }

    sBaseurl = $('base').attr('href');

});

// automatisch rouleren
var duration = 3000;
iInterval = 0;

function moveNext(){
    CF.moveTo('next');
}

function startAutoRotate(){
    iInterval = window.setInterval(moveNext, duration);
    $('.controls .toggleplay').html('stop');
}

function stopAutoRotate(){
    clearInterval(iInterval);
    $('.controls .toggleplay').html('start');
}

// gecalled na opbouw van Content Flow
var contentFlowReady = function(){

    //console.log('contentFlowReady');

    // index van iMiddenItemId opvragen
    iIndex = $('#r'+iMiddenItemId).index();

    // de carousel centreren op het juiste item
    //setTimeout('CF.moveTo(' + iIndex + ');', 1000);
    CF.moveTo(iIndex);

    // automatisch rouleren
    startAutoRotate();

    $('.controls .toggleplay').click(function(e){
       e.preventDefault;

       if($(this).html() == 'stop'){
           stopAutoRotate();
       } else {
            moveNext();
            startAutoRotate();
       }

    });

}


// De carousel items filteren op basis van de checkboxen die aangevinkt zijn in het filter
function filterCarousel(){

    // Alle aangevinkte formattype checkboxen opvragen
    oFormattypes = $('#slider .filter input:checkbox[name="format[]"]:checked');

    // Alle aangevinkte category checkboxen opvragen
    oCategorien = $('#slider .filter input:checkbox[name="category[]"]:checked');


    var aCats = [];
    oCategorien.each(function(){
        aCats.push($(this).val());
    });
    var sCat = aCats.join('-');


    var aFormats = [];
    oFormattypes.each(function(){
        aFormats.push($(this).val());
    });
    var sFormat = aFormats.join('-');


    if (!this.frame){
        document.getElementById('myFantasicFlow').innerHTML = '';
        this.frame = document.createElement('iframe');
        this.frame.src = 'carousel.php';
        this.frame.id = 'carousel_frame';
        this.frame.name = 'carousel_frame';
        this.frame.allowTransparency = 'true';
        this.frame.frameBorder = '0'; // frameBorder met hoofdletter B!
        this.frame.scrolling = 'no';
        this.frame.style.backgroundColor = '#000000';
        document.getElementById('myFantasicFlow').appendChild(this.frame);
    }

    this.frame.src = 'carousel.php?format=' + sFormat + '&category=' + sCat;

}


// Functie om de video overlay op de homepage te openen
function showOverlay(){
    $('#slider .overlay').slideDown('slow');
}

// Functie om de video overlay op de homepage te sluiten
function hideOverlay(){
    //jwplayer().pause();
    $('#slider .overlayplayer').html(''); // de player verwijderen zodat het afspelen stopt
    $('#slider .overlay').slideUp('slow');
}

/**
* Video afspelen in de overlay
*
* sType =   catalogue (voor items uit de catalogue)
*           local (voor local productions)
*           companyprofile-lang (lange versie van de company profile video)
* iId =     id van het item in de database
*/
function playVideo(sType, iId){

    // roteren van de carousel stoppen
    stopAutoRotate();

    // Overlay tonen waarin de videoplayer staat
    showOverlay();

    // controleren of het type klopt
    if(sType == 'catalogue' || sType == 'local' || sType == 'companyprofile-lang'){

        // via ajax de filmbestanden + poster opvragen
        jQuery.get($('base').attr('href') + 'ajax/getvideo.php',{type: sType, id: iId}, function(data){
            if(data.error == 1){
                //alert('item niet gevonden');
                //console.log('error: '+data.message);
            } else {
                // De nieuwe video tag plaatsen
                $('.overlayplayer').replaceWith(data.html);

                /*
                if (jwplayer.utils.hasFlash() && !jwplayer.utils.isIOS()){
                    // JW player. Het random nummer achter player.swf zorgt ervoor dat je in IE geen zwart beeld krijgt.
                    var html = [];
                    var flashvars = {   skin: "libs/jwplayer/skins/glow.zip",
                                        autostart: true,
                                        file: data.flv
                                        };

                    var sVars = '';
                    for(var i in flashvars){
                        sVars += i + '=' + flashvars[i] + '&';
                    }

                    html.push('<embed');
                    html.push('  flashvars="' + sVars + '"');
                    html.push('  allowfullscreen="true"');
                    html.push('  allowscriptaccess="always"');
                    html.push('  id="' + data.playerid + '"');
                    html.push('  name="' + data.playerid + '"');
                    html.push('  src="libs/jwplayer/player.swf?' + Math.floor(99999999*Math.random()) + '"');
                    html.push('  width="480"');
                    html.push('  height="270"');
                    html.push('/>');

                    document.getElementById(data.playerid).parentNode.innerHTML = html.join('');
                }
                */

                // JW player. Het random nummer achter player.swf zorgt ervoor dat je in IE geen zwart beeld krijgt.
                jwplayer(data.playerid).setup({
                    skin: "libs/jwplayer/skins/glow.zip",
                    autostart: true,
                    bufferlength : 1,
                    provider : 'video',
                    flashplayer: "libs/jwplayer/player.swf?"+Math.floor(99999999*Math.random()),
                    file: data.flv
                });

            }
        }, 'json');
    }
}