/*!
- * OOjs UI v0.1.0-pre (3b61a8d77c)
+ * OOjs UI v0.1.0-pre (a290673bbd)
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2014 OOjs Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: Tue Feb 11 2014 14:46:28 GMT-0800 (PST)
+ * Date: Wed Feb 12 2014 13:52:08 GMT-0800 (PST)
*/
( function () {
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
/**
* Container for elements in a child frame.
*
+ * There are two ways to specify 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
* @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 ) {
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 () {
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 */
};
/**
- * 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;
};
/**
/**
* 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;
};
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>' );
* @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
// Initialization
this.$icon.addClass( 'oo-ui-iconedElement-icon' );
- this.setIcon( config.icon );
+ this.setIcon( config.icon || this.constructor.static.icon );
};
+/* 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 );
return this;
};
+
+/**
+ * Get icon.
+ *
+ * @method
+ * @returns {string} Icon
+ */
+OO.ui.IconedElement.prototype.getIcon = function () {
+ return this.icon;
+};
/**
* Element containing an indicator.
*
* @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
// 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 );
};
/**
- * 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;
+};
/**
* Element containing a label.
*
* @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
// 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 */
/**
* 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 );
return this;
};
+/**
+ * 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.
*
* @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
// 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;
+};
/**
* Generic toolbar tool.
*
* @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(
this.constructor.static.name.replace( /^([^\/]+)\/([^\/]+).*$/, '$1-$2' )
)
.append( this.$link );
- this.setIcon( this.constructor.static.icon );
- this.updateLabel();
+ this.setTitle( config.title || this.constructor.static.title );
};
/* Inheritance */
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 */
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
*
* @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.
* 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;
};
/**
};
/**
- * 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 );
* @property {boolean}
* @inheritable
*/
-OO.ui.ToolGroup.static.labelTooltips = false;
+OO.ui.ToolGroup.static.titleTooltips = false;
/**
* Show acceleration labels in tooltips.
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 );
* @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
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;
/* Static Properties */
-OO.ui.BarToolGroup.static.labelTooltips = true;
+OO.ui.BarToolGroup.static.titleTooltips = true;
OO.ui.BarToolGroup.static.accelTooltips = true;
/**
// 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 );
this.$element
.addClass( 'oo-ui-popupToolGroup' )
.prepend( this.$handle );
- this.setLabel( config.label ? OO.ui.msg( config.label ) : '' );
};
/* Inheritance */
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() );
}
}
* @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
* @chainable
*/
OO.ui.TextInputMenuWidget.prototype.show = function () {
- this.position();
-
// Parent method
OO.ui.MenuWidget.prototype.show.call( this );
+ this.position();
this.$( this.getElementWindow() ).on( 'resize', this.onWindowResizeHandler );
return this;
};
dépôts / lhc / web / wiklou.git / commitdiff
