// ===================================================================================================
// Slider - javascript class to help with doing an AJAX slider
//
// Author: Plexus Web Creations
//
// Parameters:
// 		dom_id: DOM ID of the wrapping <ul> that is being slid
//		is_vertical: is the slider moving in a vertical direction?
//		item_count: total number of items in slider
//		item_size: size of each item in pixels (width for LEFT/RIGHT, height for UP/DOWN)
//		item_name: the name of each <li>, the item's position ID will be appended to name
//		item_class: class to put on each created <li>
//		items_per_move: how many items should the slider move by each time
//		items_showing: number of items that show in the slider at any given time
//		ajax_url: URL to pass to Ajax.Updater(), position is passed as query param
//		other_params: are there other params? 
//
// Syntax: 
//		var slider = new Slider('thumbnail_ul',false, <%= li_count %>, 104, 'thumbnail_li_', 'thumbnail_li', 3, 8, '<%= url %>', false);
//
//
// NOTE: assumptions are made on the DOM IDs for the arrow links [see render_navigation()] and
//		that the slider is using a <ul> and <li> for rendering.
// ===================================================================================================
var Slider = Class.create();
Slider.prototype = {
	LEFT: 1,
	RIGHT: -1,
	UP: 1,
	DOWN: -1,
	
	initialize: function(dom_id,is_vertical,item_count,item_size,item_name,item_class,items_per_move,items_showing,ajax_url, other_params) {
		this.dom_id = dom_id;
		this.is_vertical = is_vertical;
		this.item_count = item_count;
		this.item_size = item_size;
		this.item_name = item_name;
		this.item_class = item_class;
		this.items_per_move = items_per_move;
		this.items_showing = items_showing;
		this.ajax_url = ajax_url;
		this.other_params = other_params;
		this.current_position = 0;
	},
	
	slide_left: function() {
		if(this.current_position == 0) return;
		this._do_slide(this.LEFT);
	},
	
	slide_right: function() {
		if((this.current_position+1) == this.item_count) return;
		this._create_new_elements();
		this._do_slide(this.RIGHT);
	},
	
	slide_up: function() {
		if(this.current_position == 0) return;
		this._do_slide(this.UP);
	},
	
	slide_down: function() {
		if((this.current_position+1) == this.item_count) return;
		this._create_new_elements();
		this._do_slide(this.DOWN);
	},
	
	render_navigation: function() {
		var name1 = 'left_arrow_';
		var name2 = 'right_arrow_';
		if(this.is_vertical) {
			name1 = 'up_arrow_';
			name2 = 'down_arrow_';
		};
		if(this.current_position == 0) {
			if($(name1+'active')) Element.hide(name1+'active');
			if($(name1+'inactive')) Element.show(name1+'inactive');
		} else {
			if($(name1+'active')) Element.show(name1+'active');
			if($(name1+'inactive')) Element.hide(name1+'inactive');
		};
		if((this.current_position+this.items_showing) >= this.item_count) {
			if($(name2+'active')) Element.hide(name2+'active');
			if($(name2+'inactive')) Element.show(name2+'inactive');
		} else {
			if($(name2+'active')) Element.show(name2+'active');
			if($(name2+'inactive')) Element.hide(name2+'inactive');
		};
	},
	
	_create_new_elements: function() {
		for(var i=0;i<this.items_per_move;i++) {
			var item_number = this.current_position+this.items_showing+i;
			if(item_number > (this.item_count-1)) break;
			var temp_item_name = this.item_name+item_number;
			if(!$(temp_item_name)) {
				new Insertion.Bottom(this.dom_id,'<li class="'+this.item_class+'" id="'+temp_item_name+'"></li>');
				if(this.other_params){x = "&";}
				else{x="?";}
				var temp_update_url = this.ajax_url+x+"position="+item_number;
				new Ajax.Updater(temp_item_name,temp_update_url);
			};
		};
	},
	
	_do_slide: function(direction) {
		var how_many = this.items_per_move;
		if(direction == this.RIGHT || direction == this.DOWN) {
			if((this.current_position+this.items_showing+this.items_per_move)>this.item_count) how_many -= ((this.current_position+this.items_showing+this.items_per_move)-this.item_count);
		} else {
			if((this.current_position-this.items_per_move)<0) how_many -= (this.items_per_move-this.current_position);
		}
		var x = 0;
		var y = (this.item_size*how_many*direction);
		if(this.is_vertical) {
			x = (this.item_size*how_many*direction);
			y = 0;
		};
		new Effect.Parallel([
			new Effect.MoveBy(this.dom_id,x,y,{ sync: true })
		]);
		this.current_position += (0-(direction*how_many));
		this.render_navigation();
	}
};