var counter = 0; 
var tempX = 0;
var elt_posX,elt_posY,b;
var elements = new Array();

// During page on load
window.addEvent('domready', function() {

  // create each element
  images.each(function(photo) {
      id_div = photo.split(".");
      var id = id_div[0];
      var div = new Element('div', { 'id': id, 'class': 'image', 'styles': { 'position': 'absolute', 'opacity': '0' } }).inject('container');
      if(clickit != false) { 
        div.addEvent('click', Click);
        div.setStyle('cursor', 'pointer');
      }
      var img = new Element('img', { 'src': path+photo }).inject(div);
      img.reflect({'height': height, 'opacity': opacity});
      elements.include(id);
    });

  open();

});

// DropOut Effect
DropOut = function(element) {
  element = $(element);
  var oldtop = element.getStyle('top').toInt();  
  
  var DropOutEffect = new Fx.Morph(element, {duration: 500, transition: Fx.Transitions.Sine.easeOut, onComplete: function() { element.setStyle('top', oldtop) } });
  DropOutEffect.start({'top': [oldtop+'px', oldtop+100+'px'], 'opacity': [1, 0]});
}

// create each element
function open() { 

  // appear each element
  elements.each(function(element) {
  	var appear_effect = new Fx.Morph(element, {duration: 800, transition: Fx.Transitions.Sine.easeOut });
    appear_effect.start({ 'opacity': [0, 1] });  
  });
  
  // start carousel   
  b = setInterval('carousel()',40);
 
  // set mouse events
  function position(e) {
    if (navigator.appName.substring(0,3) == "Net") {
      tempX = e.pageX;
    } else {
      tempX = event.x+document.body.scrollLeft;
    }
 	  //move();
  }
  //document.onmousemove = position;
  //document.onmouseout = out; 
  
}

// on mouse move on main container
function move() {	
	speed = (tempX - centerx) / 2500;
	base = 0.05;	
}

// on mouse out from main container
function out() {	
	speed = speed;	
}

// Change image event to back
function textIt(elt) {
  elt = $(elt);
  elt.removeEvent('click', Click);
  elt.addEvent('click', Back);
}

// Change image event to click
function untextIt(elt) {
  elt = $(elt);
  elt.removeEvent('click', Back);
  elt.addEvent('click', Click);
}

// Back to carousel
function Back(elt) {

  if(typeof elt == 'object') { elt = this.id; }
  
  // define actions
  var appearer = '';
  elements.each(function(photo) {
    if(photo != elt) { 
      appearer += "var AppearEffect = new Fx.Morph($('"+photo+"'), {duration: 500, transition: Fx.Transitions.Sine.easeOut }); AppearEffect.start({visibility: ['hidden', 'visible'], 'opacity': [0, 1]});";
    } else {
      appearer += "$('"+photo+"').morph({left: "+elt_posx+", top: "+elt_posy+"});";
    }
  });
  appearer += "var TextEffect = new Fx.Morph($('text'), {duration: 500, transition: Fx.Transitions.Sine.easeOut, onComplete: function() { untextIt('"+elt+"'); $('text').innerHTML = ''; b = setInterval('carousel()',40); } }); TextEffect.start({visibility: ['visible', 'hidden'], 'opacity': [1, 0]});";

  // do actions
  eval(appearer);  
  
}

function Click() {

  elt = this.id;
  
  // stop carousel
  $clear(b);
  
  // get clicked element positions
  elt_posx = this.getStyle('left').toInt();
  elt_posy = this.getStyle('top').toInt();
  
  // define actions
 var fader= '';
 elements.each(function(photo) {
    if(photo != elt) { 
      fader += "DropOut('"+photo+"');";
    } else {
      fader += "$('"+photo+"').morph({left: 0, top: 0});";
    }
  });
  fader += "var TextEffect = new Fx.Morph($('text'), {duration: 500, transition: Fx.Transitions.Sine.easeOut, onStart: function() { requestText('"+elt+"') }, onComplete: function() { textIt('"+elt+"') } }); TextEffect.start({visibility: ['hidden', 'visible'], 'opacity': [0, 1]});";

  // do actions
  eval(fader);
  
}

// request text
function requestText(elt) {
	var url = 'page.php';  
	new Request.HTML({url:url, 
	  onSuccess: function(html) {
		$('text').adopt(html);
	  },
	  onFailure: function() {
		$('text').set('html', 'An error occurred. Please re-try.');
	  }
	}).get({'item': elt});
}

// carousel 
function carousel() {
 elements.each(function(photo, i) {
		angle = i*2*Math.PI/elements.length;		
		posx = centerx+Math.sin(counter*(base*speed)+angle)*radiusx;
		posy = centery+Math.cos(counter*(base*speed)+angle)*radiusy;
    $(photo).setStyles({ left: posx+'px', top: posy+'px', zIndex: Math.round(posy/3)+100 });
		angle += speed;	
	});	
	counter++
}