//The images' ID should be - swapImage1 and swapImage2
*/
if (!Scrolling) var Scrolling = {};
//Scrolling.Scroller( document.body, scrollDistance, scrollHeight, Scrolling.ScrollTween(), Xposition, Yposition );
Scrolling.Scroller = function( objID, doc, w, h, t, Xpos, Ypos) {
//get the container
//var list = doc.getElementsByTagName("*");
var o = null;
//for (var i = 0; i < list.length; i++) {
//if (list[i].className.indexOf("Scroller-Container") > -1) {
//o = list[i];
// break;
// }
// }
o = doc.getElementById(objID);
doc = eval(doc.body);
//alert(o.id);
//private variables
var self = this;
var _w = w;
var _h = h;
var oWidth = (doc.clientWidth)?doc.clientWidth:doc.offsetWidth;
var oHeight = (doc.clientHeight)?doc.clientHeight:doc.offsetHeight;
//alert(doc.clientWidth+" "+doc.offsetWidth);
//var oWidth = '400px';
//var oHeight = '300px';
var _hasTween = t ? true : false;
var _timer, _x, _y;
//t = eval(t);
//if (_hasTween){ t.apply(this); }
//public variables
this.objToScroll = o;
this.XPosition = Xpos;
this.YPosition = Ypos;
this.scrollDistance = w;
this.scrollHeight = h;
this.scrollRatio = h / w;
this.onScrollStart = function (){o.style.zIndex = 0;}
this.onScrollStop = function (){}
this.onScroll = function (){};
this.scrollSpeed = 1;
//private functions
function setPositionForeward (x, y) {
if(!x) { x = 0; }
if(!y) y = 0;
if (x > _w + oWidth)
x = _w + oWidth;
//if (x < 0) x = 0;
if (y > _h + oHeight)
y = _h + oHeight;
//if (y < 0) y = 0;
_x = x;
_y = y;
o.style.left = _x +"px";
o.style.top = _y +"px";
// window.status=" o.style.left: "+o.style.left+" o.style.top: "+o.style.top;
};
function setPositionBackward (x, y) {
if(!x) { x = 0; }
if(!y) y = 0;
if (x < _w - oWidth)
x = _w - oWidth;
//if (x > 0) x = 0;
if (y < _h - oHeight)
y = _h - oHeight;
//if (y > 0) y = 0;
_x = x;
_y = y;
o.style.left = _x +"px";
o.style.top = _y +"px";
};
//public functions
this.getYPosition = function () {
return _y ;
}
this.getXPosition = function () {
return _x ;
}
this.scrollBy = function (x, y) {
//if(direction == 1) { setPositionForeward(_x + x, _y + y); if(_x >= oWidth - o.offsetWidth - 20|| _y >= oHeight - o.offsetHeight) {this.stopScroll(); } } //alert("_y: "+_y + " h: "+ w + " Ypos: " + Ypos);
setPositionForeward(_x + x, _y + y); window.status = "_x: "+_x + " _y: "+ _y; if((w>0)? (_x >= w + Xpos ) : ( _x <= w + Xpos ) && (h>0)?(_y >= h + Ypos):(_y <= h + Ypos) ) { this.stopScroll(); }
//if(direction == -1) { setPositionBackward(_x - x, _y - y); if( Math.abs(_x) <= Math.abs(Xpos) && Math.abs(_y) <= Math.abs(Ypos) ) {this.stopScroll(); } }
//if(_y >= oHeight - o.offsetHeight - 20) { this.stopScroll(); }
this.onScroll();
};
this.jumpTo = function (x, y) {
setPositionForeward( x, y);
this.onScroll();
return _x ;
};
this.startScroll = function (x, y) {
//this.stopScroll();
this.onScrollStart();
_timer = window.setInterval( function () { self.scrollBy(x, y); }, this.scrollSpeed );
};
this.stopScroll = function () {
if (_timer) window.clearInterval(_timer);
this.onScrollStop();
};
this.reset = function (x,y) {
oWidth = doc.offsetWidth
oHeight = doc.offsetHeight;
_x = x;
_y = y;
o.style.left = "0px";
o.style.top = "0px";
//this.stopScroll();
if (_hasTween) t.apply(this);
};
this.newContent = function (c) {
o = c;
//var list = o.getElementsByTagName("*");
//for (var i = 0; i < list.length; i++) {
// if (list[i].className.indexOf("Scroller-Container") > -1) {
// o = list[i];
// }
//}
if (w) _w = w;
if (h) _h = h;
//this.reset();
};
this.getDimensions = function () {
return {
vwidth : _w,
vheight : _h,
twidth : oWidth,
theight : oHeight,
x : -_x, y : -_y
};
};
this.getContent = function () {
return o;
};
this.scrollBackward = function (hSpeed){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll((-1)*hSpeed, 0);
};
this.scrollForward = function (hSpeed){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(hSpeed, 0);
};
this.scrollUp = function (vSpeed){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(0, (-1)*vSpeed);
};
this.scrollDown = function (vSpeed){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(0, vSpeed);
};
this.scrollNE = function (eSpeed){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(eSpeed, (-1)*eSpeed);
};
this.scrollNW = function (nSpeed){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll((-1)*nSpeed, (-1)*nSpeed);
};
this.scrollBackwardAlt = function (){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(-1, 0);
this.onScrollStop = function(){ this.swapScrollingImages("swapImage1","swapImage2",-1); this.scrollForwardAlt(); }
};
this.scrollForwardAlt = function (){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(1, 0);
this.onScrollStop = function(){ this.swapScrollingImages("swapImage1","swapImage2",1); this.scrollBackwardAlt(); }
};
this.scrollUpAlt = function (){
this.startScroll(0, -1);
this.jumpTo(this.XPosition,this.getYPosition());
this.onScrollStop = function(){ this.swapScrollingImages("swapImage1","swapImage2",-1); this.scrollDownAlt(); }
};
this.scrollDownAlt = function (){
this.jumpTo(this.XPosition,this.YPosition);
this.startScroll(0, 1);
this.onScrollStop = function(){ this.swapScrollingImages("swapImage1","swapImage2",1); this.scrollUpAlt(); }
};
this.swapScrollingImages = function (id_0,id_1,direction){
if(direction == 1 ) {
this.newContent(document.getElementById(id_0));
document.getElementById(id_1).style.visibility = 'hidden';
document.getElementById(id_0).style.visibility = 'visible';
}
if(direction == -1) {
this.newContent(document.getElementById(id_1));
document.getElementById(id_1).style.visibility = 'visible';
document.getElementById(id_0).style.visibility = 'hidden';
}
};
this.reset();
};
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Create scrolling variable if it doesn't exist
if (!Scrolling) var Scrolling = {};
//ScrollTween constructor
Scrolling.ScrollTween = function () {
//private variables
var self = this;
var _steps = [0,25,50,70,85,95,97,99,100];
var _values = [1,2,3,4,5,6,7,8,9];
var _idle = true;
var o, _inc, _timer;
//private functions
function tweenTo (y) {
if (!_idle) return false;
var d = o.getDimensions();
if (y < 0) y = 0;
if (y > d.theight - d.vheight)
y = d.theight - d.vheight;
var dist = y - d.y;
_inc = 0;
_timer = null;
_values = [];
_idle = false;
for (var i = 0; i < _steps.length; i++) {
_values[i] = Math.round(d.y + dist * (_steps[i] / 100));
}
_timer = window.setInterval(function () {
o.scrollTo(_values[_inc]);
if (_inc == _steps.length - 1) {
window.clearInterval(_timer);
_idle = true;
} else _inc++;
}, o.stepSpeed);
};
function tweenBy (y) {
o.tweenTo(o.getDimensions().y + y);
};
function setSteps (s) {
_steps = s;
};
//public functions
this.apply = function (p) {
o = p;
//alert("apply");
o.tweenTo = tweenTo;
o.tweenBy = tweenBy;
o.setSteps = setSteps;
o.stepSpeed = 10;
};
};
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Create scrolling variable if it doesn't exist
if (!Scrolling) var Scrolling = {};
//Scrollbar constructor
Scrolling.Scrollbar = function (o, s, t) {
//private variables
var self = this;
var _components = {};
var _dimensions = {};
var _temporary = {};
var _hasTween = t ? true : false;
var _timer, _ratio;
//public variables
this.onMouseDown = function (){};
this.onMouseUp = function (){};
this.onScroll = function (){};
this.scrollAmount = 5;
this.scrollSpeed = 30;
this.disabled = false;
//private functions
function initialize () {
var c = _components;
var d = _dimensions;
var g = s.getDimensions();
//var g = Element.getDimensions( s );
c.up = findComponent("Scrollbar-Up", o);
c.down = findComponent("Scrollbar-Down", o);
c.track = findComponent("Scrollbar-Track", o);
c.handle = findComponent("Scrollbar-Handle", c.track);
d.trackTop = findOffsetTop(c.track);
d.trackHeight = c.track.offsetHeight;
d.handleHeight = c.handle.offsetHeight;
d.x = 0;
d.y = 0
if (_hasTween) t.apply(self);
addEvent(s.getContent(), "mousewheel", scrollbarWheel);
addEvent(o, "mousedown", scrollbarClickPrimer);
self.reset();
};
function findOffsetTop (o) {
var t = 0;
if (o.offsetParent) {
while (o.offsetParent) {
t += o.offsetTop;
o = o.offsetParent;
}
}
return t;
};
function addEvent (o, t, f) {
if (o.attachEvent) o.attachEvent('on'+ t, f);
else o.addEventListener(t, f, false);
};
function removeEvent (o, t, f) {
if (o.detachEvent) o.detachEvent('on'+ t, f);
else o.removeEventListener(t, f, false);
};
function findComponent (c, o) {
var kids = o.childNodes;
for (var i = 0; i < kids.length; i++) {
if (kids[i].className && kids[i].className.indexOf(c) >= 0) {
return kids[i];
}
}
};
function scroll (y) {
if (y < 0) y = 0;
if (y > _dimensions.trackHeight - _dimensions.handleHeight)
y = _dimensions.trackHeight - _dimensions.handleHeight;
_components.handle.style.top = y +"px";
_dimensions.y = y;
s.scrollTo(0, Math.round(_dimensions.y * _ratio));
self.onScroll();
};
function scrollbarClickPrimer (e) {
if (self.disabled) return false;
e = e?e:event;
if (!e.target) e.target = e.srcElement;
scrollbarClick(e.target.className, e);
};
function scrollbarClick (c, e) {
var d = _dimensions;
var t = _temporary;
var cy = e.clientY + document.body.scrollTop;
if (c.indexOf("Scrollbar-Up") >= 0)
startScroll(-self.scrollAmount);
if (c.indexOf("Scrollbar-Down") >= 0)
startScroll(self.scrollAmount);
if (c.indexOf("Scrollbar-Track") >= 0)
if (_hasTween) self.tweenTo((cy - d.trackTop - d.handleHeight / 2) * _ratio);
else scroll(cy - d.trackTop - d.handleHeight / 2);
if (c.indexOf("Scrollbar-Handle") >= 0) {
t.grabPoint = cy - findOffsetTop(_components.handle);
addEvent(document, "mousemove", scrollbarDrag, false);
}
t.target = e.target;
t.select = document.onselectstart;
document.onselectstart = function (){ return false; };
self.onMouseDown(e.target, c, e);
addEvent(document, "mouseup", stopScroll);
};
function scrollbarDrag (e) {
e = e?e:event;
var d = _dimensions;
var t = parseInt(_components.handle.style.top);
var v = e.clientY + document.body.scrollTop - d.trackTop;
if (v >= d.trackHeight - d.handleHeight + _temporary.grabPoint)
v = d.trackHeight - d.handleHeight;
else if (v <= _temporary.grabPoint)
v = 0;
else v = v - _temporary.grabPoint;
scroll(v);
};
function scrollbarWheel (e) {
if (self.disabled) return false;
e = e ? e : event;
var dir = 0;
if (e.wheelDelta >= 120) dir = -1;
if (e.wheelDelta <= -120) dir = 1;
self.scrollBy(dir * 20);
e.returnValue = false;
};
function startScroll (y) {
_temporary.disty = y;
_timer = window.setInterval(function () {
self.scrollBy(_temporary.disty);
}, self.scrollSpeed);
};
function stopScroll (e) {
e = e?e:event;
removeEvent(document, "mousemove", scrollbarDrag);
removeEvent(document, "mouseup", stopScroll);
document.onselectstart = _temporary.select;
if (_timer) window.clearInterval(_timer);
self.onMouseUp(_temporary.target, _temporary.target.className, e);
};
//public functions
this.reset = function () {
var d = _dimensions;
var c = _components;
var g = s.getDimensions();
_ratio = (g.theight - g.vheight) / (d.trackHeight - d.handleHeight);
c.handle.ondragstart = function (){ return false; };
c.handle.onmousedown = function (){ return false; };
c.handle.style.top = "0px";
d.y = 0;
s.reset();
scroll(0);
if (g.theight < g.vheight) {
this.disabled = true;
o.className += " Scrollbar-Disabled";
}
};
this.scrollTo = function (y) {
scroll(y / _ratio);
};
this.scrollBy = function (y) {
scroll((s.getDimensions().y + y) / _ratio);
};
this.swapContent = function (n, w, h) {
o = n;
s.swapContent(o, w, h);
initialize();
};
this.disable = function () {
this.disabled = true;
o.className += "Scrollbar-Disabled";
};
this.enable = function () {
this.disabled = false;
o.className = o.className.replace(/Scrollbar\-Disabled/, "");
};
this.getContent = function () {
return s.getContent();
};
this.getComponents = function () {
return _components;
};
this.getDimensions = function () {
var d = s.getDimensions();
//var d = Element.getDimensions( s );
d.trackHeight = _dimensions.trackHeight;
d.handleHeight = _dimensions.handleHeight;
return d;
};
initialize();
};