//
// Site design and coding by Jacob Bijani <my name first name at-sign jacobbijani.com>
// Code Copyright 2007 Jacob Bijani. All other media (Videos, Pictures, etc) Copyright 2007 Brian King
//

// set global variable for getItemInfo
var itemInfo = getItemInfo(null, null);

window.addEvent('domready', function(){
  // preload tooltip bubble
  new Asset.image('img/bubble.png');

  // grab all the tiles and preload their hover state
  for(i=0; i<($$('.tiles-row').length); i++){
    thisTile = $$('.tiles-row')[i].id.split(":", 2);;
    new Asset.image('img/tiles/' + thisTile[0] + "." + thisTile[1] + ".hover.jpg");
  }
  
  // build tool tips
  new Tips($$('.tiles-row'));
  
  // set column related constants
  var currColumn = 0;
  var columnWidth = 104;
  
  // initialize sidescroller
  var scroll = new Fx.Scroll('tiles-viewfinder', {
    wait: false,
    duration: 1000,
    transition: Fx.Transitions.Quad.easeInOut
  });
  
  // watch for clicks on the right scroll button
  $('scrollRight').addEvent('click', function(event) {
    currColumn++;
  
    event = new Event(event).stop();
    scroll.scrollTo((columnWidth * currColumn), 0);
  });
  
  // watch for clicks on the left scroll button
  $('scrollLeft').addEvent('click', function(event) {
    currColumn--;
    
    event = new Event(event).stop();
    scroll.scrollTo(((columnWidth * currColumn) - columnWidth), 0);
  });
  
  // watch for clicks on the home scroll button
  //$('scrollHome').addEvent('click', function(event) {
  //  event = new Event(event).stop();
  //  scroll.scrollTo(0,0);
  //  currColumn = 0;
  //});
  
  // watch for tile hover
  $$('.tiles-row').addEvent('mouseenter', function(){$(this.id).src = $(this.id).src.replace(/.jpg/gi, ".hover.jpg")});
  $$('.tiles-row').addEvent('mouseleave', function(){$(this.id).src = $(this.id).src.replace(/.hover.jpg/gi, ".jpg")});
  
  //$$('.tiles-row').addEvent('mouseenter', function(){typeandeid = this.id.split(":", 2); $(this.id).src = "img/tiles/" + typeandeid[0] + "." + typeandeid[1] + ".hover.jpg"});
  //$$('.tiles-row').addEvent('mouseleave', function(){typeandeid = this.id.split(":", 2); $(this.id).src = "img/tiles/" + typeandeid[0] + "." + typeandeid[1] + ".jpg"});
  
  // watch for clicks on a tile
  $$('.tiles-row').addEvent('click', function(event) {
    event = new Event(event).stop();
    
    // hide the tooltip if it exists
    $$('.tool-tip').setProperty('style', 'position: absolute; top: 0px; left: 0px; visibility: hidden;');
    
    // extract type and eid from tile id        
    typeandeid = this.id.split(":", 2);
    // build the bezel and shader and overlay them
    displayBezel(typeandeid[0], typeandeid[1]);
  });
  
  // hide the bezel and shader if the user clicks the close button
  $('bezelClose').addEvent('click', function(event){hideBezel()});
  
  // hide the bezel and shader if the user clicks an outbound link
  $('bezelOutboundLink').addEvent('click', function(event){hideBezel()});
});

// hide the bezel and shader if the user presses the esc key
window.addEvent('keydown', function(e){
  e = new Event(e);
  if(e.key == "esc"){
    hideBezel();
  }
});

function hideBezel(){
  var displayBezelShader = new Fx.Styles('bezelShader', {duration:500});
  displayBezelShader.start({
    'opacity': [.80, 0]
  });
  $('bezelWrapper').setStyle('display','none');
  (function(){$('bezelWrapper').setStyle('display','none')}).delay(501);
}

function getItemInfo(type, eid){
  // construct response to server for info about the item
  // store it to global variable itemInfo
  //var url = "./jsontest.php";
  //var request = new Json.Remote(url, {onComplete: function(jsonObj){
  //  itemInfo = jsonObj;
  //}}).send({'type': type, 'eid': eid});
  
  itemInfo = new Array();
  itemInfo['dimensions'] = new Array();
  itemInfo['title'] = "Brian King";
  itemInfo['desc'] = "<br />";
  itemInfo['dimensions']['width'] = 650;
  itemInfo['dimensions']['height'] = 432;
  
  return true;
}

