// JavaScript Document

   	var next = new Object();
	next.on = new Image();
	next.out = new Image();
      
    next.on = new Image();
    next.on.src = "images/next_2.jpg";
    
    next.out= new Image();
    next.out.src = "images/next_1.jpg";
  
  
function imgchange2(is_over_)
{
	if(is_over_.src == next.on.src) {	
		is_over_.src = next.out.src 
	} else {
		is_over_.src = next.on.src
	}
}
  
  
  
  
	var guitar_img = new Array();
	
var Slider = Class.create({
	initialize: function(sliderId) {
		// this sliders <div> id - in case we got more than one slider per page
		this.sliderId = sliderId;
		// here we store the sliders images
		this.images = new Array();
		// here we store all the 'image-frames' of the 'ring'
		this.children = $(this.sliderId).childElements();
		// set the outmost border-frames ...
		this.mostLeft = this.children.first();
		this.mostRight = this.children.last();
		// ... and the needed pointers
		this.firstElementPointer = 0;
		this.firstImagePointer = 0;
		// here we initialize the activity-flag and the movement-stack
		this.slideIsActive = false;
		this.slideQueue = new Array();
		// not really needed, just in case it's needed sometime for compatibility
		this.secureMode = false;
		// following are for slide manipulation and customization
		this.manipulator = 1;
		this.slideWidth = 150;
	},
	
	addImage: function(newPrevImageSrc, newImageSrc) {
		// here we can add a new image for the slider to be displayed
		var newPos = this.images.length;
		this.images[newPos] = new Array();
		this.images[newPos][0] = new Image();
		this.images[newPos][0].src = newPrevImageSrc;
		this.images[newPos][1] = new Image();
		this.images[newPos][1].src = newImageSrc;
	},
	
	slide: function(direction) {
		// if slide is currntly active, wait and push direction on movement-stack
		if(this.slideIsActive) {
			this.slideQueue.push(direction);
			return;
		} else {
			this.slideIsActive = true;
		}
		
		// set the direction manipulator
		this.manipulator = (direction == 'right') ? 1 : -1;
		// fade border elements
		new Effect.Opacity(this.mostLeft, {duration:1.0, from:1.0, to:0.0});
		new Effect.Opacity(this.mostRight, {duration:1.0, from:0.0, to:1.0});
		// move all elements in the current direction
		this.children.each( function(each) {
			if(this.secureMode) Element.makePositioned(each);
			if(this.mostLeft != each) 
				new Effect.Move (each, { x: (-this.manipulator * this.slideWidth), y: 0, mode: 'relative'});
			else
				// after last element has finished movement, call the swap()
				new Effect.Move (each, { x: (-this.manipulator * this.slideWidth), y: 0, mode: 'relative', afterFinish:this.swap.bind(this) }); 
		}, this);
	},
	
	swap: function(obj) {
		// set the pointers to the next element in 'ring'
		this.firstElementPointer = (this.firstElementPointer + this.manipulator) % this.children.length;
		this.firstImagePointer = (this.firstImagePointer + this.manipulator) % this.images.length;
		
		// swap the last and first element
		this.mostRight = this.mostLeft;
		this.mostLeft = this.children[this.firstElementPointer];
		// set the new image in 'ring'
		this.mostRight.childElements().first().src = this.images[(this.firstImagePointer + 4) % this.images.length][0].src;
		// set the new image in 'ring' as new link target
		this.mostRight.setAttribute("href", this.images[(this.firstImagePointer + 4) % this.images.length][1].src);
		// put the (invisible) help-element in ring to new position
		this.mostRight.setStyle({left: parseInt(this.mostRight.getStyle('left')) + (this.slideWidth * 5) + 'px'});
		this.finalize();
	},
	
	finalize: function() {
		// here we mark the slide as finished and try running the next move on the stack
		this.slideIsActive = false;
		if(this.slideQueue.length > 0)
			this.slide(this.slideQueue.pop());
	}
});
  
  
	
function pigswitch()
{	
	slider.slide('right');
}