Trevor Parscal has uploaded a new change for review.
https://gerrit.wikimedia.org/r/111672
Change subject: (Stand back) Extreme label refactoring
......................................................................
(Stand back) Extreme label refactoring
What was bothering me:
* Inconsistent API for labels and titles, such that sometimes you would pass a
message key while other times you would pass a string or jQuery selection
* Misuse of LabeledElement as a mixin
* Insane API for window titles
What I did about it:
* All label and title APIs are now documented and behaving in a consistent
manner
* Statically set messages are wrapped in a deferred message function that
localizes the message at instantiation time, rather than class declaration time
* Now strings, or functions that produce strings are the defacto input to any
label or title
* In some documented cases, it's OK to pass a jQuery object instead (this
should probably be phased out, but is being used still)
* Cleaned up lots of documentation
Change-Id: Ic967b88d55daf48d365487e17f76488b3f02c60f
---
M src/OO.ui.Tool.js
M src/OO.ui.ToolGroup.js
M src/OO.ui.Window.js
M src/OO.ui.js
M src/elements/OO.ui.IconedElement.js
M src/elements/OO.ui.IndicatedElement.js
M src/elements/OO.ui.LabeledElement.js
M src/elements/OO.ui.TitledElement.js
M src/layouts/OO.ui.BookletLayout.js
M src/layouts/OO.ui.PageLayout.js
M src/styles/OO.ui.ToolGroup.css
M src/toolgroups/OO.ui.BarToolGroup.js
M src/toolgroups/OO.ui.MenuToolGroup.js
M src/toolgroups/OO.ui.PopupToolGroup.js
M src/widgets/OO.ui.OptionWidget.js
15 files changed, 285 insertions(+), 119 deletions(-)
git pull ssh://gerrit.wikimedia.org:29418/oojs/ui refs/changes/72/111672/1
diff --git a/src/OO.ui.Tool.js b/src/OO.ui.Tool.js
index 01a48e8..96f7507 100644
--- a/src/OO.ui.Tool.js
+++ b/src/OO.ui.Tool.js
@@ -5,33 +5,38 @@
* @abstract
* @extends OO.ui.Widget
* @mixins OO.ui.IconedElement
- * @mixins OO.ui.LabeledElement
*
* @constructor
* @param {OO.ui.ToolGroup} toolGroup
* @param {Object} [config] Configuration options
+ * @cfg {string|Function} [title] Title text or a function that returns text
*/
OO.ui.Tool = function OoUiTool( toolGroup, config ) {
+ // Config intialization
+ config = config || {};
+
// Parent constructor
OO.ui.Widget.call( this, config );
// Mixin constructors
- OO.ui.IconedElement.call( this, this.$( '<span>' ) );
- OO.ui.LabeledElement.call( this, this.$( '<span>' ) );
+ OO.ui.IconedElement.call( this, this.$( '<span>' ), config );
// Properties
this.toolGroup = toolGroup;
this.toolbar = this.toolGroup.getToolbar();
this.active = false;
+ this.$title = this.$( '<span>' );
this.$link = this.$( '<a>' );
+ this.title = null;
// Events
this.toolbar.connect( this, { 'updateState': 'onUpdateState' } );
// Initialization
+ this.$title.addClass( 'oo-ui-tool-title' );
this.$link
.addClass( 'oo-ui-tool-link' )
- .append( this.$icon, this.$label );
+ .append( this.$icon, this.$title );
this.$element
.data( 'oo-ui-tool', this )
.addClass(
@@ -40,7 +45,7 @@
)
.append( this.$link );
this.setIcon( this.constructor.static.icon );
- this.updateLabel();
+ this.setTitle( config.title || this.constructor.static.title );
};
/* Inheritance */
@@ -48,7 +53,6 @@
OO.inheritClass( OO.ui.Tool, OO.ui.Widget );
OO.mixinClass( OO.ui.Tool, OO.ui.IconedElement );
-OO.mixinClass( OO.ui.Tool, OO.ui.LabeledElement );
/* Events */
@@ -81,25 +85,7 @@
OO.ui.Tool.static.group = '';
/**
- * Symbolic name of icon.
- *
- * Value should be the unique portion of an icon CSS class name, such as 'up'
for 'oo-ui-icon-up'.
- *
- * For i18n purposes, this property can be an object containing a `default`
icon name property and
- * additional icon names keyed by language code.
- *
- * Example of i18n icon definition:
- * { 'default': 'bold-a', 'en': 'bold-b', 'de': 'bold-f' }
- *
- * @abstract
- * @static
- * @property {string|Object}
- * @inheritable
- */
-OO.ui.Tool.static.icon = '';
-
-/**
- * Message key for tool title.
+ * Tool title.
*
* Title is used as a tooltip when the tool is part of a bar tool group, or a
label when the tool
* is part of a list or menu tool group. If a trigger is associated with an
action by the same name
@@ -108,10 +94,10 @@
*
* @abstract
* @static
- * @property {string}
+ * @property {string|Function} Title text or a function that returns text
* @inheritable
*/
-OO.ui.Tool.static.titleMessage = '';
+OO.ui.Tool.static.title = '';
/**
* Tool can be automatically added to tool groups.
@@ -194,11 +180,23 @@
* Get the tool title.
*
* @method
- * @returns {string} [title] Title text
+ * @param {string|Function} title Title text or a function that returns text
+ * @chainable
+ */
+OO.ui.Tool.prototype.setTitle = function ( title ) {
+ this.title = OO.ui.resolveMsg( title );
+ this.updateTitle();
+ return this;
+};
+
+/**
+ * Get the tool title.
+ *
+ * @method
+ * @returns {string} Title text
*/
OO.ui.Tool.prototype.getTitle = function () {
- var key = this.constructor.static.titleMessage;
- return typeof key === 'string' ? OO.ui.msg( key ) : '';
+ return this.title;
};
/**
@@ -212,30 +210,26 @@
};
/**
- * Update the label.
+ * Update the title.
*
* @method
*/
-OO.ui.Tool.prototype.updateLabel = function () {
- var title = this.getTitle(),
- labelTooltips = this.toolGroup.constructor.static.labelTooltips,
+OO.ui.Tool.prototype.updateTitle = function () {
+ var titleTooltips = this.toolGroup.constructor.static.titleTooltips,
accelTooltips = this.toolGroup.constructor.static.accelTooltips,
accel = this.toolbar.getToolAccelerator(
this.constructor.static.name ),
tooltipParts = [];
- this.setLabel(
- this.$( '<span>' )
- .addClass( 'oo-ui-tool-title' )
- .text( title )
- .add(
- this.$( '<span>' )
- .addClass( 'oo-ui-tool-accel' )
- .text( accel )
- )
- );
+ this.$title.empty()
+ .text( this.title )
+ .append(
+ this.$( '<span>' )
+ .addClass( 'oo-ui-tool-accel' )
+ .text( accel )
+ );
- if ( labelTooltips && typeof title === 'string' && title.length ) {
- tooltipParts.push( title );
+ if ( titleTooltips && typeof this.title === 'string' &&
this.title.length ) {
+ tooltipParts.push( this.title );
}
if ( accelTooltips && typeof accel === 'string' && accel.length ) {
tooltipParts.push( accel );
diff --git a/src/OO.ui.ToolGroup.js b/src/OO.ui.ToolGroup.js
index 2b46a97..6797c76 100644
--- a/src/OO.ui.ToolGroup.js
+++ b/src/OO.ui.ToolGroup.js
@@ -77,7 +77,7 @@
* @property {boolean}
* @inheritable
*/
-OO.ui.ToolGroup.static.labelTooltips = false;
+OO.ui.ToolGroup.static.titleTooltips = false;
/**
* Show acceleration labels in tooltips.
@@ -239,7 +239,7 @@
if ( !tool ) {
// Auto-initialize tools on first use
this.tools[name] = tool = toolFactory.create(
name, this );
- tool.updateLabel();
+ tool.updateTitle();
}
this.toolbar.reserveTool( tool );
add.push( tool );
diff --git a/src/OO.ui.Window.js b/src/OO.ui.Window.js
index b87a65d..7eb4691 100644
--- a/src/OO.ui.Window.js
+++ b/src/OO.ui.Window.js
@@ -1,6 +1,9 @@
/**
* Container for elements in a child frame.
*
+ * There are two ways to specifiy a title: set the static `title` property or
provide a `title`
+ * property in the configuration options. The latter will override the former.
+ *
* @class
* @abstract
* @extends OO.ui.Element
@@ -9,6 +12,8 @@
* @constructor
* @param {OO.ui.WindowSet} windowSet Window set this dialog is part of
* @param {Object} [config] Configuration options
+ * @cfg {string|Function} [title] Title string or function that returns a
string
+ * @cfg {string} [icon] Symbolic name of icon
* @fires initialize
*/
OO.ui.Window = function OoUiWindow( windowSet, config ) {
@@ -23,6 +28,8 @@
this.visible = false;
this.opening = false;
this.closing = false;
+ this.title = OO.ui.resolveMsg( config.title ||
this.constructor.static.title );
+ this.icon = config.icon || this.constructor.static.icon;
this.frame = new OO.ui.Frame( { '$': this.$ } );
this.$frame = this.$( '<div>' );
this.$ = function () {
@@ -90,13 +97,13 @@
OO.ui.Window.static.icon = 'window';
/**
- * Localized message for title.
+ * Window title.
*
* @static
* @inheritable
- * @property {string}
+ * @property {string|Function} Title string or function that returns a string
*/
-OO.ui.Window.static.titleMessage = null;
+OO.ui.Window.static.title = null;
/* Methods */
@@ -151,13 +158,21 @@
};
/**
- * Get the title of the window.
+ * Get the window title.
*
- * Use #titleMessage to set this unless you need to do something fancy.
- * @returns {string} Window title
+ * @returns {string} Title text
*/
OO.ui.Window.prototype.getTitle = function () {
- return OO.ui.msg( this.constructor.static.titleMessage );
+ return this.title;
+};
+
+/**
+ * Get the window icon.
+ *
+ * @returns {string} Symbolic name of icon
+ */
+OO.ui.Window.prototype.getIcon = function () {
+ return this.icon;
};
/**
@@ -183,11 +198,32 @@
/**
* Set the title of the window.
*
- * @param {string} [customTitle] Custom title, override the #titleMessage
+ * @param {string|Function} title Title text or a function that returns text
* @chainable
*/
-OO.ui.Window.prototype.setTitle = function ( customTitle ) {
- this.$title.text( customTitle || this.getTitle() );
+OO.ui.Window.prototype.setTitle = function ( title ) {
+ this.title = OO.ui.resolveMsg( title );
+ if ( this.$title ) {
+ this.$title.text( title );
+ }
+ return this;
+};
+
+/**
+ * Set the icon of the window.
+ *
+ * @param {string} icon Symbolic name of icon
+ * @chainable
+ */
+OO.ui.Window.prototype.setIcon = function ( icon ) {
+ if ( this.$icon ) {
+ this.$icon.removeClass( 'oo-ui-icon-' + this.icon );
+ }
+ this.icon = icon;
+ if ( this.$icon ) {
+ this.$icon.addClass( 'oo-ui-icon-' + this.icon );
+ }
+
return this;
};
@@ -252,12 +288,10 @@
OO.ui.Window.prototype.initialize = function () {
// Properties
this.$ = this.frame.$;
- this.$title = this.$( '<div class="oo-ui-window-title"></div>' );
- if ( this.getTitle() ) {
- this.setTitle();
- }
+ this.$title = this.$( '<div class="oo-ui-window-title"></div>' )
+ .text( this.title );
this.$icon = this.$( '<div class="oo-ui-window-icon"></div>' )
- .addClass( 'oo-ui-icon-' + this.constructor.static.icon );
+ .addClass( 'oo-ui-icon-' + this.icon );
this.$head = this.$( '<div class="oo-ui-window-head"></div>' );
this.$body = this.$( '<div class="oo-ui-window-body"></div>' );
this.$foot = this.$( '<div class="oo-ui-window-foot"></div>' );
diff --git a/src/OO.ui.js b/src/OO.ui.js
index 3f98440..1480c83 100644
--- a/src/OO.ui.js
+++ b/src/OO.ui.js
@@ -110,6 +110,19 @@
return message;
};
+OO.ui.deferMsg = function ( key ) {
+ return function () {
+ return OO.ui.msg( key );
+ };
+};
+
+OO.ui.resolveMsg = function ( msg ) {
+ if ( $.isFunction( msg ) ) {
+ return msg();
+ }
+ return msg;
+};
+
} )();
// Add more as you need
diff --git a/src/elements/OO.ui.IconedElement.js
b/src/elements/OO.ui.IconedElement.js
index e76e71c..02a50a4 100644
--- a/src/elements/OO.ui.IconedElement.js
+++ b/src/elements/OO.ui.IconedElement.js
@@ -8,7 +8,8 @@
* @param {jQuery} $icon Icon node, assigned to #$icon
* @param {Object} [config] Configuration options
* @cfg {Object|string} [icon=''] Symbolic icon name, or map of icon names
keyed by language ID;
- * use the 'default' key to specify the icon to be used when there is no icon
in the user's language.
+ * use the 'default' key to specify the icon to be used when there is no icon
in the user's
+ * language
*/
OO.ui.IconedElement = function OoUiIconedElement( $icon, config ) {
// Config intialization
@@ -20,20 +21,45 @@
// Initialization
this.$icon.addClass( 'oo-ui-iconedElement-icon' );
- this.setIcon( config.icon );
+ this.setIcon( config.icon || this.constructor.static.indicator );
};
+
+/* Static Properties */
+
+OO.ui.IconedElement.static = {};
+
+/**
+ * Icon.
+ *
+ * Value should be the unique portion of an icon CSS class name, such as 'up'
for 'oo-ui-icon-up'.
+ *
+ * For i18n purposes, this property can be an object containing a `default`
icon name property and
+ * additional icon names keyed by language code.
+ *
+ * Example of i18n icon definition:
+ * { 'default': 'bold-a', 'en': 'bold-b', 'de': 'bold-f' }
+ *
+ * @static
+ * @inheritable
+ * @property {Object|string} Symbolic icon name, or map of icon names keyed by
language ID;
+ * use the 'default' key to specify the icon to be used when there is no icon
in the user's
+ * language
+ */
+OO.ui.IconedElement.static.icon = null;
/* Methods */
/**
- * Set the icon.
+ * Set icon.
*
* @method
- * @param {Object|string} [value] Symbolic name of icon to use
+ * @param {Object|string} icon Symbolic icon name, or map of icon names keyed
by language ID;
+ * use the 'default' key to specify the icon to be used when there is no icon
in the user's
+ * language
* @chainable
*/
-OO.ui.IconedElement.prototype.setIcon = function ( value ) {
- var icon = OO.isPlainObject( value ) ? OO.ui.getLocalValue( value,
null, 'default' ) : value;
+OO.ui.IconedElement.prototype.setIcon = function ( icon ) {
+ icon = OO.isPlainObject( icon ) ? OO.ui.getLocalValue( icon, null,
'default' ) : icon;
if ( this.icon ) {
this.$icon.removeClass( 'oo-ui-icon-' + this.icon );
@@ -49,3 +75,13 @@
return this;
};
+
+/**
+ * Get icon.
+ *
+ * @method
+ * @returns {string} Icon
+ */
+OO.ui.IconedElement.prototype.getIcon = function () {
+ return this.icon;
+};
diff --git a/src/elements/OO.ui.IndicatedElement.js
b/src/elements/OO.ui.IndicatedElement.js
index c24ae32..e504501 100644
--- a/src/elements/OO.ui.IndicatedElement.js
+++ b/src/elements/OO.ui.IndicatedElement.js
@@ -7,8 +7,8 @@
* @constructor
* @param {jQuery} $indicator Indicator node, assigned to #$indicator
* @param {Object} [config] Configuration options
- * @cfg {string} [indicator=''] Symbolic indicator name
- * @cfg {string} [indicatorTitle=''] Description of indicator meaning
+ * @cfg {string} [indicator] Symbolic indicator name
+ * @cfg {string} [indicatorTitle] Indicator title text or a function that
return text
*/
OO.ui.IndicatedElement = function OoUiIndicatedElement( $indicator, config ) {
// Config intialization
@@ -17,32 +17,56 @@
// Properties
this.$indicator = $indicator;
this.indicator = null;
+ this.indicatorLabel = null;
// Initialization
this.$indicator.addClass( 'oo-ui-indicatedElement-indicator' );
- this.setIndicator( config.indicator );
- this.setIndicatorTitle( config.indicatorTitle );
+ this.setIndicator( config.indicator ||
this.constructor.static.indicator );
+ this.setIndicatorTitle( config.indicatorTitle ||
this.constructor.static.indicatorTitle );
};
+
+/* Static Properties */
+
+OO.ui.IndicatedElement.static = {};
+
+/**
+ * indicator.
+ *
+ * @static
+ * @inheritable
+ * @property {string|null} Symbolic indicator name or null for no indicator
+ */
+OO.ui.IndicatedElement.static.indicator = null;
+
+/**
+ * Indicator title.
+ *
+ * @static
+ * @inheritable
+ * @property {string|Function|null} Indicator title text, a function that
return text or null for no
+ * indicator title
+ */
+OO.ui.IndicatedElement.static.indicatorTitle = null;
/* Methods */
/**
- * Set the indicator.
+ * Set indicator.
*
* @method
- * @param {string} [value] Symbolic name of indicator to use
+ * @param {string|null} indicator Symbolic name of indicator to use or null
for no indicator
* @chainable
*/
-OO.ui.IndicatedElement.prototype.setIndicator = function ( value ) {
+OO.ui.IndicatedElement.prototype.setIndicator = function ( indicator ) {
if ( this.indicator ) {
this.$indicator.removeClass( 'oo-ui-indicator-' +
this.indicator );
this.indicator = null;
}
- if ( typeof value === 'string' ) {
- value = value.trim();
- if ( value.length ) {
- this.$indicator.addClass( 'oo-ui-indicator-' + value );
- this.indicator = value;
+ if ( typeof indicator === 'string' ) {
+ indicator = indicator.trim();
+ if ( indicator.length ) {
+ this.$indicator.addClass( 'oo-ui-indicator-' +
indicator );
+ this.indicator = indicator;
}
}
this.$element.toggleClass( 'oo-ui-indicatedElement', !!this.indicator );
@@ -51,18 +75,41 @@
};
/**
- * Set the indicator label.
+ * Set indicator label.
*
* @method
- * @param {string} [value] Description of indicator meaning
+ * @param {string|Function|null} indicator Indicator title text, a function
that return text or null
+ * for no indicator title
* @chainable
*/
-OO.ui.IndicatedElement.prototype.setIndicatorTitle = function ( value ) {
- if ( typeof value === 'string' && value.length ) {
- this.$indicator.attr( 'title', value );
+OO.ui.IndicatedElement.prototype.setIndicatorTitle = function ( indicatorTitle
) {
+ this.indicatorTitle = indicatorTitle = OO.ui.resolveMsg( indicatorTitle
);
+
+ if ( typeof indicatorTitle === 'string' && indicatorTitle.length ) {
+ this.$indicator.attr( 'title', indicatorTitle );
} else {
this.$indicator.removeAttr( 'title' );
}
return this;
};
+
+/**
+ * Get indicator.
+ *
+ * @method
+ * @returns {string} title Symbolic name of indicator
+ */
+OO.ui.IndicatedElement.prototype.getIndicator = function () {
+ return this.indicator;
+};
+
+/**
+ * Get indicator title.
+ *
+ * @method
+ * @returns {string} Indicator title text
+ */
+OO.ui.IndicatedElement.prototype.getIndicatorTitle = function () {
+ return this.indicatorTitle;
+};
diff --git a/src/elements/OO.ui.LabeledElement.js
b/src/elements/OO.ui.LabeledElement.js
index 269a4f4..653b7f7 100644
--- a/src/elements/OO.ui.LabeledElement.js
+++ b/src/elements/OO.ui.LabeledElement.js
@@ -7,7 +7,7 @@
* @constructor
* @param {jQuery} $label Label node, assigned to #$label
* @param {Object} [config] Configuration options
- * @cfg {jQuery|string} [label=''] Label text
+ * @cfg {jQuery|string|function} [label] Label nodes, text or a function that
returns nodes or text
*/
OO.ui.LabeledElement = function OoUiLabeledElement( $label, config ) {
// Config intialization
@@ -19,12 +19,22 @@
// Initialization
this.$label.addClass( 'oo-ui-labeledElement-label' );
- this.setLabel( config.label );
+ this.setLabel( config.label || this.constructor.static.label );
};
/* Static Properties */
OO.ui.LabeledElement.static = {};
+
+/**
+ * Label.
+ *
+ * @static
+ * @inheritable
+ * @property {string|Function|null} Label text; a function that returns a
nodes or text; or null for
+ * no label
+ */
+OO.ui.LabeledElement.static.label = null;
/* Methods */
@@ -32,21 +42,20 @@
* Set the label.
*
* @method
- * @param {jQuery|string} [value] jQuery HTML node selection or string text
value to use for label
+ * @param {jQuery|string|function|null} label Label nodes; text; a function
that retuns nodes or
+ * text; or null for no label
* @chainable
*/
-OO.ui.LabeledElement.prototype.setLabel = function ( value ) {
+OO.ui.LabeledElement.prototype.setLabel = function ( label ) {
var empty = false;
- if ( typeof value === 'string' && value.trim() ) {
- this.$label.text( value );
- this.label = value;
- } else if ( value instanceof jQuery ) {
- this.$label.empty().append( value );
- this.label = value;
+ this.label = label = OO.ui.resolveMsg( label ) || null;
+ if ( typeof label === 'string' && label.trim() ) {
+ this.$label.text( label );
+ } else if ( label instanceof jQuery ) {
+ this.$label.empty().append( label );
} else {
this.$label.empty();
- this.label = null;
empty = true;
}
this.$element.toggleClass( 'oo-ui-labeledElement', !empty );
@@ -56,6 +65,17 @@
};
/**
+ * Get the label.
+ *
+ * @method
+ * @returns {jQuery|string|function|null} label Label nodes; text; a function
that returns nodes or
+ * text; or null for no label
+ */
+OO.ui.LabeledElement.prototype.getLabel = function () {
+ return this.label;
+};
+
+/**
* Fit the label.
*
* @method
diff --git a/src/elements/OO.ui.TitledElement.js
b/src/elements/OO.ui.TitledElement.js
index 89a7f5a..74ffa41 100644
--- a/src/elements/OO.ui.TitledElement.js
+++ b/src/elements/OO.ui.TitledElement.js
@@ -7,7 +7,7 @@
* @constructor
* @param {jQuery} $label Titled node, assigned to #$titled
* @param {Object} [config] Configuration options
- * @cfg {string} [title=''] Title text
+ * @cfg {string|Function} [title] Title text or a function that returns text
*/
OO.ui.TitledElement = function OoUiTitledElement( $titled, config ) {
// Config intialization
@@ -15,26 +15,52 @@
// Properties
this.$titled = $titled;
+ this.title = null;
// Initialization
- this.setTitle( config.title );
+ this.setTitle( config.title || this.constructor.static.title );
};
+
+/* Static Properties */
+
+OO.ui.TitledElement.static = {};
+
+/**
+ * Title.
+ *
+ * @static
+ * @inheritable
+ * @property {string|Function} Title text or a function that returns text
+ */
+OO.ui.TitledElement.static.title = null;
/* Methods */
/**
- * Set the label.
+ * Set title.
*
* @method
- * @param {string} [value] Title text
+ * @param {string|Function|null} title Title text, a function that returns
text or null for no title
* @chainable
*/
-OO.ui.TitledElement.prototype.setTitle = function ( value ) {
- if ( typeof value === 'string' && value.length ) {
- this.$titled.attr( 'title', value );
+OO.ui.TitledElement.prototype.setTitle = function ( title ) {
+ this.title = title = OO.ui.resolveMsg( title ) || null;
+
+ if ( typeof title === 'string' && title.length ) {
+ this.$titled.attr( 'title', title );
} else {
this.$titled.removeAttr( 'title' );
}
return this;
};
+
+/**
+ * Get title.
+ *
+ * @method
+ * @returns {string} Title string
+ */
+OO.ui.TitledElement.prototype.getTitle = function () {
+ return this.title;
+};
diff --git a/src/layouts/OO.ui.BookletLayout.js
b/src/layouts/OO.ui.BookletLayout.js
index a4be7a0..75e36e8 100644
--- a/src/layouts/OO.ui.BookletLayout.js
+++ b/src/layouts/OO.ui.BookletLayout.js
@@ -10,7 +10,7 @@
* @cfg {boolean} [autoFocus=false] Focus on the first focusable element when
changing to a page
* @cfg {boolean} [outlined=false] Show an outline
* @cfg {boolean} [editable=false] Show controls for adding, removing and
reordering pages
- * @cfg {Object[]} [adders List of adders for controls, each with name, icon
and title properties
+ * @cfg {Object[]} [adders] List of adders for controls, each with name, icon
and title properties
*/
OO.ui.BookletLayout = function OoUiBookletLayout( config ) {
// Initialize configuration
diff --git a/src/layouts/OO.ui.PageLayout.js b/src/layouts/OO.ui.PageLayout.js
index b330d99..9fa9d16 100644
--- a/src/layouts/OO.ui.PageLayout.js
+++ b/src/layouts/OO.ui.PageLayout.js
@@ -25,8 +25,8 @@
this.name = name;
this.icon = config.icon || '';
this.indicator = config.indicator || '';
- this.indicatorTitle = config.indicatorTitle || '';
- this.label = config.label || '';
+ this.indicatorTitle = OO.ui.resolveMsg( config.indicatorTitle ) || '';
+ this.label = OO.ui.resolveMsg( config.label ) || '';
this.level = config.level || 0;
this.movable = !!config.movable;
diff --git a/src/styles/OO.ui.ToolGroup.css b/src/styles/OO.ui.ToolGroup.css
index fb9243b..7671fe2 100644
--- a/src/styles/OO.ui.ToolGroup.css
+++ b/src/styles/OO.ui.ToolGroup.css
@@ -20,7 +20,7 @@
display: none;
}
-.oo-ui-toolGroup .oo-ui-tool-link .oo-ui-labeledElement-label {
+.oo-ui-toolGroup .oo-ui-tool-link .oo-ui-tool-title {
color: #000;
}
@@ -84,7 +84,7 @@
opacity: 0.8;
}
-.oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-labeledElement-label {
+.oo-ui-barToolGroup .oo-ui-tool-link .oo-ui-tool-title {
display: none;
}
@@ -104,8 +104,7 @@
opacity: 1;
}
-.oo-ui-barToolGroup .oo-ui-tool-title,
-.oo-ui-barToolGroup .oo-ui-tool-accel {
+.oo-ui-barToolGroup .oo-ui-tool-title {
display: none;
}
@@ -192,7 +191,7 @@
margin-right: 0.5em;
}
-.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-labeledElement-label {
+.oo-ui-popupToolGroup .oo-ui-tool-link .oo-ui-tool-title {
display: inline-block;
vertical-align: middle;
line-height: 2em;
@@ -249,7 +248,7 @@
cursor: default;
}
-.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link
.oo-ui-labeledElement-label {
+.oo-ui-listToolGroup .oo-ui-tool.oo-ui-widget-disabled .oo-ui-tool-link
.oo-ui-tool-title {
color: #ccc;
}
diff --git a/src/toolgroups/OO.ui.BarToolGroup.js
b/src/toolgroups/OO.ui.BarToolGroup.js
index fd0332b..cd50c62 100644
--- a/src/toolgroups/OO.ui.BarToolGroup.js
+++ b/src/toolgroups/OO.ui.BarToolGroup.js
@@ -23,6 +23,6 @@
/* Static Properties */
-OO.ui.BarToolGroup.static.labelTooltips = true;
+OO.ui.BarToolGroup.static.titleTooltips = true;
OO.ui.BarToolGroup.static.accelTooltips = true;
diff --git a/src/toolgroups/OO.ui.MenuToolGroup.js
b/src/toolgroups/OO.ui.MenuToolGroup.js
index b91266f..6dc106e 100644
--- a/src/toolgroups/OO.ui.MenuToolGroup.js
+++ b/src/toolgroups/OO.ui.MenuToolGroup.js
@@ -47,7 +47,7 @@
for ( name in this.tools ) {
if ( this.tools[name].isActive() ) {
- labelTexts.push( this.tools[name].$label.find(
'.oo-ui-tool-title' ).text() );
+ labelTexts.push( this.tools[name].getTitle() );
}
}
diff --git a/src/toolgroups/OO.ui.PopupToolGroup.js
b/src/toolgroups/OO.ui.PopupToolGroup.js
index 4139c09..1bb3f95 100644
--- a/src/toolgroups/OO.ui.PopupToolGroup.js
+++ b/src/toolgroups/OO.ui.PopupToolGroup.js
@@ -24,7 +24,7 @@
// Mixin constructors
OO.ui.IconedElement.call( this, this.$( '<span>' ), config );
OO.ui.IndicatedElement.call( this, this.$( '<span>' ), config );
- OO.ui.LabeledElement.call( this, this.$( '<span>' ) );
+ OO.ui.LabeledElement.call( this, this.$( '<span>' ), config );
OO.ui.TitledElement.call( this, this.$element, config );
OO.ui.ClippableElement.call( this, this.$group );
@@ -47,7 +47,6 @@
this.$element
.addClass( 'oo-ui-popupToolGroup' )
.prepend( this.$handle );
- this.setLabel( config.label ? OO.ui.msg( config.label ) : '' );
};
/* Inheritance */
diff --git a/src/widgets/OO.ui.OptionWidget.js
b/src/widgets/OO.ui.OptionWidget.js
index 6d81eb7..2ac253a 100644
--- a/src/widgets/OO.ui.OptionWidget.js
+++ b/src/widgets/OO.ui.OptionWidget.js
@@ -11,8 +11,6 @@
* @constructor
* @param {Mixed} data Option data
* @param {Object} [config] Configuration options
- * @cfg {jQuery|string} [label] Option label
- * @cfg {string} [icon] Symbolic name of icon
* @cfg {boolean} [selected=false] Select option
* @cfg {boolean} [highlighted=false] Highlight option
* @cfg {string} [rel] Value for `rel` attribute in DOM, allowing per-option
styling
--
To view, visit https://gerrit.wikimedia.org/r/111672
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: Ic967b88d55daf48d365487e17f76488b3f02c60f
Gerrit-PatchSet: 1
Gerrit-Project: oojs/ui
Gerrit-Branch: master
Gerrit-Owner: Trevor Parscal <[email protected]>
_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
