//analytics
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-17757013-1']);
_gaq.push(['_trackPageview']);

(function() {
      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

var lang = 'fr';
var detailLabels = {year: "année", platform: "plate-forme", tech:"technos", role:"rôle" };

//values from css
var worksSelectedHeight;
var videoPlayheadWidth;


$(document).ready(function()
{

    //greets
    var hi;
    var date = new Date().getHours();
    
    if (date > 4 && date < 12)		hi = (lang=='fr') ? "Bonjour" :  "Good morning";
    else if (date >= 12 && date < 18)	hi = (lang=='fr') ? "Bonjour" :  "Good afternoon";
    else				hi = (lang=='fr') ? "Bonsoir" :  "Good evening";
    
    $("#hello").text($("#hello").text().replace("Bonjour", hi));
    
    
    //get values from css
    worksSelectedHeight = getCSSValue("_works_div_selected", "height");
    videoPlayheadWidth = getCSSValue("_works_nav_video_playhead", "width").replace("px","");
    

    //works
    $("#works > div > a").hover(onWorkOver, onWorkOut);    
    $("#works > div > a").click(onWorkClick);

    //details
    for (var label in detailLabels)
    {
        $("#detail p."+label).wrapInner("<strong>");
        $("#detail p."+label).prepend(detailLabels[label] + " ");
       
    }
    
      //top right menu
      $("#menu > a").click(onMenuClick);
      $(".btn_close").click(onBtnClose);
      $("#lightboxContainer").click(onBtnClose);
      
      //intro
      intro();
      
      //text more
      $("#text_more_link").click(function()
      {
            $("#text_more_link").hide();
            $("#text_more").fadeIn(500);
      });
    
});

//returns a css prop from an element not existing on the DOM
function getCSSValue(className, propName)
{
      var dummy = $('<div class="'+className+'" />');
      $("body").prepend(dummy); 
      var prop = dummy.css(propName);
      dummy.remove();
      return prop;
}

var animating = 0; //no hover effects while this is == 3
var worksHoverTimer;
var currentWork;
var previousWork = {id: "dummy" };
var outAlphas = {normal:.4, whenSelected: .2};



function intro()
{
      animating = 1;
      
      $("#works > div").each(function(i)
      {
            var div = $(this);
            setTimeout(function()
            {

                  div.fadeIn(300);
                  
                  if (i == $("#works > div").length - 1) animating = 0;
                  
            }, 80*i+1000);
           
      })
}


function onWorkClick()
{
      if (animating > 0) return false;
      
    var parentDiv = $(this).parent();
    var id = parentDiv.attr("id");
    //console.log(id)

    //hover cancel
    clearTimeout(worksHoverTimer);
 
    var delay = 0;

    //first hide prev selected block
    if (currentWork)
    {
        //clone object 
        previousWork = {link: currentWork.link, parentDiv: currentWork.parentDiv, id:currentWork.id, css: { height:currentWork.css.height, backgroundPosition:currentWork.css.backgroundPosition } }; 
        hideWork(0);
        delay = 50;
    }
    
    currentWork = { id: id, link:$(this), parentDiv:parentDiv }
    
    //dim - not for current AND previous
    $("#works > div:not(#"+id+", #"+previousWork.id+")").animate({opacity:outAlphas.whenSelected}, 300);
    
    showWork(0, delay);
      
    return false;
}

function showWork(delay)
{
      animating += 1;
      //console.log("sw <"+animating);
      
      setTimeout(function()
      {
            //backup css props
            currentWork.css = {height: currentWork.parentDiv.css("height"), backgroundPosition: currentWork.parentDiv.css("background-position")};
            
            //descriptif
            //currentWork.parentDiv.find("span").fadeOut(100);
            //currentWork.link.hide();
            currentWork.parentDiv.find("a").fadeOut(299);
            
            currentWork.parentDiv.animate(
            {
                height: worksSelectedHeight,
                backgroundPosition: '0px 0px'
            }, 300, function()
            {
                  
                  //currentWork.div = createWorkDiv(link);
                  //link.replaceWith( currentWork.div);
                  
                  //nav if more than 1 media (or 0), or if video is there
                  if (currentWork.parentDiv.find(".media > *").length != 1 || currentWork.parentDiv.find(".media > video").length > 0)
                        initPlayer(currentWork.parentDiv);
                  
                  //scroll
                  //$('html, body').animate({scrollTop: link.offset().top}, 2000)
                  //console.log(link.offset().top);
                  
                  //fade in media
                  
                  currentWork.parentDiv.find(".media").fadeIn(900, function()
                  {
                        
                        animating -= 1;
                        //console.log("sw >"+animating)
                        onAnimEnd();
                        
                  });
                  
            });
            
      }, delay);
    
 
    
}


function hideWork()
{
      animating += 2;
      //console.log("< hw"+animating);
      
      //fade out detail
      $("#detail > div:visible").fadeOut(100);
      
      hidePlayer(previousWork.parentDiv);
      //previousWork.parentDiv.find(".nav > a").removeClass("selected");
      pausePlayer(previousWork.parentDiv);
      clearInterval(videoTimer);
      
      //fadeOut currently showed media
      previousWork.parentDiv.find(".media").fadeOut(100, function()
      {
            //shrink back work block
            previousWork.parentDiv.animate(
            {
                  opacity:outAlphas.whenSelected,
                  height: previousWork.css.height,
                  backgroundPosition: previousWork.css.backgroundPosition
            }, 150, function()
            {
                  //previousWork.link.show();
                  previousWork.parentDiv.children("a").fadeIn(150, function()
                  {
                       animating -= 2;
                       //console.log("hw > "+animating);
                       onAnimEnd();
                  });
            });
      });
    
}


function onAnimEnd()
{
      if (animating == 0)
      {
            //console.log("end")
            
            //detail
            $("#" + currentWork.id + "_detail").fadeIn(200);
            $("#detail").css("top", currentWork.parentDiv.offset().top+"px");
      }
}

function onWorkOver()
{
   
      if (animating > 0) return;
      
      var parentDiv = $(this).parent();
      
      clearTimeout(worksHoverTimer);
         
      var id = parentDiv.attr("id");
      
      $(this).find(".summary").stop();
      $(this).find(".summary").css("opacity","1");
      
      $("#works > div").stop();
      
      //higlhight rollovered
      if (!currentWork || id != currentWork.id) parentDiv.css("opacity","1");
      
      //dim others
      var selector = (currentWork) ? "#works > div:not(#"+id+", #"+currentWork.id+")" : "#works > div:not(#"+id+")";
      $(selector).animate({opacity: (currentWork) ? outAlphas.whenSelected : outAlphas.normal }, 300);
    
}

function onWorkOut()
{
      if (animating > 0) return;
      $(this).find(".summary").stop();
      $(this).find(".summary").animate({opacity:0},700);
        
      worksHoverTimer = setTimeout(onWorksOutTimerComplete, 300)

}

function onWorksOutTimerComplete()
{
      $("#works > div").stop();
      
      var selector = (currentWork) ? "#works > div:not(#"+currentWork.id+")" : "#works > div";
      $(selector).animate({opacity: (currentWork) ? outAlphas.whenSelected : 1}, 700);
}



/*
function createWorkDiv(link)
{
    var id = link.attr("id");
    
    //create replacement div
    var div = $('<div id="'+id+'" />');
    
      //inject media from #detail
   
    var media = $("#"+id+"_detail > .media").clone();
    media.find("*").hide();
    //media.find(":first").show();
    div.append(media);
    
    //copy css props from <a>
    div.css("height", link.css("height"));
    div.css("background-position", link.css("background-position"));
    
    createPlayer(div);
    
    return div;
}*/

function initPlayer(div)
{
      if (div.find(".nav").length == 0)
      {
            createPlayer(div);
      }
      
      div.find(".nav").show();
      gotoPlayerElem(div.find(".nav").children().first(), true);
}

function hidePlayer(div)
{
      div.find(".nav").hide();
}

function pausePlayer(div)
{
      //console.log("pause player");
      var v = div.find(".media video");
      if (div.find(".media video").length > 0)
      {
            //console.log("video found");
            v[0].pause();
      }
}

function createPlayer(div)
{
      //create nav
      var nav = $('<div class="nav"></div>');
      div.prepend(nav);
      
      //if no media, create container automatically so that animation still works
      if (div.find(".media").length == 0) div.append('<div class="media"><img src="http://placehold.it/100x100/00ffff" /></div>');
    
      div.find(".media > *").each(function()
      {
            var navElem = $('<a href="#"></a>')
            if ($(this).is("video"))
            {
                navElem.addClass("video");
                navElem.addClass("btn");
                /*navElem.append('<span class="playhead"></span>');
                
                var navElemVideoControl = $('<a></a>');
                navElemVideoControl.addClass("videoControl");
                navElemVideoControl.addClass("btn");
                nav.append(navElemVideoControl);*/
                var navElemPlayhead = $('<div class="playheadContainer"><div class="playhead"></div></div>');
                
            }
            else
            {
                navElem.addClass("img");
            }
            
            navElem.click(onPlayerNavElemClick);
            nav.append(navElem);
            if (navElemPlayhead) nav.append(navElemPlayhead);
      });
    
    
}


function onPlayerNavElemClick()
{
    gotoPlayerElem($(this));
    return false;
}


var videoTimer;


function gotoPlayerElem(nav, forceVideoStart)
{

    var navIndex = nav.index();
    var navPrev = nav.parent().find(".selected");
    var mediaContainer = nav.parent().parent().find(".media");
    var media = mediaContainer.children().eq(navIndex);
    var mediaPrev = mediaContainer.find(".selected");
    
    
    
      //exit if already selected (except for videos)
    if (nav.hasClass("selected") && !media.is("video"))
    {
      //console.log("exit");
      return;
    }
    
    
  

    media.show();
    
    
    if (media.is("video"))
    {
      v = media[0];
      if (nav.hasClass("selected") && !forceVideoStart)
      {
            //item is already selected: toggle play/pause
            //console.log("item is already selected: toggle play/pause")
            
            if (nav.hasClass("paused"))
            {
                  //console.log("play");
                  v.play();
            }
            else
            {
                  //console.log("pauz");
                  v.pause();
            }
            
            nav.toggleClass("paused");
      }
      else
      {
            //console.log("init video")
            //init/play video
            
            v.play();
            
            nav.parent().find(".playheadContainer").show();
            
            videoTimer = setInterval(function()
            {
                nav.parent().find(".playhead").css("width", Math.round( (v.currentTime/v.duration)*videoPlayheadWidth ) + "px");
            }, 100);
      }
    }
    
    
      if (mediaPrev.length > 0 && !(media.is("video") && nav.hasClass("selected")) )
    {
 
      
        mediaPrev.removeClass("selected");
        mediaPrev.hide();
        
        //give href back
        navPrev.removeClass("selected");
        navPrev.attr("href","#");
        
        if (mediaPrev.is("video"))
        {
            mediaPrev[0].pause();
           
            clearInterval(videoTimer);
            
            //nav.parent().find(".playheadContainer").hide();
            //nav.parent().find(".playhead").css("opacity", "0.4");

        }
    }
    
    
    //make item unclickable (except for vidz)
    if (!nav.hasClass("video")) nav.removeAttr("href");
    
    nav.addClass("selected");
    media.addClass("selected");
   
}



function onMenuClick()
{
      $("#lightboxContainer").css("height", $(document).height());
      $("#lightboxContainer").fadeIn(200);
      
      $("#"+$(this).text()).fadeIn(200);
}

function onBtnClose(event)
{
      if (event.target.id == "lightboxContainer" || $(event.target).hasClass("btn_close"))
      {
            closeLightbox();
            return false;
      }
}

function closeLightbox()
{
      $("#lightboxContainer").fadeOut(100);
      $("#lightboxContainer > div:visible").fadeOut(100);
}