function CMImageGallerySlider(/*prefix,direction,classnames,continuous*/){
	// set the prefix
	this.prefix = 'cmig';
	if(arguments.length > 0) this.prefix = arguments[0];
	// set the direction
	this.direction = 'horizontal';
	if(arguments.length > 1) this.direction = arguments[1];
	// set the names of the button classes
	this.classnames  = {
		'before_clicked' : this.prefix+'_clicked',
		'after_clicked' : this.prefix+'_clicked',
		'before_disabled' : this.prefix+'_disabled',
		'after_disabled' : this.prefix+'_disabled'
	}
	if(arguments.length > 2){
		var cn = arguments[2];
		if(cn.before_clicked) this.classnames.before_clicked = cn.before_clicked;
		if(cn.after_clicked) this.classnames.after_clicked = cn.after_clicked;
		if(cn.before_disabled) this.classnames.before_disabled = cn.before_disabled;
		if(cn.after_disabled) this.classnames.after_disabled = cn.after_disabled;
	}
	this.continuous = arguments.length > 3?(arguments[3]?true:false):true;
	this.ishorizontal = (this.direction != 'vertical');
	
	this.speed = 40;
	this.stepping = false;
	this.stepindex = 0;
	this.stepdistanceleft = 0;
	this.stepdirection = 1;
	this.shownpanels = 0;
	
	this.window = document.getElementById(this.prefix+'_window'); 
	this.belt = document.getElementById(this.prefix+'_belt');
	this.beforebutton = document.getElementById(this.prefix+'_beforebutton'); 
	this.afterbutton = document.getElementById(this.prefix+'_afterbutton');
	
	this.windowsize = this.ishorizontal?this.window.offsetWidth:this.window.offsetHeight;
	
	this.obj = "CMImageGallerySliderInstance_" + (++ CMImageGallerySlider.instance);
	eval (this.obj + "=this");
	
	this.panelArray = [];
	var totalsize = this.continuous?this._populatePanelArray():this._measurePanels();
	if(totalsize > this.windowsize){
		this.currentpanel = 0;	
		this.originalbeltoffset = this.ishorizontal?this.belt.offsetLeft:this.belt.offsetTop;
		if(this.continuous){
			eval('this.beforebutton.onclick = function(){ ' + this.obj + '.step(1); }');
			eval('this.afterbutton.onclick = function(){ ' + this.obj + '.step(-1); }');
			this.beforebutton.className = this.beforebutton.className.replace(this.classnames.before_disabled,'');
			this.afterbutton.className = this.afterbutton.className.replace(this.classnames.after_disabled,'');
			this._positionPanels();
		}else{
			if(this.ishorizontal) this.belt.style.width = totalsize + 'px';
			else this.belt.style.height =  totalsize + 'px';
			eval('this.afterbutton.onclick = function(){ ' + this.obj + '.step(-1); }');
			this.afterbutton.className = this.afterbutton.className.replace(this.classnames.after_disabled,'');
			this.beforebutton.className += ' ' + this.classnames.before_disabled;
		}
	}else{
		this.beforebutton.className += ' ' + this.classnames.before_disabled;
		this.afterbutton.className += ' ' + this.classnames.after_disabled;
	}
}
CMImageGallerySlider.instance = 0;

CMImageGallerySlider.prototype.step = function(direction){
	if(!this.stepping){
		this.stepping = true;
		this.stepindex = 0;
		this.stepdistanceleft = this.panelArray[this.currentpanel].size;
		this.stepdirection = direction;
		if(direction < 0){
			this.afterbutton.className += ' ' + this.classnames.after_clicked;
		}else{
			this.beforebutton.className += ' ' + this.classnames.before_clicked;
		}
		this.interval = setInterval(this.obj + '._stepincrement()',this.speed);
	}
}

