/* --------------------------------------------------------------------------*
 *              tooltips plugin                                              *
 * This plugin provides enhanced tooltips.                                   *
 *---------------------------------------------------------------------------*/

//*--- ToolTips Class, derived from AjaxPlugin base class ---*
var ToolTips = Class.create(AjaxPlugin, {
  
  initialize: function($super, container_element, tooltip_url, tooltip_type, direction)
  {
//      alert(tooltip_url);
    // Call the superclass constructor:
    $super();
    
    // Can the superclass do this?
    this.server_path = GA_UTIL.get_script_path('tooltips\.js').replace(/tooltips\.js/,'');
    
    // Setup direction of tooltip
    if (direction == 'down') {
        this.direction = direction;
    } else {
        this.direction = 'up';
    }


    // Remember our server URL
    if (tooltip_url) {
      this.tooltip_url = tooltip_url;
    }
    else // otherwise use the default server at our .js location
    {
        switch (tooltip_type) {
            case 'hover':
                this.tooltip_url = this.server_path + 'tooltips_hover_' + this.direction + '\.html';
                break;
            default :
                this.tooltip_url = this.server_path + 'tooltips_' + this.direction + '\.html';
        }
    }
    
    this.contentHash = $H({});
    
    this.container_element = container_element;
    
    this.setup_html();
    
    if (tooltip_type) {
      this.tooltip_type = tooltip_type;
    }

    // Set up my valid event names:
    this.register_event_names(['tooltip_data_set', 'tooltip_opened', 'tooltip_closed']);

  },
  
  setup_html: function()
  {
    new Ajax.Request(this.tooltip_url,
      {
        onSuccess: function(transport){
          this.tooltip_html = transport.responseText;
        }.bind(this)
      });
  },
  
  // The tooltip content database is used to look up the content to display for 
  // each element that gets a tooltip.  The database is of the form:
  //  {element_id1:  content1,
  //   element_id2:  content2,
  //   ... } 
  add_content: function(content_hash)
  {
    this.contentHash.update(content_hash);
    
    // If we're displaying a tooltip whose content is being changed,
    // then re-display the tooltip:
    if (this.displayed_tooltip != null &&
        content_hash[this.displayed_tooltip] != null)
    {
      this._hide_tooltip();
      this._show_tooltip(this.displayed_tooltip);
    }
    
    // Raise an event that data has been set:
    this.raise_event('tooltip_data_set', this);
  },
  
  // setup_tooltip_for sets up a tooltip for the specified element
  setup_tooltip_for: function(element_id)
  {
    var elem = $(element_id);
    
    if (elem == null) return;
    
    elem.observe('click', this._show_tooltip.bind(this))
  },
  
  // setup_tooltip_for sets up a tooltip for the specified element
  setup_tooltip_for_no_click: function(element_id)
  {
    var elem = $(element_id);
    
    if (elem == null) return;
    
    elem.observe('mouseover', this._show_tooltip.bind(this));
    elem.observe('mouseout', this._hide_tooltip.bind(this));
  },

  // _show_tooltip is fired when the time is right to show a tooltip
  _show_tooltip: function(e)
  {
    inf('hidden');
    var element;
    if (typeof(e) == 'string') {
      element = $(e);
    }
    else {
      element = e.element();
    }
    
    // Hide any displayed tooltip in *this* Tooltips object:
    if (this.tooltip != null) {
      var prev_elem_id = this.clicked_element_id;
      this._hide_tooltip(e);
      
      // Let's make a second "show" on the same ID just toggle the TT off:
      if (prev_elem_id == element.id) {
        return;
      }
    }
    // Remember which element was clicked, for toggling:
    this.clicked_element_id = element.id;

    var container = element.up('span,div');
    if (container == null) throw 'No suitable container for tooltip??';

    // Remember which element ID we're showing:
    this.tooltip_id = container.id + '_ga_tooltip';
    
    // Append a new span to the container: 
    var tstyle = 'display:none; position:absolute; top:0px; left:0px;';
    this.tooltip = $span({id: this.tooltip_id,
                       style:  tstyle}, '');
    container.appendChild(this.tooltip);
    
    // Put the tooltip structure into the new span
    this.tooltip.innerHTML = this.tooltip_html;
    
    // Put the tooltip content into the tooltip structure:
    var tooltip_content = $('ttp_tooltip_content_area');
    tooltip_content.innerHTML = this.contentHash.get(element.id);
    
    var tt_dims = this.tooltip.getDimensions();
    var tooltip_height = tt_dims.height || 70;

    // // Get our container's offsets, to subtract from mouseover offsets:
    // // DOES THIS HAVE TO BE THIS NASTY???
    // var viewportOffset = $(this.container_element).viewportOffset();
    // //var positionedOffset = $(this.container_element).positionedOffset();
    // this.container_x = viewportOffset.left;// - positionedOffset.left;
    // this.container_y = viewportOffset.top;//  - positionedOffset.top;
    // 
    // //var x = e.pointerX() + 3 - this.container_x;
    // //var y = e.pointerY() - (tooltip_height - 5) - this.container_y;
    // var x = e.clientX - this.container_x - 1;
    // var FUDGE_FACTOR = 68; // <-- Why add this, and is it always the same?
    // var y = e.clientY - this.container_y + FUDGE_FACTOR - tooltip_height;// + 18;
    
    var x = e.pointerX();
    var y = e.pointerY();
    if (this.direction == 'up') {
        y -= (tooltip_height + 10); // offset for the tooth
    } else {
        y += 18; //(tooltip_height + 10); // offset for the tooth
    }

    x -= 5; // 5 offset for the tooth
    
    this.tooltip.setStyle({top: y+'px', left: x+'px'});
    new Effect.Appear(this.tooltip, {duration: 0.1});
    this.tooltip.makePositioned();
    
    
    switch (this.tooltip_type) {
        case 'hover':
            break;
        default :
            $("ttp_tooltip_close").observe('click', this._hide_tooltip.bind(this));
    }
    
    // Raise an event that a tooltip has been opened:
    this.raise_event('tooltip_opened', this);
  },

  // _hide_tooltip is fired when the time is right to dismiss a tooltip
  _hide_tooltip: function(e)
  {
    //$('ga_tooltip').hide();
    if (this.tooltip != null) {
      this.tooltip.remove();
      this.tooltip = null;
    }
    // Clear the clicked_element_id:
    this.clicked_element_id = null;
    // Raise an event that a tooltip has been closed:
    this.raise_event('tooltip_closed', this);
    inf('');
  }

});// End of ToolTips plugin 

