Update OOjs UI to v0.1.0-pre (880100c45e)
[lhc/web/wiklou.git] / resources / lib / oojs-ui / oojs-ui.js
index a3e2375..7dd3735 100644 (file)
@@ -1,12 +1,12 @@
 /*!
- * OOjs UI v0.1.0-pre (49b64bdba7)
+ * OOjs UI v0.1.0-pre (880100c45e)
  * 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: 2014-09-15T22:18:37Z
+ * Date: 2014-09-23T22:28:43Z
  */
 ( function ( OO ) {
 
@@ -1644,17 +1644,26 @@ OO.ui.Window.prototype.getSize = function () {
  * @return {number} Content height
  */
 OO.ui.Window.prototype.getContentHeight = function () {
+       // Temporarily resize the frame so getBodyHeight() can use scrollHeight measurements
+       var bodyHeight, oldHeight = this.$frame[0].style.height;
+       this.$frame[0].style.height = '1px';
+       bodyHeight = this.getBodyHeight();
+       this.$frame[0].style.height = oldHeight;
+
        return Math.round(
                // Add buffer for border
                ( this.$frame.outerHeight() - this.$frame.innerHeight() ) +
                // Use combined heights of children
-               ( this.$head.outerHeight( true ) + this.getBodyHeight() + this.$foot.outerHeight( true ) )
+               ( this.$head.outerHeight( true ) + bodyHeight + this.$foot.outerHeight( true ) )
        );
 };
 
 /**
  * Get the height of the dialog contents.
  *
+ * When this function is called, the dialog will temporarily have been resized
+ * to height=1px, so .scrollHeight measurements can be taken accurately.
+ *
  * @return {number} Height of content
  */
 OO.ui.Window.prototype.getBodyHeight = function () {
@@ -2293,7 +2302,7 @@ OO.ui.Dialog.prototype.getActionProcess = function ( action ) {
  * @inheritdoc
  *
  * @param {Object} [data] Dialog opening data
- * @param {jQuery|string|Function|null} [data.label] Dialog label, omit to use #static-label
+ * @param {jQuery|string|Function|null} [data.title] Dialog title, omit to use #static-title
  * @param {Object[]} [data.actions] List of OO.ui.ActionWidget configuration options for each
  *   action item, omit to use #static-actions
  */
@@ -2800,7 +2809,6 @@ OO.ui.WindowManager.prototype.openWindow = function ( win, data ) {
                                        manager.opening.notify( { state: 'setup' } );
                                        setTimeout( function () {
                                                win.ready( data ).then( function () {
-                                                       manager.updateWindowSize( win );
                                                        manager.opening.notify( { state: 'ready' } );
                                                        manager.opening = null;
                                                        manager.opened = $.Deferred();
@@ -4725,7 +4733,7 @@ OO.ui.ClippableElement.prototype.isClippedVertically = function () {
 };
 
 /**
- * Set the ideal size.
+ * Set the ideal size. These are the dimensions the element will have when it's not being clipped.
  *
  * @param {number|string} [width] Width as a number of pixels or CSS string with unit suffix
  * @param {number|string} [height] Height as a number of pixels or CSS string with unit suffix
@@ -4733,6 +4741,12 @@ OO.ui.ClippableElement.prototype.isClippedVertically = function () {
 OO.ui.ClippableElement.prototype.setIdealSize = function ( width, height ) {
        this.idealWidth = width;
        this.idealHeight = height;
+
+       if ( !this.clipping ) {
+               // Update dimensions
+               this.$clippable.css( { width: width, height: height } );
+       }
+       // While clipping, idealWidth and idealHeight are not considered
 };
 
 /**
@@ -8204,6 +8218,7 @@ OO.ui.ButtonWidget.prototype.setTarget = function ( target ) {
  * @param {Object} [config] Configuration options
  * @cfg {string} [action] Symbolic action name
  * @cfg {string[]} [modes] Symbolic mode names
+ * @cfg {boolean} [framed=false] Render button with a frame
  */
 OO.ui.ActionWidget = function OoUiActionWidget( config ) {
        // Config intialization
@@ -8647,6 +8662,7 @@ OO.ui.InlineMenuWidget.prototype.onClick = function ( e ) {
  * @abstract
  * @class
  * @extends OO.ui.Widget
+ * @mixins OO.ui.FlaggedElement
  *
  * @constructor
  * @param {Object} [config] Configuration options
@@ -8662,6 +8678,9 @@ OO.ui.InputWidget = function OoUiInputWidget( config ) {
        // Parent constructor
        OO.ui.InputWidget.super.call( this, config );
 
+       // Mixin constructors
+       OO.ui.FlaggedElement.call( this, config );
+
        // Properties
        this.$input = this.getInputElement( config );
        this.value = '';
@@ -8683,6 +8702,7 @@ OO.ui.InputWidget = function OoUiInputWidget( config ) {
 /* Setup */
 
 OO.inheritClass( OO.ui.InputWidget, OO.ui.Widget );
+OO.mixinClass( OO.ui.InputWidget, OO.ui.FlaggedElement );
 
 /* Events */
 
@@ -8931,6 +8951,8 @@ OO.ui.CheckboxInputWidget.prototype.onEdit = function () {
  * @cfg {boolean} [multiline=false] Allow multiple lines of text
  * @cfg {boolean} [autosize=false] Automatically resize to fit content
  * @cfg {boolean} [maxRows=10] Maximum number of rows to make visible when autosizing
+ * @cfg {RegExp|string} [validate] Regular expression (or symbolic name referencing
+ *  one, see #static-validationPatterns)
  */
 OO.ui.TextInputWidget = function OoUiTextInputWidget( config ) {
        // Configuration initialization
@@ -8948,9 +8970,13 @@ OO.ui.TextInputWidget = function OoUiTextInputWidget( config ) {
        this.multiline = !!config.multiline;
        this.autosize = !!config.autosize;
        this.maxRows = config.maxRows !== undefined ? config.maxRows : 10;
+       this.validate = config.validate || null;
 
        // Events
-       this.$input.on( 'keypress', OO.ui.bind( this.onKeyPress, this ) );
+       this.$input.on( {
+               keypress: OO.ui.bind( this.onKeyPress, this ),
+               blur: OO.ui.bind( this.setValidityFlag, this )
+       } );
        this.$element.on( 'DOMNodeInsertedIntoDocument', OO.ui.bind( this.onElementAttach, this ) );
        this.$icon.on( 'mousedown', OO.ui.bind( this.onIconMouseDown, this ) );
        this.$indicator.on( 'mousedown', OO.ui.bind( this.onIndicatorMouseDown, this ) );
@@ -8972,6 +8998,13 @@ OO.mixinClass( OO.ui.TextInputWidget, OO.ui.IconElement );
 OO.mixinClass( OO.ui.TextInputWidget, OO.ui.IndicatorElement );
 OO.mixinClass( OO.ui.TextInputWidget, OO.ui.PendingElement );
 
+/* Static properties */
+
+OO.ui.TextInputWidget.static.validationPatterns = {
+       'non-empty': /.+/,
+       integer: /^\d+$/
+};
+
 /* Events */
 
 /**
@@ -9062,6 +9095,7 @@ OO.ui.TextInputWidget.prototype.setValue = function ( value ) {
        // Parent method
        OO.ui.TextInputWidget.super.prototype.setValue.call( this, value );
 
+       this.setValidityFlag();
        this.adjustSize();
        return this;
 };
@@ -9143,6 +9177,31 @@ OO.ui.TextInputWidget.prototype.select = function () {
        return this;
 };
 
+/**
+ * Sets the 'invalid' flag appropriately.
+ */
+OO.ui.TextInputWidget.prototype.setValidityFlag = function () {
+       this.isValid().done( OO.ui.bind( function ( valid ) {
+               this.setFlags( { invalid: !valid } );
+       }, this ) );
+};
+
+/**
+ * Returns whether or not the current value is considered valid, according to the
+ * supplied validation pattern.
+ *
+ * @return {jQuery.Deferred}
+ */
+OO.ui.TextInputWidget.prototype.isValid = function () {
+       var validationRegexp;
+       if ( this.validate instanceof RegExp ) {
+               validationRegexp = this.validate;
+       } else {
+               validationRegexp = this.constructor.static.validationPatterns[this.validate];
+       }
+       return $.Deferred().resolve( !!this.getValue().match( validationRegexp ) ).promise();
+};
+
 /**
  * Text input with a menu of optional values.
  *
@@ -10068,6 +10127,9 @@ OO.ui.PopupWidget.prototype.updateDimensions = function ( transition ) {
                this.$element.removeClass( 'oo-ui-popupWidget-transitioning' );
        }
 
+       // Reevaluate clipping state since we've relocated and resized the popup
+       this.clip();
+
        return this;
 };
 
@@ -11091,6 +11153,13 @@ OO.ui.TextInputMenuWidget.prototype.toggle = function ( visible ) {
 
        var change = visible !== this.isVisible();
 
+       if ( change && visible ) {
+               // Make sure the width is set before the parent method runs.
+               // After this we have to call this.position(); again to actually
+               // position ourselves correctly.
+               this.position();
+       }
+
        // Parent method
        OO.ui.TextInputMenuWidget.super.prototype.toggle.call( this, visible );
 
@@ -11102,6 +11171,7 @@ OO.ui.TextInputMenuWidget.prototype.toggle = function ( visible ) {
                        this.$( this.getElementWindow() ).off( 'resize', this.onWindowResizeHandler );
                }
        }
+
        return this;
 };
 
@@ -11136,6 +11206,8 @@ OO.ui.TextInputMenuWidget.prototype.position = function () {
        }
        this.$element.css( dimensions );
        this.setIdealSize( $container.width() );
+       // We updated the position, so re-evaluate the clipping state
+       this.clip();
 
        return this;
 };