$(function(){
  var portfolio = new Portfolio;
  if (!$.browser.msie || $.browser.version.substr(0,1)>=7)
    portfolio.init();
  else
	portfolio.lightBoxLinks();
});

function Portfolio()
{
  this.banner = $('#banner');
  this.container = this.banner.find('.bannerContainer');
  this.back = $('#home .back');
  this.forward = $('#home .forward');
  this.lowerLimit = 0;
  this.upperLimit = 0;
}

Portfolio.prototype.init = function()
{
  var self = this;

  $.ajax({
    url: 'index/panels/',
    success: function(data){

      self.container.append(data);
      var panels = self.container.find('.panel');
      var width = panels.outerWidth();

      var currentMargin = self.container.css('marginLeft');
      self.currentMargin = currentMargin.substring(0, currentMargin.length-2)*1;
      self.lowerLimit = -(width * (panels.length - 1));

      self.forward.click(function(){
        self.scroll(-width);
      });

      self.back.click(function(){
        self.scroll(width);
      });

      self.forward.fadeIn();
      self.back.fadeIn();
	  
	  self.lightBoxLinks();
    }

  });
}

Portfolio.prototype.lightBoxLinks = function()
{
	$('#gallery div.johcm a').lightBox({ trigger: 'a.light.johcm', txtOf: '/', txtImage: '' });
    $('#gallery div.orbis a').lightBox({ trigger: 'a.light.orbis', txtOf: '/', txtImage: '' });
    $('#gallery div.player a').lightBox({ trigger: 'a.light.player', txtOf: '/', txtImage: '' });
	$('#gallery div.london a').lightBox({ trigger: 'a.light.london', txtOf: '/', txtImage: '' });
}

Portfolio.prototype.scroll = function(amount)
{
  var self = this;
  var oldMargin = this.currentMargin;
  var newMargin = oldMargin + amount;

  if(newMargin >= this.lowerLimit && newMargin <= this.upperLimit)
  {
    this.currentMargin = newMargin;
    this.container.animate({ marginLeft: newMargin });
  }
  else
  {
    var jumpDiff = (newMargin > oldMargin)? 20 : -20;
    this.container.animate({ marginLeft: (oldMargin + jumpDiff) }, 200, function(){
        self.container.animate({ marginLeft: oldMargin }, 200);
      });

  }
}