/* ********************************************************************
* GreyWyvern's Buffered Text-fade Effect - v2.2a
* - A bit of Javascript for handling intelligent fading of text
* - Copyright 2006 - Licenced for free distribution under the BSDL
*   - http://www.opensource.org/licenses/bsd-license.php
*
*   This program is licenced under the BSDL and may be distributed far
* and wide, anywhere on the planet and beyond (maybe!)  If you happen
* to get a kick out of this script, please drop me a note at:
* wyvern@greywyvern.com and tell me where you gave it a good home and
* plenty of bytes to eat, hmmm? :)  I'd be eternally grateful.
*
* Description:
*   A complete recode of the original fade in and out javascript I
* wrote with many improvements.  The buffer system now works almost
* flawlessly, and making fade effects is much easier for the javascript
* beginner.  Just fill in the messages and assign the onmouseover and
* onmouseout attributes with the appropriate fade function!  It also
* helps *me* out by allowing the instruction manual (below) to be much
* simpler to write ;)
*
* Changelog:
*  2.2a - Code optimization accumulation release
*       - No need to upgrade from 2.2 if it works for you
*
*  2.2 - Licence changed from GPL to BSDL
*
*  2.1 - The script would cancel two fade commands if one was a fade in
*        and one was a fade out of the same fade target and message.
*        I added some extra code to cancel the opposite case: two
*        commands where one is a fade out and the other is a fade in of
*        the same message.
*      - If the fade trigger element contained text within an HTML
*        element, a quick mouseover/mouseout or mouseout/mouseover pair
*        of events would be triggered if you moused-out of the text,
*        while staying within the trigger element.  I added a new
*        timeout to catch this set of events.
*
* Support:
*   Opera 7.x  - Perfectly
*   IE 6       - Perfectly
*   IE 5.5     - Perfectly
*   IE 5.01    - Fails
*   Mozilla    - Flickers slightly
*   Firefox    - Flickers slightly
*
*
* I) Setting Up
*   Copy the javascript from this page into an external .js file or
* into the <script> tag of your own HTML page.  This shouldn't be that
* difficult, but you wouldn't believe the kind of mail I get about
* this!  Just do it, okay?  Jeez.
*
* a) The Fade Object
*   After that's done we need to create a fade object.  We do this by
* calling the fadeObj function with a number of arguments.  We'll use
* the default example included in the script: fader[0].  You can delete
* the fader[1] lines if you like.
*
* fader[0] = new fadeObj(0, 'fade0', 'dddddd', '000000', 20, 20, true);
*
*   We'll go through the arguments in order.
*
*   The first argument (0), is the same number you give to the fader
* variable.  So if your fader object is fader[78], the first argument
* would be 78.
*
*   Next is the id of the HTML tag which will be displaying the fading
* effect.  Usually you'll want to apply some height and width styles to
* this element, since it starts out with no text by default and will
* probably be collapsed.  You don't want it jumping around when the
* script writes new text to it.
*
*   The next two values are hexidecimal colour values, WITHOUT the
* preceding #.  The first value is the starting colour, or the colour
* the text is before it fades in.  The second value is the ending
* colour, or the colour the text will be when it finishes fading in.
*
*   After this comes two speed integers, the first for fade-in speed,
* the second for fade-out.  The speed of the fade will increase the
* smaller these numbers get.  At a value of one there is no visible
* fade effect; the text will just "appear".
*   Essentially what these numbers are is the number of "steps" the
* script must take to complete the fade.  With a value of 20 like in
* the example above, there will be 20 colour changes before the text
* is fully faded-in or faded-out.
*
*   The final argument is very important.  It tells the script if there
* is a default block of text you'd like to display in the fade element.
* If set to true, the value of the message[0] will be faded-in if there
* are no more fade commands in the queue.  Once another fade is
* triggered, the default text will fade out first before the new text
* fades in.
*   If set to false, the script will erase the text in the fade element
* if there are no more fade commands left in the queue, leaving it
* completely blank.
*
*
* b) The Fade Messages
*   After setting up our fade object, all we need to do now is write
* out all of the messages which will be displayed in this element.
* Remember that this script only affects text and including images or
* links won't work.
*
*   Messages are included in the message[] array.  Simply assign each
* message a number, like so:
*
* fader[0].message[1] = "Fade text, message one.";
*
*   Each fade object can have as many messages as you want, and be in
* any numerical order.  You can even skip numbers, but note that if you
* use the fade() pointed at a message number which doesn't exist, you
* will get an error.
*
*   As mentioned above, if your fade object has a default message
* specified, it will use the message text from message[0].  Specifying
* a default message and not including a message[0] will cause an error.
*
*
* II) The Events
*   Fades can be triggered by any DOM event, but most likely you'll be
* using mouseover and mouseout events.  I used those events as examples
* below.
*
*   To trigger a fade, you use the fade() function which takes a few
* important arguments:
*
* Example: onmouseover="fade(0, 1, true);"
* 
*   The first argument is the number of the fade object this command is
* targetting.  In this case, it's been pointed at fader[0].
*
*   The second is the message this command refers to.  This one has
* been associated with message[1] of fader[0].
*
*   Lastly, the final argument indicates the direction of the fade.
* true = fade in, false = fade out.
*
*   Examine the working example script to see how these events were
* placed on the <td> elements below.
*
*
* III) Tips
*   - If you give your fade object a default message, it won't appear
* until after the first mouseover event is triggered.  To rectify this
* you can add an onload event to the <body> tag which triggers the
* default message: <body onload="fade(0, 0, true);"> where the first
* argument is, of course, the number of the desired fade object.
*
*   - All the text in each message[] variable MUST be on one line in
* the code.  That means this:
*
*   fader[0].message[1] = "Fader zero,
* message one";
*
* ... is not allowed!  The text should wrap automatically when it's
* displayed on your HTML page, but you can force line breaks with the
* <br> tag.
*
*   - If you're placing the fading text on a background, make the
* starting colour an average sample of the background instead of just
* black or white.  This will enhance the "disappearing" effect.
*
*   - The script can only fade text, but can accept non-graphical HTML
* tags like <p>, <table> (no borders), <strong> and <em>.  Use these
* tags to add structure and simple text-effects to your fades.
*
*   - To have links fade along with with the surrounding text, apply
* the CSS style: color:inherit !important; to all links within the fade
* text messages.
*
* *********************************************************************
* That's it!  Isn't that amazing!?! :)
*
* If you have any problems with this script, don't hesitate to email me
* at wyvern@greywyvern.com and I'll be happy to answer your matter-of-
* life-and-death questions!  Cheers!
* ****************************************************************** */

