Fix keyboard navigation and css in datepicker widget across many Firefox versions

CHANGELOG

@@ -14,6 +14,7 @@ CHANGELOG Roundcube Webmail
 - Fix bug where Reply-To address was ignored on reply to messages sent by self (#1490233)
 - Fix bug where empty fieldmap config entries caused empty results of ldap search (#1490229)
 - Fix bug where drafts list wasn't refreshed after draft message was sent from another window (#1490238)
+- Fix keyboard navigation and css in datepicker widget across many Firefox versions
 
 RELEASE 1.1-rc
 --------------

plugins/jqueryui/js/jquery-ui-1.10.4.custom.min.js

@@ -109,17 +109,23 @@ $.extend($.datepicker, {
 		var that = this;
 
 		// register additional keyboard events to control date selection with cursor keys
-		$(target).unbind('keyup.datepicker-extended').bind('keyup.datepicker-extended', function(event) {
+		$(target).unbind('keydown.datepicker-extended').bind('keydown.datepicker-extended', function(event) {
 			var inc = 1;
 			switch (event.keyCode) {
 				case 109:
+				case 173:
 				case 189:  // "minus"
 					inc = -1;
+				case 61:
 				case 107:
 				case 187:  // "plus"
+					// do nothing if the input does not contain full date string
+					if (this.value.length < that._formatDate(inst, inst.selectedDay, inst.selectedMonth, inst.selectedYear).length) {
+						return true;
+					}
 					that._adjustInstDate(inst, inc, 'D');
-					that._selectDate(target, that._formatDate(inst, inst.selectedDay, inst.selectedMonth, inst.selectedYear));
-					break;
+					that._selectDateRC(target, that._formatDate(inst, inst.selectedDay, inst.selectedMonth, inst.selectedYear));
+					return false;
 
 				case $.ui.keyCode.UP:
 				case $.ui.keyCode.DOWN:
@@ -222,8 +228,23 @@ $.extend($.datepicker, {
 			inst.dpDiv.find('.ui-datepicker-calendar').focus();
 			inst._hasfocus = false;
 		}
-	}
+	},
 
+	_selectDateRC: function(id, dateStr) {
+		var target = $(id), inst = this._getInst(target[0]);
+
+		dateStr = (dateStr != null ? dateStr : this._formatDate(inst));
+		if (inst.input) {
+			inst.input.val(dateStr);
+		}
+		this._updateAlternate(inst);
+		if (inst.input) {
+			inst.input.trigger("change"); // fire the change event
+		}
+		if (inst.inline) {
+			this._updateDatepicker(inst);
+		}
+	}
 });
 
-}(jQuery));
+}(jQuery));

plugins/jqueryui/js/jquery-ui-accessible-datepicker.js

@@ -94,17 +94,23 @@ $.extend($.datepicker, {
 		var that = this;
 
 		// register additional keyboard events to control date selection with cursor keys
-		$(target).unbind('keyup.datepicker-extended').bind('keyup.datepicker-extended', function(event) {
+		$(target).unbind('keydown.datepicker-extended').bind('keydown.datepicker-extended', function(event) {
 			var inc = 1;
 			switch (event.keyCode) {
 				case 109:
+				case 173:
 				case 189:  // "minus"
 					inc = -1;
+				case 61:
 				case 107:
 				case 187:  // "plus"
+					// do nothing if the input does not contain full date string
+					if (this.value.length < that._formatDate(inst, inst.selectedDay, inst.selectedMonth, inst.selectedYear).length) {
+						return true;
+					}
 					that._adjustInstDate(inst, inc, 'D');
-					that._selectDate(target, that._formatDate(inst, inst.selectedDay, inst.selectedMonth, inst.selectedYear));
-					break;
+					that._selectDateRC(target, that._formatDate(inst, inst.selectedDay, inst.selectedMonth, inst.selectedYear));
+					return false;
 
 				case $.ui.keyCode.UP:
 				case $.ui.keyCode.DOWN:
@@ -207,8 +213,23 @@ $.extend($.datepicker, {
 			inst.dpDiv.find('.ui-datepicker-calendar').focus();
 			inst._hasfocus = false;
 		}
-	}
+	},
 
+	_selectDateRC: function(id, dateStr) {
+		var target = $(id), inst = this._getInst(target[0]);
+
+		dateStr = (dateStr != null ? dateStr : this._formatDate(inst));
+		if (inst.input) {
+			inst.input.val(dateStr);
+		}
+		this._updateAlternate(inst);
+		if (inst.input) {
+			inst.input.trigger("change"); // fire the change event
+		}
+		if (inst.inline) {
+			this._updateDatepicker(inst);
+		}
+	}
 });
 
-}(jQuery));
+}(jQuery));

plugins/jqueryui/themes/larry/jquery-ui-1.10.4.custom.css

@@ -1453,10 +1453,10 @@ body .ui-tooltip {
 	        appearance: none;
 }
 .mozilla .ui-datepicker .ui-datepicker-title select {
-	background-position: right -17px;
+	background-position: right -14px;
 	text-indent: 0.01px;
 	text-overflow: '';
-	padding-right: 0;
+	padding-right: 10px;
 }
 .ui-datepicker .ui-datepicker-month:focus,
 .ui-datepicker .ui-datepicker-year:focus {

plugins/jqueryui/themes/larry/jquery-ui-css.diff

@@ -538,10 +538,10 @@
 +	        appearance: none;
 +}
 +.mozilla .ui-datepicker .ui-datepicker-title select {
-+	background-position: right -17px;
++	background-position: right -14px;
 +	text-indent: 0.01px;
 +	text-overflow: '';
-+	padding-right: 0;
++	padding-right: 10px;
 +}
 +.ui-datepicker .ui-datepicker-month:focus,
 +.ui-datepicker .ui-datepicker-year:focus {

program/js/app.js

@@ -5173,10 +5173,10 @@ function rcube_webmail()
         dateFormat: this.env.date_format,
         changeMonth: true,
         changeYear: true,
-        yearRange: '-100:+10',
+        yearRange: '-120:+10',
         showOtherMonths: true,
         selectOtherMonths: true,
-        onSelect: function(dateText) { $(this).focus().val(dateText) }
+//        onSelect: function(dateText) { $(this).focus().val(dateText); }
       });
       $('input.datepicker').datepicker();
     }