bIE = document.all?true:false
	if (!bIE) document.captureEvents(Event.MOUSEMOVE)
	var iSlidePanelWidth = 0
	var iSlideX = 0

	var clsSlidePanel = Class.create()
	clsSlidePanel.prototype = {
		initialize: function(p_oSlidePanel){
			this.m_sSlidePanelId 					= p_oSlidePanel
			this.m_iImageMargin						= 5
			this.m_iImageBorder						= 1
		}, 
		init: function(){
			this.m_oSlidePanelWrapper				= $("SlidePanelWrapper")
			this.m_oSlidePanel						= $("SlidePanel")
			this.m_oSlidePanelTabel					= $('SlidePanelTabel')
			this.m_iAppearTimeout					= 1000
			this.m_iFPS								= 32
			this.m_bAutoSlideScroll					= true
			this.m_iWidth							= 0
			this.m_iHeight							= 0
			this.m_bDebug							= false
			this.m_iPixelsPS						= 1000
			this.m_nWhenMouseSlide					= 0.20
			this.m_iSlideTimeout					= Math.round(1000 / this.m_iFPS)
			this.m_bDoOnSetSlideOnLoad				= true
			
			this.addMouseSlideFunctions($('SlidePanelLeft'), 'left')
			this.addMouseSlideFunctions($('SlidePanelRight'), 'right')

			this.m_oSlidePanelWrapper.style.zIndex 	= 1
			//this.m_oSlidePanel.style.zIndex 		= 1
			this.m_oSlidePanelTabel.style.zIndex 	= 1
			$('SlidePanelBody').style.zIndex 		= 1
			this.m_iPreviewDivZIndex				= 2
			$('SlidePanelLeft').style.zIndex 		= 60
			$('SlidePanelRight').style.zIndex 		= 60
			$('SlidePanelLeftImg').style.zIndex 	= 60
			$('SlidePanelRightImg').style.zIndex 	= 60
			
			this.reset()
		},
		reset: function(){
			this.m_oSlidePanelTabel.style.visibility = 'hidden';
			this.i										= 0
			this.m_iTotal								= 0
			this.m_aImages								= new Array()
			this.m_iScrollStart							= 0
			this.m_iScrollCurrent						= 0
			this.m_aImageWidth							= new Array()
			this.m_aAttributes							= new Array()
			this.m_bLoaded								= false
			this.m_iLoadedImages						= 0
			this.m_bAnimateSlide						= false
			this.m_bEnabled								= true
			$('SlidePanelLeftImg').style.visibility		= 'hidden'
			$('SlidePanelRightImg').style.visibility	= 'hidden'
			this.m_aArrowStatus							= new Array();
			this.m_aArrowStatus['left']					= 'hidden'
			this.m_aArrowStatus['right']				= 'hidden'
			this.m_nSlideFactor							= 0

			try{
				clearInterval(this.m_oScrollHandler)
			}catch(e){if(this.m_bDebug || g_bDebug)displayError(e)}

			if(typeof(this.m_oEffect) == 'object')
				this.m_oEffect.cancel();
		},
		
/*		setLoading: function(p_bEnabled){
			this.m_oLoadingPanel.style.display = p_bEnabled ? '' : 'none'
		},
		
*/
		setLoadingImage: function(sImgId, src){
			if(typeof(sImgId) == 'string' && typeof(src) == 'string' && src != ''){
				this.m_oLoadingImg 				= $(sImgId)
				this.m_oLoadingImage 			= new Image()
				this.m_oLoadingImage.src		= src
			}
		},
		setNotLoadingImage: function(sImgId, src){
			if(typeof(sImgId) == 'string' && typeof(src) == 'string' && src != ''){
				this.m_oLoadingImg 				= $(sImgId)
				this.m_oNotLoadingImage 		= new Image()
				this.m_oNotLoadingImage.src		= src
			}
		},
		loading: function(set){
			if(set){
				if(typeof(this.m_oLoadingImage) == 'object'){
					this.m_oLoadingImg.style.visibility = 'visible'
					this.m_oLoadingImg.src = this.m_oLoadingImage.src
				}
			}else{
				if(typeof(this.m_oNotLoadingImage) == 'object'){
					this.m_oLoadingImg.style.visibility = 'visible'
					this.m_oLoadingImg.src = this.m_oNotLoadingImage.src
				}else
					this.m_oLoadingImg.style.visibility = 'hidden'
			}
		},
		setImagePath: function(p_sPath){
			this.m_sImagePath = p_sPath
		},
		setAnimateSlide: function(p_bEnabeld){
			this.m_bAnimateSlide				= p_bEnabeld
		},
		setEnabled: function(p_bEnabeld){
			this.m_bEnabled						= p_bEnabeld
			this.setSlidesStyle(p_bEnabeld)
		},
		setSlidesStyle: function(p_bEnabeld){
			for(var i = 0;i < this.m_iTotal;i++)
				$("PreviewPicPanel"+i).style.cursor = p_bEnabeld ? 'pointer' : 'default'
		},
		setTotal: function(p_iTotal){
			this.m_iTotal 						= p_iTotal
		},
		setSize: function(p_iWidth, p_iHeight){
			if(p_iWidth && p_iHeight){
				//this.m_oSlidePanelWrapper.style.width 	= p_iWidth+"px"
				this.m_oSlidePanel.style.width 			= p_iWidth+"px"
				this.m_iWidth							= p_iWidth
				iSlidePanelWidth						= p_iWidth
				this.m_oSlidePanel.style.height 		= (p_iHeight)+"px"
				this.m_iHeight							= p_iHeight
				nMouseAutoSlideWidth					= Math.round(this.m_nWhenMouseSlide * (this.m_iWidth / 2))
				$('SlidePanelLeft').style.width			= nMouseAutoSlideWidth+'px'
				$('SlidePanelRight').style.width		= nMouseAutoSlideWidth+'px'
				
				$('SlidePanelLeft').style.height		= this.m_oSlidePanel.style.height
				$('SlidePanelRight').style.height		= this.m_oSlidePanel.style.height
				
/*				this.m_oLoadingPanel.style.width		= p_iWidth+"px"
				this.m_oLoadingPanel.style.height		= p_iHeight+"px"
				
				this.m_oLoadingImg.style.left		= Math.round((p_iWidth - this.m_oLoadingImg.width) / 2)+"px"
				this.m_oLoadingImg.style.top		= Math.round((p_iHeight - this.m_oLoadingImg.height) / 2)+"px"
				
*/				try{
					$("leftPreviewSpacer").style.width = Math.floor(p_iWidth / 2)+"px"
					$("rightPreviewSpacer").style.width = Math.floor(p_iWidth / 2)+"px"
				}catch(e){}
			}
		},
		setSlide: function(){
			if(this.m_iTotal > 0){
				//displayMessage(this.m_iTotal)
	
				clearInterval(this.m_oScrollHandler)
				
				this.m_iScrollDestination	= this.getScrollDestination()
				
				this.m_iScrollCurrent		= this.m_oSlidePanel.scrollLeft ? this.m_oSlidePanel.scrollLeft : 0
				this.m_iScrollStart			= this.m_iScrollCurrent 
				

				this.m_iScrollSteps			= Math.round(500 / this.m_iSlideTimeout)
				this.m_iScrollStep			= 0
				
				var self = this
				
				if(this.m_bAnimateSlide){
					if(this.m_bDebug || g_bDebug)displayMessage("animated")
					if(this.m_iScrollDestination != this.m_iScrollCurrent){
						this.m_oScrollHandler 	= window.setInterval(function(){
							self.makeSlideScrollStep()
						}, this.m_iSlideTimeout)
					}
				}else{
					if(this.m_bDebug || g_bDebug)displayMessage("not animated")
					this.setSlideScroll(this.m_iScrollDestination)
					try{
						if(this.m_bDoOnSetSlideOnLoad)
							this.onSlideSet(this.i)
						else
							this.m_bDoOnSetSlideOnLoad = true
					}catch(e){if(this.m_bDebug || g_bDebug)displayError(e)}
				}
			}else
				if(this.m_bDebug || g_bDebug)displayMessage('SlidePanel Total: ('+this.m_iTotal+')')
		},
		doOnSetSlideOnLoad: function(p_bEnabeld){
			this.m_bDoOnSetSlideOnLoad = p_bEnabeld
		}, 
		isEnabled: function(){
			return this.m_bEnabled
		},
		makeSlideScrollStep: function()
		{
			this.m_iScrollStep++
			this.m_iScrollCurrent 		= this.factor(this.m_iScrollStep / this.m_iScrollSteps) * (this.m_iScrollDestination - this.m_iScrollStart) + this.m_iScrollStart
			this.setSlideScroll(this.m_iScrollCurrent)
			if(this.m_iScrollCurrent == this.m_iScrollDestination){
				clearInterval(this.m_oScrollHandler)
				try{
					this.onSlideSet(this.i)
				}catch(e){if(this.m_bDebug || g_bDebug)displayError(e)}
			}
		},
		setSlideScroll: function(p_iPixels){
			p_iPixels = Math.round(p_iPixels)
			this.m_oSlidePanel.scrollLeft		= p_iPixels
			this.m_iScrollCurrent				= p_iPixels
			this.m_nNewScrollCurrent 			= p_iPixels
		},
		factor: function(f)
		{
			return .5 - Math.cos(f * Math.PI) * .5
			//(-Math.cos(f*Math.PI)/2) + 0.5; 
			//.5 - Math.cos(f * Math.PI) * .5
		},
		getScrollDestination: function(){
			iScrollDestination 	= 0 
			for(var i = 0;i <= this.i;i++){
				iScrollDestination += this.getPreviewWidth(i)
				//if(this.m_bDebug || g_bDebug)displayMessage(this.m_aImageWidth[i]+' + Math.round(('+this.m_iImageBorder+' + '+this.m_iImageMargin+') * 2)')
			}
			iScrollDestination -= Math.floor(this.getPreviewWidth(this.i) / 2)
			return iScrollDestination
		},
		getTotalScrollWidth: function(){
			iTotalScrollWidth = 0 
			for(var i = 0;i < this.m_iTotal;i++)
				iTotalScrollWidth += this.getPreviewWidth(i)
			return iTotalScrollWidth;
		},
		getPreviewWidth: function(i){
			return this.m_aImageWidth[i] + Math.round((this.m_iImageBorder + this.m_iImageMargin) * 2)
		},
		setImageProperties: function(p_iImageMargin, p_iImageBorder){
			this.m_iImageMargin		= p_iImageMargin
			this.m_iImageBorder		= p_iImageBorder
		},
		setImageMargin: function(p_iImageMargin){
			this.m_iImageMargin		= p_iImageMargin
		},
		setSlideSelection: function(i){
			if(this.m_bDebug || g_bDebug)displayMessage('clsSlidePanel:setSlideSelection('+i+')')
			this.i = i
			for(var ii = 0;ii < this.m_iTotal;ii++){
				PreviewPicPanel = $("PreviewPicPanel"+ii)
				if(ii == i){
					PreviewPicPanel.className = "SelectedPreviewPic"
					PreviewPicPanel.setAttribute("class", "SelectedPreviewPic")
					setOpacity(PreviewPicPanel, 1.0)
				}else{
					PreviewPicPanel.className = "UnselectedPreviewPic"
					PreviewPicPanel.setAttribute("class", "UnselectedPreviewPic")
					setOpacity(PreviewPicPanel, 0.5)
				}
			}
			//try{
			//}catch(e){if(this.m_bDebug || g_bDebug)displayError(e)}
			
			if(this.m_bAutoSlideScroll)
				this.setSlide()
		},
		setSlideSelectionById: function(id){
			for(var i = 0;i < this.m_iTotal;i++)
				if(typeof(this.m_aAttributes[i]) == 'object')
					if(typeof(this.m_aAttributes[i]['id']) == 'number')
						if(this.m_aAttributes[i]['id'] == id)
							return this.setSlideSelection(i)
			throw new Error("Slide can't be set by id. ")
		},
		previousSlide: function(){
			this.setSlideSelection(this.getPreviousSlideNum())
		}, 
		getPreviousSlideNum: function(){
			return this.i - 1 >= 0 ? this.i - 1 : this.m_iTotal - 1
		},
		nextSlide: function(){
			this.setSlideSelection(this.getNextSlideNum())
		}, 
		getNextSlideNum: function(){
			return this.i + 1 < this.m_iTotal ? this.i + 1 : 0
		},
		disableAutoSlideScroll: function(){
			this.m_bAutoSlideScroll				= false
		},
		getPreviewDiv: function(i){
			var self = this

			var PreviewPicPanel = 					document.createElement("div")
			var img =								new Image()
			
			PreviewPicPanel.setAttribute("id", 		"PreviewPicPanel"+i)
			PreviewPicPanel.setAttribute("class", 	"PreviewPicPanel")
			PreviewPicPanel.className = 			"PreviewPicPanel"
			PreviewPicPanel.style.zIndex = 			(this.m_iPreviewDivZIndex - 1)
			
			//var img 				= new Image()
			//img.setAttribute("id", 					"PreviewPic"+i)
			PreviewPicPanel.onclick = function(){
				if(self.isEnabled()){
					try{
						self.onSlideClick(i)
					}catch(e){/*if(this.m_bDebug || g_bDebug)displayError(e)*/}
					if(self.i != i)
						self.setSlideSelection(i)
				}
			}
			PreviewPicPanel.onmouseover = function(){
				if(self.isEnabled())
					self.hoverPreviewImg(this, true, i)										  
			}
			PreviewPicPanel.onmouseout = function(){
				if(self.isEnabled())
					self.hoverPreviewImg(this, false, i)										  
			}

			//img.setAttribute("alt", 				"")
			PreviewPicPanel.setAttribute("class", 				"UnselectedPreviewPic")
			PreviewPicPanel.className = 						"UnselectedPreviewPic"
			//PreviewPicPanel.style.zIndex = 						(this.m_iPreviewDivZIndex - 1)
			
			//PreviewPicPanel.appendChild(img)
			
			var img = 								new Image()
			img.src = 								this.m_sImagePath+"picLoadingSmall.gif"
			img.setAttribute("id", 					"PreviewLoadPic"+i)
			img.setAttribute("class", 				"PreviewLoadPic")
			img.className = 						"PreviewLoadPic"
			img.style.display =						"none"
			img.style.zIndex = 						this.m_iPreviewDivZIndex
			
			PreviewPicPanel.appendChild(img)

			return PreviewPicPanel
		}, 
		hoverPreviewImg: function(obj, Over, i){
			if(Over)
				setOpacity(obj, 1.0)
			else
				if(obj.className != "SelectedPreviewPic")
					setOpacity(obj, 0.5)
		},
		prepareSlides: function(p_iTotal){
			this.setTotal(p_iTotal)

			var self = this

			removeResults('SlidePanelBody')
			var row = document.createElement("tr")

			var div = document.createElement("div")
			div.setAttribute("id", "leftPreviewSpacer")
			div.style.width = Math.floor(this.m_iWidth / 2)+"px"
			div.appendChild(document.createTextNode(" "))

			var td = document.createElement("td")
			td.style.padding = 0
			//this.addMouseSlideFunctions(td)
			td.appendChild(div)
			
			row.appendChild(td)

			for(var i = 0;i < p_iTotal;i++){
				var cell = document.createElement("td")
				//this.addMouseSlideFunctions(cell)
				cell.appendChild(this.getPreviewDiv(i))
				cell.style.zIndex = this.m_iPreviewDivZIndex
				row.appendChild(cell)
			}

			var div = document.createElement("div")
			div.setAttribute("id", "rightPreviewSpacer")
			div.style.width = Math.floor(this.m_iWidth / 2)+"px"
			div.appendChild(document.createTextNode(" "))

			var td = document.createElement("td")
			td.style.padding = 0
			//this.addMouseSlideFunctions(td)
			td.appendChild(div)
			
			row.appendChild(td)
			
			$('SlidePanelBody').appendChild(row)
		},
		setSlideImg: function(i, p_sPath, p_aAttributes){
			var self = this
			this.m_aImages[i] = new Image()
			this.m_aImages[i].onload = function(){
				self.m_aImageWidth[i] = this.width
				$("PreviewPicPanel"+i).style.background = "url('"+this.src+"')"
				$("PreviewPicPanel"+i).style.width = this.width+'px'
				$("PreviewPicPanel"+i).style.height = this.height+'px'
				self.checkIfLoaded();
			}
			this.m_aImages[i].src = p_sPath
			this.loading(true)
			this.setAttributes(i, p_aAttributes)
		},
		setAttributes: function(i, p_aAttributes){
			if(typeof(p_aAttributes) == 'object')
				this.m_aAttributes[i] = p_aAttributes
		}, 
		getAttributes: function(i){
			if(typeof(this.m_aAttributes[i]) == 'object')
				return this.m_aAttributes[i]
			else
				return false
		}, 
		setSlideLoading: function(i, loading){
			if(this.m_bAnimateSlide){
				var img = $("PreviewLoadPic"+i)
				if(img)
					img.style.display =						loading ? '' : 'none'
			}
		},
		checkIfLoaded: function(){
			this.m_iLoadedImages++
			if(this.m_iLoadedImages == this.m_iTotal){
				this.m_bLoaded = true
				this.loading(false)
				try{
					this.onLoaded();
				}catch(e){if(this.m_bDebug || g_bDebug)displayError(e)}
			}
		},
		onLoaded: function(){
			//this.setLoading(false)
			this.setSlideSelection(this.getDefault())
			this.setAnimateSlide(true)
			this.loading(false)
			this.m_oEffect = fadeObj('SlidePanelTabel', this.m_iAppearTimeout, 0, 100);
		}, 
		getDefault: function(){
			for(var i = 0;i < this.m_iTotal;i++){
				if(typeof(this.m_aAttributes[i]) == 'object'){
					if(typeof(this.m_aAttributes[i]['default']) == 'string'){
						if(parseInt(this.m_aAttributes[i]['default']) == 1)
							return i
					}
				}
			}
			return 0;
		}, 
		addMouseSlideFunctions: function(obj, direction){
			var self = this
			obj.onmousemove = function(ev){
				self.mouseMoveHandler(ev)
			}
			obj.onmouseover = function(){
				self.mouseOverHandler(direction)
			}
			obj.onmouseout = function(){
				self.mouseOutHandler(direction)
			}
		}, 
		mouseMoveHandler: function(ev){
			iSlideX = bIE ? event.clientX + document.body.scrollLeft : ev.pageX
			iSlideX = iSlideX < 0 ? 0 : iSlideX
		}, 
		mouseOverHandler: function(direction){
			if(!this.m_bMouseSlideInterval){
				this.m_bMouseSlideInterval = true
				this.m_iXSlidePanel = getPosX($("SlidePanel"))
				this.showArrow(direction)
				var self = this 
				clearTimeout(this.m_oMouseSlideOutHandler)
				this.m_oMouseSlideOverHandler = setInterval(function(){
					self.calculateMouseSlideVars()
					self.mouseSlide()
				}, self.m_iSlideTimeout)
			}
		}, 
		mouseOutHandler: function(direction){
			clearInterval(this.m_oMouseSlideOverHandler)
			this.m_bMouseSlideInterval = false
			this.hideArrow(direction)
		}, 
		calculateMouseSlideVars: function(){
			if(iSlideX > 0){
				var iX = iSlideX - this.m_iXSlidePanel
				
				var nNewSlideFactor 			= 0
				var hw 							= Math.round(iSlidePanelWidth / 2)
				
				if(iX < hw * this.m_nWhenMouseSlide || iX > hw * (2 - this.m_nWhenMouseSlide)){
					nlhw = hw * this.m_nWhenMouseSlide
					nrhw = hw * ((1 - this.m_nWhenMouseSlide) + 1)
					if(iX < hw){
						nNewSlideFactor 			= 1 - (1 / nlhw * iX)
						this.m_sSlideDirection		= 'left'
					}else{
						nNewSlideFactor 			= 1 / nlhw * (iX - nrhw)
						this.m_sSlideDirection		= 'right'
					}
				}
				this.m_nSlideFactor 	= nNewSlideFactor
			}
		}, 
		mouseSlide: function(){
			if(this.m_sSlideDirection == 'left'){
				this.m_nNewScrollCurrent 	-= this.m_nSlideFactor * (this.m_iPixelsPS / this.m_iFPS)
				iMaxLeft 			= Math.round(this.m_aImageWidth[0] / 2) + Math.round(this.m_iImageBorder + this.m_iImageMargin)
				this.m_nNewScrollCurrent 	= this.m_nNewScrollCurrent <= iMaxLeft ? iMaxLeft : this.m_nNewScrollCurrent
			}else{
				this.m_nNewScrollCurrent 	+= this.m_nSlideFactor * (this.m_iPixelsPS / this.m_iFPS)
				iMaxRight 			= Math.round(this.getTotalScrollWidth() - (this.m_aImageWidth[this.m_iTotal - 1] / 2)) - (this.m_iImageBorder + this.m_iImageMargin)
				this.m_nNewScrollCurrent 	= this.m_nNewScrollCurrent >= iMaxRight ? iMaxRight : this.m_nNewScrollCurrent
			}
			nNewScrollCurrent = Math.round(this.m_nNewScrollCurrent)
			if(nNewScrollCurrent != this.m_iScrollPrevious){
				this.setSlideScroll(nNewScrollCurrent)
				this.m_iScrollPrevious = nNewScrollCurrent
			}
		}, 
		showArrow: function(direction){
			clearTimeout(this.m_aArrowTimeout)
			if(this.m_aArrowStatus[direction] == 'hidden'){
				this.m_aArrowStatus[direction] = 'in'
				
				var obj = direction == 'left' ? $('SlidePanelLeftImg') : $('SlidePanelRightImg')
				var self = this
				this.m_oEffect 			= new Spry.Effect.Fade(
					obj, 
					{
						finish: function(){
							self.m_aArrowStatus[direction] = 'visible'
						}, 
						duration: 250, 
						from: 0, 
						to: 100
					}
				)
				this.m_oEffect.start()
			}else if(this.m_aArrowStatus[direction] == 'out'){
				var self = this
				this.m_aArrowTimeout = setTimeout(function(){
					self.showArrow(direction)			
				}, 100)
			}
		}, 
		hideArrow: function(direction){
			clearTimeout(this.m_aArrowTimeout)
			if(this.m_aArrowStatus[direction] == 'visible'){
				this.m_aArrowStatus[direction] = 'out'

				var obj = direction == 'left' ? $('SlidePanelLeftImg') : $('SlidePanelRightImg')
				var self = this
				this.m_oEffect 			= new Spry.Effect.Fade(
					obj, 
					{
						finish: function(){
							self.m_aArrowStatus[direction] = 'hidden'
						}, 
						duration: 250, 
						from: 100, 
						to: 0
					}
				)
				this.m_oEffect.start()
			}else if(this.m_aArrowStatus[direction] == 'in'){
				var self = this
				this.m_aArrowTimeout = setTimeout(function(){
					self.hideArrow(direction)			
				}, 100)
			}
		}
	}
	
	function getPosX(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;
	}