﻿/* ============================================================================================
 * Copyright (c) 2008 Muhammet TURŞAK (tursoft@gmail.com, www.tursoft.net)
 * Dual licensed
 *   - GPL http://www.gnu.org/licenses/gpl.html and 
 *   - MIT http://www.opensource.org/licenses/mit-license.php
 
===============================================================================================
# INFORMATION and META DATA ABOUT LIBRARY
-----------------------------------------------------------------------------------------------
NAME                : MyPulldownContent
VERSION             : v1.0
UPDATE DATE         : 23.11.2008

AUTHOR              : Muhammet TURŞAK (tursoft@gmail.com, www.tursoft.net)
DESCRIPTION         : A jquery plugin to easiy show pulldown statis / dynamic Ajax content
LICENSING           : 
            - GPL http://www.gnu.org/licenses/gpl.html and 
            - MIT http://www.opensource.org/licenses/mit-license.php

DEPENDENT FILES     : 
    - jquery-1.2.6.js  (or higher)
    - tursoft.shared.v1.1.js
    
    - default.css (MyPulldownContent styles) 
    - info.gif
    - leftarrow.gif    

TESTED BROWSERS     : IE 8 Beta, Firefox 3.0.4

KNOWN BUGS / ISSUES : 
    - No known bugs or issues
    
===============================================================================================
# DOCUMENTATION
-----------------------------------------------------------------------------------------------
SUPPORTED TAGS      : *

METHODS             : 
    - MyPulldownContent($options)
        Function Options; 
            - <empty>  
		
		Source Attributes;
            - ContentURL	: URL of dynamic content
			- ContentID  	: ID of static content element
			- ContentText 	: Text content			
			- ContentType  	: Type of data source (id / url / text)
			- ContentWidth	: Width of content pulldown box
			- ContentHeight	: Height of content pulldown box
			- PulldownSide	: Side of dropdown content according to the source button (left / right)
			- TitleIsVisible: Visibility of title row (truw / false)
			- TitleBgImgSrc	: Title row bacground image
			- TitleImgSrc	: Title row image url
			- TitleHeight	: Title text
 ============================================================================================ */
