function showTiles(){

	this.tileID = 1;
	this.currentID = this.tileID;
	this.nextID = 0;
	this.tilesArr = $$('#showTrailsPanel div');
	this.loading = false;

	
	this.init = function(){
		var t = this;
		if ($('tile-next')){
			$('tile-next').observe("click", function(ele){
				Event.stop(ele)
				if(!loading){
					currentID = tileID;
					if (tileID >=tilesArr.length){
						tileID = 1;
					}else{
						tileID++;
					}
					nextID = tileID;
					t.showImage(currentID, nextID);
				}
			});
			$('tile-prev').observe("click", function(ele){
				Event.stop(ele);
				if(!loading){
					currentID = tileID;
					if (tileID == 1){
						tileID = tilesArr.length;
					}else{
						tileID--;
					}
					nextID = tileID;
					t.showImage(currentID, nextID);
				}
			});
		}

	}
	this.init();

	this.next = function(){
	}
	this.prev = function(){
	}

	this.showImage = function(cid, nid){
		//alert(cid + ' :: ' + nid);
		//alert(tileID)
		//var t = this;
		loading = true
		new Effect.Fade(tilesArr[cid-1], { 
				duration : 0.1,
				from : .7,
				to : 0.0,
				queue: { position: 'front', scope: 'imageTile', limit: 2 } 
			}); 
		new Effect.Appear(tilesArr[nid-1], { 
				duration : 0.3,
				from : 0.3,
				to : 1,
				queue: { position: 'end', scope: 'imageTile', limit: 2 },
				afterFinish : function(){
					loading = false;
				}
			}); 
		//tilesArr.invoke("hide")[id-1].appear();
	}
}

Event.observe(window, "load", function(){
	if ($('showTrailsPanel')){
		showTiles();
	}
//alert($$('h3.exhitorPanel').length);
	$$('h3.exhitorPanel').each(function(ele){
		//alert(ele);
		ele.down('a').observe('click', function(ele2){
			Event.stop(ele2)
			var el = Event.element(ele2).up().next().toggle();
		})
		
	})
})

var Popup = {
  open: function(options)
  {
    this.options = {
      url: '#',
      width: 300,
      height: 300
    }
    Object.extend(this.options, options || {});
    window.open(this.options.url, '', 'width='+this.options.width+',height='+this.options.height);
  }
}