/* **************************************************************************
*** GreyWyvern's HTML Block Scroller & Marquee ******************************
*****************************************************************************
* HTML Block Scroller & Marquee JavaScript - v1.5 - Coded by GreyWyvern
*  - Copyright 2005 - Licenced for free distribution under the BSDL
*  -     http://www.opensource.org/licenses/bsd-license.php
*
* Have one or more scrolling blocks of HTML anywhere on your screen, and
* all infinitely adjustable!  Scroller will even pause on mouseover and
* resume on mouseout.
*
* Version 1.5
*   - Added pause-on-mouseover
*   - Added patch from Vincent Driessen:
*      - Disables scrolling when scrollObject has only one block
*
*****************************************************************************
*** Instructions ************************************************************
*****************************************************************************
* 1. Create the target for the scroller in the body of your HTML:
*
* <div id="MainName">
*   The contents of this block will be displayed if the browser does not support the scroller.
*   It will be overwritten if the scroller is supported.
* </div>
*
* Where "MainName" is any name you choose.  You don't have to use a <div>
* either.  You may use any block level element that can be pixel resized.
*
*****************************************************************************
* 2. Create a Cascading Style Sheets (CSS) class for blocks in this scroller:
*
* <style type="text/CSS">
*   .scrollClass {
*     text-align:center;
*     font:normal 80% Arial,sans-serif;
*   }
* </style>
*
*****************************************************************************
* 3. Create a new scrollObject:
*
* var scroller1 = new scrollObject("scroller1", "MainName", 120, 120, "white", "up", 1.35, 2.7, 30, 5000, "scrollClass");
*
* The arguments for this object are as follows:
*  a. - The variable name you are giving this scrollObject
*  b. - ID of the target tag (from step 1)
*  c. - Width (in pixels) of your scroller
*  d. - Height (in pixels) of your scroller
*  e. - Default background colour of the outer tag, can also be hexcode in the form: #rrggbb
*  f. - Scroll direction: one of "up", "down", "left" or "right"
*  g. - Decceleration index as block is moved (nominal range: 1 => 2)
*  h. - Initial speed of a block at beginning of slide:
*         Maximum speed as this value approaches one
*         Minimum speed as this value approaches scroller height
*  i. - Delay between each incremental movement upwards (milliseconds)
*  j. - Amount of time to pause before next scroll begins (milliseconds)
*  k. - CSS class name for blocks (from step 2)
*
* By adjusting the values for g and h you can dramatically change the
* animation style of your scroller.
*
* For example, if you make h = 1, you won't even see the "slide" effect; new
* blocks will simply *appear* over the old ones.  By contrast, if you set h
* to the height (if scrolling up or down) or width (if scrolling left or
* right) of your block, there will be no "slowdown" effect, and new blocks
* will slide in one pixel at a time.
*
* A low g value (less than 1.2) will weaken the slowdown effect, while a high
* g value (greater than 1.2) will increase it.
*
*****************************************************************************
* 4. Fill your Scroll Object with HTML:
*
* scroller1.block[0] = "This is block 1";
* scroller1.block[1] = "This is block 2";
* scroller1.block[2] = "Blocks can contain any HTML including:";
* scroller1.block[3] = "Images, tables, links and more";
* scroller1.block[4] = "Easy to configure, easy to run, with content automatically centred horizontally and vertically";
* scroller1.block[5] = "Have any number of block scrollers running on a single page all with a single JavaScript";
* scroller1.block[6] = "View the source for more info!";
*
* There is no limit to how many blocks or scrollObjects this program can
* hold, as long as there are no spaces in the numbering of an array (ie.
* name.block[0], name.block[1], name.block[2], ...), and all double-quotes
* (") are escaped (preceded) with a backslash (\), except the very first and
* last set (the ones which bound the HTML itself).
*
*   Eg.
*     "He said "Hi!"";
*   becomes
*     "He said \"Hi!\"";
*
*****************************************************************************
* 5. Add an "onload" command to the <body> tag:
*
* <body onload="scroller1.scroll();">
*
* And you're done!
*
*****************************************************************************
*** Adding more block scrollers to the same page: ***************************
*****************************************************************************
* 1. Create additional ID'ed targets (with different ID's) in the body of
* your HTML
*
* <div id="MainName2">
*   Scroller not supported.
* </div>
*
* <div id="MainName3">
*   Sorry, too bad for you.
* </div>
*
*****************************************************************************
* 2. Create additional classes for new blocks if you wish, or use the same
* class.
*
* <style type="text/CSS">
*   .scrollClass {
*     text-align:center;
*     font:normal 70% Arial,sans-serif;
*   }
*   .scrollClass2 {
*     text-align:center;
*     font:normal 80% Courier,monospace;
*     background-color:blue;
*   }
*   .scrollClass3 {
*     text-align:right;
*     font:bold 100% Arial,sans-serif;
*     background-color:#ffda00;
*     color:#00adff;
*   }
* </style>
*
*****************************************************************************
* 3. Create new scrollObjects for each scroller in the <script> tag:
*
* var scroller2 = new scrollObject("scroller2", "MainName2", 468, 60, "yellow", "down", 1.35, 2, 40, 10000, "scrollClass2");
* var scroller3 = new scrollObject("scroller3", "MainName3", 140, 140, "#ff8822", "right", 1.95, 3.1, 20, 4000, "scrollClass3");
*
*****************************************************************************
* 4. Fill your Scroll Objects with HTML:
*
* scroller2.block[0] = "<a href=\"http://www.greywyvern.com\"><span style=\"font:bold 200% fantasy;\">Visit GreyWyvern.com!</span></a>";
* scroller2.block[1] = "<a href=\"http://www.greywyvern.com/orca\"><strong>Home of the Orca Scripts!</strong></a>";
* scroller2.block[2] = "<a href=\"http://www.greywyvern.com\"><img src=\"http://www.greywyvern.com/img/jpg/bannerorca468x60.jpg\" border=\"0\"/></a>";
*
* scroller3.block[0] = "Block 1";
* scroller3.block[1] = "Block 2";
* scroller3.block[2] = "Block 3";
* scroller3.block[3] = "Block 4";
*
*****************************************************************************
* 5. Add an "onload" command for each scroll object to the <body> tag:
*
* <body onload="scroller1.scroll(); scroller2.scroll(); scroller3.scroll();">
*
*****************************************************************************
*** End Instructions ********************************************************
***************************************** Create your scroll objects below **
***** BEGIN CODE ***** Two sample objects are provided for experimentation */




