/*!
- * OOjs UI v0.16.2
+ * OOjs UI v0.16.6
* https://www.mediawiki.org/wiki/OOjs_UI
*
* Copyright 2011–2016 OOjs UI Team and other contributors.
* Released under the MIT license
* http://oojs.mit-license.org
*
- * Date: 2016-03-08T21:46:49Z
+ * Date: 2016-04-19T21:57:49Z
*/
( function ( OO ) {
* [1]: https://www.mediawiki.org/wiki/OOjs_UI/Widgets/Selects_and_Options#Button_selects_and_options
*
* @class
- * @extends OO.ui.DecoratedOptionWidget
+ * @extends OO.ui.OptionWidget
* @mixins OO.ui.mixin.ButtonElement
+ * @mixins OO.ui.mixin.IconElement
+ * @mixins OO.ui.mixin.IndicatorElement
* @mixins OO.ui.mixin.TabIndexedElement
* @mixins OO.ui.mixin.TitledElement
*
// Mixin constructors
OO.ui.mixin.ButtonElement.call( this, config );
+ OO.ui.mixin.IconElement.call( this, config );
+ OO.ui.mixin.IndicatorElement.call( this, config );
OO.ui.mixin.TitledElement.call( this, $.extend( {}, config, { $titled: this.$button } ) );
OO.ui.mixin.TabIndexedElement.call( this, $.extend( {}, config, {
$tabIndexed: this.$button,
// Initialization
this.$element.addClass( 'oo-ui-buttonOptionWidget' );
- this.$button.append( this.$element.contents() );
+ this.$button.append( this.$icon, this.$label, this.$indicator );
this.$element.append( this.$button );
};
/* Setup */
-OO.inheritClass( OO.ui.ButtonOptionWidget, OO.ui.DecoratedOptionWidget );
+OO.inheritClass( OO.ui.ButtonOptionWidget, OO.ui.OptionWidget );
OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.ButtonElement );
+OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.IconElement );
+OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.IndicatorElement );
OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.TitledElement );
OO.mixinClass( OO.ui.ButtonOptionWidget, OO.ui.mixin.TabIndexedElement );
* @cfg {number} [max=Infinity] Maximum allowed value
* @cfg {number} [step=1] Delta when using the buttons or up/down arrow keys
* @cfg {number|null} [pageStep] Delta when using the page-up/page-down keys. Defaults to 10 times #step.
+ * @cfg {boolean} [showButtons=true] Whether to show the plus and minus buttons.
*/
OO.ui.NumberInputWidget = function OoUiNumberInputWidget( config ) {
// Configuration initialization
min: -Infinity,
max: Infinity,
step: 1,
- pageStep: null
+ pageStep: null,
+ showButtons: true
}, config );
// Parent constructor
// Properties
this.input = new OO.ui.TextInputWidget( $.extend(
- {
- disabled: this.isDisabled()
- },
- config.input
- ) );
- this.minusButton = new OO.ui.ButtonWidget( $.extend(
- {
- disabled: this.isDisabled(),
- tabIndex: -1
- },
- config.minusButton,
- {
- classes: [ 'oo-ui-numberInputWidget-minusButton' ],
- label: '−'
- }
- ) );
- this.plusButton = new OO.ui.ButtonWidget( $.extend(
{
disabled: this.isDisabled(),
- tabIndex: -1
+ type: 'number'
},
- config.plusButton,
- {
- classes: [ 'oo-ui-numberInputWidget-plusButton' ],
- label: '+'
- }
+ config.input
) );
+ if ( config.showButtons ) {
+ this.minusButton = new OO.ui.ButtonWidget( $.extend(
+ {
+ disabled: this.isDisabled(),
+ tabIndex: -1
+ },
+ config.minusButton,
+ {
+ classes: [ 'oo-ui-numberInputWidget-minusButton' ],
+ label: '−'
+ }
+ ) );
+ this.plusButton = new OO.ui.ButtonWidget( $.extend(
+ {
+ disabled: this.isDisabled(),
+ tabIndex: -1
+ },
+ config.plusButton,
+ {
+ classes: [ 'oo-ui-numberInputWidget-plusButton' ],
+ label: '+'
+ }
+ ) );
+ }
// Events
this.input.connect( this, {
keydown: this.onKeyDown.bind( this ),
'wheel mousewheel DOMMouseScroll': this.onWheel.bind( this )
} );
- this.plusButton.connect( this, {
- click: [ 'onButtonClick', +1 ]
- } );
- this.minusButton.connect( this, {
- click: [ 'onButtonClick', -1 ]
- } );
+ if ( config.showButtons ) {
+ this.plusButton.connect( this, {
+ click: [ 'onButtonClick', +1 ]
+ } );
+ this.minusButton.connect( this, {
+ click: [ 'onButtonClick', -1 ]
+ } );
+ }
// Initialization
this.setIsInteger( !!config.isInteger );
this.setStep( config.step, config.pageStep );
this.$field = $( '<div>' ).addClass( 'oo-ui-numberInputWidget-field' )
- .append(
- this.minusButton.$element,
- this.input.$element,
- this.plusButton.$element
- );
+ .append( this.input.$element );
this.$element.addClass( 'oo-ui-numberInputWidget' ).append( this.$field );
+ if ( config.showButtons ) {
+ this.$field
+ .prepend( this.minusButton.$element )
+ .append( this.plusButton.$element );
+ this.$element.addClass( 'oo-ui-numberInputWidget-buttoned' );
+ }
this.input.setValidation( this.validateNumber.bind( this ) );
};
OO.ui.NumberInputWidget.prototype.onWheel = function ( event ) {
var delta = 0;
- // Standard 'wheel' event
- if ( event.originalEvent.deltaMode !== undefined ) {
- this.sawWheelEvent = true;
- }
- if ( event.originalEvent.deltaY ) {
- delta = -event.originalEvent.deltaY;
- } else if ( event.originalEvent.deltaX ) {
- delta = event.originalEvent.deltaX;
- }
-
- // Non-standard events
- if ( !this.sawWheelEvent ) {
- if ( event.originalEvent.wheelDeltaX ) {
- delta = -event.originalEvent.wheelDeltaX;
- } else if ( event.originalEvent.wheelDeltaY ) {
- delta = event.originalEvent.wheelDeltaY;
- } else if ( event.originalEvent.wheelDelta ) {
- delta = event.originalEvent.wheelDelta;
- } else if ( event.originalEvent.detail ) {
- delta = -event.originalEvent.detail;
+ if ( !this.isDisabled() && this.input.$input.is( ':focus' ) ) {
+ // Standard 'wheel' event
+ if ( event.originalEvent.deltaMode !== undefined ) {
+ this.sawWheelEvent = true;
+ }
+ if ( event.originalEvent.deltaY ) {
+ delta = -event.originalEvent.deltaY;
+ } else if ( event.originalEvent.deltaX ) {
+ delta = event.originalEvent.deltaX;
}
- }
- if ( delta ) {
- delta = delta < 0 ? -1 : 1;
- this.adjustValue( delta * this.step );
- }
+ // Non-standard events
+ if ( !this.sawWheelEvent ) {
+ if ( event.originalEvent.wheelDeltaX ) {
+ delta = -event.originalEvent.wheelDeltaX;
+ } else if ( event.originalEvent.wheelDeltaY ) {
+ delta = event.originalEvent.wheelDeltaY;
+ } else if ( event.originalEvent.wheelDelta ) {
+ delta = event.originalEvent.wheelDelta;
+ } else if ( event.originalEvent.detail ) {
+ delta = -event.originalEvent.detail;
+ }
+ }
- return false;
+ if ( delta ) {
+ delta = delta < 0 ? -1 : 1;
+ this.adjustValue( delta * this.step );
+ }
+
+ return false;
+ }
};
/**