/**
 * Clientside support script for use with the prototip
 * tooltips library. See the usage example to see how
 * this can be configured.
 *
 * @access public
 * @package ShipsQuickinfo
 * @author AeonOfTime <eve@aeonoftime.com>
 * @license http://creativecommons.org/licenses/BSD/
 * @link http://aeonoftime.com/EVE_Online_Tools/Ships_Quickinfo/
 */

ShipsQuickinfo = {
		
   /**
    * Stores the relative or absolute path to the image folder
    * 
    * Note: Include the trailing slash!
    * 
    * @access public
    */
	imgFolder:'/mylibs/images/',

   /**
    * Stores the relative or absolute path to the scripts folder
    * 
    * Note: include the trailing slash!
    * 
    * @access public
    */
	scriptFolder:'/mylibs/',
	
   /**
    * Sets the title of the tooltip (the title bar)
    * 
    * @access public
    */
	tooltipTitle:'Aeon\'s Ship QuickInfo v1.2',
	
   /**
    * The tooltip library to use. 
    * 
    * NOTE: You can add your own by implementing the 
    * according tooltipify_libraryname() method and 
    * setting this parameter.
    *  
    * @access public
    */
	tooltipLibrary:'default',
	
   /**
    * The prototip style to use
    * 
    * @access public
    */
	tooltipStyle:'protogrey',

   /**
    * Whether to add a graphical button to the link which
    * inherits the href attribute of the initial link.
    * 
    * @access public
    */
	appendButton:true,

   /**
    * Sets the maximum width of the content of the tooltips
    * 
    * @access public
    */
	contentMaxWidth:460,

   /**
    * Tooltips counter.
    * 
    * @access private
    */
	counter:0,
	
   /**
    * Goes through all links in the page's DOM and extends
    * all links whose rel attribute is "ShipsQuickinfo".
    * 
    * @access public
    */
	init:function()
	{
		var els = document.getElementsByTagName( 'a' );
		for( var i=0; i < els.length; i++ ) {
			if( els[i].getAttribute( 'rel' ) == 'ShipsQuickinfo' ) {
				Element.extend( els[i] );
				var el = false;
				if( this.appendButton ) {
					var el = new Element( 
						'img', 
						{ 
							src:this.imgFolder+'more.png', 
							title:'External information on the '+els[i].innerHTML, 
							style:'margin-left:4px;cursor:pointer;' 
						} 
					);
					Element.insert( els[i], { after: el } );
				}
				
				if( !this['tooltipify_'+this.tooltipLibrary] ) {
					this.tooltipLibrary = 'default';
				}
				
				this['tooltipify_'+this.tooltipLibrary]( els[i], el );
			}
		}
	},

   /**
    * Adds the tooltip functionality to a link
    * using the built-in tooltips solution.
    */
	tooltipify_default:function( sourceElement, buttonElement )
	{
		this.counter++;
		
		// create the tooltip object that will handle displaying
		// inidividual tooltips. 
		var tip = { 
			id:this.counter,
			source: sourceElement, 
			button: buttonElement,
			title:this.tooltipTitle,
			imgFolder:this.imgFolder,
			scriptFolder:this.scriptFolder,
			offsetX:3,
			offsetY:3,
			contentMaxWidth:this.contentMaxWidth,
			built:false,
		   /**
		    * Initializes the tooltip by setting the relevant attributes
		    * in the button and link so that a click will actually display
		    * the tooltip.
		    */
			init:function() {
				// the button is not always shown, but if it is active
				// we want it to have the original link as target.
				if( this.button ) {
					this.button.writeAttribute( 'onclick', 'document.location=\''+this.source.href+'\'' );
				}
				
				this.source.writeAttribute( 'href', 'javascript:void(0);' );
				this.source.writeAttribute( 'title', 'Data sheet for the '+this.source.innerHTML );
				this.source.onclick = function() { tip.show(); };
			},
			show:function()
			{
				this.build();
				$('SQTContainer'+this.id).style.display = 'block';
			},
			hide:function()
			{
				$('SQTContainer'+this.id).style.display = 'none';
			},
		   /**
		    * Builds the DOM structure of the tooltip.
		    * This is only done once.
		    */
			build:function()
			{
				if( this.built ) {
					return true;
				}
				
				// the main tooltip element
				var el = new Element( 'div', { id:'SQTContainer'+this.id, class:'SQTFrame', style:'display:none' } );
				
				Element.insert( $$('body')[0], { after: el } );
				
				// the header
				Element.insert( el, new Element( 'div', { class:'SQTHeader', id:'SQTHeader'+this.id } ).update( this.title ) );
				
				// the content
				Element.insert( el, new Element( 'div', { class:'SQTContent', id:'SQTItem'+this.id } ).update( 'Please wait...' ) );
				
				// the close button
				Element.insert( $('SQTHeader'+this.id), new Element( 'img', { class:'SQTCloseButton', src:this.imgFolder+'close.png', onclick:"$('SQTContainer"+this.id+"').style.display = 'none';" } ) );
				
				// load the ship details
				new Ajax.Updater(
					$('SQTItem'+this.id), 
					this.scriptFolder+'ShipsQuickinfo.php?ship_name='+sourceElement.innerHTML
				);
				
				// position the whole thing
				posEl = this.source;
				if( this.button ) {
					posEl = this.button;
				}
				
				$('SQTItem'+this.id).style.width = this.contentMaxWidth+'px';
				
				var pos = posEl.positionedOffset();
				el.style.left = (pos[0]+posEl.getWidth()+this.offsetX)+'px';
				el.style.top = (pos[1]+posEl.getHeight()+this.offsetY)+'px';
				
				this.built = true;
			}
		};
		
		tip.init();
	},
	
   /**
    * Adds the tooltip functionality to a link 
    * using the prototip library.
    */
	tooltipify_prototip:function( sourceElement, buttonElement )
	{
		// determine which element to hook to, as the button
		// can be deactivated in options. In that case we just
		// hook the tooltip to the link itself.
		var hookElement = sourceElement;
		if( buttonElement ) {
			hookElement = buttonElement;
		}
		
		new Tip(
			hookElement, 
			{
				title: this.tooltipTitle,
				showOn: 'click',
				hideOn: { element: 'closeButton', event: 'click' },
				width: 410,
				hook: { target: 'bottomRight', tip: 'topLeft' },
				stem: 'topLeft',
				offset: { x: -6, y: -3 },
				style: this.tooltipStyle,
				ajax: 
				{
					url: this.scriptFolder+'ShipsQuickinfo.php?ship_name='+sourceElement.innerHTML
				}
			}
		);
	}
};