CMImageGallerySlider.prototype._stepincrement = function(){
	if(this.stepdistanceleft){
		var inc = Math.floor(Math.min(this.stepdistanceleft,Math.max(this.stepdistanceleft/2,2)));
		if(this.ishorizontal){
			this.belt.style.left = (this.belt.offsetLeft - this.originalbeltoffset + (inc*this.stepdirection)) + 'px';
		}else{
			this.belt.style.top = (this.belt.offsetTop - this.originalbeltoffset + (inc*this.stepdirection)) + 'px';
		}
		this.stepindex ++;
		this.stepdistanceleft -= inc;
	}else{
		clearInterval (this.interval);
		this.interval = null;
		this.currentpanel -= this.stepdirection;
		if(this.stepdirection < 0){
			this.afterbutton.className = this.afterbutton.className.replace(this.classnames.after_clicked,'');
		}else{
			this.beforebutton.className = this.beforebutton.className.replace(this.classnames.before_clicked,'');
		}
		if(this.continuous){
			if(this.currentpanel < 0) this.currentpanel = this.panelArray.length - 1;
			if(this.currentpanel > this.panelArray.length - 1) this.currentpanel = 0;
			this._positionPanels();
		}else{
			if(this.currentpanel <= 0){
				this.beforebutton.className += ' ' + this.classnames.before_disabled;
				eval('this.beforebutton.onclick = null');
			}else{
				this.beforebutton.className = 'CMSliderGallery_beforebutton';
				eval('this.beforebutton.onclick = function(){ ' + this.obj + '.step(1); }');
			}
			if((this.currentpanel) >= this.panelArray.length - this.shownpanels){
				this.afterbutton.className += ' ' + this.classnames.after_disabled;
				eval('this.afterbutton.onclick = null');
			}else{
				this.afterbutton.className = this.afterbutton.className.replace(this.classnames.after_disabled,'');
				eval('this.afterbutton.onclick = function(){ ' + this.obj + '.step(-1); }');
			}
		}
		this.stepping = false;
	}
}

CMImageGallerySlider.prototype._populatePanelArray = function(){
	var removes = [];
	var totalsize = 0;
	for(i=0;i<this.belt.childNodes.length;i++){
		var panel = this.belt.childNodes[i];
		if(panel.id && panel.id.substring(0,this.prefix.length+6) == this.prefix + '_panel'){
			var sliderpanel = new CMImageGallerySliderPanel(this,panel);
			this.panelArray[this.panelArray.length] = sliderpanel;
			totalsize += sliderpanel.size;
		}else{
			removes[removes.length] = panel;
		}
	}
	for(i=0;i<removes.length;i++){
		this.belt.removeChild(removes[i]);
	}
	return totalsize;
}

CMImageGallerySlider.prototype._measurePanels = function(){
	var totalsize = 0;
	for(i=0;i<this.belt.childNodes.length;i++){
		var panel = this.belt.childNodes[i];
		if(panel.id && panel.id.substring(0,this.prefix.length+6) == this.prefix + '_panel'){
			var sliderpanel = new CMImageGallerySliderPanel(this,panel);
			this.panelArray[this.panelArray.length] = sliderpanel;
			totalsize += sliderpanel.size;
			if(totalsize <= this.windowsize) this.shownpanels++;
		}
	}
	return totalsize;
}

CMImageGallerySlider.prototype._positionPanels = function(){
	var current = this.panelArray[this.currentpanel];
	var previous = this.panelArray[this._getPreviousPanelIndex(this.currentpanel)];
	// remove all panels before the current, but ensure that at least one is left behind for the back action.
	var removes = [];
	for(i=0;i<this.belt.childNodes.length;i++){
		var panel = this.belt.childNodes[i];
		if(panel == previous.obj){
			break;
		}else if(panel == current.obj){
			this.belt.insertBefore(previous.obj,current.obj);
			break;
		}else{
			removes[removes.length] = panel;
		}
	}
	for(i=0;i<removes.length;i++){
		this.belt.removeChild(removes[i]);
	}
	// identify where the end point is
	var coveredwindow = 0;
	var lastindex = this.currentpanel;
	for(i=0;i<this.belt.childNodes.length;i++){
		var panel = this.belt.childNodes[i];
		if(panel == previous.obj){
			continue;
		}else{
			coveredwindow += this.ishorizontal?panel.offsetWidth:panel.offsetHeight;
			lastvisibleitem = this.panelArray[lastindex];
			lastindex = this._getNextPanelIndex(lastindex);
			if(coveredwindow > this.windowsize){
				break;
			}
		}
	}
	// ensure that visible panels cover the whole window
	while(coveredwindow < this.windowsize){
		lastvisibleitem = this.panelArray[lastindex];
		this.belt.appendChild(lastvisibleitem.obj);
		coveredwindow += lastvisibleitem.size;
		lastindex = this._getNextPanelIndex(lastindex);
	}
	// add the next item
	var afterlast = lastvisibleitem.obj.nextSibling;
	if(afterlast==null){
		afterlast = this.panelArray[lastindex].obj;
		this.belt.appendChild(afterlast);
	}
	// Remove all items after that
	var remover = afterlast.nextSibling;
	while(remover){
		this.belt.removeChild(remover);
		remover = afterlast.nextSibling;
	}

	if(this.ishorizontal){
		this.belt.style.width = (coveredwindow + previous.size + afterlast.offsetWidth) + 'px';
		this.belt.style.left = -previous.size + 'px';
	}else{
		this.belt.style.height = (coveredwindow + previous.size + afterlast.offsetHeight) + 'px';
		this.belt.style.top = -previous.size + 'px';
	}
}