/* ***** Begin: GreyWyvern's Buffered Text-fade Effect - v2.2a ***** */
var fader = new Array(), fadeQ = new Array();
var RGB = new Array(256), k = 0, hex = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
for (var i = 0; i < 16; i++) for (var j = 0; j < 16; j++) RGB[k++] = hex[i] + hex[j];

function fadeObj(number, id, colOff, colOn, spdIn, spdOut, def) {
  this.number = number;
  this.id = id;
  this.colOff = [parseInt(colOff.substr(0, 2), 16), parseInt(colOff.substr(2, 2), 16), parseInt(colOff.substr(4, 2), 16)];
  this.colOn = [parseInt(colOn.substr(0, 2), 16), parseInt(colOn.substr(2, 2), 16), parseInt(colOn.substr(4, 2), 16)];
  this.colNow = [parseInt(colOff.substr(0, 2), 16), parseInt(colOff.substr(2, 2), 16), parseInt(colOff.substr(4, 2), 16)];
  this.spdIn = spdIn;
  this.spdOut = spdOut;
  this.def = def;
  this.direction = false;
  this.active = false;
  this.message = new Array();
  this.messageNow = 0;
}

function fadeCmd(number, message, direction) {
  this.number = number;
  this.message = message;
  this.direction = direction;
}

function fade(number, message, direction) {
  if (fader[number].def && fader[number].messageNow == 0 && fader[number].direction) {
    fadeQ[fadeQ.length] = new fadeCmd(number, 0, false);
    fadeQ[fadeQ.length] = new fadeCmd(number, message, direction);
    message = 0;
    direction = false;
  } else fadeQ[fadeQ.length] = new fadeCmd(number, message, direction);
  setTimeout(function() { fadeBegin(number); }, 20);
}

function fadeBegin(number) {
  for (var x = 0; x < fadeQ.length; x++) {
    for (var y = x + 1; y < fadeQ.length; y++) {
      if (fadeQ[x].number == fadeQ[y].number && fadeQ[x].message == fadeQ[y].message && fadeQ[x].direction != fadeQ[y].direction) {
        fadeQ.splice(x, 1);
        fadeQ.splice(y - 1, 1);
      }
    }
  }
  if (!fader[number].active) {
    for (var x = 0; x < fadeQ.length; x++) {
      if (fadeQ[x].number == number && fadeQ[x].direction != fader[number].direction) {
        var del = fadeQ.splice(x, 1);
        setTimeout(function() { fadeEng(number, del[0].message, del[0].direction); }, 0);
        break;
      }
    }
  }
}

function fadeEng(number, message, direction) {
  if (!fader[number].active) {
    fader[number].active = true;
    fader[number].direction = direction;
    fader[number].messageNow = message;
    document.getElementById(fader[number].id).innerHTML = fader[number].message[message];
  }
  var iniCol = (direction) ? fader[number].colOff : fader[number].colOn;
  var endCol = (direction) ? fader[number].colOn : fader[number].colOff;
  var incCol = fader[number].colNow;
  var spd = (direction) ? fader[number].spdIn : fader[number].spdOut;
  for (var x = 0; x < 3; x++) {
    var incr = (endCol[x] - iniCol[x]) / spd;
    incCol[x] = (incr < 0) ? Math.max(incCol[x] + incr, endCol[x]) : Math.min(incCol[x] + incr, endCol[x]);
  }
  document.getElementById(fader[number].id).style.color = "#" + RGB[parseInt(incCol[0])] + RGB[parseInt(incCol[1])] + RGB[parseInt(incCol[2])];
  if (incCol[0] == endCol[0] && incCol[1] == endCol[1] && incCol[2] == endCol[2]) {
    fader[number].active = false;
    for (var x = 0; x < fadeQ.length; x++) {
      if (fadeQ[x].number == number) {
        var del = fadeQ.splice(x, 1);
        setTimeout(function() { fadeEng(number, del[0].message, del[0].direction); }, 0);
        return false;
      }
    }
    if (!direction) {
      if (fader[number].def) {
        setTimeout(function() { fadeEng(number, 0, true); }, 0);
      } else document.getElementById(fader[number].id).innerHTML = "&nbsp;";
    }
  } else setTimeout(function() { fadeEng(number, message, direction); }, 0);
}
/* ***** End: GreyWyvern's Buffered Text-fade Effect - v2.2a ******* */




