var slideObj,slideParent,slideHmin,slideHmax,slideVmin,slideVmax,SlidebarBorderStyle,SlidebarBorderWidth,sliderStylesAdded=false,sliderArrowActive=false

function slideDo(){
  if(event.button==1){
    if(slideObj!=null){
	 n=slideObj.id.split('_')
	  if(slideObj.type=='draggableSliderHandle'){
        if(slideParent.type=='vertical'){
          if(((event.clientY-slider_y)>=slideVmin)&&((event.clientY-slider_y)<=slideVmax)){
			moveSlider(n[1],event.clientY - slider_y)
           }
		 }
        if(slideParent.type=='horizontal'){
          if(((event.clientX-slider_x)>=slideHmin)&&((event.clientX-slider_x)<=slideHmax)){
			moveSlider(n[1],event.clientX-slider_x)
           }
		 }
        return false
	   }
     }
   }
 }

function slideGet(){
  slideObj=event.srcElement
  slideParent=slideObj.parentElement
  slider_x = (event.clientX-slideObj.style.pixelLeft);
  slider_y = (event.clientY-slideObj.style.pixelTop);
  slideHmin = 0
  slideVmin = 0
  if(slideObj.tagName=='IMG'){
    slideHmax = slideParent.offsetWidth-slideObj.offsetWidth
	slideVmax = slideParent.offsetHeight-slideObj.offsetHeight
   }else{
    slideHmax = (slideParent.offsetWidth-slideObj.offsetWidth)-(SlidebarBorderWidth*2)
    slideVmax = (slideParent.offsetHeight-slideObj.offsetHeight)-(SlidebarBorderWidth*2)
   }
 }

function slideDrop(){
 slideObj=null
}

function slideArrowEvent(id,dir){
 arrowObj=id.split('_')
 slideArrowScroll(arrowObj[1],dir,arrowObj[0])
}

function slideArrowScroll(what,dir,arrowDir){
 if(sliderArrowActive){
  step=1
  holder=document.getElementById('slideBit_'+what)
  if(dir=='vertical'){
   ot=holder.offsetTop
   pw=holder.parentElement.offsetWidth
   ph=holder.parentElement.offsetHeight
   if(arrowDir=='slideArrowA'){
    if(ot>0){
	 moveSlider(what,ot-step)
	 t=setTimeout('slideArrowScroll("'+what+'","'+dir+'","'+arrowDir+'")',step)
    }
   }
   if(arrowDir=='slideArrowB'){
    if(ot<ph-pw){
	 moveSlider(what,ot+step)
	 t=setTimeout('slideArrowScroll("'+what+'","'+dir+'","'+arrowDir+'")',step)
    }
   }
  }
  if(dir=='horizontal'){
   ol=holder.offsetLeft
   pw=holder.parentElement.offsetWidth
   ph=holder.parentElement.offsetHeight
   if(arrowDir=='slideArrowA'){
    if(ol>0){
	 moveSlider(what,ol-step)
	 t=setTimeout('slideArrowScroll("'+what+'","'+dir+'","'+arrowDir+'")',step)
    }
   }
   if(arrowDir=='slideArrowB'){
    if(ol<pw-ph){
	 moveSlider(what,ol+step)
	 t=setTimeout('slideArrowScroll("'+what+'","'+dir+'","'+arrowDir+'")',step)
    }
   }
  }
 }
}

function createSlider(what,T,L,H,W,dir,type,pic1,pic2,pic3,pic4,arrows,pointer,color1,color2,eventType){
 holder=document.getElementById(what)
 holder.attachEvent('onmousedown',slideGet)
 holder.attachEvent('onmousemove',slideDo)
 holder.attachEvent('onmouseup',slideDrop)
 var str=''
 var tmp=what.split('slideBar')
 SlidebarBorderStyle ='solid'
 SlidebarBorderWidth =1
 if(dir=='vertical'){arrowFontSize=W/2}
 if(dir=='horizontal'){arrowFontSize=H/2}
 if(eventType=='click')events='onmousedown="sliderArrowActive=true;slideArrowEvent(this.id,\''+dir+'\')" onmouseup="sliderArrowActive=false;"'
 if(eventType=='over')events='onmouseover="sliderArrowActive=true;slideArrowEvent(this.id,\''+dir+'\')" onmouseout="sliderArrowActive=false;"'
 if(type=='standard'){
  var sliderHandleWidth=W-(SlidebarBorderWidth*2)
  var sliderHandleHeight=H-(SlidebarBorderWidth*2)
  if(arrows){
   if(dir=='vertical'){
    str+='<div id="slideArrowA_'+tmp[1]+'" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color2+';background:'+color2+';font-family:webdings;font-size:'+arrowFontSize+';color:'+color1+';top:'+T+';left:'+L+';height:'+W+';width:'+W+';cursor:'+pointer+';" align="center" onselectstart="return false" '+events+'>5</div>'
    str+='<div id="slideArrowB_'+tmp[1]+'" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color2+';background:'+color2+';font-family:webdings;font-size:'+arrowFontSize+';color:'+color1+';top:'+(H+W+T)+';left:'+L+';height:'+W+';width:'+W+';cursor:'+pointer+';" align="center" onselectstart="return false" '+events+'>6</div>'
    arrowOffsetT=W+T
    arrowOffsetL=L
   }
   if(dir=='horizontal'){
    str+='<div id="slideArrowA_'+tmp[1]+'" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color2+';background:'+color2+';font-family:webdings;font-size:'+arrowFontSize+';color:'+color1+';top:'+T+';left:'+L+';height:'+H+';width:'+H+';cursor:'+pointer+';" align="center" onselectstart="return false" '+events+'>3</div>'
    str+='<div id="slideArrowB_'+tmp[1]+'" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color2+';background:'+color2+';font-family:webdings;font-size:'+arrowFontSize+';color:'+color1+';top:'+T+';left:'+(H+W+L)+';height:'+H+';width:'+H+';cursor:'+pointer+';" align="center" onselectstart="return false" '+events+'>4</div>'
    arrowOffsetT=T
    arrowOffsetL=L+H
   }
  }else{
   arrowOffsetT=T
   arrowOffsetL=L
  }
  str+='<div id="slideBar_'+tmp[1]+'" type="'+dir+'" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color2+';background:'+color1+';font-family:verdana;font-size:0;top:'+arrowOffsetT+';left:'+arrowOffsetL+';height:'+H+';width:'+W+';" onselectstart="return false;">'
   if(dir=='vertical'){
    str+='<div id="slideBit_'+tmp[1]+'" type="draggableSliderHandle" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color1+';background:'+color2+';font-family:verdana;font-size:0;height:'+sliderHandleWidth+';width:'+sliderHandleWidth+';cursor:'+pointer+'" onselectstart="return false;"></div>'
   }
   if(dir=='horizontal'){
    str+='<div id="slideBit_'+tmp[1]+'" type="draggableSliderHandle" style="position:absolute;border:'+SlidebarBorderWidth+' '+SlidebarBorderStyle+' '+color1+';background:'+color2+';font-family:verdana;font-size:0;height:'+sliderHandleHeight+';width:'+sliderHandleHeight+';cursor:'+pointer+'" onselectstart="return false;"></div>'
   }
  str+='</div>'
 }
if(type=='picture'){
  sliderHandleWidth=W
  sliderHandleHeight=H
  if(arrows){
   if(dir=='vertical'){
    str+='<img src="'+pic3+'" id="slideArrowA_'+tmp[1]+'" style="position:absolute;top:'+T+';left:'+L+';height:'+W+';width:'+W+';cursor:'+pointer+';" align="center" onselectstart="return false" ondragstart="return false" '+events+'>'
    str+='<img src="'+pic4+'" id="slideArrowB_'+tmp[1]+'" style="position:absolute;top:'+(H+W+T)+';left:'+L+';height:'+W+';width:'+W+';cursor:'+pointer+';" align="center" onselectstart="return false" ondragstart="return false" '+events+'>'
    arrowOffsetT=T+W
    arrowOffsetL=L
   }
   if(dir=='horizontal'){
    str+='<img src="'+pic3+'" id="slideArrowA_'+tmp[1]+'" style="position:absolute;top:'+T+';left:'+L+';height:'+H+';width:'+H+';cursor:'+pointer+';" align="center" onselectstart="return false" ondragstart="return false" '+events+'>'
    str+='<img src="'+pic4+'" id="slideArrowB_'+tmp[1]+'" style="position:absolute;top:'+T+';left:'+(H+W+L)+';height:'+H+';width:'+H+';cursor:'+pointer+';" align="center" onselectstart="return false" ondragstart="return false" '+events+'>'
    arrowOffsetT=T
    arrowOffsetL=L+H
   }
  }else{
   arrowOffsetT=T
   arrowOffsetL=L
  }
  str+='<div id="slideBar_'+tmp[1]+'" type="'+dir+'" style="position:absolute;top:'+arrowOffsetT+';left:'+arrowOffsetL+';height:'+H+';width:'+W+';">'
   if(dir=='vertical'){
    str+='<img style="position:absolute;height:100%;width:100%;" src="'+pic1+'" onselectstart="return false;"><img id="slideBit_'+tmp[1]+'" type="draggableSliderHandle" src="'+pic2+'" style="position:absolute;height:'+sliderHandleWidth+';width:'+sliderHandleWidth+';cursor:'+pointer+'">'
   }
   if(dir=='horizontal'){
    str+='<img style="position:absolute;height:100%;width:100%;" src="'+pic1+'" onselectstart="return false;"><img id="slideBit_'+tmp[1]+'" type="draggableSliderHandle" src="'+pic2+'" style="position:absolute;height:'+sliderHandleHeight+';width:'+sliderHandleHeight+';cursor:'+pointer+'">'
   }
  str+='</div>'
 }
 holder.insertAdjacentHTML("beforeEnd",str)
}

function moveSlider(what,val){
 sliderEl=document.getElementById('slideBit_'+what)
 if(sliderEl.parentElement.type=='vertical'){sliderEl.style.top=val}
 if(sliderEl.parentElement.type=='horizontal'){sliderEl.style.left=val}
 slideVal(what,val)
}