(function($){

	// ==================================================================
	var $$ = $.fn.MyPulldownContent = function($options) {
	
		var $defaults = {  };
		$$.$options = $.extend($defaults, $options);
	
		return $(this).each(function() {
							var $this=$(this);
							
							$this.$=function() {};
							$this.$.isListVisible=false;
							$this.$.ID=this.id;
							var $tagContentURL=(trim($this.attr("href"))!=""?"href":"ContentURL");
							$this.$.options= {
								ContentURL		: _getAttrValue($this, $tagContentURL, ""),
								ContentID		: _getAttrValue($this, "ContentID", ""),
								ContentText		: _getAttrValue($this, "ContentText", ""),
								ContentType		: _getAttrValue($this, "ContentType", "text"),  // id / url / text								
								ContentWidth	: _getAttrValue($this, "ContentWidth", ""),
								ContentHeight	: _getAttrValue($this, "ContentHeight", ""),
								PulldownSide	: _getAttrValue($this, "PulldownSide", "right"),
								TitleIsVisible	: _getAttrValue($this, "TitleIsVisible", "false"),
								TitleBgImgSrc	: _getAttrValue($this, "TitleBgImgSrc", "false"),
								TitleImgSrc	    : _getAttrValue($this, "TitleImgSrc", "false"),
								TitleHeight	    : _getAttrValue($this, "TitleHeight", "40px")
							}
							
							$$.onParseData($this);
							$$.onInitView($this);
						});
	};

	// ==================================================================
	$$.SupportedTags=new Array();
	$$.isSupportedTag=function($this) {
		var i=0;
		for(i=0;i<$$.SupportedTags.length;i++)
		{
			if ($this[0].nodeName.toUpperCase()==$$.SupportedTags[i].toUpperCase())
				return true;
		}
		
		return false;
	};
	
	$$.onParseData=function($this) {
		$this.$.itemTexts=new Array();
		$this.$.itemValues=new Array();
		
		// check tagname is supported
		if (!$$.isSupportedTag($this))
			return;
		
		switch($this.$.options.ContentType)
		{
			case "id"	: 
					$("#"+$this.$.options.ContentID).each(function() { $this.$.options.ContentText=$(this).html(); });
					break;
					
			case "url"	: 
					break;
					
			case ""		:					
			case "text"	:
					break;			
		}
	};

	// ==================================================================
	$$.onInitView=function($this) {
		// Copy and modify button element
			var $button=$this; //.clone(true);
			$button.addClass("MyPulldownContent_button");
						
		// Content pulldown box
		var $tblContentBox=$(document.createElement("table"))
							.attr({ cellspacing:0, cellpadding:0, border:0})
							.css({display:"none", position:"absolute"})
							.addClass("MyPulldownContent_pulldownbox");
							
		var $tdContentBox=$(document.createElement("td")).addClass("MyPulldownContent_content");							
		if ($this.$.options.TitleIsVisible=="true") {
		    var $tdTitleBox=$(document.createElement("td"));
		    $tblContentBox.append($(document.createElement("tr")).append($tdTitleBox));	
		    $tdTitleBox.css("height", $this.$.options.TitleHeight)
		               .css("background-image","url("+$this.$.options.TitleBgImgSrc+")")
		               .addClass("MyPulldownContent_title")
		               .append(
		                    $(document.createElement("img"))
		                              .attr("src",$this.$.options.TitleImgSrc)
		                              .attr("border","0px")
		               );
		}
			
		$tblContentBox.append($(document.createElement("tr")).append($tdContentBox));
		$('body').append($tblContentBox);
		
		var $divContent=$(document.createElement("div"))
								   .appendTo($tdContentBox)
								   .css({width:$this.$.options.ContentWidth, height:$this.$.options.ContentHeight, overflow:"auto"});
						 		  // .attr({width:$this.$.options.ContentWidth, height:$this.$.options.ContentHeight});

		// events
		$button.hover(function() { $(this).addClass("MyPulldownContent_button_hover");},
					  function() { 
					  		if (!$this.$.isListVisible)
						  		$(this).removeClass("MyPulldownContent_button_hover");
						});
		
		if ($this.$.options.ContentType=="id")
			$("#"+$this.$.options.ContentID)
				.each(function() { $(this).hide();});

		$tdContentBox.click=$divContent.click=$tblContentBox.click(function(event) {
										  // event.preventDefault();
						    			  event.stopPropagation();
									  });
		
		$button.click(function(event){							
						event.preventDefault();
						event.stopPropagation();
						
						$(document).click();
						
						if ($this.$.isListVisible)
							return;

						$this.$.isListVisible=true;
						// TODO: Get URL content if type if URL
						
						switch($this.$.options.ContentType)
						{
							case "url":
								$tblContentBox.slideDown(250);						
								if (!IsValueEmpty($this.$.options.ContentURL)) {
										try {
										$this.$.options.ContentText= $.ajax({ url: $this.$.options.ContentURL, async: false, cache:false })
																	  .responseText;
										} catch (err){ $this.$.options.ContentText=$this.$.options.ContentURL+" cannot be loaded!"; }
										
										$divContent.html($this.$.options.ContentText);
										$tblContentBox.slideDown(250);
									}										
								break;
								
							case "text":
								$divContent.html($this.$.options.ContentText);
								$tblContentBox.slideDown(250);
								break;		
								
							case "id":

								$("#"+$this.$.options.ContentID)
									.each(function() {
											$(this).remove();
											$(this).css({position:"relative", left:0, top:0})
												   .appendTo($divContent)
												   .show();	   
										});								
								break;					
						}
						
						// position
						var $pos=$button.offset();
						$pos.top+=$button.innerHeight()+(($button.outerHeight()-$button.innerHeight()) / 2); //-(($tblContentBox.outerHeight()-$tblContentBox.innerHeight())/2);
						$pos.left=($this.$.options.PulldownSide=="right"?$pos.left:
								   (($pos.left+$button.width())-($tblContentBox.width()-11)))
						
						$tblContentBox.css($pos);
						
						// show
						$button.addClass("MyPulldownContent_button_hover");																		
					}
				);
		
		$(document).click(function(event) {
				$this.$.isListVisible=false;
				$button.removeClass("MyPulldownContent_button_hover");
				$tblContentBox.hide();
			});
	}
	

})(jQuery);