X-Git-Url: https://git.heureux-cyclage.org/?a=blobdiff_plain;f=resources%2Fsrc%2Fmediawiki.widgets%2Fmw.widgets.DateInputWidget.js;h=f10c93db48c0488926ea7c3cde758c1be068dbb9;hb=fb79f30319b9ad2a7eb0f5f4d1668143ec8f963e;hp=50a84f8b0512ee18cab13f332bd3bbc6e4bccea9;hpb=06424a026d81c1caaec36877c3c822c1e2c90e2b;p=lhc%2Fweb%2Fwiklou.git

diff --git a/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js b/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js
index 50a84f8b05..f10c93db48 100644
--- a/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js
+++ b/resources/src/mediawiki.widgets/mw.widgets.DateInputWidget.js
@@ -130,6 +130,7 @@
 		} );
 		this.inCalendar = 0;
 		this.inTextInput = 0;
+		this.closing = false;
 		this.inputFormat = config.inputFormat;
 		this.displayFormat = config.displayFormat;
 		this.longDisplayFormat = config.longDisplayFormat;
@@ -173,7 +174,7 @@
 		this.$handle.on( {
 			click: this.onClick.bind( this ),
 			keypress: this.onKeyPress.bind( this ),
-			focus: this.activate.bind( this )
+			focus: this.onFocus.bind( this )
 		} );
 
 		// Initialization
@@ -242,6 +243,16 @@
 	OO.inheritClass( mw.widgets.DateInputWidget, OO.ui.TextInputWidget );
 	OO.mixinClass( mw.widgets.DateInputWidget, OO.ui.mixin.IndicatorElement );
 
+	/* Events */
+
+	/**
+	 * Fired when the widget is deactivated (i.e. the calendar is closed). This can happen because
+	 * the user selected a value, or because the user blurred the widget.
+	 *
+	 * @event deactivate
+	 * @param {boolean} userSelected Whether the deactivation happened because the user selected a value
+	 */
+
 	/* Methods */
 
 	/**
@@ -386,13 +397,23 @@
 	 * Deactivate this input field for data entry. Closes the calendar and hides the text field.
 	 *
 	 * @private
+	 * @param {boolean} [userSelected] Whether we are deactivating because the user selected a value
 	 */
-	mw.widgets.DateInputWidget.prototype.deactivate = function () {
+	mw.widgets.DateInputWidget.prototype.deactivate = function ( userSelected ) {
 		this.$element.removeClass( 'mw-widget-dateInputWidget-active' );
 		this.$handle.show();
 		this.textInput.toggle( false );
 		this.calendar.toggle( false );
 		this.setValidityFlag();
+
+		if ( userSelected ) {
+			// Prevent focusing the handle from reopening the calendar
+			this.closing = true;
+			this.$handle.focus();
+			this.closing = false;
+		}
+
+		this.emit( 'deactivate', !!userSelected );
 	};
 
 	/**
@@ -521,6 +542,17 @@
 		}
 	};
 
+	/**
+	 * Handle focus events.
+	 *
+	 * @private
+	 */
+	mw.widgets.DateInputWidget.prototype.onFocus = function () {
+		if ( !this.closing ) {
+			this.activate();
+		}
+	};
+
 	/**
 	 * Handle calendar key press events.
 	 *
@@ -530,8 +562,7 @@
 	 */
 	mw.widgets.DateInputWidget.prototype.onCalendarKeyPress = function ( e ) {
 		if ( !this.isDisabled() && e.which === OO.ui.Keys.ENTER ) {
-			this.deactivate();
-			this.$handle.focus();
+			this.deactivate( true );
 			return false;
 		}
 	};
@@ -544,13 +575,15 @@
 	 * @return {boolean} False to cancel the default event
 	 */
 	mw.widgets.DateInputWidget.prototype.onCalendarClick = function ( e ) {
+		var targetClass = this.calendar.getPrecision() === 'month' ?
+			'mw-widget-calendarWidget-month' :
+			'mw-widget-calendarWidget-day';
 		if (
 			!this.isDisabled() &&
 			e.which === 1 &&
-			$( e.target ).hasClass( 'mw-widget-calendarWidget-day' )
+			$( e.target ).hasClass( targetClass )
 		) {
-			this.deactivate();
-			this.$handle.focus();
+			this.deactivate( true );
 			return false;
 		}
 	};
@@ -561,8 +594,7 @@
 	 * @private
 	 */
 	mw.widgets.DateInputWidget.prototype.onEnter = function () {
-		this.deactivate();
-		this.$handle.focus();
+		this.deactivate( true );
 	};
 
 	/**