/*
Deltan PDA
2008 Steve Breslin
The scroller-control code was borrowed (and moderately modified) from:
Aaron Boodman's ypSimpleScroll, as modified by Sergi Meseguer
http://www.java2s.com/Code/JavaScript/GUI-Components/Customscrollbar2.htm
*/
baseScroller.prototype.scrollUp = function(count) { this.startScroll('up', count) }
baseScroller.prototype.scrollDown = function(count) { this.startScroll('down', count) }
baseScroller.updateFrequency = 10
baseScroller.ie = document.all ? 1 : 0
baseScroller.ns4 = document.layers ? 1 : 0
baseScroller.dom = document.getElementById ? 1 : 0
baseScroller.mac = navigator.platform == "MacPPC"
baseScroller.mo5 = document.getElementById && !document.all ? 1 : 0
baseScroller.prototype.startScroll = function(dir, count) {
if (this.loaded){
if (this.animationTimer) window.clearTimeout(this.animationTimer)
this.overrideScrollAngle(dir)
this.speed = this.origSpeed
this.lastTime = (new Date()).getTime() - this.y.updateFrequency
this.animationTimer = window.setTimeout(this.gRef + ".scroll('"+dir+"','"+count+"')", this.y.updateFrequency)
}
}
baseScroller.prototype.endScroll = function() {
if (this.loaded){
window.clearTimeout(this.animationTimer)
this.animationTimer = 0;
this.speed = this.origSpeed
}
}
baseScroller.prototype.overrideScrollAngle = function(dir) {
if (this.loaded) {
this.fy = dir == 'up' ? -1 : 1
this.stopV = dir == 'up' ? 0 : this.scrollH
}
}
/*
baseScroller.prototype.scrollTo = function(stopV, aniLen) {
if (this.loaded){
if (stopV != this.scrollTop ) {
if (this.animationTimer) window.clearTimeout(this.animationTimer)
this.lastTime = (new Date()).getTime()
this.fy = (stopV - this.scrollTop)
this.stopV = stopV
this.speed = fy / aniLen * 1000
window.setTimeout(this.gRef + ".scroll()", this.y.updateFrequency)
}
}
}
*/
baseScroller.prototype.jumpTo = function(nx, ny) {
if (this.loaded){
ny = Math.min(Math.max(ny, 0), this.scrollH)
this.scrollTop = ny
if (this.y.ns4) this.content.moveTo(-nx, -ny)
else {
this.content.style.top = -ny + "px"
}
}
}
baseScroller.prototype.scroll = function(dir, count) {
this.animationTimer = window.setTimeout(this.gRef + ".scroll('"+dir+"','"+count+"')", this.y.updateFrequency)
var nt = (new Date()).getTime()
var d = Math.round((nt - this.lastTime) / 1000 * this.speed)
if (d > 0) {
var ny = d * this.fy + this.scrollTop
var yOut = (ny >= this.scrollTop && ny >= this.stopV) || (ny <= this.scrollTop && ny <= this.stopV)
if (nt - this.lastTime != 0 && (this.fy == 0 || yOut) ) {
this.jumpTo(this.stopH, this.stopV)
this.endScroll()
}
else {
this.jumpTo(0, ny)
this.lastTime = nt
}
// update dragger position:
if(dir=='down') theThumb[count].style.top = parseInt(((theThumb[count].maxY-theThumb[count].minY) *
this.scrollTop/this.stopV)+theThumb[count].minY) + "px";
if(dir=='up') theThumb[count].style.top = parseInt(((theThumb[count].maxY-theThumb[count].minY) *
this.scrollTop/this.scrollH)+theThumb[count].minY) + "px";
}
}
function baseScroller(id, left, top, width, height, speed) {
var y = this.y = baseScroller
if (document.layers && !y.ns4) history.go(0)
if (y.ie || y.ns4 || y.dom) {
this.loaded = false
this.id = id
this.origSpeed = speed
this.animationTimer = false
this.op = ""
this.lastTime = 0
this.clipH = height
this.clipW = width
this.scrollTop = 0
this.scrollLeft = 0
this.gRef = "baseScroller_"+id
eval(this.gRef+"=this")
var d = document
d.write('')
}
}
baseScroller.prototype.load = function() {
var d, lyrId1, lyrId2
d = document
lyrId1 = this.id + "Container"
lyrId2 = this.id + "Content"
this.container = this.y.dom ? d.getElementById(lyrId1) : this.y.ie ? d.all[lyrId1] : d.layers[lyrId1]
this.content = obj2 = this.y.ns4 ? this.container.layers[lyrId2] : this.y.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
this.docH = Math.max(this.y.ns4 ? this.content.document.height : this.content.offsetHeight, this.clipH)
this.docW = Math.max(this.y.ns4 ? this.content.document.width : this.content.offsetWidth, this.clipW)
this.scrollH = this.docH - this.clipH
this.scrollW = this.docW - this.clipW
this.loaded = true
this.scrollTop = Math.max(Math.min(this.scrollTop, this.scrollH),0)
this.jumpTo(0, this.scrollTop)
}
var theThumb = []; var theScroll = []; var thumbTravel = []; var ratio = [];
function instantiateScroller(count, id, left, top, width, height, speed){
if(document.getElementById) {
theScroll[count] = new baseScroller(id, left, top, width, height, speed);
}
}
function changeImage(anImage, newSource) {
document.images[anImage].src = newSource;
}
function createDragger(count, handler, root, thumb, minX, maxX, minY, maxY){
var buttons = '';
document.getElementById(root).innerHTML = buttons + document.getElementById(root).innerHTML;
theThumb[count] = document.getElementById(thumb);
var thisup = document.getElementById("up"+count);
var thisdn = document.getElementById("dn"+count);
theThumb[count].style.left = parseInt(minX+15) + "px";
thisup.style.left = parseInt(minX+15) + "px";
thisdn.style.left = parseInt(minX+15) + "px";
theThumb[count].style.border =0;
theThumb[count].style.top = parseInt(minY) + "px";
thisup.style.top = 0 + "px";
thisdn.style.top = parseInt(minY+maxY) + "px";
theScroll[count].load();
Drag.init(theThumb[count], null, minX+15, maxX+15, minY, maxY-27);
// the number of pixels the thumb can travel vertically (max - min)
thumbTravel[count] = theThumb[count].maxY - theThumb[count].minY;
// the ratio between scroller movement and thumbMovement
ratio[count] = theScroll[count].scrollH / thumbTravel[count];
theThumb[count].onDrag = function(x, y) {
theScroll[count].jumpTo(null, Math.round((y - theThumb[count].minY) * ratio[count]));
}
}
var Drag = {
obj : null,
init : function(o, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper)
{
o.onmousedown = Drag.start;
o.hmode = bSwapHorzRef ? false : true ;
o.vmode = bSwapVertRef ? false : true ;
o.root = oRoot && oRoot != null ? oRoot : o ;
if (o.hmode && isNaN(parseInt(o.root.style.left ))) o.root.style.left = "0px";
if (o.vmode && isNaN(parseInt(o.root.style.top ))) o.root.style.top = "0px";
if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.style.right = "0px";
if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = "0px";
o.minX = typeof minX != 'undefined' ? minX : null;
o.minY = typeof minY != 'undefined' ? minY : null;
o.maxX = typeof maxX != 'undefined' ? maxX : null;
o.maxY = typeof maxY != 'undefined' ? maxY : null;
o.xMapper = fXMapper ? fXMapper : null;
o.yMapper = fYMapper ? fYMapper : null;
o.root.onDragStart = new Function();
o.root.onDragEnd = new Function();
o.root.onDrag = new Function();
},
start : function(e)
{
var o = Drag.obj = this;
e = Drag.fixE(e);
var y = parseInt(o.vmode ? o.root.style.top : o.root.style.bottom);
var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
o.root.onDragStart(x, y);
o.lastMouseX = e.clientX;
o.lastMouseY = e.clientY;
if (o.hmode) {
if (o.minX != null) o.minMouseX = e.clientX - x + o.minX;
if (o.maxX != null) o.maxMouseX = o.minMouseX + o.maxX - o.minX;
} else {
if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x;
if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x;
}
if (o.vmode) {
if (o.minY != null) o.minMouseY = e.clientY - y + o.minY;
if (o.maxY != null) o.maxMouseY = o.minMouseY + o.maxY - o.minY;
} else {
if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y;
if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y;
}
document.onmousemove = Drag.drag;
document.onmouseup = Drag.end;
thumbUpdate(o.id, 'down');
return false;
},
drag : function(e)
{
e = Drag.fixE(e);
var o = Drag.obj;
var ey = e.clientY;
var ex = e.clientX;
var y = parseInt(o.vmode ? o.root.style.top : o.root.style.bottom);
var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
var nx, ny;
if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX);
if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX);
if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY);
if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY);
nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1));
ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1));
if (o.xMapper) nx = o.xMapper(y)
else if (o.yMapper) ny = o.yMapper(x)
Drag.obj.root.style[o.hmode ? "left" : "right"] = nx + "px";
Drag.obj.root.style[o.vmode ? "top" : "bottom"] = ny + "px";
Drag.obj.lastMouseX = ex;
Drag.obj.lastMouseY = ey;
Drag.obj.root.onDrag(nx, ny);
return false;
},
end : function()
{
document.onmousemove = null;
document.onmouseup = null;
Drag.obj.root.onDragEnd( parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]),
parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]));
thumbUpdate(Drag.obj.id, 'up');
Drag.obj = null;
},
fixE : function(e)
{
if (typeof e == 'undefined') e = window.event;
if (typeof e.layerX == 'undefined') e.layerX = e.offsetX;
if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;
return e;
}
};
var browser=false; // string: 'IE' or 'Opera' (or remains false for other browsers)
function init() {
createDragger(0, "handle0", "root0", "thumb0", 405, 405, 42, 300);
createDragger(1, "handle1", "root1", "thumb1", -108, -108, 42, 300);
if(-1 != navigator.userAgent.indexOf("Opera")) {
browser = 'Opera';
}
else if(-1 != navigator.userAgent.indexOf("MSIE")) {
browser = 'IE';
}
/* initialize mouse wheel scrolling event-capture */
if (browser=='Opera' || browser =='IE') {
getId('scroll0Container').onmousewheel = wheel0;
getId('scroll1Container').onmousewheel = wheel1;
}
else if (window.addEventListener) {
/* Firefox or IE6/IE7 */
getId('scroll0Container').addEventListener('DOMMouseScroll', wheel0, false);
getId('scroll1Container').addEventListener('DOMMouseScroll', wheel1, false);
}
/* set the topmenu by calling menuClick on 'Introduction' */
menuReset(0, 0);
}
function wheel0(event) {
return wheel(0, event);
}
function wheel1(event) {
return wheel(1, event);
}
/* This handles mouse wheel scrolling.
* The design is to make the scroll faster if the mouse commands are stacked.
* (Commands stack if we get passed a new command while we're processing the current one,
* and the new command tells us to do what we're already doing. (As opposed to cancelling commands,
* which tell us to switch direction and proceed as usual.)
*/
var stacksize = 0;
var curDir;
baseScroller.prototype.mousewheelScroll = function(dir, side) {
if (dir == curDir) {
++stacksize;
}
else {
stacksize = 1;
curDir = dir;
}
if (this.animationTimer) window.clearTimeout(this.animationTimer)
this.overrideScrollAngle(dir)
this.speed = this.origSpeed *stacksize *stacksize *4 /* making it modified by stacksize^2 feels about right. */
this.lastTime = (new Date()).getTime() - this.y.updateFrequency
this.animationTimer = window.setTimeout(this.gRef + ".mousewheelScroller('"+dir+"','"+side+"')", this.y.updateFrequency)
}
baseScroller.prototype.mousewheelScroller = function (dir, side) {
var nt = (new Date()).getTime()
var d = Math.round((nt - this.lastTime) / 1000 * this.speed)
if (d > 0) {
var ny = (d * this.fy + this.scrollTop)
var yOut = (ny >= this.scrollTop && ny >= this.stopV) || (ny <= this.scrollTop && ny <= this.stopV)
if (nt - this.lastTime != 0 && (this.fy == 0 || yOut) ) {
this.jumpTo(this.stopH, this.stopV)
this.endScroll()
}
else {
this.jumpTo(0, ny)
this.lastTime = nt
}
// update dragger position:
if(dir=='down') theThumb[side].style.top = parseInt(((theThumb[side].maxY-theThumb[side].minY) *
this.scrollTop/this.stopV)+theThumb[side].minY) + "px";
if(dir=='up') theThumb[side].style.top = parseInt(((theThumb[side].maxY-theThumb[side].minY) *
this.scrollTop/this.scrollH)+theThumb[side].minY) + "px";
/* reset any stacked-up mousewheel commands, in case it was the mousewheel which fired this scroll action. */
stacksize = 0;
curDir = false;
this.scrollTop = this.scrollTop
}
}
var scrolltimer;
function mousewheelHandler(side, delta) {
/* reset the scrolltimer, which is essentially an */
if(scrolltimer) {
window.clearTimeout(scrolltimer);
scrolltimer = false;
}
delta = (delta > 0 ? 'up' : 'down');
theScroll[side].mousewheelScroll(delta, side);
scrolltimer = window.setTimeout("theScroll[" + side + "].endScroll()", 150);
}
/*
* Event handler for mouse wheel event.
*/
function wheel(side, event){
var delta = 0;
if (!event) /* For IE. */
event = window.event;
if (event.wheelDelta) { /* IE/Opera. */
delta = event.wheelDelta/120;
/** In Opera 9, delta differs in sign as compared to IE.
*/
if (window.opera)
delta = delta;
} else if (event.detail) { /** Mozilla case. */
/** In Mozilla, sign of delta is different than in IE.
* Also, delta is multiple of 3.
*/
delta = -event.detail/3;
}
/** If delta is nonzero, handle it.
* Basically, delta is now positive if wheel was scrolled up,
* and negative, if wheel was scrolled down.
*/
if (delta)
mousewheelHandler(side, delta);
/** Prevent default actions caused by mouse wheel.
* That might be ugly, but we handle scrolls somehow
* anyway, so don't bother here..
*/
if (event.preventDefault)
event.preventDefault();
event.returnValue = false;
}
var curDown=false; // thumb0, thumb1, or 0 for false (no thumb being dragged)
var over=0; // 1 for true (mouse hovers over a thumb), 0 for false (it's not over)
/* We centralize the thumb-update code here, especially because it fires off
* two different areas of code: from onmouseover/onmouseout in the main
* buttons declaration, and in the drag code for the dragger (that's where the
* drag is engaged and disengaged).
*
* so, four stats: down, over, out, up
*
* unfortunately, different browsers work differently.
*
* basically, if a thumb is being dragged, and the mouse moves off the thumb,
* IE sends two signals, the first of which is correct, and a second which fires
* off the new element (although it calls the thumb-element's handler -- yes, very
* confusing and buggy).
*
* then, if the mouse moves back onto the thumb (the thum still being dragged),
* IE sends two more signals, the first of which is wrong; the second correct.
*
* also, if it the mouse passes over the *other* thumb, the the foreign element
* fires the mouseover of the currently-active element, so it looks like we're
* hovering now over the *active* thumb, when in fact we're hovering over the
* *other* thumb. anyway, these problems called for some separate IE-only handling.
*/
function thumbUpdate(thumbid, stat) {
if(stat == 'over' || stat == 'out') {
if(curDown) { /* one of the thumbs is currently down */
/* if it's an event involving the *other* thumb, ignore the event. */
if(thumbid != curDown)
return;
/* IE requires special handling, if the thumb is currently being dragged. */
if(browser=='IE') {
if(window.event.srcElement.name != thumbid+'image') {
/* the event fired on a spurious event: the currently-active thumb
* is not the source element.
*/
return;
}
}
/* no need to *visually* update: since 'down' dominates, so we update the stat and
* we're done.
*/
over=(stat=='over' ? 1 : 0);
return;
}
/* our normal handling if neither thumb is currently being dragged. */
over = (stat=='over' ? 1 : 0);
changeImage(thumbid+'image', (over == 1 ? './img/thumb_arrowlit.png' : './img/thumb_unlit.png'));
return false;
}
if(stat == 'up') {
counter = 0; // reset the counter
curDown = false; // reset the marker for the thumb currently being dragged.
changeImage(thumbid+'image', (over == 1 ? './img/thumb_arrowlit.png' : './img/thumb_unlit.png'));
return;
}
/* stat is 'down': we remember which thumb, and we update the image. */
curDown = thumbid;
changeImage(thumbid+'image', './img/thumb_full_lit.png');
return;
}
function getId(id) {
return document.all ? document.all[id] : document.getElementById(id);
}
function changeBg(id, bg) {
getId(id).style.backgroundImage = "url(" + bg + ")";
}
function getInnerHTML(id) {
return getId(id).innerHTML;
}
function writeDiv(id, content) {
getId(id).innerHTML = content;
}
function getCurContent(id) {
return getId(id).innerHTML;
}
// menuTitles tells us the titles of the tabs.
var menuTitles = new Array();
menuTitles[0] = "导言";
menuTitles[1] = "起源";
menuTitles[2] = "超空间";
menuTitles[3] = "顶点";
menuTitles[4] = "准备";
menuTitles[5] = "撤离";
// menuWordWidth tells us each word's respective pixel width.
var menuWordWidth = new Array();
menuWordWidth[0] = 40 // the pixel-width of the word "Introduction"
menuWordWidth[1] = 40
menuWordWidth[2] = 57
menuWordWidth[3] = 40
menuWordWidth[4] = 40
menuWordWidth[5] = 40
var curTop = 0; // The 'currently selected' tab.
/*
menuClick
=========
total space in the flat part of the tabs: 339
To figure out the "flat padding" of each tab:
. add the word-pixels together.
. subtract that from 339
. divide that value by 5.
That is the menu's "common padding value". Each tab gets that much
padding. Note that we round this, so the last tab is not exact. so, the
last tab gets whatever is left over.
A tab's width is the common padding value plus the tab's word's pixel count.
The first div is 18 pixels + the first tab's flat width + the 5 pixel spacer.
The second, third, and fourth divs are 5spacer+ the tab's flat width +5spacer.
This last entry handles "rounding", so its width is: 415 minus "what's
come already" -- so, 415 minus the widths of tabs 1 through 4, and minus
58 (the total space taken by the spacers).
So, "what's come already" plus the last tab is 415.
*/
function getMenuPadding(collapsed) {
/* reconstruct the tabs, and write the value to the "tabs" div. */
var counter = 0;
for(var tabNumber = 0 ; tabNumber <= 5 ; ++tabNumber) {
if(tabNumber != collapsed) {
/* we'll be adding menu[tabNumber] to the tabs, so add the word's width to pixelcount */
counter += menuWordWidth[tabNumber];
}
}
/* At this point, pixelcount = the horizontal space taken by the words on the five tabs.
*
* We will now redefine: pixelcount = the remaining tab-space on the flat area of the tabs,
* the "padding" area around the words on the tabs.
*/
counter = 328 - counter;
/* Now what we *really* want to know is how much padding per tab, so we divide pixelcount
* by 5 and that's the padding. (If a tab's padding is 10, then there will be 5 pixels on
* either side of the word.)
*/
return Math.round(counter / 5);
}
function getTargetWidths(collapsed, padding) {
var totalWidth = 0;
var retArray = new Array;
for(var tabNumber = 0 ; tabNumber <= 5 ; ++tabNumber) {
var cur = 0;
if(tabNumber == collapsed)
cur = 5;
else
cur = menuWordWidth[tabNumber] + padding;
if(tabNumber==0) {
cur += 23;
totalWidth += cur;
}
else if(tabNumber==5) {
cur = 415 - totalWidth;
}
else {
cur += 10;
totalWidth += cur;
}
retArray[tabNumber] = cur;
}
return retArray;
}
var curWidthArray;
function menuReset(collapsed, inactive) {
var padding = getMenuPadding(collapsed);
curWidthArray = getTargetWidths(collapsed, padding);
var val = '';
for(var tabNumber = 0 ; tabNumber <= 5 ; ++tabNumber) {
var thisWidthTotal = curWidthArray[tabNumber];
if(tabNumber == inactive)
val += '
