wikimedia/mediawiki-extensions-VisualEditor
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/extensions/VisualEditor synced 2024-11-28 00:00:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Limit the number of initially visible parameters in the parameter search widget

Browse source 
* Truncate beyond 3 parameters
* Add a special option class that, when clicked, shows the remaining parameters
* Use a special option class for the no parameters item instead of hacking the normal one
* Simplify the design of the no parameters item: no icon, centered text

Change-Id: Ia8259e91b42a59c2b08019df36217d485208ad99
This commit is contained in:
Trevor Parscal 2014-04-08 12:15:15 -07:00
parent c25a48c057
commit 70655da2b9
9 changed files with 165 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
VisualEditor.php
View file

@ -993,6 +993,8 @@ $wgResourceModules += array(
'modules/ve-mw/ui/widgets/ve.ui.MWParameterSearchWidget.js',
'modules/ve-mw/ui/widgets/ve.ui.MWParameterResultWidget.js',
'modules/ve-mw/ui/widgets/ve.ui.MWMoreParametersResultWidget.js',
'modules/ve-mw/ui/widgets/ve.ui.MWNoParametersResultWidget.js',
'modules/ve-mw/ui/pages/ve.ui.MWTemplatePage.js',
'modules/ve-mw/ui/pages/ve.ui.MWParameterPage.js',
@ -1008,6 +1010,8 @@ $wgResourceModules += array(
'modules/ve-mw/ce/styles/ve.ce.MWTransclusionNode.css',
'modules/ve-mw/ui/styles/ve.ui.MWParameterPage.css',
'modules/ve-mw/ui/styles/ve.ui.MWParameterResultWidget.css',
'modules/ve-mw/ui/styles/ve.ui.MWMoreParametersResultWidget.css',
'modules/ve-mw/ui/styles/ve.ui.MWNoParametersResultWidget.css',
'modules/ve-mw/ui/styles/ve.ui.MWParameterSearchWidget.css',
'modules/ve-mw/ui/styles/ve.ui.MWTransclusionContentPage.css',
'modules/ve-mw/ui/styles/ve.ui.MWTransclusionDialog.css',
@ -1039,6 +1043,7 @@ $wgResourceModules += array(
'visualeditor-dialogbutton-template-tooltip',
'visualeditor-dialogbutton-transclusion-tooltip',
'visualeditor-parameter-input-placeholder',
'visualeditor-parameter-search-more',
'visualeditor-parameter-search-no-unused',
'visualeditor-parameter-search-unknown',
),

1
modules/ve-mw/i18n/en.json
View file

@ -179,6 +179,7 @@
"visualeditor-pagemenu-tooltip": "Page options",
"visualeditor-pagetranslationwarning": "You are editing a translatable page. Editing these in VisualEditor is not yet officially supported.",
"visualeditor-parameter-input-placeholder": "Parameter name",
"visualeditor-parameter-search-more": "Show $1 other {{PLURAL:$1|parameter|parameters}}",
"visualeditor-parameter-search-no-unused": "No unused parameters",
"visualeditor-parameter-search-unknown": "Unknown parameter",
"visualeditor-preference-betatempdisable": "Temporarily disable VisualEditor while it is in beta",

1
modules/ve-mw/i18n/qqq.json
View file

@ -184,6 +184,7 @@
"visualeditor-pagemenu-tooltip": "Tooltip text for the page menu which has the following items:\n* {{msg-mw|visualeditor-meta-tool}}\n* {{msg-mw|visualeditor-settings-tool}}\n* {{msg-mw|visualeditor-advancedsettings-tool}}\n* {{msg-mw|visualeditor-categories-tool}}\n* {{msg-mw|visualeditor-languages-tool}}\n* {{msg-mw|visualeditor-mweditmodesource-title}}\n* {{msg-mw|visualeditor-dialog-command-help-title}}",
"visualeditor-pagetranslationwarning": "Edit notice shown when VisualEditor loads, warning users editing a translated page that it is not officially supported.",
"visualeditor-parameter-input-placeholder": "Placeholder text label for an input for adding a parameter to a template.\n{{Identical|Parameter name}}",
"visualeditor-parameter-search-more": "Label for item in parameter list that, when clicked, reveals additional parameters that had been truncated to save space",
"visualeditor-parameter-search-no-unused": "Message displayed in the transclusion dialog when no known parameters are unused by this template.",
"visualeditor-parameter-search-unknown": "{{Identical|Unknown parameter}}",
"visualeditor-preference-betatempdisable": "Label for the temporary user preference to disable VisualEditor while it is in beta.",

25
modules/ve-mw/ui/styles/ve.ui.MWMoreParametersResultWidget.css Normal file
View file

@ -0,0 +1,25 @@
/*!
* VisualEditor MediaWiki UserInterface MWMoreParametersResultWidget styles.
*
* @copyright 2011-2014 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
.ve-ui-mwMoreParametersResultWidget {
padding-right: 0.25em;
}
.ve-ui-mwMoreParametersResultWidget .oo-ui-optionWidget-icon {
top: 0.25em;
margin-top: 0;
}
.ve-ui-mwMoreParametersResultWidget-label {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
/* HACK: Based on the expected width of this widget, using % produces unreliable results*/
max-width: 33em;
font-weight: bold;
float: left;
}

17
modules/ve-mw/ui/styles/ve.ui.MWNoParametersResultWidget.css Normal file
View file

@ -0,0 +1,17 @@
/*!
* VisualEditor MediaWiki UserInterface MWNoParametersResultWidget styles.
*
* @copyright 2011-2014 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
.ve-ui-mwNoParametersResultWidget.oo-ui-widget-disabled {
opacity: 0.5;
}
.ve-ui-mwNoParametersResultWidget-label {
text-align: center;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}

12
modules/ve-mw/ui/styles/ve.ui.MWParameterResultWidget.css
View file

@ -14,10 +14,6 @@
margin-top: 0;
}
.ve-ui-mwParameterResultWidget.oo-ui-widget-disabled {
opacity: 0.5;
}
.ve-ui-mwParameterResultWidget-label,
.ve-ui-mwParameterResultWidget-names,
.ve-ui-mwParameterResultWidget-description {
@ -43,14 +39,14 @@
padding: 0.125em 0.25em;
margin-left: 0.5em;
color: #999;
background-color: #fff;
background-color: #eee;
border: solid 1px #ddd;
}
.ve-ui-mwParameterResultWidget-names span:not(:first-child) {
background-color: #eee;
.ve-ui-mwParameterResultWidget-name:first-child {
background-color: #fff;
}
.ve-ui-mwParameterResultWidget-description {
clear: both;
}
}

42
modules/ve-mw/ui/widgets/ve.ui.MWMoreParametersResultWidget.js Normal file
View file

@ -0,0 +1,42 @@
/*!
* VisualEditor UserInterface MWMoreParametersResultWidget class.
*
* @copyright 2011-2014 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* Creates an ve.ui.MWMoreParametersResultWidget object.
*
* @class
* @extends OO.ui.OptionWidget
*
* @constructor
* @param {Mixed} data Item data
* @param {number} [data.remainder] Remaining items that can be shown
* @param {Object} [config] Configuration options
*/
ve.ui.MWMoreParametersResultWidget = function VeUiMWMoreParametersResultWidget( data, config ) {
// Configuration initialization
config = ve.extendObject( { 'icon': 'parameter-set' }, config );
// Parent constructor
OO.ui.OptionWidget.call( this, data, config );
// Initialization
this.$element.addClass( 've-ui-mwMoreParametersResultWidget' );
this.setLabel( this.buildLabel() );
};
/* Inheritance */
OO.inheritClass( ve.ui.MWMoreParametersResultWidget, OO.ui.OptionWidget );
/* Methods */
/** */
ve.ui.MWMoreParametersResultWidget.prototype.buildLabel = function () {
return this.$( '<div>' )
.addClass( 've-ui-mwMoreParametersResultWidget-label' )
.text( ve.msg( 'visualeditor-parameter-search-more', this.data.remainder ) );
};

38
modules/ve-mw/ui/widgets/ve.ui.MWNoParametersResultWidget.js Normal file
View file

@ -0,0 +1,38 @@
/*!
* VisualEditor UserInterface MWNoParametersResultWidget class.
*
* @copyright 2011-2014 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
/**
* Creates an ve.ui.MWNoParametersResultWidget object.
*
* @class
* @extends OO.ui.OptionWidget
*
* @constructor
* @param {Mixed} data Item data
* @param {Object} [config] Configuration options
*/
ve.ui.MWNoParametersResultWidget = function VeUiMWNoParametersResultWidget( data, config ) {
// Parent constructor
OO.ui.OptionWidget.call( this, data, config );
// Initialization
this.$element.addClass( 've-ui-mwNoParametersResultWidget' );
this.setLabel( this.buildLabel() );
};
/* Inheritance */
OO.inheritClass( ve.ui.MWNoParametersResultWidget, OO.ui.OptionWidget );
/* Methods */
/** */
ve.ui.MWNoParametersResultWidget.prototype.buildLabel = function () {
return this.$( '<div>' )
.addClass( 've-ui-mwNoParametersResultWidget-label' )
.text( ve.msg( 'visualeditor-parameter-search-no-unused' ) );
};

48
modules/ve-mw/ui/widgets/ve.ui.MWParameterSearchWidget.js
View file

@ -13,11 +13,13 @@
*
* @constructor
* @param {Object} [config] Configuration options
* @cfg {number|null} [limit=3] Limit on the number of initial options to show, null to show all
*/
ve.ui.MWParameterSearchWidget = function VeUiMWParameterSearchWidget( template, config ) {
// Configuration intialization
config = ve.extendObject( {
'placeholder': ve.msg( 'visualeditor-parameter-input-placeholder' )
'placeholder': ve.msg( 'visualeditor-parameter-input-placeholder' ),
'limit': 3
}, config );
// Parent constructor
@ -26,6 +28,8 @@ ve.ui.MWParameterSearchWidget = function VeUiMWParameterSearchWidget( template,
// Properties
this.template = template;
this.index = [];
this.showAll = false;
this.limit = config.limit || null;
// Events
this.template.connect( this, { 'add': 'buildIndex', 'remove': 'buildIndex' } );
@ -70,7 +74,12 @@ ve.ui.MWParameterSearchWidget.prototype.onQueryChange = function () {
* @fires select
*/
ve.ui.MWParameterSearchWidget.prototype.onResultsSelect = function ( item ) {
this.emit( 'select', item && item.getData() ? item.getData().name : null );
if ( item instanceof ve.ui.MWParameterResultWidget ) {
this.emit( 'select', item.getData().name );
} else if ( item instanceof ve.ui.MWMoreParametersResultWidget ) {
this.showAll = true;
this.addResults();
}
};
/**
@ -117,25 +126,34 @@ ve.ui.MWParameterSearchWidget.prototype.buildIndex = function () {
* @method
*/
ve.ui.MWParameterSearchWidget.prototype.addResults = function () {
var i, len, item, textMatch, nameMatch,
var i, len, item, textMatch, nameMatch, remainder,
exactMatch = false,
value = this.query.getValue().trim().replace( /[\|\{\}]/g, '' ),
query = value.toLowerCase(),
hasQuery = !!query.length,
items = [];
this.results.clearItems();
for ( i = 0, len = this.index.length; i < len; i++ ) {
item = this.index[i];
textMatch = item.text.indexOf( query ) >= 0;
nameMatch = item.names.indexOf( query ) >= 0;
if ( textMatch || nameMatch ) {
if ( hasQuery ) {
textMatch = item.text.indexOf( query ) >= 0;
nameMatch = item.names.indexOf( query ) >= 0;
}
if ( !hasQuery || textMatch || nameMatch ) {
items.push( new ve.ui.MWParameterResultWidget( item, { '$': this.$ } ) );
if ( nameMatch ) {
if ( hasQuery && nameMatch ) {
exactMatch = true;
}
}
if ( !hasQuery && !this.showAll && items.length >= this.limit ) {
remainder = len - i;
break;
}
}
if ( !exactMatch && value.length && !this.template.hasParameter( value ) ) {
if ( hasQuery && !exactMatch && value.length && !this.template.hasParameter( value ) ) {
items.unshift( new ve.ui.MWParameterResultWidget( {
'name': value,
'label': value,
@ -145,14 +163,12 @@ ve.ui.MWParameterSearchWidget.prototype.addResults = function () {
}
if ( !items.length ) {
items.push( new ve.ui.MWParameterResultWidget(
{
'name': null,
'label': '',
'aliases': [],
'description': ve.msg( 'visualeditor-parameter-search-no-unused' )
},
{ '$': this.$, 'disabled': true }
items.push( new ve.ui.MWNoParametersResultWidget(
{}, { '$': this.$, 'disabled': true }
) );
} else if ( remainder ) {
items.push( new ve.ui.MWMoreParametersResultWidget(
{ 'remainder': remainder }, { '$': this.$ }
) );
}