/*
 * @copyright		© Copyright 2006-2012, epages GmbH, All Rights Reserved.
 *
 * @module			ep.fn.showNextOn
 *
 * @revision		$$
 */

define("ep/fn/shownexton", [
	"jquery",
	"ep"
], function ($, ep) {

	/**
	 * Attach an event listener for one or more events to the selected elements. When the event is triggered we show the next siblings in the DOM.
	 * 
	 * The `.showNextOn()` attaches an event listener for one or more events to the selected elements. When the event is triggered we show the next siblings in the DOM.
	 * 
	 * ### Examples
	 * Show the next two (2nd and 3rd) list elements, when the button inside the first list element is clicked.
	 * 
	 * JavaScript:
	 * 
	 *     ep('#qunit-fixture li.showNextOn').first().showNextOn(
	 *     'click',
	 *     'button#clickThisToShowNext2',
	 *     2,
	 *     false
	 *     );
	 * 
	 * HTML:
	 * 
	 *     <ul>
	 *     <li class="showNextOn">
	 *     <button id="clickThisToShowNext2"></button>
	 *     <button id="clickThisAndNothingHappens"></button>
	 *     </li>
	 *     <li class="FirstTest HideElement">
	 *     <span class="someStuff"></span>
	 *     </li>
	 *     <li class="FirstTest HideElement">
	 *     <span class="someStuff"></span>
	 *     </li>
	 *     </ul>
	 * 
	 * CSS:
	 * 
	 *     .HideElement {
	 *     display: none!important;
	 *     height: 0;
	 *     }
	 * 
	 * 
	 * @param {String} event One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".
	 * @param {String} selector A selector string to filter the descendants of the selected elements that trigger the event. If the selector is null or omitted, the event is always triggered when it reaches the selected element.
	 * @param {Number} number The number (default is 1) of (next-inline) siblings to show, when the event is triggered.
	 * @param {Boolean} [hideSelf] If true, the selected element is hidden, when the event is triggered.
	 * 
	 * @method showNextOn
	 * @member jQuery
	 * 
	 * @since 6.15.0
	 */
	ep.fn.showNextOn = function (event, selector, number, hideSelf) {
		var eventHandler = function (event) {
			var i = 0,
					next = event.data.$this.next(),
					number = event.data.number;
			hideSelf && event.data.$this.hide();
			for (i = 0; i < number; i++) {
				next = next
					.removeClass("HideElement")
					.show()
					.next();
			}
		};

		return this.each(function (index, value) {
			var $this = $(this);
			$this.one(event, selector, {number : number || 1, $this : $this}, eventHandler);
		});
	}

	return ep;

});