1 files changed, 129 insertions, 0 deletions
diff --git a/resources/jquery/jquery.expandableField.js b/resources/jquery/jquery.expandableField.js
new file mode 100644
index 00000000..ebe29a41
--- /dev/null
+++ b/resources/jquery/jquery.expandableField.js
@@ -0,0 +1,129 @@
+/**
+ * This plugin provides functionallity to expand a text box on focus to double it's current width
+ *
+ * Usage:
+ *
+ * Set options:
+ *		$('#textbox').expandableField( { option1: value1, option2: value2 } );
+ *		$('#textbox').expandableField( option, value );
+ * Get option:
+ *		value = $('#textbox').expandableField( option );
+ * Initialize:
+ *		$('#textbox').expandableField();
+ *
+ * Options:
+ *
+ */
+( function( $ ) {
+
+$.expandableField = {
+	/**
+	 * Expand the field, make the callback
+	 */
+	expandField: function( e, context ) {
+		context.config.beforeExpand.call( context.data.$field, context );
+		context.data.$field
+			.animate( { 'width': context.data.expandedWidth }, 'fast', function() {
+				context.config.afterExpand.call( this, context );
+			} );
+	},
+	/**
+	 * Condense the field, make the callback
+	 */
+	condenseField: function( e, context ) {
+		context.config.beforeCondense.call( context.data.$field, context );
+		context.data.$field
+			.animate( { 'width': context.data.condensedWidth }, 'fast', function() {
+				context.config.afterCondense.call( this, context );
+			} );
+	},
+	/**
+	 * Sets the value of a property, and updates the widget accordingly
+	 * @param property String Name of property
+	 * @param value Mixed Value to set property with
+	 */
+	configure: function( context, property, value ) {
+		// Validate creation using fallback values
+		switch( property ) {
+			default:
+				context.config[property] = value;
+				break;
+		}
+	}
+
+};
+$.fn.expandableField = function() {
+	
+	// Multi-context fields
+	var returnValue = null;
+	var args = arguments;
+	
+	$( this ).each( function() {
+
+		/* Construction / Loading */
+		
+		var context = $( this ).data( 'expandableField-context' );
+		if ( context == null ) {
+			context = {
+				config: {
+					// callback function for before collapse
+					'beforeCondense': function( context ) {},
+					// callback function for before expand
+					'beforeExpand': function( context ) {},
+					// callback function for after collapse
+					'afterCondense': function( context ) {},
+					// callback function for after expand
+					'afterExpand': function( context ) {},
+					// Whether the field should expand to the left or the right -- defaults to left
+					'expandToLeft': true
+				}
+			};
+		}
+		
+		/* API */
+		// Handle various calling styles
+		if ( args.length > 0 ) {
+			if ( typeof args[0] == 'object' ) {
+				// Apply set of properties
+				for ( var key in args[0] ) {
+					$.expandableField.configure( context, key, args[0][key] );
+				}
+			} else if ( typeof args[0] == 'string' ) {
+				if ( args.length > 1 ) {
+					// Set property values
+					$.expandableField.configure( context, args[0], args[1] );
+				} else if ( returnValue == null ) {
+					// Get property values, but don't give access to internal data - returns only the first
+					returnValue = ( args[0] in context.config ? undefined : context.config[args[0]] );
+				}
+			}
+		}
+		
+		/* Initialization */
+		
+		if ( typeof context.data == 'undefined' ) {
+			context.data = {
+				// The width of the field in it's condensed state
+				'condensedWidth': $( this ).width(),
+				// The width of the field in it's expanded state
+				'expandedWidth': $( this ).width() * 2,
+				// Reference to the field
+				'$field': $( this )
+			};
+			
+			$( this )
+				.addClass( 'expandableField' )
+				.focus( function( e ) {
+					$.expandableField.expandField( e, context );
+				} )
+				.delayedBind( 250, 'blur', function( e ) {
+					$.expandableField.condenseField( e, context );
+				} );
+		}
+		// Store the context for next time
+		$( this ).data( 'expandableField-context', context );
+	} );
+	return returnValue !== null ? returnValue : $(this);
+};
+
+} )( jQuery );