/*
Script: Tips.js
  Class for creating nice tips that follow the mouse cursor when hovering an element.
 
License:
  MIT-style license.
*/
 
var Tips = new Class({
 
  Implements: [Events, Options],
 
  options: {
    onShow: function(tip){
      tip.setStyle('visibility', 'visible');
    },
    onHide: function(tip){
      tip.setStyle('visibility', 'hidden');
    },
    showDelay: 100,
    hideDelay: 100,
    className: null,
    offsets: {x: 16, y: 16},
    fixed: false
  },
 
  initialize: function(){
    var params = Array.link(arguments, {options: Object.type, elements: $defined});
    this.setOptions(params.options || null);
    
    var newClassName='tip';
    if (params.elements) newClassName=params.elements.replace('.','');
        
 
    this.tip = new Element('div').inject(document.body);
 
    if (this.options.className) this.tip.addClass(this.options.className);
 
    var top = new Element('div', {'class': 'tip-top'}).inject(this.tip);
    //this.container = new Element('div', {'class': 'tip'}).inject(this.tip);
    this.container = new Element('div', {'class': newClassName}).inject(this.tip);
    var bottom = new Element('div', {'class': 'tip-bottom'}).inject(this.tip);
 
    this.tip.setStyles({position: 'absolute', top: 0, left: 0, visibility: 'hidden'});
 
    if (params.elements) this.attach(params.elements);
  },
 
  attach: function(elements){
    $$(elements).each(function(element){

      var _title = element.retrieve('tip:title', element.get('title'));
      var title = false;
      var text = false;
      var text2 = false;
      var trackingImage = false;
      if(_title)
      {
	var __title = _title.split('|');
	if(__title[0]) title = __title[0];
	if(__title[1]) text = __title[1];
	if(__title[2]) text2 = __title[2];
	if(__title[3]) trackingImge=__title[3];
      }
      
      var enter = element.retrieve('tip:enter', this.elementEnter.bindWithEvent(this, element));
      var leave = element.retrieve('tip:leave', this.elementLeave.bindWithEvent(this, element));
      //element.addEvents({mouseenter: enter, mouseleave: leave});
      element.addEvents({click: enter, mouseleave: leave});
      if (!this.options.fixed){
        var move = element.retrieve('tip:move', this.elementMove.bindWithEvent(this, element));
        element.addEvent('mousemove', move);
      }
      element.store('tip:native', element.get('title'));
      element.erase('title');
    }, this);
    return this;
  },
 
  detach: function(elements){
    $$(elements).each(function(element){
      //element.removeEvent('mouseenter', element.retrieve('tip:enter') || $empty);
      element.removeEvent('click', element.retrieve('tip:enter') || $empty);
      element.removeEvent('mouseleave', element.retrieve('tip:leave') || $empty);
      element.removeEvent('mousemove', element.retrieve('tip:move') || $empty);
      element.eliminate('tip:enter').eliminate('tip:leave').eliminate('tip:move');
      var original = element.retrieve('tip:native');
      if (original) element.set('title', original);
    });
    return this;
  },
 
  elementEnter: function(event, element){
 
    $A(this.container.childNodes).each(Element.dispose);
 
      var _title = element.retrieve('tip:title', element.get('title'));
      var title = false;
      var text = false;
      var text2 = false;
      var text3 = false;
      var text4 = false;
      var text5 = false;
      var text6 = false;
      var text7 = false;
      if(_title)
      {
	var __title = _title.split('|');
	if(__title[0]) title = __title[0];
	if(__title[1]) text = __title[1];
	if(__title[2]) text2 = __title[2];
	if(__title[3]) text3 = __title[3];
	if(__title[4]) text4 = __title[4];
	if(__title[5]) text5 = __title[5];
	if(__title[6]) text6 = __title[6];
	if(__title[7]) text7 = __title[7];
      }
 
    if (text7)
    {
        if (text5==false) text5='';
        var output='<table class="promoDetails">';
        output += '<tr><td class="c1">Name:</td><td class="c2">' + title + '</td><td class="c1">Rate:</td><td class="c2">' + text2 + '</td></tr>';
        output += '<tr><td class="c1">Phone:</td><td class="c2">' + text + '</td><td class="c1">Min:</td><td class="c2">' + text3 + '</td></tr>';
        output += '<tr><td class="c1"></td><td class="c2"></td><td class="c1">Term:</td><td class="c2">' + text4 + '</td></tr>';
        output += '<tr><td colspan="2" class="h">Special Features</td><td colspan="2" class="header">Notes</td></tr>'
        output += '<tr><td colspan="2" class="t">' + text5 + '</td><td colspan="2" class="t">' + text6 + '</td></tr>';
        output += '</table>';
        this.titleElement = new Element('div', {'class': 'tip-title'}).inject(this.container);
        this.fill(this.titleElement, output);
        this.textElement = new Element('img', {'src': text7}).inject(this.container);
    } else {
        if (title){
          this.titleElement = new Element('div', {'class': 'tip-title'}).inject(this.container);
          this.fill(this.titleElement, title);
        }
     
        if (text){
          this.textElement = new Element('div', {'class': 'tip-text'}).inject(this.container);
          this.fill(this.textElement, text);
        }

        if (text2){
          this.textElement = new Element('div', {'class': 'tip-text2'}).inject(this.container);
          this.fill(this.textElement, text2);
        }
        
        if (text3){
          this.textElement = new Element('img', {'src': text3}).inject(this.container);
        }
    }
 
    this.timer = $clear(this.timer);
    this.timer = this.show.delay(this.options.showDelay, this);
 
    this.position((!this.options.fixed) ? event : {page: element.getPosition()});
    return false;
  },
 
  elementLeave: function(event){
    $clear(this.timer);
    this.timer = this.hide.delay(this.options.hideDelay, this);
  },
 
  elementMove: function(event){
    this.position(event);
  },
 
  position: function(event){
    var size = window.getSize(), scroll = window.getScroll();
    var tip = {x: this.tip.offsetWidth, y: this.tip.offsetHeight};
    var props = {x: 'left', y: 'top'};
    for (var z in props){
      var pos = event.page[z] + this.options.offsets[z];
      if ((pos + tip[z] - scroll[z]) > size[z]) pos = event.page[z] - this.options.offsets[z] - tip[z];
      this.tip.setStyle(props[z], pos);
    }
  },
 
  fill: function(element, contents){
    (typeof contents == 'string') ? element.set('html', contents) : element.adopt(contents);
  },
 
  show: function(){
    this.fireEvent('show', this.tip);
  },
 
  hide: function(){
    this.fireEvent('hide', this.tip);
  }
 
});
function initTips() {
	var Tips1 = new Tips('.tip', {});
	var Tips2 = new Tips('.tipwide', {});

}
if (window.addEventListener)
	window.addEventListener("load", initTips, false);
else if (window.attachEvent)
	window.attachEvent("onload", initTips);