/* *****
 * User defined fade objects and messages
 *
 * These messages are used in fades triggered by mouseovers and
 * mouseouts on table cells.  They are the simplest type of fade and
 * require no extra Javascript code.
 */
//fader[0] = new fadeObj(0, 'fade0', 'dddddd', '000000', 20, 20, true);
//fader[0].message[0] = "This is an optional default message; the fade object on the right side has no default.  Mouseover each topic to make quotes fade in and out.";
//fader[0].message[1] = "Nowhere can a man find a quieter or more untroubled retreat than in his own soul.<br />- Marcus Aurelius";
//fader[0].message[2] = "Feeding the starving poor only increases their number.<br />- Ben Bova";
//fader[0].message[3] = "The limits of tyrants are prescribed by the endurance of those whom they oppose.<br />- Frederick Douglass";
//fader[0].message[4] = "The foolish man seeks happiness in the distance, the wise grows it under his feet.<br />- James Oppenheim";

//fader[1] = new fadeObj(1, 'fade1', 'bbbbbb', '000000', 20, 20, false);
//fader[1].message[1] = "Success is relative. It is what we can make of the mess we have made of things.<br />- T.S. Eliot";
//fader[1].message[2] = "We have two ears and one mouth so we may listen more and talk the less.<br />- Epictetus";
//fader[1].message[3] = "It is better to be violent, if there is violence in our hearts, than to put on the cloak of nonviolence to cover impotence.<br />- Mahatma Gandhi";
//fader[1].message[4] = "Don't part with your illusions. When they are gone you may still exist, but you have ceased to live.<br />- Mark Twain";



/* *****
 * The code below describes how to make a throbbing or automatic fade
 * sequence of messages.  The throbFade function is called repeatedly
 * which controls what commands are sent to the fade engine, rather
 * than using mouseovers.
 *
 * Notes:
 * - A global array throbStep is used to keep track of where each
 *   animation is currently in the sequence.
 * - The list of messages defined in the fader *must* start at zero (0)
 *   and count upwards without skipping any integers.
 * - The third line of the throbFade() function controls how fast
 *   commands get sent to the fade engine.  It waits only 100 milli-
 *   seconds when fading out, but 4000 milliseconds (4 seconds) when
 *   fading in; this means the message will remain visible for about 4
 *   seconds before fading out again.
 *
 * Other types of fade animation are possible simply by designing
 * different ways to control the fade-ins and fade-outs!
 */
var throbStep = new Array();
function throbFade(item) {
  if (!throbStep[item]) throbStep[item] = 0;
  fade(item, Math.floor(throbStep[item] / 2), (throbStep[item] % 2) ? false : true);
  setTimeout(function() { throbFade(item); }, (throbStep[item] % 2) ? 100 : 10000);
  if (++throbStep[item] > fader[item].message.length * 2 - 1) throbStep[item] = 0;
}

fader[2] = new fadeObj(3, 'fade2', 'bbbbbb', '000000', 50, 50, false);
fader[2].message[0] = "&quot;<em>When I interview candidates that have been sent by Highams, I not only know that they are technically capable but, more importantly, they are the right kind of character for Novae</em>&quot;.<br />&nbsp;<br />Steve Fookes, IT Director, Novae Group plc";
fader[2].message[1] = "&quot;<em>In my experience of recruitment over the last ten years, Highams’ knowledge of the market for project managers, business analysts and testers for the UK and European insurance industry is unrivalled</em>&quot;<br />&nbsp;<br />Jan Egan, Business Analysis Manager, Allianz plc";
fader[2].message[2] = "&quot;<em>I have always been impressed by Highams and its knowledge of our industry. In terms of service, Highams provides nothing short of excellence</em>&quot;<br />&nbsp;<br />Steve Williams, Head of Strategic Sales, Bravura Solutions";
fader[2].message[3] = "&quot;<em>It has been a pleasure to receive only high quality candidates from you for this position. We have interviewed both of the candidates that you have presented, and have not met with any of the 7 candidates that were presented by the other agency.</em>&quot;<br />&nbsp;<br />Andrew Buchan, Sector Development Manager, SSP";

setTimeout(function() { throbFade(2); }, 1000);