
__onloadStack.push(function() {
	new aniMenu($('animenu'));
});

function aniMenu(node) {
	/**
	 * Settings
	 */
	this.leftWidth = 52;
	this.rightWidth = 58;
	this.liWidth = 126;
	this.shiftsteps = 18;
	this.shiftstepsize = this.liWidth / this.shiftsteps;

	this.numVisibleUls = 3;
	/********/
	
	this.ul;			//ul to shift width
	this.firstLi;		//first
	this.node = node;	//containing node
	this.shifting = false;
	this.stack = new Array();

	var uls = node.getElementsByTagName('ul');
	if (uls.length == 1) {
		this.ul = uls[0];
		var childNode = this.ul.firstChild;
		while(childNode) {
			nextChild = childNode.nextSibling;
			if (childNode.nodeName.toLowerCase() != 'li') {
				this.ul.removeChild(childNode);
			}
			childNode = nextChild;
		}

		var lis = this.ul.getElementsByTagName('li');
		if (lis.length > this.numVisibleUls) {
			this.firstLi = lis[0];
			var ulWidth = this.numVisibleUls * this.liWidth;
			var divWidth = ulWidth + this.leftWidth + this.rightWidth;
			this.node.style.width = divWidth + 'px';
			$('inner').style.width = ulWidth + 'px';
			this.ul.style.marginLeft = (-1* this.liWidth) + 'px';
			this.initControls();
			this.shift(1);
		}
	}
}
aniMenu.prototype.getUlMargin = function() {
	var margin = this.ul.style.marginLeft.replace(/px/,'') * 1;
	return margin;
}

aniMenu.prototype.initControls = function() {
	var self = this;
	$('before').onclick = function() { self.shift(-1); }
	$('before').onmouseover = function() {  }
	$('before').onmouseout = function() {  }
	$('after').onclick = function() { self.shift(1); }
	$('after').onmouseover = function() {  }
	$('after').onmouseout = function() {  }
}

aniMenu.prototype.shift = function(dir) {
	if (this.shifting) return false;
	var direction = (dir == -1) ? 'left' : 'right';
	
	this.shifting = true;
	for(i = 0; i < this.shiftsteps; i++) {
		this.stack.push(this.shiftstepsize*dir);
	}
	this.stack.push(direction);
	this.go();
}

aniMenu.prototype.go = function() {
	var action = this.stack.shift();
	if (typeof(action) == 'number') {
		var margin = this.getUlMargin() + action;
		this.ul.style.marginLeft = margin + 'px';
	} else {
		this.swapLi(action);
	}

	if (this.stack.length == 0) {
		this.shifting = false;
	} else {
		var self = this;
		window.setTimeout(function(){self.go();}, 10);
	}
}

aniMenu.prototype.swapLi = function(direction) {
	if (direction == 'left') {
		var margin = this.getUlMargin() + this.liWidth;
		this.ul.appendChild(this.ul.firstChild);
		this.ul.style.marginLeft = margin + 'px';
	} else {
		var margin = this.getUlMargin() - this.liWidth;
		this.ul.insertBefore(this.ul.lastChild, this.ul.firstChild);
		this.ul.style.marginLeft = margin + 'px';
	}

}
