1 files changed, 106 insertions, 0 deletions
diff --git a/www/wiki/extensions/UploadWizard/resources/details/uw.UlsWidget.js b/www/wiki/extensions/UploadWizard/resources/details/uw.UlsWidget.js
new file mode 100644
index 00000000..a1b13fb3
--- /dev/null
+++ b/www/wiki/extensions/UploadWizard/resources/details/uw.UlsWidget.js
@@ -0,0 +1,106 @@
+( function ( mw, uw, $, OO ) {
+
+	/**
+	 * A ULS within a description field in UploadWizard's "Details" step form.
+	 *
+	 * @constructor
+	 * @param {Object} [config]
+	 * @cfg {Object} [languages] Keys are 2-letter language codes, values are language autonyms
+	 * @cfg {Array} [classes] Classes to apply to the ULS container div
+	 */
+	uw.UlsWidget = function UWUlsWidget( config ) {
+		var i;
+
+		uw.UlsWidget.parent.call( this );
+
+		this.$element = $( '<div>' )
+			.append(
+				$( '<span>' )
+					.attr( 'tabindex', 0 )
+					.addClass( 'oo-ui-dropdownWidget-handle' )
+					.addClass( 'oo-ui-widget' )
+					.addClass( 'oo-ui-indicatorElement' )
+					.append(
+						$( '<span>' ).addClass( 'oo-ui-labelElement-label' ),
+						$( '<span>' )
+							.addClass( 'oo-ui-indicatorElement-indicator' )
+							.addClass( 'oo-ui-indicator-down' )
+					)
+			)
+			.addClass( 'oo-ui-dropdownWidget' )
+			.addClass( 'oo-ui-widget-enabled' );
+		for ( i = 0; i < config.classes.length; i++ ) {
+			this.$element.addClass( config.classes[ i ] );
+		}
+
+		if ( mw.loader.getState( 'ext.uls.mediawiki' ) === 'ready' ) {
+			this.initialiseUls( config.languages );
+		}
+	};
+	OO.inheritClass( uw.UlsWidget, OO.ui.Widget );
+	OO.mixinClass( uw.UlsWidget, OO.EventEmitter );
+
+	uw.UlsWidget.prototype.initialiseUls = function ( languages ) {
+		var ulsWidget = this;
+
+		this.languages = languages;
+
+		this.uls = $( this.$element ).uls( {
+			onSelect: function ( language ) {
+				ulsWidget.setValue( language );
+				ulsWidget.$element.parent().find( '.oo-ui-inputWidget-input' ).focus();
+			},
+			languages: languages,
+			ulsPurpose: 'upload-wizard-description',
+			onVisible: function () {
+				// Re-position the ULS *after* the widget has been rendered, so that we can be
+				// sure it's in the right place
+				var offset = ulsWidget.$element.offset();
+				if ( this.$menu.css( 'direction' ) === 'rtl' ) {
+					offset.left =
+						offset.left - parseInt( this.$menu.css( 'width' ) ) + ulsWidget.$element.width();
+				}
+				this.$menu.css( offset );
+			}
+		} );
+		// Show the ULS when a user tabs into the language selection field
+		this.$element.find( '.oo-ui-dropdownWidget-handle' ).on( 'focus', function () {
+			$( this ).click();
+		} );
+	};
+
+	/**
+	 * @param {object} languages
+	 */
+	uw.UlsWidget.prototype.updateLanguages = function ( languages ) {
+		this.uls.off().removeData( 'uls' );
+		this.initialiseUls( languages );
+	};
+
+	/**
+	 * @param {string} value
+	 */
+	uw.UlsWidget.prototype.setValue = function ( value ) {
+		var current = this.languageValue;
+		this.languageValue = value;
+		this.$element.find( '.oo-ui-labelElement-label' ).text( this.languages[ value ] );
+		if ( current !== value ) {
+			this.emit( 'select' );
+		}
+	};
+
+	/**
+	 * @return {string}
+	 */
+	uw.UlsWidget.prototype.getValue = function () {
+		return this.languageValue;
+	};
+
+	/**
+	 * @return {uw.UlsWidget}
+	 */
+	uw.UlsWidget.prototype.getElement = function () {
+		return this.$element;
+	};
+
+}( mediaWiki, mediaWiki.uploadWizard, jQuery, OO ) );