/* ********************************************************************
*** GreyWyvern's HTML Block Scroller & Marquee ************************
***********************************************************************
* HTML Block Scroller & Marquee JavaScript - v1.9
*  - Copyright 2007 - 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 webpages.
* The scroller will even pause on mouseover and resume on mouseout.
*
* Version 1.9
*   - Fixed content flash in Firefox
*   - Code optimization
*
* Version 1.8
*   - Fixed movement in "down" and "right" directions
*   - Added the speed argument back in for customisability
*   - scrollObject ARGUMENT LIST HAS CHANGED
*
* Version 1.7
*   - Significant recode for speed and efficiency
*   - Pause-on-mouseover now works reliably
*   - Now MUCH less complicated to create a scroller
*   - scrollObject ARGUMENT LIST HAS CHANGED
*     - Only five arguments instead of ten :)
*
* Version 1.6
*   - Specifying variable name in argument list no longer required
*   - scrollObject ARGUMENT LIST HAS CHANGED
*
* 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="scr1">
*   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 "scr1" 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; such as a <span> element to which the display:block; CSS
* property has been applied.
*
* To style the scroller container, assign CSS properties to the scr1
* id:
*
* #scr1 {
*   background-color:#f6f6f6;
*   margin:0px auto;
* }
*
* For each of the blocks you add to a scroller, the script will add a
* single-celled <table> inside the target element and insert the
* contents of the block. So to style the blocks of your scroller, you
* can style these table cells as if they were actually part of your
* document source:
*
* #scr1 table tr td {
*   padding:10px;
*   color:#ff0000;
*   text-align:center;
*   vertical-align:middle;
* }
*
***********************************************************************
* 2. Create a new scrollObject:
*
* var scroll1 = new scrollObject("scr1", 120, 120, "up", 5000, 1.4);
*
* The arguments for this object are as follows:
*  a. - ID of the target tag (from step 1)
*  b. - Width (in pixels) of your scroller
*  c. - Height (in pixels) of your scroller
*  d. - Scroll direction: one of "up", "down", "left" or "right"
*  e. - Amount of time to pause before next scroll begins (ms)
*  f. - Slide-in speed of your scroller (1.001 up to width or height)
*
***********************************************************************
* 3. Fill the Scroll Object blocks with HTML:
*
* scroll1.block[0] = "This is block 1";
* scroll1.block[1] = "This is block 2";
* scroll1.block[2] = "Blocks can contain any HTML including:";
* scroll1.block[3] = "Images, tables, links and more";
* scroll1.block[4] = "Easy to configure, easy to run";
* scroll1.block[5] = "Have any number of block scrollers running";
* scroll1.block[6] = "On a single page all with a single JavaScript";
* scroll1.block[7] = "View the source for more info!";
*
* There is no limit to how many blocks or scrollObjects this program
* can hold, as long as you don't skip any integers when numbering the
* blocks. For example, the following setup will cause the scroller to
* throw an error:
*
* scroll1.block[0] = "This is block 1";
* scroll1.block[1] = "This is block 2";
* scroll1.block[3] = "Images, tables, links and more";
*
***********************************************************************
* 4. Add an "onload" command to the <body> tag:
*
* <body onload="scroll1.scroll();">
*
*
***********************************************************************
*** To add more scrollers to the same page: ***************************
***********************************************************************
* 1. Create additional ID'ed targets (with different ID's) in the body
* of your HTML
*
* <div id="scr2">
*   Default content which will not scroll
* </div>
*
* <div id="scr3">
*   Default content which will not scroll
* </div>
*
***********************************************************************
* 2. Create new scrollObjects for each scroller in the <script> tag:
*
* var scroll2 = new scrollObject("scr2", 468, 60, "down", 10000, 1.2);
* var scroll3 = new scrollObject("scr3", 140, 140, "right", 4000, 2);
*
***********************************************************************
* 3. Fill the Scroll Object blocks with HTML:
*
* scroll2.block[0] = '<strong>HTML is allowed too!</strong>';
* scroll2.block[1] = '<img src="/images/mybanner.jpg" alt="">';
* scroll2.block[2] = '<a href="/home">And links!</a>';
* scroll2.block[2] = 'As long as it fits within the dimensions above';
*
* scroll3.block[0] = "Block 1";
* scroll3.block[1] = "Block 2";
* scroll3.block[2] = "Block 3";
* scroll3.block[3] = "Block 4";
*
***********************************************************************
* 4. Add an "onload" command for all scroll objects to the <body> tag:
*
* <body onload="scroll1.scroll();scroll2.scroll();scroll3.scroll();">
*
*
***********************************************************************
*** End Instructions **************************************************
*************************************************** BEGIN CODE ***** */



