From: Trevor Parscal <tparscal@users.mediawiki.org>
Date: Wed, 15 Sep 2010 02:03:24 +0000 (+0000)
Subject: Added collapsible tabs plugin, reworked tabIndex functions, and fixed some syntax... 
X-Git-Tag: 1.31.0-rc.0~34919
X-Git-Url: http://git.cyclocoop.org/%24href?a=commitdiff_plain;h=92d8037bb9f802ea45b1affa5e9d36ebd5686d5b;p=lhc%2Fweb%2Fwiklou.git

Added collapsible tabs plugin, reworked tabIndex functions, and fixed some syntax errors.
---

diff --git a/resources/Resources.php b/resources/Resources.php
index 0f409797d2..a9c970b8e3 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -30,6 +30,9 @@ return array(
 	'jquery.client' => new ResourceLoaderFileModule(
 		array( 'scripts' => 'resources/jquery/jquery.client.js' )
 	),
+	'jquery.collapsibleTabs' => new ResourceLoaderFileModule(
+		array( 'scripts' => 'resources/jquery/jquery.collapsibleTabs.js' )
+	),
 	'jquery.color' => new ResourceLoaderFileModule(
 		array( 'scripts' => 'resources/jquery/jquery.color.js' )
 	),
diff --git a/resources/jquery/jquery.client.js b/resources/jquery/jquery.client.js
index ed4c56e7fd..657e1465f2 100644
--- a/resources/jquery/jquery.client.js
+++ b/resources/jquery/jquery.client.js
@@ -152,9 +152,9 @@ jQuery.client = {
 	 * @return Boolean true if browser known or assumed to be supported, false if blacklisted
 	 */
 	'test': function( map ) {
-		var client = this.client();
+		var profile = $.client.profile();
 		// Check over each browser condition to determine if we are running in a compatible client
-		var browser = map[$( 'body' ).is( '.rtl' ) ? 'rtl' : 'ltr'][client.browser];
+		var browser = map[$( 'body' ).is( '.rtl' ) ? 'rtl' : 'ltr'][profile.browser];
 		if ( typeof browser !== 'object' ) {
 			// Unknown, so we assume it's working
 			return true;
@@ -165,11 +165,11 @@ jQuery.client = {
 			if ( val === false ) {
 				return false;
 			} else if ( typeof val == 'string' ) {
-				if ( !( eval( 'client.version' + op + '"' + val + '"' ) ) ) {
+				if ( !( eval( 'profile.version' + op + '"' + val + '"' ) ) ) {
 					return false;
 				}
 			} else if ( typeof val == 'number' ) {
-				if ( !( eval( 'client.versionNumber' + op + val ) ) ) {
+				if ( !( eval( 'profile.versionNumber' + op + val ) ) ) {
 					return false;
 				}
 			}
diff --git a/resources/jquery/jquery.collapsibleTabs.js b/resources/jquery/jquery.collapsibleTabs.js
new file mode 100644
index 0000000000..2e7c84d477
--- /dev/null
+++ b/resources/jquery/jquery.collapsibleTabs.js
@@ -0,0 +1,113 @@
+/*
+ * Collapsible tabs jQuery Plugin
+ */
+jQuery.fn.collapsibleTabs = function( options ) {
+	// return if the function is called on an empty jquery object
+	if( !this.length ) return this;
+	//merge options into the defaults
+	var $settings = $.extend( {}, $.collapsibleTabs.defaults, options );
+
+	this.each( function() {
+		var $this = $( this );
+		// add the element to our array of collapsible managers
+		$.collapsibleTabs.instances = ( $.collapsibleTabs.instances.length == 0 ?
+			$this : $.collapsibleTabs.instances.add( $this ) );
+		// attach the settings to the elements
+		$this.data( 'collapsibleTabsSettings', $settings );
+		// attach data to our collapsible elements
+		$this.children( $settings.collapsible ).each( function() {
+			$.collapsibleTabs.addData( $( this ) );
+		} );
+	} );
+	
+	// if we haven't already bound our resize hanlder, bind it now
+	if( !$.collapsibleTabs.boundEvent ) {
+		$( window )
+			.delayedBind( '500', 'resize', function( ) { $.collapsibleTabs.handleResize(); } );
+	}
+	// call our resize handler to setup the page
+	$.collapsibleTabs.handleResize();
+	return this;
+};
+jQuery.collapsibleTabs = {
+	instances: [],
+	boundEvent: null,
+	defaults: {
+		expandedContainer: '#p-views ul',
+		collapsedContainer: '#p-cactions ul',
+		collapsible: 'li.collapsible',
+		shifting: false,
+		expandCondition: function( eleWidth ) {
+			return ( $( '#left-navigation' ).position().left + $( '#left-navigation' ).width() )
+				< ( $( '#right-navigation' ).position().left - eleWidth );
+		},
+		collapseCondition: function() {
+			return ( $( '#left-navigation' ).position().left + $( '#left-navigation' ).width() )
+				> $( '#right-navigation' ).position().left;
+		}
+	},
+	addData: function( $collapsible ) {
+		var $settings = $collapsible.parent().data( 'collapsibleTabsSettings' );
+		$collapsible.data( 'collapsibleTabsSettings', {
+			'expandedContainer': $settings.expandedContainer,
+			'collapsedContainer': $settings.collapsedContainer,
+			'expandedWidth': $collapsible.width(),
+			'prevElement': $collapsible.prev()
+		} );
+	},
+	getSettings: function( $collapsible ) {
+		var $settings = $collapsible.data( 'collapsibleTabsSettings' );
+		if ( typeof $settings == 'undefined' ) {
+			$.collapsibleTabs.addData( $collapsible );
+			$settings = $collapsible.data( 'collapsibleTabsSettings' );
+		}
+		return $settings;
+	},
+	handleResize: function( e ){
+		$.collapsibleTabs.instances.each( function() {
+			var $this = $( this ), data = $.collapsibleTabs.getSettings( $this );
+			if( data.shifting ) return;
+
+			// if the two navigations are colliding
+			if( $this.children( data.collapsible ).length > 0 && data.collapseCondition() ) {
+				
+				$this.trigger( "beforeTabCollapse" );
+				// move the element to the dropdown menu
+				$.collapsibleTabs.moveToCollapsed( $this.children( data.collapsible + ':last' ) );
+			}
+
+			// if there are still moveable items in the dropdown menu,
+			// and there is sufficient space to place them in the tab container
+			if( $( data.collapsedContainer + ' ' + data.collapsible ).length > 0
+					&& data.expandCondition( $.collapsibleTabs.getSettings( $( data.collapsedContainer ).children(
+							data.collapsible+":first" ) ).expandedWidth ) ) {
+				//move the element from the dropdown to the tab
+				$this.trigger( "beforeTabExpand" );
+				$.collapsibleTabs
+					.moveToExpanded( data.collapsedContainer + " " + data.collapsible + ':first' );
+			}
+		});
+	},
+	moveToCollapsed: function( ele ) {
+		var $moving = $( ele );
+		var data = $.collapsibleTabs.getSettings( $moving );
+		var dataExp = $.collapsibleTabs.getSettings( data.expandedContainer );
+		dataExp.shifting = true;
+		$moving
+			.remove()
+			.prependTo( data.collapsedContainer )
+			.data( 'collapsibleTabsSettings', data );
+		dataExp.shifting = false;
+		$.collapsibleTabs.handleResize();
+	},
+	moveToExpanded: function( ele ) {
+		var $moving = $( ele );
+		var data = $.collapsibleTabs.getSettings( $moving );
+		var dataExp = $.collapsibleTabs.getSettings( data.expandedContainer );
+		dataExp.shifting = true;
+		// remove this element from where it's at and put it in the dropdown menu
+		$moving.remove().insertAfter( data.prevElement ).data( 'collapsibleTabsSettings', data );
+		dataExp.shifting = false;
+		$.collapsibleTabs.handleResize();
+	}
+};
\ No newline at end of file
diff --git a/resources/jquery/jquery.tabIndex.js b/resources/jquery/jquery.tabIndex.js
index ec86e88adb..3bce092c05 100644
--- a/resources/jquery/jquery.tabIndex.js
+++ b/resources/jquery/jquery.tabIndex.js
@@ -1,11 +1,24 @@
-( function( $ ) {
-
 /**
- * Finds the highest tabindex in use.
+ * Finds the lowerst tabindex in use within a selection
+ * 
+ * @return Integer of lowest tabindex on the page
+ */
+jQuery.fn.firstTabIndex = function() {
+	var minTabIndex = 0;
+	$(this).find( '[tabindex]' ).each( function() {
+		var tabIndex = parseInt( $(this).attr( 'tabindex' ) );
+		if ( tabIndex > minTabIndex ) {
+			minTabIndex = tabIndex;
+		}
+	} );
+	return minTabIndex;
+};
+/**
+ * Finds the highest tabindex in use within a selection
  * 
  * @return Integer of highest tabindex on the page
  */
-$.fn.maxTabIndex( function() {
+jQuery.fn.lastTabIndex = function() {
 	var maxTabIndex = 0;
 	$(this).find( '[tabindex]' ).each( function() {
 		var tabIndex = parseInt( $(this).attr( 'tabindex' ) );
@@ -14,6 +27,4 @@ $.fn.maxTabIndex( function() {
 		}
 	} );
 	return maxTabIndex;
-} );
-
-} )();
\ No newline at end of file
+};
\ No newline at end of file