/*
 * navigation for jQuery
 *
 * @requires jQuery v1.4.1 or later.
 *
 * Copyright (C) 2011 RickSoft
 * http://www.ricksoft.jp/
 *
 * Dual licensed under the MIT and GPL licenses.
 * http://docs.jquery.com/License
 */
(function($){

	/**
	 * 利用方法について
	 *
	 * 1. 以下のような構造のHTMLを用意する。
	 * 	<div id="navigation">
	 * 		<ul>
	 * 			<li><a href="#">XXX</a></li>
	 * 			<li><a href="#">XXX</a></li>
	 * 		</ul>
	 * 	</div>
	 * 2. jquery.navigation.jsをHTMLの<script>でロードする。
	 * 3. JavaScriptで以下のようにnavigationを呼び出す。
	 * 	$(document).ready(function(){
	 * 		$('#navigation').navigation({
	 * 			animateIn : { params : { height: "show", width: "show", opacity: 'show' }, options : { duration: "normal" }, callback : function(element) {} },
	 * 			animateOut : { params : { height: "hide", width: "hide", opacity: 'hide' }, options : { duration: "fast" }, callback : function(element) {} },
	 * 			dropdown: [{
	 * 				addClass : 'navi1 navi12',
	 * 				style : { 'width' : '350px', 'height' : '250px', 'backgroundColor' : 'white', 'border' : '1px solid gray', 'opacity' : '0.9' },
	 * 				content : '<b>ナビゲーション１</b>',
	 * 				align : 'left'
	 * 			},{
	 * 				addClass : 'navi2 navi22',
	 * 				style : { 'width' : '350px', 'height' : '250px', 'backgroundColor' : 'white', 'border' : '1px solid gray', 'opacity' : '0.9' },
	 * 				content : '<b>ナビゲーション２</b>',
	 * 				align : 'right'
	 * 			}]
	 * 		});
	 * 	});
	 *
	 * optionについて
	 *
	 * dropdown[].addClass (文字列)
	 * ドロップダウンメニューにCSSのclassを定義します。
	 *
	 * dropdown[].style (オブジェクト)
	 * ドロップダウンメニューにCSSのstyleを定義します。
	 *
	 * dropdown[].content (文字列)
	 * ドロップダウンメニューに表示するHTMLを定義します。
	 *
	 * dropdown[].align (文字列)
	 * ドロップダウンメニューの表示位置(left, center, right)が指定できます。
	 *
	 * (animateIn || animateOut).params.height (文字列)
	 *  ドロップダウンメニューのアニメーション(縦方向)を定義します。
	 * 	'show'    // slideDown animateInのデフォルト
	 * 	'hide'    // slideUp animateOutのデフォルト
	 * 	'toggle'  // slideToggle
	 *
	 * (animateIn || animateOut).params.width (文字列)
	 *  ドロップダウンメニューのアニメーション(横方向)を定義します。
	 * 	'show'    // slideDown
	 * 	'hide'    // slideUp
	 * 	'toggle'  // slideToggle
	 *
	 * (animateIn || animateOut).params.opacity (文字列)
	 *  ドロップダウンメニューのアニメーション(透過度)を定義します。
	 * 	'show'    // fadeIn
	 * 	'hide'    // fadeOut
	 * 	'toggle'  // fadeToggle
	 *
	 * (animateIn || animateOut).options.duration (文字列)
	 *  ドロップダウンメニューのアニメーション(速度)を定義します。
	 * 	'slow'
	 * 	'normal'  // デフォルト
	 * 	'fast'
	 *
	 * (animateIn || animateOut).options.easing (文字列)
	 *  ドロップダウンメニューのアニメーション(変化量)を定義します。参考資料 : http://semooh.jp/jquery/cont/doc/easing/
	 * 	'linear'
	 * 	'swing'  // デフォルト
	 *
	 * (animateIn || animateOut).options.callback (function)
	 *  ドロップダウンメニューのホバー時のコールバック関数を定義します。引数にはホバーされた要素<li>が渡されます。
	 *
	 */
	$.fn.navigation = function(options) {

		var defaults = {
			animateIn : { params : { height: "show" }, options : { duration: "slow", easing: "swing" }, callback : function(){} },
			animateOut : { params : { height: "hide" }, options : { duration: "slow", easing: "swing"}, callback : function(){} },
			dropdown : [ { addClass : '', style : {}, content : '', align : '' } ]
		};

		var o = $.extend(defaults, options);

		return this.each(function() {

			var $container = $(this);

			$("> ul > li", $container).each(function(index) {

				var $this = $(this);

				var $option_dropdown = o.dropdown[index] || {};

				if(isEmptyObject($option_dropdown)) {
					return;
				}

				var $addClass = $option_dropdown.addClass || "";

				var $style = $.extend({
					'display' : 'none',
					'position' : 'absolute',
					'top' : $this.height() + $this.offset().top,
					'zIndex' : '100'
				}, $option_dropdown.style || {});

				var $html = $option_dropdown.content || "";

				var $child = $('<div/>').addClass($addClass).css($style).html($html).appendTo($this);

				if($option_dropdown.align == 'left') {
					$child.css({ 'left' :  $this.offset().left });
				}

				if($option_dropdown.align == 'right') {
					$child.css({ 'left' :  ($this.offset().left - ($child.width() - $this.width())) });
				}

				if($option_dropdown.align == 'center') {
					$child.css({ 'left' :  ($this.offset().left - ($child.width() - $this.width()) * 0.5) });
				}

				$this.hover(
					function() {
						if(o.animateIn.callback) { o.animateIn.callback($(this)); }
						$("> div:not(:animated)" , this).animate(
							$.extend({}, o.animateIn.params),
							$.extend({}, o.animateIn.options)
						);
					},
					function() {
						$("> div" , this).animate(
							$.extend({}, o.animateOut.params),
							$.extend({}, o.animateOut.options)
						);
						if(o.animateOut.callback) { o.animateOut.callback($(this)); }
					}
				)

			});

		});
	};

	function isEmptyObject(obj) {
		for (var name in obj) {
			return false;
		}
		return true;
	};

})(jQuery);