/* ********************************************************************
* 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:
* javascript@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 javascript@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',  '663300','33BB00', 20, 20, true);
fader[0].message[0] = "Mouseover each place to see the place details properly  fade in and out here.";
fader[0].message[1] = "It is  16  Kms  from  Shimoga  on Holehonnur, Channagiri Road, Rivers Tunga and Bhadra -Joins here. hence the name Koodali.  As the rivers joins Tunga- Bhadra was born.  It flows overwellemingly from here. Koodali is also a religious centre.  It is also called as south Varanasi, Mahaprayaga and Rushyashrama,   Brahmeswara, Narashima and Rameshwsra temples, and 600 years old mutt at shankaracharya is here inscriptions of Hoysala and Ikkeri Kings are found here. <IMG SRC='images/shimoga/Koodali.jpg' WIDTH='310' HEIGHT='210' BORDER='0' ALT='Koodali' align='left' class='elemFader'><IMG SRC='images/shimoga/koodali1.jpg' WIDTH='310' HEIGHT='210' BORDER='0' ALT='Koodali' align='right' class='elemFader'>";
fader[0].message[2] = "It is 10Kms. from Shimoga on Thirthahalli Road. A Dam is constructed across the river Tunga. It is  580'in width  and  60'in height. Upper Tunga project has an inspection Bungalow, reservation  authority The executive engineer, Upper Tunga Projects Shimoga, Telephone No 08182-22972.  <IMG SRC='images/shimoga/gajanur.jpg' WIDTH='351' HEIGHT='293' BORDER='0' ALT='Gajanur Dam' class='elemFader'>";
fader[0].message[3] = "It is 32 Kms. from Shimoga on Thirthahalli Road.   It is a Bird Sanctuary on Tunga River.Birds like Lgret, Carmorent Darter, Snake Bird are  found.  The season starts during May and November.  <IMG SRC='images/shimoga/mandagadde.jpg' ALIGN='center' WIDTH='420' HEIGHT='270' BORDER='0' ALT='Mandagadde a Bird Sanctuary ' class='elemFader'>";
fader[0].message[4] = "It located in the middle of Shimoga City, on the banks of Tunga river.  The palace  is built by Keladi Rule Shivappa Nayaka during 16th century. The palace is entirely built of rose wood. State department of Archeology is maintaining the museum, which has a collection of stone carvings and antiquities of the Keladi period. A rest house is available for the tourist. Reservation authority the Assistant Director of State Archeology ,Shivappanaika palace, Shimoga. Telephone 08182-23362. <IMG SRC='images/shimoga/shivappa-nayaka-palace.jpg' WIDTH='314' HEIGHT='173' BORDER='0' ALT='Shivappa Nayaka Palace' class='elemFader'>";
fader[0].message[5] = "The church is built in the middle of Shimoga city on B.H road .The architecture  of the church is in Roman graphic style. The church is said to be the 2nd largest church in India .The church is about 18000 square feet in area with a big prayer hall. Which has the capacity of 5000 peoples. The attractive statue of Jesus attracts tourists and pilgrims. &nbsp; <IMG SRC='images/shimoga/church.jpg' WIDTH='280' HEIGHT='197' BORDER='0' ALT='Church' align='left' class='elemFader'>";
fader[0].message[6] = "Elephant camp is 13 Kms. from Shimoga on Thirthahalli Road, located on the      banks of the Tunga reservoir, everyday morning all the elephants take their bath and proceed to near by forest for their rounds after  10 A.M   Tourist should reach this spot before 9 A.m. City buses are available at 7.30, 8.30 and 10 A.M. <IMG SRC='images/shimoga/sakrebylu.jpg' WIDTH='281' HEIGHT='350' BORDER='0' ALT='Elephant Camp' align='left' class='elemFader'>";
fader[0].message[7] = "This Safari is located at Tavarekoppa  10 Kms away from Shimoga in B.H   road (N.H 206),Sagar route. Forest department has set-up the Shettihalli Lion Safari, where we can see some Tigers,Lions,Chita,Bear,Deer,Birds etc Children recreation facilities are available and it will be opening at about 9 A.M to 5 P.M everyday except Tuesday that is holiday. Almost all buses to Sagar will stop here. <IMG SRC='images/shimoga/tavarekoppa.jpg' WIDTH='225' HEIGHT='180' BORDER='0' ALT='Tiger Safari ' Align='left' class='elemFader'> <IMG SRC='images/shimoga/tiger-safari.jpg' WIDTH='237' HEIGHT='181' BORDER='0' ALT='Tiger Safari ' Align='right' class='elemFader'>";

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 variable throbStep is used to keep track of where the
 *   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 second 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!

function throbFade() {
  fade(2, Math.floor(throbStep / 2), (throbStep % 2) ? false : true);
  setTimeout("throbFade();", (throbStep % 2) ? 100 : 4000);
  if (++throbStep > fader[2].message.length * 2 - 1) throbStep = 0;
}

fader[2] = new fadeObj(2, 'fade2', 'bbbbbb', '000000', 30, 30, false);
fader[2].message[0] = "This is an automatically fading message";
fader[2].message[1] = "By designing your own looping functions...";
fader[2].message[2] = "You can co-ordinate many separate fade effects";
fader[2].message[3] = "Including a simple list of messages like this one";
fader[2].message[4] = "View the source to find out how!";

var throbStep = 0;
setTimeout("throbFade();", 1000);

 */