function displayBezel(type, eid){
  // poll json server for info about the item
  getItemInfo(type, eid);

  // build the title
  if(type == 'vimeo'){
    var titleString = itemInfo['title'];
  } else if(type == 'demoreel') {
    var titleString = "Demo Reel";
  }else if(type == 'resume') {
    var titleString = "Brian King";
  } else if(type == 'contact') {
    var titleString = "Contact Me";
  } else {
    var titleString = "Oops!";
  }
  
  // build the money shot.
  if(type == 'vimeo'){
    var moneyString = '<object type="application/x-shockwave-flash" width="' + itemInfo['dimensions']['width'] + '" height="' + itemInfo['dimensions']['height'] + '" data="http://vimeo.com/moogaloop.swf?clip_id=' + eid + '&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color="><param name="quality" value="best" /><param name="allowfullscreen" value="true" /><param name="scale" value="showAll" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=' + eid + '&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=" /></object>';
  } else if(type == 'demoreel'){
    var moneyString = '<object type="application/x-shockwave-flash" width="650" height="432" data="http://vimeo.com/moogaloop.swf?clip_id=296776&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color="><param name="quality" value="best" /><param name="allowfullscreen" value="true" /><param name="scale" value="showAll" /><param name="movie" value="http://vimeo.com/moogaloop.swf?clip_id=296776&amp;server=vimeo.com&amp;fullscreen=1&amp;show_title=0&amp;show_byline=0&amp;show_portrait=0&amp;color=" /></object>';
  } else if(type == 'resume') {
    var moneyString = '<div class="bezel-about-header">CAN DO</div><div class="bezel-about-entry">ENG/HD Camera Operator, Steadicam Operator, Final Cut Studio, After Effects, Shake, Cinema 4D, Photoshop, Newsgraphics, Quantel Paintbox, Avid thunder, Voiceover and Copyrighting</div><div class="bezel-about-header">HAS WORKED WITH</div><div class="bezel-about-entry">MTVU and MTV2, CBS Television, CW, Miami 48 Hour Film Festival, Rhode Island International Film Festival, Royal Caribbean Cruises, Apple Inc., WSVN (FOX 7, Miami), Actual Reality Pictures</div><div class="bezel-about-bi2u">(brian is in you)</div>';
  } else if(type == 'contact') {
    var moneyString = '<div class="bezel-contact-email">bk@brianisinyou.net</div>';
  } else {
    var moneyString = "<br />";
  }
  
  // build the description
  if(type == 'vimeo'){
    var descString = itemInfo['desc'];
  } else if(type == 'demoreel'){
    var descString = "Summer 2007 Demo Reel";
  } else if(type == 'resume') {
    var descString = null;
  } else if(type == 'contact') {
    var descString = null;
  } else {
    var descString = 'The provided value "' + type + '" is not a valid type. Don\'t worry though, it\'s not your fault though.';
  }
  
  // build the 'outbound link', aka the words in the middle of the bottom of the bezel
  if(type == 'vimeo'){
    var outboundString = 'Video Hosting Provided by <a href="http://vimeo.com/' + eid + '/l:embed_' + eid + '" target="_blank" id="bezelOutboundLink">Vimeo.com</a>';
  } else if(type == 'demoreel'){
    var outboundString = 'Video Hosting Provided by <a href="http://vimeo.com/296776/l:embed_296776" target="_blank" id="bezelOutboundLink">Vimeo.com</a>';
  } else if(type == 'resume') {
    var outboundString = '<br />'
  } else if(type == 'contact') {
    var outboundString = '<br />';
  } else {
    var outboundString = 'EID#' + eid + '';
  }
  
  // fill out the bezel
  $('bezelTitle').setHTML(titleString);
  $('bezelMoney').setHTML(moneyString);
  $('bezelDesc').setHTML(descString);
  $('bezelOutbound').setHTML(outboundString);
  
  // display the bezel shader
  $('bezelShader').setStyle('display','block'); 
  var displayBezelShader = new Fx.Styles('bezelShader', {duration:200});
  displayBezelShader.start({
    'opacity': [0, .80]
  });
  
  // display the bezel
  (function(){$('bezelWrapper').setStyle('display','block')}).delay(300);
  (function(){$('bezelMoney').setStyle('display','block')}).delay(500);
  
  return true;
}