From 686ff4b538b3fc4f0c632b1d35a123b2ee3770cc Mon Sep 17 00:00:00 2001 From: Aleksander Machniak Date: Fri, 23 Jan 2015 09:49:47 +0100 Subject: Fix keyboard navigation and css in datepicker widget across many Firefox versions --- plugins/jqueryui/js/jquery-ui-1.10.4.custom.min.js | 31 ++++++++++++++++++---- .../jqueryui/js/jquery-ui-accessible-datepicker.js | 31 ++++++++++++++++++---- .../themes/larry/jquery-ui-1.10.4.custom.css | 4 +-- plugins/jqueryui/themes/larry/jquery-ui-css.diff | 4 +-- 4 files changed, 56 insertions(+), 14 deletions(-) (limited to 'plugins') diff --git a/plugins/jqueryui/js/jquery-ui-1.10.4.custom.min.js b/plugins/jqueryui/js/jquery-ui-1.10.4.custom.min.js index ea4edecb3..73248ecac 100755 --- a/plugins/jqueryui/js/jquery-ui-1.10.4.custom.min.js +++ b/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)); \ No newline at end of file +}(jQuery)); diff --git a/plugins/jqueryui/js/jquery-ui-accessible-datepicker.js b/plugins/jqueryui/js/jquery-ui-accessible-datepicker.js index 1c79e13bd..ef7561c7b 100644 --- a/plugins/jqueryui/js/jquery-ui-accessible-datepicker.js +++ b/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)); \ No newline at end of file +}(jQuery)); diff --git a/plugins/jqueryui/themes/larry/jquery-ui-1.10.4.custom.css b/plugins/jqueryui/themes/larry/jquery-ui-1.10.4.custom.css index 737f4771a..b8008732c 100755 --- a/plugins/jqueryui/themes/larry/jquery-ui-1.10.4.custom.css +++ b/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 { diff --git a/plugins/jqueryui/themes/larry/jquery-ui-css.diff b/plugins/jqueryui/themes/larry/jquery-ui-css.diff index cce990679..e3971ecdb 100644 --- a/plugins/jqueryui/themes/larry/jquery-ui-css.diff +++ b/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 { -- cgit v1.2.3