(function($){
$.widget("thomaskahn.smoothDivScroll",{
options:{
scrollingHotSpotLeft: "div.scrollingHotSpotLeft",
scrollingHotSpotRight: "div.scrollingHotSpotRight",
scrollableArea: "div.scrollableArea",
scrollWrapper: "div.scrollWrapper",
hiddenOnStart: false,
ajaxContentURL: "",
countOnlyClass: "",
scrollStep: 15,
scrollInterval: 10,
mouseDownSpeedBooster: 3,
autoScroll: "",
autoScrollDirection: "right",
autoScrollStep: 5,
autoScrollInterval: 10,
visibleHotSpots: "",
hotSpotsVisibleTime: 5,
startAtElementId: ""
},
_create: function(){
var self=this,o=this.options,el=this.element
el.data("scrollWrapper",el.find(o.scrollWrapper))
el.data("scrollingHotSpotRight",el.find(o.scrollingHotSpotRight))
el.data("scrollingHotSpotLeft",el.find(o.scrollingHotSpotLeft))
el.data("scrollableArea",el.find(o.scrollableArea))
el.data("speedBooster",1)
el.data("motherElementOffset",el.offset().left)
el.data("scrollXPos",0)
el.data("hotSpotWidth",el.find(o.scrollingHotSpotLeft).width())
el.data("scrollableAreaWidth",0)
el.data("startingPosition",0)
el.data("rightScrollInterval",null)
el.data("leftScrollInterval",null)
el.data("autoScrollInterval",null)
el.data("hideHotSpotBackgroundsInterval",null)
el.data("previousScrollLeft",0)
el.data("pingPongDirection","right")
el.data("getNextElementWidth",true)
el.data("swapAt",null)
el.data("startAtElementHasNotPassed",true)
el.data("swappedElement",null)
el.data("originalElements",el.data("scrollableArea").children(o.countOnlyClass))
el.data("visible",true)
el.data("initialAjaxContentLoaded",false)
el.data("enabled",true)
if(o.autoScroll !=="always"){
switch(o.visibleHotSpots){
case "always":
self.showHotSpotBackgrounds()
break
case "onstart":
self.showHotSpotBackgrounds()
el.data("hideHotSpotBackgroundsInterval",setTimeout(function(){
self.hideHotSpotBackgrounds("slow")
},(o.hotSpotsVisibleTime*1000)))
break
default:
break}}
el.data("scrollingHotSpotRight").bind("mousemove",function(e){
var x=e.pageX-(this.offsetLeft+el.data("motherElementOffset"))
el.data("scrollXPos",Math.round((x/el.data("hotSpotWidth"))*o.scrollStep))
if(el.data("scrollXPos")===Infinity){
el.data("scrollXPos",0)}
})
el.data("scrollingHotSpotRight").bind("mouseover",function(){
if((o.autoScroll==="onstart"&&el.data("autoScrollInterval")!==null)){
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)
self._trigger("autoScrollIntervalStopped")}
el.data("rightScrollInterval",setInterval(function(){
if(el.data("scrollXPos")>0&&el.data("enabled")){
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()+(el.data("scrollXPos")*el.data("speedBooster")))
self._showHideHotSpots()}
},o.scrollInterval))
self._trigger("mouseOverRightHotSpot")
})
el.data("scrollingHotSpotRight").bind("mouseout",function(){
clearInterval(el.data("rightScrollInterval"))
el.data("scrollXPos",0)
})
el.data("scrollingHotSpotRight").bind("mousedown",function(){
el.data("speedBooster",o.mouseDownSpeedBooster)
})
$("body").bind("mouseup",function(){
el.data("speedBooster",1)
})
el.data("scrollingHotSpotLeft").bind("mousemove",function(e){
var x=el.data("scrollingHotSpotLeft").innerWidth()-(e.pageX-el.data("motherElementOffset"))
el.data("scrollXPos",Math.round((x/el.data("hotSpotWidth"))*o.scrollStep))
if(el.data("scrollXPos")===Infinity){
el.data("scrollXPos",0)}
})
el.data("scrollingHotSpotLeft").bind("mouseover",function(){
if((o.autoScroll==="onstart"&&el.data("autoScrollInterval")!==null)){
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)
self._trigger("autoScrollIntervalStopped")}
el.data("leftScrollInterval",setInterval(function(){
if(el.data("scrollXPos")>0&&el.data("enabled")){
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()-(el.data("scrollXPos")*el.data("speedBooster")))
self._showHideHotSpots()}
},o.scrollInterval))
self._trigger("mouseOverLeftHotSpot")
})
el.data("scrollingHotSpotLeft").bind("mouseout",function(){
clearInterval(el.data("leftScrollInterval"))
el.data("scrollXPos",0)
})
el.data("scrollingHotSpotLeft").bind("mousedown",function(){
el.data("speedBooster",o.mouseDownSpeedBooster)
})
$(window).bind("resize",function(){
if(!(o.hiddenOnStart)){
self._showHideHotSpots()}
self._trigger("windowResized")
})
if(o.ajaxContentURL.length>0){
self.replaceContent(o.ajaxContentURL)}
else{
self.recalculateScrollableArea()}
if(o.hiddenOnStart){
self.hide()}
if((o.autoScroll.length>0)&&!(o.hiddenOnStart)&&(o.ajaxContentURL.length<=0)){
self.startAutoScroll()}
},
showHotSpotBackgrounds: function(fadeSpeed){
var self=this,el=this.element
if(fadeSpeed !==undefined){
el.data("scrollingHotSpotLeft").css("opacity","0.0")
el.data("scrollingHotSpotRight").css("opacity","0.0")
el.data("scrollingHotSpotLeft").addClass("scrollingHotSpotLeftVisible")
el.data("scrollingHotSpotRight").addClass("scrollingHotSpotRightVisible")
el.data("scrollingHotSpotLeft").fadeTo(fadeSpeed,0.35)
el.data("scrollingHotSpotRight").fadeTo(fadeSpeed,0.35)}
else{
el.data("scrollingHotSpotLeft").addClass("scrollingHotSpotLeftVisible")
el.data("scrollingHotSpotLeft").removeAttr("style")
el.data("scrollingHotSpotRight").addClass("scrollingHotSpotRightVisible")
el.data("scrollingHotSpotRight").removeAttr("style")}
self._showHideHotSpots()
},
hideHotSpotBackgrounds: function(fadeSpeed){
var el=this.element
if(fadeSpeed !==undefined){
el.data("scrollingHotSpotLeft").fadeTo(fadeSpeed,0.0,function(){
el.data("scrollingHotSpotLeft").removeClass("scrollingHotSpotLeftVisible")
})
el.data("scrollingHotSpotRight").fadeTo(fadeSpeed,0.0,function(){
el.data("scrollingHotSpotRight").removeClass("scrollingHotSpotRightVisible")
})}
else{
el.data("scrollingHotSpotLeft").removeClass("scrollingHotSpotLeftVisible")
el.data("scrollingHotSpotLeft").removeAttr("style")
el.data("scrollingHotSpotRight").removeClass("scrollingHotSpotRightVisible")
el.data("scrollingHotSpotRight").removeAttr("style")}
},
_showHideHotSpots: function(){
var self=this,el=this.element,o=this.options
if(o.autoScroll !=="always"){
if(el.data("scrollableAreaWidth")<=(el.data("scrollWrapper").innerWidth())){
el.data("scrollingHotSpotLeft").hide()
el.data("scrollingHotSpotRight").hide()}
else if(el.data("scrollWrapper").scrollLeft()===0){
el.data("scrollingHotSpotLeft").hide()
el.data("scrollingHotSpotRight").show()
self._trigger("scrollLeftLimitReached")
clearInterval(el.data("leftScrollInterval"))
el.data("leftScrollInterval",null)}
else if(el.data("scrollableAreaWidth")<=(el.data("scrollWrapper").innerWidth()+el.data("scrollWrapper").scrollLeft())){
el.data("scrollingHotSpotLeft").show()
el.data("scrollingHotSpotRight").hide()
self._trigger("scrollRightLimitReached")
clearInterval(el.data("rightScrollInterval"))
el.data("rightScrollInterval",null)}
else{
el.data("scrollingHotSpotLeft").show()
el.data("scrollingHotSpotRight").show()}}
else{
el.data("scrollingHotSpotLeft").hide()
el.data("scrollingHotSpotRight").hide()}
},
moveToElement: function(moveTo,elementNumber){
var self=this,el=this.element,o=this.options,tempScrollableAreaWidth=0,foundStartAtElement=false
switch(moveTo){
case "first":
el.data("scrollXPos",0)
self._trigger("movedToFirstElement")
break
case "start":
el.data("scrollableArea").children(o.countOnlyClass).each(function(){
if((o.startAtElementId.length>0)&&(($(this).attr("id"))===o.startAtElementId)){
el.data("startingPosition",tempScrollableAreaWidth)
foundStartAtElement=true}
tempScrollableAreaWidth=tempScrollableAreaWidth+$(this).outerWidth(true)
})
el.data("scrollXPos",el.data("startingPosition"))
self._trigger("movedToStartElement")
break
case "last":
el.data("scrollXPos",el.data("scrollableAreaWidth"))
self._trigger("movedToLastElement")
break
case "number":
if(!(isNaN(elementNumber))){
el.data("scrollableArea").children(o.countOnlyClass).each(function(index){
if(index===(elementNumber-1)){
el.data("scrollXPos",tempScrollableAreaWidth)}
tempScrollableAreaWidth=tempScrollableAreaWidth+$(this).outerWidth(true)
})}
self._trigger("movedToElementNumber",null,{"elementNumber": elementNumber})
break
default:
break}
el.data("scrollWrapper").scrollLeft(el.data("scrollXPos"))
self._showHideHotSpots()
},
addContent: function(ajaxContentURL,addWhere){
var self=this,el=this.element
$.get(ajaxContentURL,function(data){
if(addWhere==="first"){
el.data("scrollableArea").children(":first").before(data)}
else{
el.data("scrollableArea").children(":last").after(data)}
self.recalculateScrollableArea()
self._showHideHotSpots()
})
},
replaceContent: function(ajaxContentURL){
var self=this,el=this.element
el.data("scrollableArea").load(ajaxContentURL,function(){
self.recalculateScrollableArea()
self.moveToElement("first")
self._showHideHotSpots()
el.data("startingPosition",0)
})
},
recalculateScrollableArea: function(){
var tempScrollableAreaWidth=0,foundStartAtElement=false,o=this.options,el=this.element,self=this
el.data("scrollableArea").children(o.countOnlyClass).each(function(){
if((o.startAtElementId.length>0)&&(($(this).attr("id"))===o.startAtElementId)){
el.data("startingPosition",tempScrollableAreaWidth)
foundStartAtElement=true}
tempScrollableAreaWidth=tempScrollableAreaWidth+$(this).outerWidth(true)
})
if(!(foundStartAtElement)){
el.data("startAtElementId","")}
el.data("scrollableAreaWidth",tempScrollableAreaWidth)
el.data("scrollableArea").width(el.data("scrollableAreaWidth"))
el.data("scrollWrapper").scrollLeft(el.data("startingPosition"))
el.data("scrollXPos",el.data("startingPosition"))
if(!(el.data("initialAjaxContentLoaded"))){
if((o.autoScroll.length>0)&&!(o.hiddenOnStart)&&(o.ajaxContentURL.length>0)){
self.startAutoScroll()
el.data("initialAjaxContentLoaded",true)}}
},
stopAutoScroll: function(){
var self=this,el=this.element
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)
self._showHideHotSpots()
self._trigger("autoScrollStopped")
},
startAutoScroll: function(){
var self=this,el=this.element,o=this.options
self._showHideHotSpots()
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)
self._trigger("autoScrollStarted")
el.data("autoScrollInterval",setInterval(function(){
if(!(el.data("visible"))||(el.data("scrollableAreaWidth")<=(el.data("scrollWrapper").innerWidth()))){
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)}
else{
el.data("previousScrollLeft",el.data("scrollWrapper").scrollLeft())
switch(o.autoScrollDirection){
case "right":
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()+o.autoScrollStep)
if(el.data("previousScrollLeft")===el.data("scrollWrapper").scrollLeft()){
self._trigger("autoScrollRightLimitReached")
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)
self._trigger("autoScrollIntervalStopped")}
break
case "left":
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()-o.autoScrollStep)
if(el.data("previousScrollLeft")===el.data("scrollWrapper").scrollLeft()){
self._trigger("autoScrollLeftLimitReached")
clearInterval(el.data("autoScrollInterval"))
el.data("autoScrollInterval",null)
self._trigger("autoScrollIntervalStopped")}
break
case "backandforth":
if(el.data("pingPongDirection")==="right"){
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()+(o.autoScrollStep))}
else{
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()-(o.autoScrollStep))}
if(el.data("previousScrollLeft")===el.data("scrollWrapper").scrollLeft()){
if(el.data("pingPongDirection")==="right"){
el.data("pingPongDirection","left")
self._trigger("autoScrollRightLimitReached")}
else{
el.data("pingPongDirection","right")
self._trigger("autoScrollLeftLimitReached")}}
break
case "endlessloopright":
if(el.data("getNextElementWidth")){
if((o.startAtElementId.length>0)&&(el.data("startAtElementHasNotPassed"))){
el.data("swapAt",$("#"+o.startAtElementId).outerWidth(true))
el.data("startAtElementHasNotPassed",false)}
else{
el.data("swapAt",el.data("scrollableArea").children(":first").outerWidth(true))}
el.data("getNextElementWidth",false)}
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()+o.autoScrollStep)
if(el.data("swapAt")<=el.data("scrollWrapper").scrollLeft()){
el.data("swappedElement",el.data("scrollableArea").children(":first").detach())
el.data("scrollableArea").append(el.data("swappedElement"))
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()-el.data("swappedElement").outerWidth(true))
el.data("getNextElementWidth",true)}
break
case "endlessloopleft":
if(el.data("getNextElementWidth")){
if((o.startAtElementId.length>0)&&(el.data("startAtElementHasNotPassed"))){
el.data("swapAt",$("#"+o.startAtElementId).outerWidth(true))
el.data("startAtElementHasNotPassed",false)}
else{
el.data("swapAt",el.data("scrollableArea").children(":first").outerWidth(true))}
el.data("getNextElementWidth",false)}
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()-o.autoScrollStep)
if(el.data("scrollWrapper").scrollLeft()===0){
el.data("swappedElement",el.data("scrollableArea").children(":last").detach())
el.data("scrollableArea").prepend(el.data("swappedElement"))
el.data("scrollWrapper").scrollLeft(el.data("scrollWrapper").scrollLeft()+el.data("swappedElement").outerWidth(true))
el.data("getNextElementWidth",true)}
break
default:
break}}
},o.autoScrollInterval))
},
restoreOriginalElements: function(){
var self=this,el=this.element
el.data("scrollableArea").html(el.data("originalElements"))
self.recalculateScrollableArea()
self.moveToElement("first")
},
show: function(){
var el=this.element
el.data("visible",true)
el.show()
},
hide: function(){
var el=this.element
el.data("visible",false)
el.hide()
},
enable: function(){
var el=this.element
el.data("enabled",true)
},
disable: function(){
var el=this.element
clearInterval(el.data("autoScrollInterval"))
clearInterval(el.data("rightScrollInterval"))
clearInterval(el.data("leftScrollInterval"))
clearInterval(el.data("hideHotSpotBackgroundsInterval"))
el.data("enabled",false)
},
destroy: function(){
var el=this.element
clearInterval(el.data("autoScrollInterval"))
clearInterval(el.data("rightScrollInterval"))
clearInterval(el.data("leftScrollInterval"))
clearInterval(el.data("hideHotSpotBackgroundsInterval"))
el.data("scrollingHotSpotRight").unbind("mouseover")
el.data("scrollingHotSpotRight").unbind("mouseout")
el.data("scrollingHotSpotRight").unbind("mousedown")
el.data("scrollingHotSpotLeft").unbind("mouseover")
el.data("scrollingHotSpotLeft").unbind("mouseout")
el.data("scrollingHotSpotLeft").unbind("mousedown")
el.data("scrollableArea").html(el.data("originalElements"))
el.data("scrollableArea").removeAttr("style")
el.data("scrollingHotSpotRight").removeAttr("style")
el.data("scrollingHotSpotLeft").removeAttr("style")
el.data("scrollWrapper").scrollLeft(0)
el.data("scrollingHotSpotLeft").removeClass("scrollingHotSpotLeftVisible")
el.data("scrollingHotSpotRight").removeClass("scrollingHotSpotRightVisible")
el.data("scrollingHotSpotRight").hide()
el.data("scrollingHotSpotLeft").hide()
$.Widget.prototype.destroy.apply(this,arguments)}
})
})(jQuery)