/*
var scObj1 = new scrollObject("scObj1", "Main", 120, 120, "white", "up", 1.45, 3, 30, 5000, "scrollClass");

scObj1.block[0] = "This is block 1";
scObj1.block[1] = "This is block 2, which appears five seconds later";
scObj1.block[2] = "Blocks can contain any HTML including:";
scObj1.block[3] = "Images, tables, links and more";
scObj1.block[4] = "Easy to configure, easy to run, with content automatically centred horizontally and vertically";
scObj1.block[5] = "Have any number of block scrollers running on a single page all with a single JavaScript";
scObj1.block[6] = "View the source for more info!";
*/

/*
var scObj2 = new scrollObject("scObj2", "scroller", 125, 80, "#FFFFFF", "left", 1.37, 2.7, 30, 3000, "scrollClass");

scObj2.block[0] = "<a href=\"portfolio.php\"><img src=\"images/xdox-100.gif\" border=0></a>";
scObj2.block[1] = "<a href=\"portfolio.php\"><img src=\"images/grow100.jpg\" border=0></a>";
*/




/* **************************************************************************
*** Don't pass this line ****************************************************
************************************************************************** */
function scrollObject(objName, main, width, height, bkgcol, direct, deccel, begin, speed, pause, classname) {
  this.objName = objName;
  this.main = main;
  this.one = main + "Block1";
  this.two = main + "Block2";
  this.block = new Array();
  this.blockup = 1;
  this.divup = 1;
  this.height = height;
  this.width = width;
  this.bkgcol = bkgcol;
  this.direct = direct;
  this.deccel = Math.max(deccel, 1);
  this.begin = Math.max(Math.min(begin, (direct == "up" || direct == "down") ? height : width), 1);
  this.speed = speed;
  this.pause = pause;
  this.slide = ((direct == "up" || direct == "down") ? height : width) / this.begin;
  this.table = "<table cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td class=\"" + classname + "\" style=\"width:" + width + "px;height:" + height + "px;\">";
  this.active = false;
  this.moving = false;
  this.process = 0;
  this.mouse = false;
  this.scroll = function() {
    if (!document.getElementById) return false;
    document.getElementById(this.main).innerHTML = "<div id=\"" + this.one + "\"></div><div id=\"" + this.two + "\"></div>";
    var divList = [document.getElementById(this.main), document.getElementById(this.one), document.getElementById(this.two)];
    for (var i = 0; i <= 2; i++) {
      if (i > 0) {
        divList[i].style.position = "absolute";
        if (this.direct == "up" || this.direct == "down") {
          divList[i].style.left = "0px";
          divList[i].style.top = (i == 1) ? "0px" : ((this.direct == "up") ? "" : "-") + this.height + "px";
        } else {
          divList[i].style.left = (i == 1) ? "0px" : ((this.direct == "left") ? "" : "-") + this.width + "px";
          divList[i].style.top = "0px";
        } divList[i].innerHTML = this.table + this.block[i - 1] + "</td></tr></table>";
      } else {
        divList[i].style.position = "relative";
        divList[i].style.background = this.bkgcol;
        if (this.block.length > 1) {
          divList[i].onmouseover = new Function("if (" + this.objName + ".active) setTimeout(\"" + this.objName + ".scrollWait();\", " + this.objName + ".pause); " + this.objName + ".active = false; " + this.objName + ".mouse = true;");
          divList[i].onmouseout = new Function(this.objName + ".mouse = false;");
        }
      } divList[i].style.overflow = "hidden";
      divList[i].style.width = this.width + "px";
      divList[i].style.height = this.height + "px";
    } this.active = true;
    if (this.block.length > 1) this.process = setTimeout(this.objName + ".scrollLoop();", this.pause);
  }
  this.scrollLoop = function() {
    clearTimeout(this.process);
    if (this.moving == false && this.active == false) return false;
    var divList = [document.getElementById(this.main), document.getElementById(this.one), document.getElementById(this.two)];
    this.slide = Math.max(this.slide / this.deccel, 1);
    var slideInc = (this.direct == "up" || this.direct == "left") ? -parseInt(this.slide) : parseInt(this.slide);
    if ((this.direct == "up" && Math.max(parseInt(divList[1].style.top) + slideInc, parseInt(divList[2].style.top) + slideInc) <= 0) ||
        (this.direct == "down" && Math.min(parseInt(divList[1].style.top) + slideInc, parseInt(divList[2].style.top) + slideInc) >= 0) ||
        (this.direct == "left" && Math.max(parseInt(divList[1].style.left) + slideInc, parseInt(divList[2].style.left) + slideInc) <= 0) ||
        (this.direct == "right" && Math.min(parseInt(divList[1].style.left) + slideInc, parseInt(divList[2].style.left) + slideInc) >= 0)) {
      this.slide = ((this.direct == "up" || this.direct == "down") ? this.height : this.width) / this.begin;
      if (++this.blockup >= this.block.length) this.blockup = 0;
      this.divup = (this.divup == 1) ? 2 : 1;
      if (this.direct == "up" || this.direct == "down") {
        divList[3 - this.divup].style.top = ((this.direct == "down") ? "-" : "") + this.height + "px";
        divList[this.divup].style.top = "0px";
      } else {
        divList[3 - this.divup].style.left = ((this.direct == "right") ? "-" : "") + this.width + "px";
        divList[this.divup].style.left = "0px";
      } divList[3 - this.divup].innerHTML = this.table + this.block[this.blockup] + "</td></tr></table>";
      this.moving = false;
      this.process = setTimeout(this.objName + ".scrollLoop();", this.pause);
    } else {
      this.moving = true;
      for (var j = 1; j <= 2; j++) {
        if (this.direct == "up" || this.direct == "down") {
          divList[j].style.top = (parseInt(divList[j].style.top) + slideInc) + "px";
        } else divList[j].style.left = (parseInt(divList[j].style.left) + slideInc) + "px";
      } this.process = setTimeout(this.objName + ".scrollLoop();", this.speed);
    }
  }
  this.scrollWait = function() {
    clearTimeout(this.process);
    if (this.active) return false;
    if (!this.mouse) {
      this.active = true;
      this.process = setTimeout(this.objName + ".scrollLoop();", this.pause / 2);
    } else this.process = setTimeout(this.objName + ".scrollWait();", this.pause);
  }
}

