var scrollOffset=0;
var scrollNum=0;
var scrollMaxNum=0;
var scroll=0;

// Initialization
$.scroll = {
	init: function() {
		for (module in $.scroll) {
			if ($.scroll[module].init)
				$.scroll[module].init();
		}
	}
};

$(document).ready($.scroll.init);

$.scroll.fn = {
	init: function() {
		$("#submenu").append('<div class="scroll"><div class="up"></div><div class="down"></div></div>');
		var scrollHeight = $("#submenu ul").height();
		var scrollMaskHeight = $("#submenu div.mask").height();
		scrollOffset = $("#submenu ul li").outerHeight({margin:true});
		scrollNum = Math.round(scrollMaskHeight/scrollOffset);
		scrollMaxNum = Math.round(scrollHeight/scrollOffset);
		$("#submenu div.up").css({opacity:0},0);
		$("#submenu div.down").css({opacity:0},0);
		$("#submenu div.up").delay(2000).animate({opacity:1},1000);
		$("#submenu div.up").bind('click', this.scrollUp)
		.bind('mouseover', this.enter)
		.bind('mouseout', this.exit)
		.each(this.preload);
		$("#submenu div.down").delay(2000).animate({opacity:1},1000);
		$("#submenu div.down").bind('click', this.scrollDown)
		.bind('mouseover', this.enter)
		.bind('mouseout', this.exit)
		.each(this.preload);
	},
	preload: function() {
		$(this).animate({opacity:1},500);
	},
	scrollUp: function() {
		scroll=(0<scroll)?scroll-1:0;
		$('#submenu ul').animate({top:-scroll*scrollNum*scrollOffset}, 1000);		
/*
		var pos = $("#submenu ul").position();
		var offset = pos.top+$("#submenu ul li").outerHeight({margin: true});
		offset=(0<offset)?0:offset;
		$('#submenu ul').animate({top:offset}, 500);
*/
		return false;
	},
	scrollDown: function() {
		scroll=((scroll+1)*scrollNum<scrollMaxNum)?scroll+1:scroll;
		$('#submenu ul').animate({top:-scroll*scrollNum*scrollOffset}, 1000);		
/*
		var pos = $("#submenu ul").position();
		var offset = pos.top-$("#submenu ul li").outerHeight({margin: true});
		var max = $("#submenu .mask").innerHeight() - $("#submenu ul").innerHeight();
//		console.log($("#submenu ul li").outerHeight({margin: true}))
//		console.log(offset+":"+max+":"+pos.top);
		offset=(offset<max)?pos.top:offset;
		$('#submenu ul').animate({top:offset}, 500);
*/
		return false;
	},
	enter: function() {
		$(this).animate({opacity:0.6},500);
	},
	exit: function() {
		$(this).animate({opacity:1},500);
	}
};

//EOF