//
// This script is used to create a Rotator inside of an existing DIV (or other container) on a web page.
// It allows you to add as many or as few images as you'd like. For each of the images you can specify
// an optional link url, the target for that link, the title for the mouseover, and also a description
// that might get displayed on top of the image.
//
// DEPENDENCIES: jquery.js (some version of jquery needs to be included for this script to work)
//
//
// Sample usage:
//
// 1. At the top of your HTML page include jquery and this script like this:
//
//        <script src="js/jquery/jquery-1.2.6.js"></script>  <!-- any version > 1.2.3 is okay -->
//        <script src="js/cmg_rotator.js"></script>
//
// 2. Anywhere in your HTML create the Rotator object and specify the name of the container (div, span, whatever)
//
//        <script type="text/javascript">
//        var myRotator = new cmgRotator('divDynamicRotatorContent');
//
// 3. AFTER you create the object, add the images that you want in the rotator like this:
//
//        myRotator.add_image('welcome.jpg','#',                    '_self', 'Welcome to Valley Creek',   'This description text might sit on TOP of image. Not coded yet though.');
//        myRotator.add_image('image2.jpg', 'http://google.com',    '_self', 'Welcome 2',                 'This description text might sit on TOP of image. Not coded yet though.');
//        myRotator.add_image('image3.jpg', 'http://churchmedia.cc','_blank','Welcome to Valley Creek 3', 'This description text might sit on TOP of image. Not coded yet though.');
//
// 4. Now that you've created the cmgRotator and added pictures to it, end the <script> section:
//
//         </script>
//
// 5. At the bottom of your HTML before the </body> tag, add the following code that will start
//    the rotator after the page is fully loaded, and tell it how many seconds to use in between
//    each image. In this case we're using 3 seconds in between each image:
//
//        <script type="text/javascript">
//        $j(document).ready(function(){
//          objRotator.start(3);
//        });
//        </script>
//


//Define the object and its properties
function cmgRotator(div_container) {
  //Properties
  this.div_container = div_container;
  this.image_path = 'images/rotator/';
  this.written_html_to_page = false;

  this.current_index = 0;
  this.images = new Array();

  this.interval = 5;
  this.timer_id = -1;
  this.is_currently_executing = false; //keeps track of whether the timer fired code is currently executing

  //Create a closure that will reference the instance of the object so the timer fired callback
  //will have access to the member variables of the object itself (not the context of the timer
  //object itself).
  var internalRotator = this;
  this.callback_timer_fired = function() {
    internalRotator.timer_fired();
  }
}

//Assign methods to the object
cmgRotator.prototype = {
  add_image: function(image, link, target, mouseover_text, description) {
    var tmp_image_object = new cmgImage(image, link, target, mouseover_text, description);
    this.images.push(tmp_image_object);
    return true;
  },

  write_html_to_page: function() {
    if (this.images.length > 0) {
      var img_object = this.images[0];
      var sLink = img_object.link;
      if (sLink == '') { sLink = '#'; }
      var sTarget = img_object.target;

      //Add <a href></a> to the page
      $j("<a></a>").attr( { href:sLink, id:'cmg_rotator_href', target:sTarget }).appendTo('#'+this.div_container);
      var image_source = this.image_path + img_object.image;

      //Add <img> inside of the new <a>
      $j("<img>").attr( { id:'cmg_rotator_img', src:image_source, alt:img_object.mouseover_text, title:img_object.mouseover_text } ).appendTo('#cmg_rotator_href');

      this.written_html_to_page = true;
      return true;
    }
    else {
      return false;
    }
  },

  rotate_images: function() {
    this.current_index = this.current_index + 1;
    if (this.current_index == this.images.length) {
      //if we're at the end of the array the go back to the beginning
      this.current_index = 0;
    }
    var img_object = this.images[this.current_index];
    $j('#cmg_rotator_img').attr('src', this.image_path + img_object.image);
    $j('#cmg_rotator_img').attr('alt', img_object.mouseover_text);
    $j('#cmg_rotator_img').attr('title', img_object.mouseover_text);
    if (img_object.link == '') {
      $j('#cmg_rotator_href').attr('href', "#");
      $j('#cmg_rotator_href').attr('target', "");
    }
    else {
      $j('#cmg_rotator_href').attr('href', img_object.link);
      $j('#cmg_rotator_href').attr('target', img_object.target);
    }
  },

  timer_fired: function() {
    if (!this.is_currently_executing) {
      try {
        this.is_currently_executing = true;
        this.rotate_images();
      }
      finally {
        this.is_currently_executing = false;
      }
    }
  },

  start: function(interval_in_seconds) {
    if (this.written_html_to_page == false) {
      this.write_html_to_page();
    }

    if (this.timer_id > -1) { return true; } //timer was already started, no need to start it again
    var interval_in_milleseconds = interval_in_seconds * 1000;
    this.timer_id = setInterval(this.callback_timer_fired, interval_in_milleseconds);
    return true;
  },

  stop: function() {
    if (this.timer_id == -1 ) { return true; } //timer isn't running, no need to stop it

    clearInterval(this.timer_id);
    this.timer_id = -1;
    return true;
  }
}

//
// Define the object and its properties.
//
// NOTE: This type of object is used within the Rotator oject.
//
function cmgImage(image, link, target, mouseover_text, description) {
  this.image = image;
  this.link = link;
  this.target = target;
  this.mouseover_text = mouseover_text;
  this.description = description;
}