var activeTags = [];
var activeFilters = [];

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-778769-2']);
_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);
  
  $('.movable img').live('dblclick', function() {
    $.history.load($(this).attr('rel')+"/"+$(this).attr('id'));
  });
  
  $('.movable').live('click', function() {
    $(this).css('z-index', 1000);
  });
  
  $('.elementDetail').live('dblclick', function() {
    pageload();
  });
  
  $.history.init(pageload);
        
  $('#tags a').click(function() {    
    if(!$(this).hasClass('active')) {
      $(this).addClass('active');
      $(this).siblings('a').removeClass('active');
      activeTags = [];
      var id = $(this).html();
      _gaq.push(['_trackEvent', 'Tags', id]);
      activeTags.push(id);
      $.history.load("tag/" +activeFilters+"/"+activeTags);
    }
  });
        
  $('#menu ul li a').click(function() {
    if($(this).attr('rel') != "link") {
      var id = $(this).attr('rel');
      $('#tags').slideUp(300);
      $('#tags div').hide();
      $('#'+id).show();
      $('#tags').slideDown(300);
      if(!$(this).hasClass('active')) {
        $('#menu ul li a').removeClass('active');
        $(this).addClass('active');
        activeFilters = []; 
        activeTags = ['new'];
        $('#tags a').removeClass('active');
        $('#'+id+' a:eq(0)').addClass('active');
        var what = $(this).attr('rel') == 'illu' ? 'Illustrations' : 'Videos';
        _gaq.push(['_trackEvent', 'Filter', what]);
        activeFilters.push(id);
        $.history.load("tag/" +activeFilters+"/"+activeTags);
      } 
      if($('#menu ul li a:eq(2)').hasClass('active')) {
        $('#menu ul li a:eq(2)').removeClass('active');
      }
    } else {
      _gaq.push(['_trackEvent', 'Filter', 'Links']);
      $.history.load("link"); 
    }
  });
        
  $('.movable').draggable({
    stack: ".movable"
  });
        
  $('#raining').sprite({
    fps: 12, 
    no_of_frames: 9
  });
  
  $('.umbrella').click(function () {
    startGlitch();
  });
      
});

function randomizeElements() {
  $('.movable').each(function() { 
    var wContent = $('#content').width();
    var hContent = $('#content').height();
    var wImg = $(this).width();
    var hImg = $(this).height();
    $(this).css({
      left: randomFromTo(5, wContent - (wImg + 5)),
      top: randomFromTo(95, hContent - (hImg + 5))
    });
  });
}

function pageload(hash) {
  var url, css, info, what, is, id;
  if(hash) {
    info = hash.split('/');
    if(info[0] != 'link') {
      if(info[0] == 'tag') {        
        is = info[1];
        id = info[2];
        url = 'index.php/init/tags/'+is+'/'+id;
        css = {
          height: '70%',
          width: ''
        }
      } else {
        is = info[0];
        id = info[1];
        url = 'index.php/init/show/'+is+'/'+id;
        css = {
          height: 'auto',
          width: ''
        }
      }
      $('#tags div').hide();
      $('#'+is).show();
      $('#tags').slideDown(300);
      if(is == 'illu') {
        what = 'Illustration';
        $('#menu ul li a:eq(0)').addClass('active');
        $('#menu ul li a:eq(1)').removeClass('active');
        $('#menu ul li a:eq(2)').removeClass('active');
      } else {
        what = 'Video';
        $('#menu ul li a:eq(0)').removeClass('active');
        $('#menu ul li a:eq(1)').addClass('active');
        $('#menu ul li a:eq(2)').removeClass('active');
      }      
      if(activeFilters.length == 0) {
        activeFilters.push(is);
         $('#tags a').each(function () {
           if($(this).html() == id) {
              $('#tags a').removeClass('active');
              $(this).addClass('active');
           }             
         });
      }
      _gaq.push(['_trackEvent', 'Access', what, id]);      
    } else {
      activeFilters = [];
      $('#tags').slideUp(300);
      $('#menu ul li a:eq(0)').removeClass('active');
      $('#menu ul li a:eq(1)').removeClass('active');
      $('#menu ul li a:eq(2)').addClass('active');
      url = 'index.php/init/links';
      css = {
        width: '60%', 
        margin: '0 auto',  
        height: 'auto'
      }
    }
  } else {
    // start page
    url = 'index.php/init/tags/'+activeFilters+'/'+activeTags;
    css = {
      height: '70%'
    }
  }
  if((activeTags.length != 0 && activeFilters.length != 0) || hash) 
  {
    $('#raining').show();
    $.ajax({
      url: url,
      success: function(data){
        eval($(data).find("script").text());
        $('#content .movable').fadeOut('slow');      
        $('#content .elementDetail').fadeOut('slow');      
        $('#content').html(data);
        $('.movable').fadeIn('slow');
        $('.elementDetail').fadeIn('slow');
        $('.movable').draggable({
          stack: ".movable"
        });
        $('#content').css(css);
        $('#raining').hide();
        paginate(is, parseInt(id));
        randomizeElements(); 
        tooltip();
      }
    });
  } else {
    $('#content').css(css);
  }
}

function paginate(is, value) {
  if(typeof(ids) != "undefined") {
    if($("#pagination").length != 0) {
      var index = $.inArray(value,ids);
      if(ids[index-1] != null) {
        $("#pagination").append("<a href='javascript: void(0)' onclick='javascript: $.history.load(\""+is+"/"+ids[index-1]+"\");'>Previous</a>");
      }
      if(ids[index+1] != null) {
        if(ids[index-1] != null) $("#pagination").append(" / ");
        $("#pagination").append("<a href='javascript: void(0)' onclick='javascript: $.history.load(\""+is+"/"+ids[index+1]+"\");'>Next</a>");
      }
    }
  }
}

function tooltip(){
  $('.movable').tooltip({
    track: true,
    fade: 250,
    delay: 0, 
    showURL: false, 
    bodyHandler: function() { 
      return "Move me. Double click me for details."; 
    } 
  });
}

function randomFromTo(from, to){
  return Math.floor(Math.random() * (to - from + 1) + from);
}