var _SealListBox = function(container_id) {
	var container = $('#'+container_id+' div.contain'), self = this;
	this.list = container.find('div.list ul');
	this.left = container.find('div.left');
	this.right = container.find('div.right');

	this.width = this.list.width();
	this.max_page = Math.ceil(this.list.find('li').length / 4);


	this.page = 1;
	
	this.left.click( function() {   self.moveLeft(); return false; } );
	this.right.click( function() {  self.moveRight(); return false; } );

	this.left.css('display', 'none');
};

var _SealListRelatedBox = function(container_id) {
	var container = $('#'+container_id+' div.relatedSeal'), self = this;
	this.list = container.find('div.list ul');
	this.left = container.find('div.left');
	this.right = container.find('div.right');

	this.width = this.list.width();
	this.len = this.list.find('li').length; 
	this.max_page = Math.ceil( this.list.find('li').length / 4);

	this.page = 1;


	this.left.click( function() { self.moveLeft(); return false; } );
	this.right.click( function() {  self.moveRight(); return false; } );

	this.left.css('display', 'none');
	if(this.len  < 4) 	this.right.css('display', 'none');
};


_SealListRelatedBox.prototype.moveLeft = function() {

	if(this.page <= 1) return;
	var left = (this.page - 2) * this.width * -1 ;
	this.list.animate({ left: left }, 500);
	--this.page;

	this.right.css('display', 'block');
	if(this.page <= 1) this.left.css('display', 'none');
};
_SealListRelatedBox.prototype.moveRight = function() {

	if(this.page >= this.max_page) return;

	var left = this.page * this.width * -1 ;
	this.list.animate({ left: left }, 500);
	++this.page;

	this.left.css('display', 'block');
	if(this.page >= this.max_page) this.right.css('display', 'none');
};



_SealListBox.prototype.moveLeft = function() {

	if(this.page <= 1) return;
	var left = (this.page - 2) * this.width * -1;
	this.list.animate({ left: left }, 500);
	--this.page;

	this.right.css('display', 'block');
	if(this.page <= 1) this.left.css('display', 'none');
};
_SealListBox.prototype.moveRight = function() {

	if(this.page >= this.max_page) return;

	var left = this.page * this.width * -1;
	this.list.animate({ left: left }, 500);
	++this.page;

	this.left.css('display', 'block');
	if(this.page >= this.max_page) this.right.css('display', 'none');
};

