// demo.js - public js handlers ( commenting, the tree view, etc )

//console.log("xornotsite.js");

$(document).ready( function(){
    checkJSEnabled();  
    $('.content-tree.viewlet').each( initContentTree );

    $('#content.past-client').each( initPastClient );

    $('.service').each( initServices );

    $('body.home').each( initSlideshow );
});

function checkJSEnabled(){
    $('#main-content').removeClass('closed');
    $('#js-check-container').addClass('closed');
}

function initContentTree(){
    //console.log("initContentTree: ", this);

    // shut nodes with children
    $(this).find('li').has('ul').addClass('shut');
    
    $('li.shut', this).find('ul').addClass('closed');

    // if clicking on the li, but not the a, toggle submenu
    $(this).find('li').has('ul').click( function(evt){ 
        toggleSubMenu(this); 
        evt.stopPropagation();
    });
    // if clicking on the link but not the arrow, do nothing
    $(this).find('li a').click( function(evt){ 
        evt.stopPropagation();
    });

    // start by opening the active item if it has children
    $('li.active', this).has('ul').each( function(){ 
        toggleSubMenu(this);
    });  
 
}

function toggleSubMenu(submenu){
    //console.log("toggleSubMenu() ", submenu);
    if( $(submenu).hasClass('shut') ){
        //console.log("opening");
        $(submenu).removeClass('shut').addClass('open');
        $(submenu).children('div').children('ul').removeClass('closed');
    }else{
        //console.log("closing");
        $(submenu).addClass('shut').removeClass('open');
        $(submenu).children('div').children('ul').addClass('closed');
    }
}



// popups for past work section
function initPastClient(){

    $('img.popup-thumbnail').click( function(){
        $('#popup img').attr('src', $(this).attr('src') ); 
        $('#popup').show(200);
    });

    $('#popup').click( function(){
        $(this).hide(200);
    })
}

function initServices(){
    $('.read-more').click( function(){
        var service = $(this).parents('.service')[0];
        $(this).hide();
        $('.more', service).show();
        $('.service-image.thumbnail', service).hide();
        $('.service-image.fullsize', service).show();
    })
    $('.read-details').click( function(){
        var service = $(this).parents('.service')[0];
        $(this).hide();
        $('.details', service).show();
    })
    $('.hide-details').click( function(){
        var service = $(this).parents('.service')[0];
        $('.more, .details', service).hide();
        $('.read-more, .read-details', service).show();
        $('.service-image.fullsize', service).hide();
        $('.service-image.thumbnail', service).show();
    })
}



var slideImages = [ 
    '/images/hands_paper_425x282.jpg', 
    '/images/customers_viewing_425x282.jpg',
    '/images/eye_426x282.jpg', 
    ];
var slideIndex = 0;

// request_image makes an ajax hit and starts off the slideshow loop
function initSlideshow(){
    // make sure only the right pic shows first 
    setTimeout( function(){ $('.hidden-slide').removeClass('hidden-slide') }, 1000 );
    // schedule fading out the top two images to show the next one underneath
    setTimeout( function(){ $('#home-slide-1').fadeOut(1500) }, 2500 );
    setTimeout( function(){ $('#home-slide-2').fadeOut(1500) }, 7000 );
}