//------------------------------------------------------------------------------
// A Switcher class for HPR.
dojo.require("dojo.fx");
dojo.require("dojo.NodeList-fx");

//------------------------------------------------------------------------------
dojo.declare("hpr.Switcher", null, {
    //--------------------------------------------------------------------------
    constructor: function(args) {
      this.switcher_node = dojo.byId(args.switcher_node);
      this.element_selector = args.element_selector;
      this.next_selector = args.next_selector;
      this.prev_selector = args.prev_selector;
      this.progress_selector = args.progress_selector;
      if (args.duration) {
        this.duration = args.duration;
      } else {
        this.duration = 5000;
      }
      this.current_progress = 0;
      this.progress_interval = this.duration / 50;

      this.elements = dojo.query(this.element_selector, this.switcher_node);
      this.progress_elements = dojo.query(this.progress_selector, this.switcher_node);
      // only set this up if we have more than one element.
      if (this.elements.length > 1) {
        this.cur_index = 0;
        this.next_index = 1;
        this.elements.style("zIndex", -1);
        dojo.style(this.elements[this.cur_index], "zIndex", 1);
        this._schedule_transition(this.cur_index, this.next_index);
      }

      dojo.connect(this.switcher_node, "onmouseover", this, "_pause_animation");
      dojo.connect(this.switcher_node, "onmouseout", this, "_start_animation");

      dojo.query(this.next_selector, this.switcher_node).connect("onclick", this, "_click_next");
      dojo.query(this.prev_selector, this.switcher_node).connect("onclick", this, "_click_prev");
      this.paused = false;
    },

    //--------------------------------------------------------------------------
    _pause_animation: function() {
      this.paused = true;
      this._unschedule_transition();
      var progressAnim = this._animate_progress();
      progressAnim.play();
    },

    //--------------------------------------------------------------------------
    _start_animation: function() {
      this.paused = false;
      this._schedule_transition(this.cur_index, this.next_index);
    },

    //--------------------------------------------------------------------------
    _unschedule_transition: function() {
      clearTimeout(this.timeout_id);
      clearInterval(this.interval_id);
    },
    //--------------------------------------------------------------------------
    _click_next: function(event) {
      dojo.stopEvent(event);
      this.next();
      return false;
    },

    //--------------------------------------------------------------------------
    _click_prev: function(event) {
      dojo.stopEvent(event);
      this.prev();
      return false;
    },

    //--------------------------------------------------------------------------
    _reset_progress: function() {
        this.current_progress = 0;
        clearInterval(this.interval_id);
    },

    //--------------------------------------------------------------------------
    _schedule_transition: function(cur_index, next_index) {
        this.timeout_id = setTimeout(dojo.hitch(this, "next"), this.duration);
        this._reset_progress();
        this.interval_id = setInterval(dojo.hitch(this, 'progress'), this.progress_interval);
    },

    //--------------------------------------------------------------------------
    _setup_next: function() {
        this._schedule_transition(this.cur_index, this.next_index);
    },

    //--------------------------------------------------------------------------
    _animate_progress: function() {
      cur_progress = this.current_progress;
      this._reset_progress();
      return this.progress_elements.animateProperty({
        properties: {
          width: { start: cur_progress, end: "0", units: "%" }
        }
      });
    },

    //--------------------------------------------------------------------------
    transition: function(cur_index, next_index, next_func) {
      console.log(this.cur_index);
      console.log(this.next_index);
      var fadeOutNode = this.elements[cur_index];
      var fadeInNode = this.elements[next_index];
      dojo.style(fadeOutNode, {
          opacity: 1.0,
          zIndex: 1
      });
      dojo.style(fadeInNode, {
          opacity: 0.0,
          zIndex: 0
      });

      dojo.addClass(fadeOutNode, "shown");
      dojo.addClass(fadeInNode, "shown");
      dojo.removeClass(fadeOutNode, "hidden");
      dojo.removeClass(fadeInNode, "hidden");

      var fadeIn = dojo.fadeIn({
        node: fadeInNode,
        duration: 500
      });
      var fadeOut = dojo.fadeOut({
        node: fadeOutNode,
        duration: 500
      });
      var progressAnim = this._animate_progress();

      var anim = dojo.fx.combine([fadeIn, fadeOut, progressAnim]);
      if (next_func) {
        dojo.connect(anim, "onEnd", this, next_func);
      }
      dojo.connect(anim, "onEnd", function() {
          dojo.removeClass(fadeOutNode, "shown");
          dojo.addClass(fadeOutNode, "hidden");
          dojo.style(fadeOutNode, {
              zIndex: -1
          });
          dojo.style(fadeInNode, {
              zIndex: 1
          });
      });
      anim.play();
    },

    //--------------------------------------------------------------------------
    next: function() {
      if (this.paused) {
        this.transition(this.cur_index, this.next_index);
      } else {
        this.transition(this.cur_index, this.next_index, "_setup_next");
      }
      this.cur_index += 1;
      if (this.cur_index >= this.elements.length) {
        this.cur_index = 0;
      }
      this.next_index = this.cur_index + 1;
      if (this.next_index >= this.elements.length) {
        this.next_index = 0;
      } 
    },

    //--------------------------------------------------------------------------
    prev: function() {
      this.cur_index -= 1;
      if (this.cur_index < 0) {
        this.cur_index = this.elements.length - 1;
      }

      this.next_index = this.cur_index + 1;
      if (this.next_index >= this.elements.length) {
        this.next_index = 0;
      } 

      if (this.paused) {
        this.transition(this.next_index, this.cur_index);
      } else {
        this.transition(this.next_index, this.cur_index, "_setup_next");
      }
    },

    //--------------------------------------------------------------------------
    progress: function(cur_index, next_index) {
      this.current_progress += 2;
      if (this.current_progress > 100) {
        this.current_progress = 100
      }

      this.progress_elements.style("width", this.current_progress + "%");
    },


    _forIE: "No Trailing Commas"
});