| Index: trunk/extensions/UsabilityInitiative/css/combined.css |
| — | — | @@ -127,6 +127,16 @@ |
| 128 | 128 | #panel.collapsible-nav #p-navigation h5 { |
| 129 | 129 | display: none; |
| 130 | 130 | } |
| | 131 | +.expandableField { |
| | 132 | + display: block; |
| | 133 | + float: left; |
| | 134 | +} |
| | 135 | +#simpleSearch { |
| | 136 | + overflow: auto; |
| | 137 | +} |
| | 138 | +div#simpleSearch button#searchButton { |
| | 139 | + margin: 0.4em 0 0 0; |
| | 140 | +} |
| 131 | 141 | /* wikiEditor plugin */ |
| 132 | 142 | |
| 133 | 143 | /* This ID (#editform) could change in MediaWiki */ |
| Index: trunk/extensions/UsabilityInitiative/css/combined.min.css |
| — | — | @@ -125,6 +125,16 @@ |
| 126 | 126 | #panel.collapsible-nav #p-navigation h5{ |
| 127 | 127 | display:none; |
| 128 | 128 | } |
| | 129 | +.expandableField{ |
| | 130 | +display:block; |
| | 131 | +float:left; |
| | 132 | +} |
| | 133 | +#simpleSearch{ |
| | 134 | +overflow:auto; |
| | 135 | +} |
| | 136 | +div#simpleSearch button#searchButton{ |
| | 137 | +margin:0.4em 0 0 0; |
| | 138 | +} |
| 129 | 139 | form#editform{ |
| 130 | 140 | margin:0; |
| 131 | 141 | padding:0; |
| Index: trunk/extensions/UsabilityInitiative/Vector/Vector.combined.js |
| — | — | @@ -188,6 +188,49 @@ |
| 189 | 189 | }); |
| 190 | 190 | //Global storage of fallback for onbeforeunload hook |
| 191 | 191 | var fallbackWindowOnBeforeUnload = null; |
| | 192 | +/* JavaScript for ExpandableSearch extension */ |
| | 193 | +$j( document ).ready( function() { |
| | 194 | + |
| | 195 | + // Only use this function in conjuction with the Vector skin |
| | 196 | + if( !wgVectorEnabledModules.expandablesearch || skin != 'vector' ) { |
| | 197 | + return true; |
| | 198 | + } |
| | 199 | + $j( '#searchInput' ) |
| | 200 | + .expandableField( { |
| | 201 | + 'beforeExpand': function( context ) { |
| | 202 | + // animate the containers border |
| | 203 | + $j( this ) |
| | 204 | + .parent() |
| | 205 | + .animate( { |
| | 206 | + 'borderTopColor': '#a0d8ff', |
| | 207 | + 'borderLeftColor': '#a0d8ff', |
| | 208 | + 'borderRightColor': '#a0d8ff', |
| | 209 | + 'borderBottomColor': '#a0d8ff' }, 'fast' ); |
| | 210 | + }, |
| | 211 | + 'beforeCondense': function( context ) { |
| | 212 | + // animate the containers border |
| | 213 | + $j( this ) |
| | 214 | + .parent() |
| | 215 | + .animate( { |
| | 216 | + 'borderTopColor': '#aaaaaa', |
| | 217 | + 'borderLeftColor': '#aaaaaa', |
| | 218 | + 'borderRightColor': '#aaaaaa', |
| | 219 | + 'borderBottomColor': '#aaaaaa' }, 'fast' ); |
| | 220 | + }, |
| | 221 | + 'afterExpand': function( context ) { |
| | 222 | + //trigger the collapsible tabs resize handler |
| | 223 | + if ( typeof $j.collapsibleTabs != 'undefined' ){ |
| | 224 | + $j.collapsibleTabs.handleResize(); |
| | 225 | + } |
| | 226 | + }, |
| | 227 | + 'afterCondense': function( context ) { |
| | 228 | + //trigger the collapsible tabs resize handler |
| | 229 | + if ( typeof $j.collapsibleTabs != 'undefined' ){ |
| | 230 | + $j.collapsibleTabs.handleResize(); |
| | 231 | + } |
| | 232 | + } |
| | 233 | + } ); |
| | 234 | +}); |
| 192 | 235 | /* Prototype code to demonstrate proposed edit page footer cleanups */ |
| 193 | 236 | /* First draft and will be changing greatly */ |
| 194 | 237 | |
| Index: trunk/extensions/UsabilityInitiative/Vector/Vector.combined.min.js |
| — | — | @@ -9,7 +9,8 @@ |
| 10 | 10 | $j('#wpTextbox1, #wpSummary').each(function(){$j(this).data('origtext',$j(this).val());});fallbackWindowOnBeforeUnload=window.onbeforeunload;window.onbeforeunload=function(){var fallbackResult=undefined;if(fallbackWindowOnBeforeUnload){fallbackResult=fallbackWindowOnBeforeUnload();} |
| 11 | 11 | if(fallbackResult!==undefined){return fallbackResult;} |
| 12 | 12 | if(wgAction=='submit'||$j('#wpTextbox1').data('origtext')!=$j('#wpTextbox1').val()||$j('#wpSummary').data('origtext')!=$j('#wpSummary').val()){return mw.usability.getMsg('vector-editwarning-warning');}} |
| 13 | | -$j('form').submit(function(){window.onbeforeunload=fallbackWindowOnBeforeUnload;});});var fallbackWindowOnBeforeUnload=null;$j(document).ready(function(){if(!wgVectorEnabledModules.footercleanup){return true;} |
| | 13 | +$j('form').submit(function(){window.onbeforeunload=fallbackWindowOnBeforeUnload;});});var fallbackWindowOnBeforeUnload=null;$j(document).ready(function(){if(!wgVectorEnabledModules.expandablesearch||skin!='vector'){return true;} |
| | 14 | +$j('#searchInput').expandableField({'beforeExpand':function(context){$j(this).parent().animate({'borderTopColor':'#a0d8ff','borderLeftColor':'#a0d8ff','borderRightColor':'#a0d8ff','borderBottomColor':'#a0d8ff'},'fast');},'beforeCondense':function(context){$j(this).parent().animate({'borderTopColor':'#aaaaaa','borderLeftColor':'#aaaaaa','borderRightColor':'#aaaaaa','borderBottomColor':'#aaaaaa'},'fast');},'afterExpand':function(context){if(typeof $j.collapsibleTabs!='undefined'){$j.collapsibleTabs.handleResize();}},'afterCondense':function(context){if(typeof $j.collapsibleTabs!='undefined'){$j.collapsibleTabs.handleResize();}}});});$j(document).ready(function(){if(!wgVectorEnabledModules.footercleanup){return true;} |
| 14 | 15 | $j('#editpage-copywarn').add('.editOptions').wrapAll('<div id="editpage-bottom"></div>');$j('#wpSummary').data('hint',$j('#wpSummaryLabel span small').remove().text().replace(/\)|\(/g,'')).change(function(){if($j(this).val().length==0){$j(this).addClass('inline-hint').val($j(this).data('hint'));}else{$j(this).removeClass('inline-hint');}}).focus(function(){if($j(this).val()==$j(this).data('hint')){$j(this).removeClass('inline-hint').val("");}}).blur(function(){$j(this).trigger('change');}).trigger('change');$j('#wpSummary').add('.editCheckboxes').wrapAll('<div id="editpage-summary-fields"></div>');$j('#editpage-specialchars').remove();var transclusionCount=$j('.templatesUsed ul li').size();$j('.templatesUsed ul').wrap('<div id="transclusions-list" class="collapsible-list collapsed"></div>').parent().prepend('<label>This page contains <a href="http://en.wikipedia.org/wiki/transclusion">transclusions</a> of <strong>' |
| 15 | 16 | +transclusionCount |
| 16 | 17 | +'</strong> other pages.</label>');$j('.mw-templatesUsedExplanation').remove();$j('.collapsible-list label').click(function(){$j(this).parent().toggleClass('expanded').toggleClass('collapsed').find('ul').slideToggle('fast');return false;}).trigger('click');$j('#wpPreview, #wpDiff, .editHelp, #editpage-specialchars').remove();$j('#mw-editform-cancel').remove().appendTo('.editButtons');});if(wgVectorEnabledModules.simplesearch&&skin=='vector'&&typeof os_autoload_inputs!=='undefined'&&os_autoload_forms!=='undefined'){os_autoload_inputs=[];os_autoload_forms=[];} |
| Index: trunk/extensions/UsabilityInitiative/js/plugins.combined.js |
| — | — | @@ -5759,6 +5759,133 @@ |
| 5760 | 5760 | } ); |
| 5761 | 5761 | } )( jQuery ); |
| 5762 | 5762 | /** |
| | 5763 | + * This plugin provides functionallity to expand a text box on focus to double it's current width |
| | 5764 | + * |
| | 5765 | + * Usage: |
| | 5766 | + * |
| | 5767 | + * Set options: |
| | 5768 | + * $('#textbox').expandableField( { option1: value1, option2: value2 } ); |
| | 5769 | + * $('#textbox').expandableField( option, value ); |
| | 5770 | + * Get option: |
| | 5771 | + * value = $('#textbox').expandableField( option ); |
| | 5772 | + * Initialize: |
| | 5773 | + * $('#textbox').expandableField(); |
| | 5774 | + * |
| | 5775 | + * Options: |
| | 5776 | + * |
| | 5777 | + */ |
| | 5778 | +( function( $ ) { |
| | 5779 | + |
| | 5780 | +$.expandableField = { |
| | 5781 | + /** |
| | 5782 | + * Expand the field, make the callback |
| | 5783 | + */ |
| | 5784 | + expandField: function( e, context ) { |
| | 5785 | + context.config.beforeExpand.call( context.data.$field, context ); |
| | 5786 | + context.data.$field |
| | 5787 | + .animate( { 'width': context.data.expandedWidth }, 'fast', function() { |
| | 5788 | + context.config.afterExpand.call( this, context ); |
| | 5789 | + } ); |
| | 5790 | + }, |
| | 5791 | + /** |
| | 5792 | + * Condense the field, make the callback |
| | 5793 | + */ |
| | 5794 | + condenseField: function( e, context ) { |
| | 5795 | + context.config.beforeCondense.call( context.data.$field, context ); |
| | 5796 | + context.data.$field |
| | 5797 | + .animate( { 'width': context.data.condensedWidth }, 'fast', function() { |
| | 5798 | + context.config.afterCondense.call( this, context ); |
| | 5799 | + } ); |
| | 5800 | + }, |
| | 5801 | + /** |
| | 5802 | + * Sets the value of a property, and updates the widget accordingly |
| | 5803 | + * @param {String} property Name of property |
| | 5804 | + * @param {Mixed} value Value to set property with |
| | 5805 | + */ |
| | 5806 | + configure: function( context, property, value ) { |
| | 5807 | + // Validate creation using fallback values |
| | 5808 | + switch( property ) { |
| | 5809 | + default: |
| | 5810 | + context.config[property] = value; |
| | 5811 | + break; |
| | 5812 | + } |
| | 5813 | + } |
| | 5814 | + |
| | 5815 | +}; |
| | 5816 | +$.fn.expandableField = function() { |
| | 5817 | + |
| | 5818 | + // Multi-context fields |
| | 5819 | + var returnValue = null; |
| | 5820 | + var args = arguments; |
| | 5821 | + |
| | 5822 | + $( this ).each( function() { |
| | 5823 | + |
| | 5824 | + /* Construction / Loading */ |
| | 5825 | + |
| | 5826 | + var context = $( this ).data( 'expandableField-context' ); |
| | 5827 | + if ( context == null ) { |
| | 5828 | + context = { |
| | 5829 | + config: { |
| | 5830 | + // callback function for before collapse |
| | 5831 | + 'beforeCondense': function( context ) {}, |
| | 5832 | + // callback function for before expand |
| | 5833 | + 'beforeExpand': function( context ) {}, |
| | 5834 | + // callback function for after collapse |
| | 5835 | + 'afterCondense': function( context ) {}, |
| | 5836 | + // callback function for after expand |
| | 5837 | + 'afterExpand': function( context ) {}, |
| | 5838 | + } |
| | 5839 | + }; |
| | 5840 | + } |
| | 5841 | + |
| | 5842 | + /* API */ |
| | 5843 | + // Handle various calling styles |
| | 5844 | + if ( args.length > 0 ) { |
| | 5845 | + if ( typeof args[0] == 'object' ) { |
| | 5846 | + // Apply set of properties |
| | 5847 | + for ( var key in args[0] ) { |
| | 5848 | + $.expandableField.configure( context, key, args[0][key] ); |
| | 5849 | + } |
| | 5850 | + } else if ( typeof args[0] == 'string' ) { |
| | 5851 | + if ( args.length > 1 ) { |
| | 5852 | + // Set property values |
| | 5853 | + $.expandableField.configure( context, args[0], args[1] ); |
| | 5854 | + } else if ( returnValue == null ) { |
| | 5855 | + // Get property values, but don't give access to internal data - returns only the first |
| | 5856 | + returnValue = ( args[0] in context.config ? undefined : context.config[args[0]] ); |
| | 5857 | + } |
| | 5858 | + } |
| | 5859 | + } |
| | 5860 | + |
| | 5861 | + /* Initialization */ |
| | 5862 | + |
| | 5863 | + if ( typeof context.data == 'undefined' ) { |
| | 5864 | + context.data = { |
| | 5865 | + // The width of the field in it's condensed state |
| | 5866 | + 'condensedWidth': $( this ).width(), |
| | 5867 | + // The width of the field in it's expanded state |
| | 5868 | + 'expandedWidth': $( this ).width() * 2, |
| | 5869 | + // Reference to the field |
| | 5870 | + '$field': $( this ) |
| | 5871 | + }; |
| | 5872 | + |
| | 5873 | + $( this ) |
| | 5874 | + .addClass( 'expandableField' ) |
| | 5875 | + .focus( function( e ) { |
| | 5876 | + $.expandableField.expandField( e, context ); |
| | 5877 | + } ) |
| | 5878 | + .delayedBind( 250, 'blur', function( e ) { |
| | 5879 | + $.expandableField.condenseField( e, context ); |
| | 5880 | + } ); |
| | 5881 | + } |
| | 5882 | + // Store the context for next time |
| | 5883 | + $( this ).data( 'expandableField-context', context ); |
| | 5884 | + } ); |
| | 5885 | + return returnValue !== null ? returnValue : $(this); |
| | 5886 | +}; |
| | 5887 | + |
| | 5888 | +} )( jQuery ); |
| | 5889 | +/** |
| 5763 | 5890 | * This plugin provides a generic way to add suggestions to a text box. |
| 5764 | 5891 | * |
| 5765 | 5892 | * Usage: |
| Index: trunk/extensions/UsabilityInitiative/js/plugins.combined.min.js |
| — | — | @@ -391,7 +391,10 @@ |
| 392 | 392 | $.fn.extend({delayedBind:function(timeout,event,data,callback){var encEvent=encodeEvent(event);return this.each(function(){var that=this;if(!($(this).data('_delayedBindBound-'+encEvent+'-'+timeout))){$(this).data('_delayedBindBound-'+encEvent+'-'+timeout,true);$(this).bind(event,function(){var timerID=$(this).data('_delayedBindTimerID-'+encEvent+'-'+timeout);if(typeof timerID!='undefined') |
| 393 | 393 | clearTimeout(timerID);timerID=setTimeout(function(){$(that).trigger('_delayedBind-'+encEvent+'-'+timeout);},timeout);$(this).data('_delayedBindTimerID-'+encEvent+'-'+timeout,timerID);});} |
| 394 | 394 | $(this).bind('_delayedBind-'+encEvent+'-'+timeout,data,callback);});},delayedBindCancel:function(timeout,event){var encEvent=encodeEvent(event);return this.each(function(){var timerID=$(this).data('_delayedBindTimerID-'+encEvent+'-'+timeout);if(typeof timerID!='undefined') |
| 395 | | -clearTimeout(timerID);});},delayedBindUnbind:function(timeout,event,callback){var encEvent=encodeEvent(event);return this.each(function(){$(this).unbind('_delayedBind-'+encEvent+'-'+timeout,callback);});}});})(jQuery);(function($){$.suggestions={cancel:function(context){if(context.data.timerID!=null){clearTimeout(context.data.timerID);} |
| | 395 | +clearTimeout(timerID);});},delayedBindUnbind:function(timeout,event,callback){var encEvent=encodeEvent(event);return this.each(function(){$(this).unbind('_delayedBind-'+encEvent+'-'+timeout,callback);});}});})(jQuery);(function($){$.expandableField={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);});},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);});},configure:function(context,property,value){switch(property){default:context.config[property]=value;break;}}};$.fn.expandableField=function(){var returnValue=null;var args=arguments;$(this).each(function(){var context=$(this).data('expandableField-context');if(context==null){context={config:{'beforeCondense':function(context){},'beforeExpand':function(context){},'afterCondense':function(context){},'afterExpand':function(context){},}};} |
| | 396 | +if(args.length>0){if(typeof args[0]=='object'){for(var key in args[0]){$.expandableField.configure(context,key,args[0][key]);}}else if(typeof args[0]=='string'){if(args.length>1){$.expandableField.configure(context,args[0],args[1]);}else if(returnValue==null){returnValue=(args[0]in context.config?undefined:context.config[args[0]]);}}} |
| | 397 | +if(typeof context.data=='undefined'){context.data={'condensedWidth':$(this).width(),'expandedWidth':$(this).width()*2,'$field':$(this)};$(this).addClass('expandableField').focus(function(e){$.expandableField.expandField(e,context);}).delayedBind(250,'blur',function(e){$.expandableField.condenseField(e,context);});} |
| | 398 | +$(this).data('expandableField-context',context);});return returnValue!==null?returnValue:$(this);};})(jQuery);(function($){$.suggestions={cancel:function(context){if(context.data.timerID!=null){clearTimeout(context.data.timerID);} |
| 396 | 399 | if(typeof context.config.cancel=='function'){context.config.cancel.call(context.data.$textbox);}},restore:function(context){context.data.$textbox.val(context.data.prevText);},update:function(context,delayed){function maybeFetch(){if(context.data.$textbox.val()!==context.data.prevText){context.data.prevText=context.data.$textbox.val();if(typeof context.config.fetch=='function'){context.config.fetch.call(context.data.$textbox,context.data.$textbox.val());}}} |
| 397 | 400 | if(context.data.timerID!=null){clearTimeout(context.data.timerID);} |
| 398 | 401 | if(delayed){context.data.timerID=setTimeout(maybeFetch,context.config.delay);}else{maybeFetch();} |
| Index: trunk/extensions/UsabilityInitiative/Makefile |
| — | — | @@ -5,6 +5,7 @@ |
| 6 | 6 | CSS := \ |
| 7 | 7 | css/suggestions.css\ |
| 8 | 8 | css/vector.collapsibleNav.css\ |
| | 9 | + css/vector.expandableSearch.css\ |
| 9 | 10 | css/wikiEditor.css\ |
| 10 | 11 | css/wikiEditor.dialogs.css\ |
| 11 | 12 | css/wikiEditor.toc.css\ |
| — | — | @@ -26,6 +27,7 @@ |
| 27 | 28 | js/plugins/jquery.color.js\ |
| 28 | 29 | js/plugins/jquery.cookie.js\ |
| 29 | 30 | js/plugins/jquery.delayedBind.js\ |
| | 31 | + js/plugins/jquery.expandableField.js\ |
| 30 | 32 | js/plugins/jquery.suggestions.js\ |
| 31 | 33 | js/plugins/jquery.textSelection.js\ |
| 32 | 34 | js/plugins/jquery.wikiEditor.js\ |
| — | — | @@ -50,6 +52,7 @@ |
| 51 | 53 | Vector/Modules/CollapsibleNav/CollapsibleNav.js\ |
| 52 | 54 | Vector/Modules/CollapsibleTabs/CollapsibleTabs.js\ |
| 53 | 55 | Vector/Modules/EditWarning/EditWarning.js\ |
| | 56 | + Vector/Modules/ExpandableSearch/ExpandableSearch.js\ |
| 54 | 57 | Vector/Modules/FooterCleanup/FooterCleanup.js\ |
| 55 | 58 | Vector/Modules/SimpleSearch/SimpleSearch.js |
| 56 | 59 | |