// ***** Sample scroller #1
var scroll1 = new scrollObject("scr1", 400, 180, "up", 8000, 1.15);
    scroll1.block[0] = "&ldquo;This is the fourth year that Tom has looked after all our mortgage needs.  We are confident that we get the best advice and trust him to proactively search for the right products to suit our needs for both our residential and buy to let mortgages.&rdquo;<span>Mrs J Shaw</span>";
    scroll1.block[1] = "&ldquo;I have an incredibly busy lifestyle that doesn't allow me to shop around for the best deals, the team at J P Financial took the hassle away and got me the best deal available, thank you J P Financial!&rdquo;<span>Mr S Fergusson</span>";
    scroll1.block[2] = "&ldquo;I would recommend Paul at J P Financial without hesitation, as a first time buyer he helped me through the whole process and really helped take the stress away.&rdquo;<span>Miss N Boyd</span>";
    scroll1.block[3] = "&ldquo;J P Financial Services have provided me with advice for nearly five years.  Through this period I have had a prompt and efficient service and a substantial saving on my mortgage and insurance polices.&rdquo;<span>Mr V Patel</span>";
    scroll1.block[4] = "&ldquo;Thank you for you prompt and efficient service.  It was a delight to deal with you and I would have no hesitation in recommending you to friends and family.&rdquo;<span>Mr N Tapley</span>";
    scroll1.block[5] = "&ldquo;I recently remortgaged through J P Financial, and to say that I was impressed with the service would be an understatement.&rdquo;<span>Mr P Hoole</span>";
    scroll1.block[6] = "&ldquo;I have used the services of J P Financial for over two years now.  The team have always been helpful, knowledgeable and provided honest informative advice.  J P Financial come highly recommended to anyone wanting to get their financial plans in place with the minimum of fuss.&rdquo;<span>Mr D Barry</span>";


/* *****
 * Instead of using the onload attribute of the <body> tag, you can
 * also start your scrollers this way.
 *
 */
window.onload = function() {
  scroll1.scroll();
}




/* ********************************************************************
 * The Mighty ScrollObject
 *   - Don't edit this if you know what's good for ya!
 *
 */
function scrollObject(main, width, height, direct, pause, speed) {
  var self = this;
  this.main = main;
  this.width = width;
  this.height = height;
  this.direct = direct;
  this.pause = pause;
  this.speed = Math.max(1.001, Math.min((direct == "up" || direct == "down") ? height : width, speed));
  this.block = new Array();
  this.blockprev = this.offset = 0;
  this.blockcurr = 1;
  this.mouse = false;
  this.scroll = function() {
    if (!document.getElementById) return false;
    this.main = document.getElementById(this.main);
    while (this.main.firstChild) this.main.removeChild(this.main.firstChild);
    this.main.style.overflow = "hidden";
    this.main.style.position = "relative";
    this.main.style.width = this.width + "px";
    this.main.style.height = this.height + "px";
    for (var x = 0; x < this.block.length; x++) {
      var table = document.createElement('table');
          table.cellPadding = table.cellSpacing = table.border = "0";
          table.style.position = "absolute";
          table.style.left = table.style.top = "0px";
          table.style.width = this.width + "px";
          table.style.height = this.height + "px";
          table.style.overflow = table.style.visibility = "hidden";
        var tbody = document.createElement('tbody');
          var tr = document.createElement('tr');
            var td = document.createElement('td');
                td.innerHTML = this.block[x];
              tr.appendChild(td);
            tbody.appendChild(tr);
          table.appendChild(tbody);
      this.main.appendChild(this.block[x] = table);
    }
    if (this.block.length > 1) {
      this.main.onmouseover = function() { self.mouse = true; }
      this.main.onmouseout = function() { self.mouse = false; }
      setInterval(function() {
        if (!self.offset && self.scrollLoop()) self.block[self.blockcurr].style.visibility = "visible";
      }, this.pause);
    } this.block[this.blockprev].style.visibility = "visible";
  }
  this.scrollLoop = function() {
    if (!this.offset) {
      if (this.mouse) return false;
      this.offset = (this.direct == "up" || this.direct == "down") ? this.height : this.width;
    } else this.offset = Math.floor(this.offset / this.speed);
    if (this.direct == "up" || this.direct == "down") {
      this.block[this.blockcurr].style.top = ((this.direct == "up") ? this.offset : -this.offset) + "px";
      this.block[this.blockprev].style.top = ((this.direct == "up") ? this.offset - this.height : this.height - this.offset) + "px";
    } else {
      this.block[this.blockcurr].style.left = ((this.direct == "left") ? this.offset : -this.offset) + "px";
      this.block[this.blockprev].style.left = ((this.direct == "left") ? this.offset - this.width : this.width - this.offset) + "px";
    }
    if (!this.offset) {
      this.block[this.blockprev].style.visibility = "hidden";
      this.blockprev = this.blockcurr;
      if (++this.blockcurr >= this.block.length) this.blockcurr = 0;
    } else setTimeout(function() { self.scrollLoop(); }, 30);
    return true;
  }
}