CMImageGallerySlider.prototype._getNextPanelIndex = function(index){
	return (index == this.panelArray.length-1)?0:index+1;
}

CMImageGallerySlider.prototype._getPreviousPanelIndex = function(index){
	return (index == 0)?this.panelArray.length-1:index-1;
}

function CMImageGallerySliderPanel(owner,obj){
	this.owner = owner;
	this.obj = obj;
	this.index = obj.id.substring(owner.prefix.length+7);
	this.size = owner.ishorizontal?obj.offsetWidth:obj.offsetHeight;
}
var preloaded_file ='';
var blending = false;
var loading_bg=false;
var CMImageGalleryShowImage = {
	show:function(id,newimage){
		var oldimage = document.getElementById('img_fullview');
		var oldimage_src = oldimage.src;
		if(newimage.length<=0 || blending==true){
			oldimage.src=newimage;
			return;
		 }
		blending = true;
		CMImageGalleryShowImage.showLoading(id);
		preloaded_file = new Image();
		preloaded_file.src = newimage; 
		preloaded_file.onLoad = CMImageGalleryShowImage.blendstart(id,oldimage,preloaded_file,'2000');
		return;	

	},
	showLoading: function(id){
		if(loading_bg==false){
		loading_bg=true;
		var div_obj = document.getElementById('CMSliderGallery_Image_'+id);
		var overlay = document.getElementById('overlay');
		overlay.style.display = "";
		overlay.style.left = parseInt(findPosX(div_obj)+1)+'px';
		overlay.style.top = parseInt(findPosY(div_obj)+1)+'px';
		}else{
			loading_bg = false;
			var div_obj = document.getElementById('CMSliderGallery_Image_'+id);
			var overlay = document.getElementById('overlay');
			overlay.style.display = "none";	
		}		
	},
	blendstart:function(id,oldimage,newimage,millisec){
		CMImageGalleryShowImage.showLoading(id);
		CMImageGalleryShowImage.blendimage('CMSliderGallery_Image_'+id,oldimage,newimage,millisec)
	},
	blendimage: function(divid, oldimage, newimage_name, millisec) {
		var speed = Math.round(millisec / 100);
		var timer = 0;
		
		//set the current image as background
		var div_holder = document.getElementById(divid);
		div_holder.style.backgroundImage = "url(" + oldimage.src + ")";
		
		//make image transparent
		CMImageGalleryShowImage.changeOpac(0, 'img_fullview');
		
		//make new image
		oldimage.src = newimage_name.src;
		var intervalID= "";
		//fade in image
		for(i = 1; i <= 100; i++) {
			intervalID = setTimeout("CMImageGalleryShowImage.changeOpac(" + i + ",'img_fullview')",(timer*speed));
			timer++;
		}
		clearTimeout(intervalID);
	},
	
	//change the opacity for different browsers
	changeOpac:function(opacity, id) {
		var Imgobject = document.getElementById(id).style; 
		Imgobject.opacity = (opacity / 100);
		Imgobject.MozOpacity = (opacity/100);
		Imgobject.KhtmlOpacity = (opacity / 100);
		Imgobject.filter = "alpha(opacity=" + opacity + ")";
		if(opacity>85) blending=false;
	}
};

function findPosX(obj) {
    var curleft = 0;
    if (obj.offsetParent) {
        while (1) {
            curleft+=obj.offsetLeft;
            if (!obj.offsetParent) {
                break;
            }
            obj=obj.offsetParent;
        }
    } else if (obj.x) {
        curleft+=obj.x;
    }
    return curleft;
}
function findPosY(obj) {
    var curtop = 0;
    if (obj.offsetParent) {
        while (1) {
            curtop+=obj.offsetTop;
            if (!obj.offsetParent) {
                break;
            }
            obj=obj.offsetParent;
        }
    } else if (obj.y) {
        curtop+=obj.y;
    }
    return curtop;
}
