public inbox for [email protected]
help / color / mirror / Atom feed[PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility).
5+ messages / 3 participants
[nested] [flat]
* [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility).
@ 2020-03-07 13:29 Pradip Parkale <[email protected]>
2020-03-09 05:39 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Akshay Joshi <[email protected]>
0 siblings, 1 reply; 5+ messages in thread
From: Pradip Parkale @ 2020-03-07 13:29 UTC (permalink / raw)
To: pgadmin-hackers
Hi Hackers,
Attached is a patch to change the Datetime picker value using a keyboard.
--
Thanks & Regards,
Pradip Parkale
QMG, EnterpriseDB Corporation
Attachments:
[application/octet-stream] RM4237.patch (4.3K, 3-RM4237.patch)
download | inline diff:
diff --git a/web/pgadmin/static/js/backform.pgadmin.js b/web/pgadmin/static/js/backform.pgadmin.js
index 06b2159d5..3090fd254 100644
--- a/web/pgadmin/static/js/backform.pgadmin.js
+++ b/web/pgadmin/static/js/backform.pgadmin.js
@@ -2821,6 +2821,7 @@ define([
'focusout input': 'closePicker',
'change.datetimepicker': 'onChange',
'click .input-group': 'togglePicker',
+ 'keydown .datetimepicker-input': 'keyboardEvent',
},
togglePicker: function() {
if (this.has_datepicker) {
@@ -2846,6 +2847,109 @@ define([
'</div>',
'<% } %>',
].join('\n')),
+
+ keyboardEvent: function(event) {
+ let stopBubble = false;
+ if (!event.altKey && event.keyCode == 38) {
+ this.up();
+ }
+ if (!event.altKey && event.keyCode == 40) {
+ this.down();
+ }
+ if (event.keyCode == 37) {
+ this.left();
+ }
+ if (event.keyCode == 39) {
+ this.right();
+ }
+ if (event.keyCode == 27){
+ this.$el.find('input').datetimepicker('hide');
+ stopBubble = true;
+ }
+ if (event.keyCode == 13){
+ if ((this.$el.find('.datepicker').is(':visible')) || (this.$el.find('.timepicker').is(':visible'))){
+ this.$el.find('input').datetimepicker('hide');
+ }else{
+ this.$el.find('input').datetimepicker('show');
+ }
+ }
+ if (event.altKey && event.keyCode == 84) {
+ this.timePicker();
+ }
+ if(event.altKey && event.keyCode == 38){
+ this.controlUp();
+ }
+ if(event.altKey && event.keyCode == 40){
+ this.controlDown();
+ }
+
+ if(stopBubble) {
+ event.stopImmediatePropagation();
+ }
+ },
+
+ down: function() {
+ if (this.$el.find('.datepicker').is(':visible')) {
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.add(7, 'd'));
+ } else {
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.subtract(1, 'm'));
+ }
+ },
+
+ up: function() {
+ if (this.$el.find('.datepicker').is(':visible')) {
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.subtract(7, 'd'));
+ } else {
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.add(1, 'm'));
+ }
+ },
+
+ left: function() {
+ if (this.$el.find('.datepicker').is(':visible')) {
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.subtract(1, 'd'));
+ }
+ },
+
+ right: function() {
+ if (this.$el.find('.datepicker').is(':visible')) {
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.add(1, 'd'));
+ }
+ },
+
+ timePicker:function() {
+ if (this.$el.find('.timepicker').is(':visible')){
+ this.$el.find('.fa-calendar').click();
+ }else{
+ this.$el.find('.fa-clock-o').click();
+ }
+ },
+
+ controlUp:function() {
+ this.$el.find('.fa-clock-o').click();
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.add(1, 'h'));
+ },
+
+ controlDown:function() {
+ this.$el.find('.fa-clock-o').click();
+ let $el = this.$el.find('.datetimepicker-input');
+ let currdate = $el.data('datetimepicker').date().clone();
+ $el.datetimepicker('date', currdate.subtract(1, 'h'));
+ },
+
render: function() {
var field = _.defaults(this.field.toJSON(), this.defaults),
attributes = this.model.toJSON(),
^ permalink raw reply [nested|flat] 5+ messages in thread
* Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility).
2020-03-07 13:29 [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
@ 2020-03-09 05:39 ` Akshay Joshi <[email protected]>
2020-03-10 07:47 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
0 siblings, 1 reply; 5+ messages in thread
From: Akshay Joshi @ 2020-03-09 05:39 UTC (permalink / raw)
To: Pradip Parkale <[email protected]>; +Cc: pgadmin-hackers
Hi Pradip
I have tested the patch. I am able to navigate the dates using the
keyboard, but not able to select the year/month and time. Can you please
work on it and send the patch again.
On Sat, Mar 7, 2020 at 7:00 PM Pradip Parkale <
[email protected]> wrote:
> Hi Hackers,
>
> Attached is a patch to change the Datetime picker value using a keyboard.
>
>
> --
> Thanks & Regards,
> Pradip Parkale
> QMG, EnterpriseDB Corporation
>
--
*Thanks & Regards*
*Akshay Joshi*
*Sr. Software Architect*
*EnterpriseDB Software India Private Limited*
*Mobile: +91 976-788-8246*
^ permalink raw reply [nested|flat] 5+ messages in thread
* Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility).
2020-03-07 13:29 [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
2020-03-09 05:39 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Akshay Joshi <[email protected]>
@ 2020-03-10 07:47 ` Pradip Parkale <[email protected]>
2020-03-10 07:53 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Akshay Joshi <[email protected]>
0 siblings, 1 reply; 5+ messages in thread
From: Pradip Parkale @ 2020-03-10 07:47 UTC (permalink / raw)
To: Akshay Joshi <[email protected]>; +Cc: pgadmin-hackers
Hi Akshay,
I have already added the code to change the time. To select the time
picker, the user needs to press 'Alt+T' (Option+T for mac) and then
Up/Down arrows to change the minutes and Alt + Up/Down to change the hours.
On Mon, Mar 9, 2020 at 11:09 AM Akshay Joshi <[email protected]>
wrote:
> Hi Pradip
>
> I have tested the patch. I am able to navigate the dates using the
> keyboard, but not able to select the year/month and time. Can you please
> work on it and send the patch again.
>
> On Sat, Mar 7, 2020 at 7:00 PM Pradip Parkale <
> [email protected]> wrote:
>
>> Hi Hackers,
>>
>> Attached is a patch to change the Datetime picker value using a keyboard.
>>
>>
>> --
>> Thanks & Regards,
>> Pradip Parkale
>> QMG, EnterpriseDB Corporation
>>
>
>
> --
> *Thanks & Regards*
> *Akshay Joshi*
>
> *Sr. Software Architect*
> *EnterpriseDB Software India Private Limited*
> *Mobile: +91 976-788-8246*
>
--
Thanks & Regards,
Pradip Parkale
QMG, EnterpriseDB Corporation
^ permalink raw reply [nested|flat] 5+ messages in thread
* Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility).
2020-03-07 13:29 [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
2020-03-09 05:39 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Akshay Joshi <[email protected]>
2020-03-10 07:47 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
@ 2020-03-10 07:53 ` Akshay Joshi <[email protected]>
2020-03-10 08:50 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Khushboo Vashi <[email protected]>
0 siblings, 1 reply; 5+ messages in thread
From: Akshay Joshi @ 2020-03-10 07:53 UTC (permalink / raw)
To: Pradip Parkale <[email protected]>; +Cc: pgadmin-hackers
Thanks, patch applied.
On Tue, Mar 10, 2020 at 1:17 PM Pradip Parkale <
[email protected]> wrote:
> Hi Akshay,
> I have already added the code to change the time. To select the time
> picker, the user needs to press 'Alt+T' (Option+T for mac) and then
> Up/Down arrows to change the minutes and Alt + Up/Down to change the hours.
>
> On Mon, Mar 9, 2020 at 11:09 AM Akshay Joshi <
> [email protected]> wrote:
>
>> Hi Pradip
>>
>> I have tested the patch. I am able to navigate the dates using the
>> keyboard, but not able to select the year/month and time. Can you please
>> work on it and send the patch again.
>>
>> On Sat, Mar 7, 2020 at 7:00 PM Pradip Parkale <
>> [email protected]> wrote:
>>
>>> Hi Hackers,
>>>
>>> Attached is a patch to change the Datetime picker value using a keyboard.
>>>
>>>
>>> --
>>> Thanks & Regards,
>>> Pradip Parkale
>>> QMG, EnterpriseDB Corporation
>>>
>>
>>
>> --
>> *Thanks & Regards*
>> *Akshay Joshi*
>>
>> *Sr. Software Architect*
>> *EnterpriseDB Software India Private Limited*
>> *Mobile: +91 976-788-8246*
>>
>
>
> --
> Thanks & Regards,
> Pradip Parkale
> QMG, EnterpriseDB Corporation
>
--
*Thanks & Regards*
*Akshay Joshi*
*Sr. Software Architect*
*EnterpriseDB Software India Private Limited*
*Mobile: +91 976-788-8246*
^ permalink raw reply [nested|flat] 5+ messages in thread
* Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility).
2020-03-07 13:29 [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
2020-03-09 05:39 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Akshay Joshi <[email protected]>
2020-03-10 07:47 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
2020-03-10 07:53 ` Re: [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Akshay Joshi <[email protected]>
@ 2020-03-10 08:50 ` Khushboo Vashi <[email protected]>
0 siblings, 0 replies; 5+ messages in thread
From: Khushboo Vashi @ 2020-03-10 08:50 UTC (permalink / raw)
To: Akshay Joshi <[email protected]>; +Cc: Pradip Parkale <[email protected]>; pgadmin-hackers
Hi Pradip,
Looks like you have repeated below code in if and else both the conditions.
let $el = this.$el.find('.datetimepicker-input');
let currdate = $el.data('datetimepicker').date().clone();
We can optimize this code by taking these both lines above if condition.
Thanks,
Khushboo
On Tue, Mar 10, 2020 at 1:24 PM Akshay Joshi <[email protected]>
wrote:
> Thanks, patch applied.
>
> On Tue, Mar 10, 2020 at 1:17 PM Pradip Parkale <
> [email protected]> wrote:
>
>> Hi Akshay,
>> I have already added the code to change the time. To select the time
>> picker, the user needs to press 'Alt+T' (Option+T for mac) and then
>> Up/Down arrows to change the minutes and Alt + Up/Down to change the hours.
>>
>> On Mon, Mar 9, 2020 at 11:09 AM Akshay Joshi <
>> [email protected]> wrote:
>>
>>> Hi Pradip
>>>
>>> I have tested the patch. I am able to navigate the dates using the
>>> keyboard, but not able to select the year/month and time. Can you please
>>> work on it and send the patch again.
>>>
>>> On Sat, Mar 7, 2020 at 7:00 PM Pradip Parkale <
>>> [email protected]> wrote:
>>>
>>>> Hi Hackers,
>>>>
>>>> Attached is a patch to change the Datetime picker value using a
>>>> keyboard.
>>>>
>>>>
>>>> --
>>>> Thanks & Regards,
>>>> Pradip Parkale
>>>> QMG, EnterpriseDB Corporation
>>>>
>>>
>>>
>>> --
>>> *Thanks & Regards*
>>> *Akshay Joshi*
>>>
>>> *Sr. Software Architect*
>>> *EnterpriseDB Software India Private Limited*
>>> *Mobile: +91 976-788-8246*
>>>
>>
>>
>> --
>> Thanks & Regards,
>> Pradip Parkale
>> QMG, EnterpriseDB Corporation
>>
>
>
> --
> *Thanks & Regards*
> *Akshay Joshi*
>
> *Sr. Software Architect*
> *EnterpriseDB Software India Private Limited*
> *Mobile: +91 976-788-8246*
>
^ permalink raw reply [nested|flat] 5+ messages in thread
end of thread, other threads:[~2020-03-10 08:50 UTC | newest]
Thread overview: 5+ messages (download: mbox mbox.gz follow: Atom feed)
-- links below jump to the message on this page --
2020-03-07 13:29 [PgAdmin][RM4237]: User can not change value of Datetime picker control using keyboard (Accessibility). Pradip Parkale <[email protected]>
2020-03-09 05:39 ` Akshay Joshi <[email protected]>
2020-03-10 07:47 ` Pradip Parkale <[email protected]>
2020-03-10 07:53 ` Akshay Joshi <[email protected]>
2020-03-10 08:50 ` Khushboo Vashi <[email protected]>
This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox