From 71eae2089e702d5c4ef6b0453850c4de1709d448 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Sun, 26 Mar 2017 10:24:33 -0400 Subject: [PATCH 01/16] Add keyboard shortcuts to main menu. 1. Show shortcuts for easy navigation. --- app/assets/javascripts/shortcuts.js | 39 +++++++++++++++++++ .../stylesheets/framework/dropdowns.scss | 27 +++++++++++++ app/views/layouts/nav/_dashboard.html.haml | 20 ++++++++-- 3 files changed, 83 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index fd5097696ad..b7d3438a83c 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -19,6 +19,45 @@ return _this.focusFilter(e); }; })(this)); + function gotoMenu(menu){ + if($('.global-dropdown.open').length) { + window.location.href = $('.global-dropdown-menu .dashboard-shortcuts-'+menu).attr('href'); + } + } + + Mousetrap.bind('m', function() { + $('.global-dropdown-menu').addClass('shortcuts') + $('.global-dropdown-toggle').trigger('click'); + }); + + Mousetrap.bind('P', function() { + gotoMenu('projects'); + }); + + Mousetrap.bind('A', function() { + gotoMenu('activity'); + }); + + Mousetrap.bind('G', function() { + gotoMenu('groups'); + }); + + Mousetrap.bind('L', function() { + gotoMenu('milestones'); + }); + + Mousetrap.bind('I', function() { + gotoMenu('issues'); + }); + + Mousetrap.bind('M', function() { + gotoMenu('merge_requests'); + }); + + Mousetrap.bind('S', function() { + gotoMenu('snippets'); + }); + Mousetrap.bind(['ctrl+shift+p', 'command+shift+p'], this.toggleMarkdownPreview); if (typeof findFileURL !== "undefined" && findFileURL !== null) { Mousetrap.bind('t', function() { diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss index 23cba57f83a..95494ff8569 100644 --- a/app/assets/stylesheets/framework/dropdowns.scss +++ b/app/assets/stylesheets/framework/dropdowns.scss @@ -187,6 +187,33 @@ } } + .kbd { + display: none; + } + + &.shortcuts span{ + display: inline-block; + width: 140px; + } + + &.shortcuts .kbd { + display: inline-block; + padding: 3px 5px; + font-size: 11px; + line-height: 10px; + color: #555; + vertical-align: middle; + background-color: #fcfcfc; + border-width: 1px; + border-style: solid; + border-color: #ccc #ccc #bbb; + border-image: none; + border-radius: 3px; + box-shadow: 0 -1px 0 #bbb inset; + width: 21px; + text-align: center; + } + ul { margin: 0; padding: 0; diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml index 15285ee32a3..92231b03896 100644 --- a/app/views/layouts/nav/_dashboard.html.haml +++ b/app/views/layouts/nav/_dashboard.html.haml @@ -3,37 +3,51 @@ = link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do %span Projects + .kbd + P = nav_link(path: 'dashboard#activity') do = link_to activity_dashboard_path, class: 'dashboard-shortcuts-activity', title: 'Activity' do %span Activity + .kbd + A - if koding_enabled? = nav_link(controller: :koding) do = link_to koding_path, title: 'Koding' do %span Koding = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do - = link_to dashboard_groups_path, title: 'Groups' do + = link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do %span Groups + .kbd + G = nav_link(controller: 'dashboard/milestones') do - = link_to dashboard_milestones_path, title: 'Milestones' do + = link_to dashboard_milestones_path, class: 'dashboard-shortcuts-milestones', title: 'Milestones' do %span Milestones + .kbd + L = nav_link(path: 'dashboard#issues') do = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues' do %span Issues .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :issues, :opened)) + .kbd + I = nav_link(path: 'dashboard#merge_requests') do = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'dashboard-shortcuts-merge_requests' do %span Merge Requests .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :merge_requests, :opened)) + .kbd + M = nav_link(controller: 'dashboard/snippets') do - = link_to dashboard_snippets_path, title: 'Snippets' do + = link_to dashboard_snippets_path, class: 'dashboard-shortcuts-snippets', title: 'Snippets' do %span Snippets + .kbd + S %li.divider %li = link_to "Help", help_path, title: 'About GitLab CE', class: 'about-gitlab' From fac13e6175ca40d4bea790e49556be1561f5a995 Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Sun, 26 Mar 2017 10:39:43 -0400 Subject: [PATCH 02/16] Add changelog --- app/views/help/_shortcuts.html.haml | 4 ++++ changelogs/unreleased/menu-shortcut.yml | 4 ++++ 2 files changed, 8 insertions(+) create mode 100644 changelogs/unreleased/menu-shortcut.yml diff --git a/app/views/help/_shortcuts.html.haml b/app/views/help/_shortcuts.html.haml index 8e6da3fad90..5f101af7ab6 100644 --- a/app/views/help/_shortcuts.html.haml +++ b/app/views/help/_shortcuts.html.haml @@ -15,6 +15,10 @@ %tr %th %th Global Shortcuts + %tr + %td.shortcut + .key m + %td Main Menu %tr %td.shortcut .key s diff --git a/changelogs/unreleased/menu-shortcut.yml b/changelogs/unreleased/menu-shortcut.yml new file mode 100644 index 00000000000..51fdabb9ade --- /dev/null +++ b/changelogs/unreleased/menu-shortcut.yml @@ -0,0 +1,4 @@ +--- +title: Add keyboard shortcuts to main menu +merge_request: +author: Jacob Schatz From cba47179d51f60cd5fae641ab53fe220ab729b2b Mon Sep 17 00:00:00 2001 From: Jacob Schatz Date: Sun, 26 Mar 2017 16:39:01 -0400 Subject: [PATCH 03/16] Change shortcut to `n`. --- app/assets/javascripts/shortcuts.js | 2 +- app/views/help/_shortcuts.html.haml | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index b7d3438a83c..ef32cc39c1f 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -25,7 +25,7 @@ } } - Mousetrap.bind('m', function() { + Mousetrap.bind('n', function() { $('.global-dropdown-menu').addClass('shortcuts') $('.global-dropdown-toggle').trigger('click'); }); diff --git a/app/views/help/_shortcuts.html.haml b/app/views/help/_shortcuts.html.haml index 5f101af7ab6..127db1d26e7 100644 --- a/app/views/help/_shortcuts.html.haml +++ b/app/views/help/_shortcuts.html.haml @@ -17,8 +17,8 @@ %th Global Shortcuts %tr %td.shortcut - .key m - %td Main Menu + .key n + %td Main Navigation %tr %td.shortcut .key s From 82ababf0a9504854ee3bb7f2b65e8711f46eb1e7 Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Wed, 29 Mar 2017 13:06:10 -0500 Subject: [PATCH 04/16] Fix layout of shortcut keys in dropdown --- .../stylesheets/framework/dropdowns.scss | 23 ++++++--------- app/views/layouts/nav/_dashboard.html.haml | 28 +++++++++---------- 2 files changed, 22 insertions(+), 29 deletions(-) diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss index 95494ff8569..06b6a9da4fa 100644 --- a/app/assets/stylesheets/framework/dropdowns.scss +++ b/app/assets/stylesheets/framework/dropdowns.scss @@ -191,26 +191,19 @@ display: none; } - &.shortcuts span{ - display: inline-block; - width: 140px; - } - &.shortcuts .kbd { + background-color: $gray-light; + color: $gl-text-color; + border: 1px solid $gray-darkest; + box-shadow: 0 -1px 0 $gray-darkest inset; display: inline-block; - padding: 3px 5px; + vertical-align: top; + padding: 3px 0; + margin-right: 5px; font-size: 11px; line-height: 10px; - color: #555; - vertical-align: middle; - background-color: #fcfcfc; - border-width: 1px; - border-style: solid; - border-color: #ccc #ccc #bbb; - border-image: none; border-radius: 3px; - box-shadow: 0 -1px 0 #bbb inset; - width: 21px; + width: 20px; text-align: center; } diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml index 92231b03896..cc2d70aa55b 100644 --- a/app/views/layouts/nav/_dashboard.html.haml +++ b/app/views/layouts/nav/_dashboard.html.haml @@ -1,16 +1,16 @@ %ul = nav_link(path: ['root#index', 'projects#trending', 'projects#starred', 'dashboard/projects#index'], html_options: {class: "#{project_tab_class} home"}) do = link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do - %span - Projects .kbd P + %span + Projects = nav_link(path: 'dashboard#activity') do = link_to activity_dashboard_path, class: 'dashboard-shortcuts-activity', title: 'Activity' do - %span - Activity .kbd A + %span + Activity - if koding_enabled? = nav_link(controller: :koding) do = link_to koding_path, title: 'Koding' do @@ -18,36 +18,36 @@ Koding = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do = link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do - %span - Groups .kbd G + %span + Groups = nav_link(controller: 'dashboard/milestones') do = link_to dashboard_milestones_path, class: 'dashboard-shortcuts-milestones', title: 'Milestones' do - %span - Milestones .kbd L + %span + Milestones = nav_link(path: 'dashboard#issues') do = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues' do + .kbd + I %span Issues .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :issues, :opened)) - .kbd - I = nav_link(path: 'dashboard#merge_requests') do = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'dashboard-shortcuts-merge_requests' do + .kbd + M %span Merge Requests .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :merge_requests, :opened)) - .kbd - M = nav_link(controller: 'dashboard/snippets') do = link_to dashboard_snippets_path, class: 'dashboard-shortcuts-snippets', title: 'Snippets' do - %span - Snippets .kbd S + %span + Snippets %li.divider %li = link_to "Help", help_path, title: 'About GitLab CE', class: 'about-gitlab' From 610ea22ea770821fac04f3d757f98091a85512c7 Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Wed, 29 Mar 2017 13:58:18 -0500 Subject: [PATCH 05/16] Map bindings to lowercase letters; only show key bindings when using keyboard shortcut --- app/assets/javascripts/shortcuts.js | 70 ++++++++++++---------- app/views/layouts/nav/_dashboard.html.haml | 28 ++++----- 2 files changed, 52 insertions(+), 46 deletions(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index ef32cc39c1f..24b6ad02b25 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -19,45 +19,51 @@ return _this.focusFilter(e); }; })(this)); + function gotoMenu(menu){ - if($('.global-dropdown.open').length) { - window.location.href = $('.global-dropdown-menu .dashboard-shortcuts-'+menu).attr('href'); - } + window.location.href = $('.js-dashboard-shortcuts-'+menu).attr('href'); } + $('.global-dropdown').on('hide.bs.dropdown', function() { + $('.global-dropdown-menu').removeClass('shortcuts'); + Mousetrap.unbind(['p', 'a', 'r', 'l', 'i', 'm', 'e']); + }); + + $('.global-dropdown').on('show.bs.dropdown', function() { + Mousetrap.bind('p', function() { + gotoMenu('projects'); + }); + + Mousetrap.bind('a', function() { + gotoMenu('activity'); + }); + + Mousetrap.bind('r', function() { + gotoMenu('groups'); + }); + + Mousetrap.bind('l', function() { + gotoMenu('milestones'); + }); + + Mousetrap.bind('i', function() { + gotoMenu('issues'); + }); + + Mousetrap.bind('m', function() { + gotoMenu('merge_requests'); + }); + + Mousetrap.bind('e', function() { + gotoMenu('snippets'); + }); + }); + Mousetrap.bind('n', function() { - $('.global-dropdown-menu').addClass('shortcuts') + $('.global-dropdown-menu').addClass('shortcuts'); $('.global-dropdown-toggle').trigger('click'); }); - Mousetrap.bind('P', function() { - gotoMenu('projects'); - }); - - Mousetrap.bind('A', function() { - gotoMenu('activity'); - }); - - Mousetrap.bind('G', function() { - gotoMenu('groups'); - }); - - Mousetrap.bind('L', function() { - gotoMenu('milestones'); - }); - - Mousetrap.bind('I', function() { - gotoMenu('issues'); - }); - - Mousetrap.bind('M', function() { - gotoMenu('merge_requests'); - }); - - Mousetrap.bind('S', function() { - gotoMenu('snippets'); - }); - Mousetrap.bind(['ctrl+shift+p', 'command+shift+p'], this.toggleMarkdownPreview); if (typeof findFileURL !== "undefined" && findFileURL !== null) { Mousetrap.bind('t', function() { diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml index cc2d70aa55b..6cfbbec8c46 100644 --- a/app/views/layouts/nav/_dashboard.html.haml +++ b/app/views/layouts/nav/_dashboard.html.haml @@ -1,14 +1,14 @@ %ul = nav_link(path: ['root#index', 'projects#trending', 'projects#starred', 'dashboard/projects#index'], html_options: {class: "#{project_tab_class} home"}) do - = link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do + = link_to dashboard_projects_path, title: 'Projects', class: 'js-dashboard-shortcuts-projects' do .kbd - P + p %span Projects = nav_link(path: 'dashboard#activity') do - = link_to activity_dashboard_path, class: 'dashboard-shortcuts-activity', title: 'Activity' do + = link_to activity_dashboard_path, class: 'js-dashboard-shortcuts-activity', title: 'Activity' do .kbd - A + a %span Activity - if koding_enabled? @@ -17,35 +17,35 @@ %span Koding = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do - = link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do + = link_to dashboard_groups_path, class: 'js-dashboard-shortcuts-groups', title: 'Groups' do .kbd - G + r %span Groups = nav_link(controller: 'dashboard/milestones') do - = link_to dashboard_milestones_path, class: 'dashboard-shortcuts-milestones', title: 'Milestones' do + = link_to dashboard_milestones_path, class: 'js-dashboard-shortcuts-milestones', title: 'Milestones' do .kbd - L + l %span Milestones = nav_link(path: 'dashboard#issues') do - = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues' do + = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'js-dashboard-shortcuts-issues' do .kbd - I + i %span Issues .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :issues, :opened)) = nav_link(path: 'dashboard#merge_requests') do - = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'dashboard-shortcuts-merge_requests' do + = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'js-dashboard-shortcuts-merge_requests' do .kbd - M + m %span Merge Requests .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :merge_requests, :opened)) = nav_link(controller: 'dashboard/snippets') do - = link_to dashboard_snippets_path, class: 'dashboard-shortcuts-snippets', title: 'Snippets' do + = link_to dashboard_snippets_path, class: 'js-dashboard-shortcuts-snippets', title: 'Snippets' do .kbd - S + e %span Snippets %li.divider From e220eecb57ced25b12fcdad10fcaf0ec5f86cce1 Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Thu, 30 Mar 2017 10:14:56 -0500 Subject: [PATCH 06/16] Switch global shortcuts to shift; reuse key styles from help menu --- app/assets/javascripts/shortcuts.js | 61 ++++++++----------- .../shortcuts_dashboard_navigation.js | 15 ----- .../javascripts/shortcuts_navigation.js | 2 +- .../stylesheets/framework/dropdowns.scss | 15 +---- app/views/help/_shortcuts.html.haml | 39 +++++++----- app/views/layouts/nav/_dashboard.html.haml | 42 ++++++------- changelogs/unreleased/menu-shortcut.yml | 2 +- 7 files changed, 75 insertions(+), 101 deletions(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index 24b6ad02b25..4a09cdfe99f 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -20,50 +20,39 @@ }; })(this)); - function gotoMenu(menu){ - window.location.href = $('.js-dashboard-shortcuts-'+menu).attr('href'); - } + const globalDropdownMenu = $('.global-dropdown-menu'); $('.global-dropdown').on('hide.bs.dropdown', function() { - $('.global-dropdown-menu').removeClass('shortcuts'); - Mousetrap.unbind(['p', 'a', 'r', 'l', 'i', 'm', 'e']); - }); - - $('.global-dropdown').on('show.bs.dropdown', function() { - Mousetrap.bind('p', function() { - gotoMenu('projects'); - }); - - Mousetrap.bind('a', function() { - gotoMenu('activity'); - }); - - Mousetrap.bind('r', function() { - gotoMenu('groups'); - }); - - Mousetrap.bind('l', function() { - gotoMenu('milestones'); - }); - - Mousetrap.bind('i', function() { - gotoMenu('issues'); - }); - - Mousetrap.bind('m', function() { - gotoMenu('merge_requests'); - }); - - Mousetrap.bind('e', function() { - gotoMenu('snippets'); - }); + globalDropdownMenu.removeClass('shortcuts'); }); Mousetrap.bind('n', function() { - $('.global-dropdown-menu').addClass('shortcuts'); + globalDropdownMenu.addClass('shortcuts'); $('.global-dropdown-toggle').trigger('click'); }); + Mousetrap.bind('shift+a', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-activity'); + }); + Mousetrap.bind('shift+i', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-issues'); + }); + Mousetrap.bind('shift+m', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-merge_requests'); + }); + Mousetrap.bind('shift+p', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-projects'); + }); + Mousetrap.bind('shift+g', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-groups'); + }); + Mousetrap.bind('shift+l', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-milestones'); + }); + Mousetrap.bind('shift+s', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-snippets'); + }); + Mousetrap.bind(['ctrl+shift+p', 'command+shift+p'], this.toggleMarkdownPreview); if (typeof findFileURL !== "undefined" && findFileURL !== null) { Mousetrap.bind('t', function() { diff --git a/app/assets/javascripts/shortcuts_dashboard_navigation.js b/app/assets/javascripts/shortcuts_dashboard_navigation.js index 4f1a19924a4..0d8d251e93e 100644 --- a/app/assets/javascripts/shortcuts_dashboard_navigation.js +++ b/app/assets/javascripts/shortcuts_dashboard_navigation.js @@ -13,21 +13,6 @@ require('./shortcuts'); function ShortcutsDashboardNavigation() { ShortcutsDashboardNavigation.__super__.constructor.call(this); - Mousetrap.bind('g a', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-activity'); - }); - Mousetrap.bind('g i', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-issues'); - }); - Mousetrap.bind('g m', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-merge_requests'); - }); - Mousetrap.bind('g t', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.shortcuts-todos'); - }); - Mousetrap.bind('g p', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-projects'); - }); } ShortcutsDashboardNavigation.findAndFollowLink = function(selector) { diff --git a/app/assets/javascripts/shortcuts_navigation.js b/app/assets/javascripts/shortcuts_navigation.js index 3f5d6724417..5128223b373 100644 --- a/app/assets/javascripts/shortcuts_navigation.js +++ b/app/assets/javascripts/shortcuts_navigation.js @@ -31,7 +31,7 @@ require('./shortcuts'); Mousetrap.bind('g n', function() { return ShortcutsNavigation.findAndFollowLink('.shortcuts-network'); }); - Mousetrap.bind('g g', function() { + Mousetrap.bind('g d', function() { return ShortcutsNavigation.findAndFollowLink('.shortcuts-repository-charts'); }); Mousetrap.bind('g i', function() { diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss index 06b6a9da4fa..7767826b033 100644 --- a/app/assets/stylesheets/framework/dropdowns.scss +++ b/app/assets/stylesheets/framework/dropdowns.scss @@ -187,24 +187,13 @@ } } - .kbd { + .shortcut-mappings { display: none; } - &.shortcuts .kbd { - background-color: $gray-light; - color: $gl-text-color; - border: 1px solid $gray-darkest; - box-shadow: 0 -1px 0 $gray-darkest inset; + &.shortcuts .shortcut-mappings { display: inline-block; - vertical-align: top; - padding: 3px 0; margin-right: 5px; - font-size: 11px; - line-height: 10px; - border-radius: 3px; - width: 20px; - text-align: center; } ul { diff --git a/app/views/help/_shortcuts.html.haml b/app/views/help/_shortcuts.html.haml index 127db1d26e7..a20d3e3a235 100644 --- a/app/views/help/_shortcuts.html.haml +++ b/app/views/help/_shortcuts.html.haml @@ -100,34 +100,39 @@ %th Global Dashboard %tr %td.shortcut - .key g - .key a + .key shift a %td Go to the activity feed %tr %td.shortcut - .key g - .key p + .key shift p %td Go to projects %tr %td.shortcut - .key g - .key i + .key shift i %td Go to issues %tr %td.shortcut - .key g - .key m + .key shift m %td Go to merge requests %tr %td.shortcut - .key g - .key t + .key shift g %td - Go to todos + Go to groups + %tr + %td.shortcut + .key shift l + %td + Go to milestones + %tr + %td.shortcut + .key shift s + %td + Go to snippets %tbody %tr %th @@ -159,7 +164,7 @@ %tr %td.shortcut .key g - .key b + .key j %td Go to jobs %tr @@ -171,7 +176,7 @@ %tr %td.shortcut .key g - .key g + .key d %td Go to repository charts %tr @@ -183,7 +188,7 @@ %tr %td.shortcut .key g - .key l + .key b %td Go to issue boards %tr @@ -198,6 +203,12 @@ .key s %td Go to snippets + %tr + %td.shortcut + .key g + .key w + %td + Go to wiki %tr %td.shortcut .key t diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml index 6cfbbec8c46..39daefa11fd 100644 --- a/app/views/layouts/nav/_dashboard.html.haml +++ b/app/views/layouts/nav/_dashboard.html.haml @@ -1,14 +1,14 @@ %ul = nav_link(path: ['root#index', 'projects#trending', 'projects#starred', 'dashboard/projects#index'], html_options: {class: "#{project_tab_class} home"}) do - = link_to dashboard_projects_path, title: 'Projects', class: 'js-dashboard-shortcuts-projects' do - .kbd - p + = link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do + .shortcut-mappings + .key shift p %span Projects = nav_link(path: 'dashboard#activity') do - = link_to activity_dashboard_path, class: 'js-dashboard-shortcuts-activity', title: 'Activity' do - .kbd - a + = link_to activity_dashboard_path, class: 'dashboard-shortcuts-activity', title: 'Activity' do + .shortcut-mappings + .key shift a %span Activity - if koding_enabled? @@ -17,35 +17,35 @@ %span Koding = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do - = link_to dashboard_groups_path, class: 'js-dashboard-shortcuts-groups', title: 'Groups' do - .kbd - r + = link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do + .shortcut-mappings + .key shift l %span Groups = nav_link(controller: 'dashboard/milestones') do - = link_to dashboard_milestones_path, class: 'js-dashboard-shortcuts-milestones', title: 'Milestones' do - .kbd - l + = link_to dashboard_milestones_path, class: 'dashboard-shortcuts-milestones', title: 'Milestones' do + .shortcut-mappings + .key shift w %span Milestones = nav_link(path: 'dashboard#issues') do - = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'js-dashboard-shortcuts-issues' do - .kbd - i + = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues' do + .shortcut-mappings + .key shift i %span Issues .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :issues, :opened)) = nav_link(path: 'dashboard#merge_requests') do - = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'js-dashboard-shortcuts-merge_requests' do - .kbd - m + = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'dashboard-shortcuts-merge_requests' do + .shortcut-mappings + .key shift m %span Merge Requests .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :merge_requests, :opened)) = nav_link(controller: 'dashboard/snippets') do - = link_to dashboard_snippets_path, class: 'js-dashboard-shortcuts-snippets', title: 'Snippets' do - .kbd - e + = link_to dashboard_snippets_path, class: 'dashboard-shortcuts-snippets', title: 'Snippets' do + .shortcut-mappings + .key shift s %span Snippets %li.divider diff --git a/changelogs/unreleased/menu-shortcut.yml b/changelogs/unreleased/menu-shortcut.yml index 51fdabb9ade..74803498f58 100644 --- a/changelogs/unreleased/menu-shortcut.yml +++ b/changelogs/unreleased/menu-shortcut.yml @@ -1,4 +1,4 @@ --- title: Add keyboard shortcuts to main menu merge_request: -author: Jacob Schatz +author: From b19538d197aebf5445fa56c5b016e0c6c973b51d Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Thu, 30 Mar 2017 10:36:13 -0500 Subject: [PATCH 07/16] Change shortcuts --- app/assets/javascripts/shortcuts_navigation.js | 4 ++-- app/views/layouts/nav/_dashboard.html.haml | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/shortcuts_navigation.js b/app/assets/javascripts/shortcuts_navigation.js index 5128223b373..ba76664eed6 100644 --- a/app/assets/javascripts/shortcuts_navigation.js +++ b/app/assets/javascripts/shortcuts_navigation.js @@ -25,7 +25,7 @@ require('./shortcuts'); Mousetrap.bind('g c', function() { return ShortcutsNavigation.findAndFollowLink('.shortcuts-commits'); }); - Mousetrap.bind('g b', function() { + Mousetrap.bind('g j', function() { return ShortcutsNavigation.findAndFollowLink('.shortcuts-builds'); }); Mousetrap.bind('g n', function() { @@ -37,7 +37,7 @@ require('./shortcuts'); Mousetrap.bind('g i', function() { return ShortcutsNavigation.findAndFollowLink('.shortcuts-issues'); }); - Mousetrap.bind('g l', function() { + Mousetrap.bind('g b', function() { ShortcutsNavigation.findAndFollowLink('.shortcuts-issue-boards'); }); Mousetrap.bind('g m', function() { diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml index 39daefa11fd..2f8d722c58a 100644 --- a/app/views/layouts/nav/_dashboard.html.haml +++ b/app/views/layouts/nav/_dashboard.html.haml @@ -19,13 +19,13 @@ = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do = link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do .shortcut-mappings - .key shift l + .key shift g %span Groups = nav_link(controller: 'dashboard/milestones') do = link_to dashboard_milestones_path, class: 'dashboard-shortcuts-milestones', title: 'Milestones' do .shortcut-mappings - .key shift w + .key shift l %span Milestones = nav_link(path: 'dashboard#issues') do From 86f3ae0c914c2ce807b7c47629967a4c2bcb925f Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Thu, 30 Mar 2017 10:46:27 -0500 Subject: [PATCH 08/16] Change todos shortcut to shift --- app/assets/javascripts/shortcuts.js | 3 +++ app/views/help/_shortcuts.html.haml | 7 ++++++- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index 4a09cdfe99f..ac895bcee47 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -31,6 +31,9 @@ $('.global-dropdown-toggle').trigger('click'); }); + Mousetrap.bind('shift+t', function() { + return ShortcutsDashboardNavigation.findAndFollowLink('.shortcuts-todos'); + }); Mousetrap.bind('shift+a', function() { return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-activity'); }); diff --git a/app/views/help/_shortcuts.html.haml b/app/views/help/_shortcuts.html.haml index a20d3e3a235..0281fb5a98b 100644 --- a/app/views/help/_shortcuts.html.haml +++ b/app/views/help/_shortcuts.html.haml @@ -97,7 +97,12 @@ %tbody.hidden-shortcut.project{ style: 'display:none' } %tr %th - %th Global Dashboard + %th Global Shortcuts + %tr + %td.shortcut + .key shift t + %td + Go to todos %tr %td.shortcut .key shift a From 04b69fac3bd7f0c6ab252f2def6eaadbccdd0501 Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Thu, 30 Mar 2017 10:53:47 -0500 Subject: [PATCH 09/16] Reorganize shortcut help menu --- app/views/help/_shortcuts.html.haml | 106 +++++++++++++--------------- 1 file changed, 51 insertions(+), 55 deletions(-) diff --git a/app/views/help/_shortcuts.html.haml b/app/views/help/_shortcuts.html.haml index 0281fb5a98b..700c5e61a14 100644 --- a/app/views/help/_shortcuts.html.haml +++ b/app/views/help/_shortcuts.html.haml @@ -43,61 +43,6 @@ .key %i.fa.fa-arrow-up %td Edit last comment (when focused on an empty textarea) - %tbody - %tr - %th - %th Project Files browsing - %tr - %td.shortcut - .key - %i.fa.fa-arrow-up - %td Move selection up - %tr - %td.shortcut - .key - %i.fa.fa-arrow-down - %td Move selection down - %tr - %td.shortcut - .key enter - %td Open Selection - %tbody - %tr - %th - %th Finding Project File - %tr - %td.shortcut - .key - %i.fa.fa-arrow-up - %td Move selection up - %tr - %td.shortcut - .key - %i.fa.fa-arrow-down - %td Move selection down - %tr - %td.shortcut - .key enter - %td Open Selection - %tr - %td.shortcut - .key esc - %td Go back - %tbody - %tr - %th - %th Project File - %tr - %td.shortcut - .key y - %td Go to file permalink - - .col-lg-4 - %table.shortcut-mappings - %tbody.hidden-shortcut.project{ style: 'display:none' } - %tr - %th - %th Global Shortcuts %tr %td.shortcut .key shift t @@ -138,6 +83,30 @@ .key shift s %td Go to snippets + %tbody + %tr + %th + %th Finding Project File + %tr + %td.shortcut + .key + %i.fa.fa-arrow-up + %td Move selection up + %tr + %td.shortcut + .key + %i.fa.fa-arrow-down + %td Move selection down + %tr + %td.shortcut + .key enter + %td Open Selection + %tr + %td.shortcut + .key esc + %td Go back + .col-lg-4 + %table.shortcut-mappings %tbody %tr %th @@ -222,6 +191,33 @@ %td.shortcut .key i %td New issue + + %tbody + %tr + %th + %th Project Files browsing + %tr + %td.shortcut + .key + %i.fa.fa-arrow-up + %td Move selection up + %tr + %td.shortcut + .key + %i.fa.fa-arrow-down + %td Move selection down + %tr + %td.shortcut + .key enter + %td Open Selection + %tbody + %tr + %th + %th Project File + %tr + %td.shortcut + .key y + %td Go to file permalink .col-lg-4 %table.shortcut-mappings %tbody.hidden-shortcut.network{ style: 'display:none' } From cde0b27c0bef41bd610deb21e1ff441bb8aa0ea8 Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Thu, 30 Mar 2017 11:37:37 -0500 Subject: [PATCH 10/16] Fix shortcut specs --- features/project/shortcuts.feature | 2 +- spec/features/boards/keyboard_shortcut_spec.rb | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/features/project/shortcuts.feature b/features/project/shortcuts.feature index b47fca31ef2..cbbea237825 100644 --- a/features/project/shortcuts.feature +++ b/features/project/shortcuts.feature @@ -26,7 +26,7 @@ Feature: Project Shortcuts @javascript Scenario: Navigate to repository charts tab - Given I press "g" and "g" + Given I press "g" and "d" Then the active sub tab should be Charts And the active main tab should be Repository diff --git a/spec/features/boards/keyboard_shortcut_spec.rb b/spec/features/boards/keyboard_shortcut_spec.rb index a5fc766401f..a9cc6c49f8e 100644 --- a/spec/features/boards/keyboard_shortcut_spec.rb +++ b/spec/features/boards/keyboard_shortcut_spec.rb @@ -14,7 +14,7 @@ describe 'Issue Boards shortcut', feature: true, js: true do end it 'takes user to issue board index' do - find('body').native.send_keys('gl') + find('body').native.send_keys('gb') expect(page).to have_selector('.boards-list') wait_for_vue_resource From d9ed9c6d0d9712154877d8f2b336562c502a939d Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Thu, 30 Mar 2017 18:10:34 +0100 Subject: [PATCH 11/16] Adds ShortcutsDashboardNavigation to globals comment since its a global variable --- app/assets/javascripts/shortcuts.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index ac895bcee47..dcabeedd0cf 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -1,5 +1,5 @@ /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, quotes, prefer-arrow-callback, consistent-return, object-shorthand, no-unused-vars, one-var, one-var-declaration-per-line, no-else-return, comma-dangle, max-len */ -/* global Mousetrap */ +/* global Mousetrap, ShortcutsDashboardNavigation */ /* global findFileURL */ (function() { From e9025c25e4a7e7ebbb2e7097c14470bdadb64982 Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Thu, 30 Mar 2017 18:31:59 +0100 Subject: [PATCH 12/16] Improve shortcuts code --- app/assets/javascripts/dispatcher.js | 2 - app/assets/javascripts/shortcuts.js | 49 ++++++------------- .../shortcuts_dashboard_navigation.js | 38 +++++--------- 3 files changed, 26 insertions(+), 63 deletions(-) diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js index 307c6a306d1..0a1a62fb012 100644 --- a/app/assets/javascripts/dispatcher.js +++ b/app/assets/javascripts/dispatcher.js @@ -24,7 +24,6 @@ /* global Search */ /* global Admin */ /* global NamespaceSelects */ -/* global ShortcutsDashboardNavigation */ /* global Project */ /* global ProjectAvatar */ /* global CompareAutocomplete */ @@ -378,7 +377,6 @@ const ShortcutsBlob = require('./shortcuts_blob'); break; case 'dashboard': case 'root': - shortcut_handler = new ShortcutsDashboardNavigation(); new UserCallout(); break; case 'groups': diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index dcabeedd0cf..d9b20d2694b 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -1,6 +1,7 @@ /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, quotes, prefer-arrow-callback, consistent-return, object-shorthand, no-unused-vars, one-var, one-var-declaration-per-line, no-else-return, comma-dangle, max-len */ -/* global Mousetrap, ShortcutsDashboardNavigation */ +/* global Mousetrap */ /* global findFileURL */ +import findAndFollowLink from './shortcuts_dashboard_navigation'; (function() { var bind = function(fn, me) { return function() { return fn.apply(me, arguments); }; }; @@ -14,47 +15,27 @@ } Mousetrap.bind('?', this.onToggleHelp); Mousetrap.bind('s', Shortcuts.focusSearch); - Mousetrap.bind('f', (function(_this) { - return function(e) { - return _this.focusFilter(e); - }; - })(this)); + Mousetrap.bind('f', (e => this.focusFilter(e))); const globalDropdownMenu = $('.global-dropdown-menu'); - $('.global-dropdown').on('hide.bs.dropdown', function() { - globalDropdownMenu.removeClass('shortcuts'); + $('.global-dropdown').on('hide.bs.dropdown', () => { + globalDropdownMenu.toggleClass('shortcuts'); }); - Mousetrap.bind('n', function() { - globalDropdownMenu.addClass('shortcuts'); + Mousetrap.bind('n', () => { + globalDropdownMenu.toggleClass('shortcuts'); $('.global-dropdown-toggle').trigger('click'); }); - Mousetrap.bind('shift+t', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.shortcuts-todos'); - }); - Mousetrap.bind('shift+a', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-activity'); - }); - Mousetrap.bind('shift+i', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-issues'); - }); - Mousetrap.bind('shift+m', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-merge_requests'); - }); - Mousetrap.bind('shift+p', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-projects'); - }); - Mousetrap.bind('shift+g', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-groups'); - }); - Mousetrap.bind('shift+l', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-milestones'); - }); - Mousetrap.bind('shift+s', function() { - return ShortcutsDashboardNavigation.findAndFollowLink('.dashboard-shortcuts-snippets'); - }); + Mousetrap.bind('shift+t', () => findAndFollowLink('.shortcuts-todos')); + Mousetrap.bind('shift+a', () => findAndFollowLink('.dashboard-shortcuts-activity')); + Mousetrap.bind('shift+i', () => findAndFollowLink('.dashboard-shortcuts-issues')); + Mousetrap.bind('shift+m', () => findAndFollowLink('.dashboard-shortcuts-merge_requests')); + Mousetrap.bind('shift+p', () => findAndFollowLink('.dashboard-shortcuts-projects')); + Mousetrap.bind('shift+g', () => findAndFollowLink('.dashboard-shortcuts-groups')); + Mousetrap.bind('shift+l', () => findAndFollowLink('.dashboard-shortcuts-milestones')); + Mousetrap.bind('shift+s', () => findAndFollowLink('.dashboard-shortcuts-snippets')); Mousetrap.bind(['ctrl+shift+p', 'command+shift+p'], this.toggleMarkdownPreview); if (typeof findFileURL !== "undefined" && findFileURL !== null) { diff --git a/app/assets/javascripts/shortcuts_dashboard_navigation.js b/app/assets/javascripts/shortcuts_dashboard_navigation.js index 0d8d251e93e..25f39e4fdb6 100644 --- a/app/assets/javascripts/shortcuts_dashboard_navigation.js +++ b/app/assets/javascripts/shortcuts_dashboard_navigation.js @@ -1,28 +1,12 @@ -/* eslint-disable func-names, space-before-function-paren, max-len, one-var, no-var, no-restricted-syntax, vars-on-top, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, wrap-iife, prefer-arrow-callback, consistent-return, no-return-assign */ -/* global Mousetrap */ -/* global Shortcuts */ +/** + * Helper function that finds the href of the fiven selector and updates the location. + * + * @param {String} selector + */ +export default (selector) => { + const link = document.querySelector(selector).getAttribute('href'); -require('./shortcuts'); - -(function() { - var extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }, - hasProp = {}.hasOwnProperty; - - this.ShortcutsDashboardNavigation = (function(superClass) { - extend(ShortcutsDashboardNavigation, superClass); - - function ShortcutsDashboardNavigation() { - ShortcutsDashboardNavigation.__super__.constructor.call(this); - } - - ShortcutsDashboardNavigation.findAndFollowLink = function(selector) { - var link; - link = $(selector).attr('href'); - if (link) { - return window.location = link; - } - }; - - return ShortcutsDashboardNavigation; - })(Shortcuts); -}).call(window); + if (link) { + window.location = link; + } +}; From d7351cff5ab4a48a1a967188946eec96d7ac82d7 Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Thu, 30 Mar 2017 18:43:11 +0100 Subject: [PATCH 13/16] Reuse code --- .../javascripts/shortcuts_navigation.js | 65 +++++-------------- 1 file changed, 15 insertions(+), 50 deletions(-) diff --git a/app/assets/javascripts/shortcuts_navigation.js b/app/assets/javascripts/shortcuts_navigation.js index ba76664eed6..c74ab0afd0c 100644 --- a/app/assets/javascripts/shortcuts_navigation.js +++ b/app/assets/javascripts/shortcuts_navigation.js @@ -1,6 +1,7 @@ /* eslint-disable func-names, space-before-function-paren, max-len, no-var, one-var, no-restricted-syntax, vars-on-top, no-use-before-define, no-param-reassign, new-cap, no-underscore-dangle, wrap-iife, prefer-arrow-callback, consistent-return, no-return-assign */ /* global Mousetrap */ /* global Shortcuts */ +import findAndFollowLink from './shortcuts_dashboard_navigation'; require('./shortcuts'); @@ -13,59 +14,23 @@ require('./shortcuts'); function ShortcutsNavigation() { ShortcutsNavigation.__super__.constructor.call(this); - Mousetrap.bind('g p', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-project'); - }); - Mousetrap.bind('g e', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-project-activity'); - }); - Mousetrap.bind('g f', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-tree'); - }); - Mousetrap.bind('g c', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-commits'); - }); - Mousetrap.bind('g j', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-builds'); - }); - Mousetrap.bind('g n', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-network'); - }); - Mousetrap.bind('g d', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-repository-charts'); - }); - Mousetrap.bind('g i', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-issues'); - }); - Mousetrap.bind('g b', function() { - ShortcutsNavigation.findAndFollowLink('.shortcuts-issue-boards'); - }); - Mousetrap.bind('g m', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-merge_requests'); - }); - Mousetrap.bind('g t', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-todos'); - }); - Mousetrap.bind('g w', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-wiki'); - }); - Mousetrap.bind('g s', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-snippets'); - }); - Mousetrap.bind('i', function() { - return ShortcutsNavigation.findAndFollowLink('.shortcuts-new-issue'); - }); + Mousetrap.bind('g p', () => findAndFollowLink('.shortcuts-project')); + Mousetrap.bind('g e', () => findAndFollowLink('.shortcuts-project-activity')); + Mousetrap.bind('g f', () => findAndFollowLink('.shortcuts-tree')); + Mousetrap.bind('g c', () => findAndFollowLink('.shortcuts-commits')); + Mousetrap.bind('g j', () => findAndFollowLink('.shortcuts-builds')); + Mousetrap.bind('g n', () => findAndFollowLink('.shortcuts-network')); + Mousetrap.bind('g d', () => findAndFollowLink('.shortcuts-repository-charts')); + Mousetrap.bind('g i', () => findAndFollowLink('.shortcuts-issues')); + Mousetrap.bind('g b', () => findAndFollowLink('.shortcuts-issue-boards')); + Mousetrap.bind('g m', () => findAndFollowLink('.shortcuts-merge_requests')); + Mousetrap.bind('g t', () => findAndFollowLink('.shortcuts-todos')); + Mousetrap.bind('g w', () => findAndFollowLink('.shortcuts-wiki')); + Mousetrap.bind('g s', () => findAndFollowLink('.shortcuts-snippets')); + Mousetrap.bind('i', () => findAndFollowLink('.shortcuts-new-issue')); this.enabledHelp.push('.hidden-shortcut.project'); } - ShortcutsNavigation.findAndFollowLink = function(selector) { - var link; - link = $(selector).attr('href'); - if (link) { - return window.location = link; - } - }; - return ShortcutsNavigation; })(Shortcuts); }).call(window); From 177c213962a12789170fed4011ebb093b91dd21e Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Thu, 30 Mar 2017 20:19:00 +0100 Subject: [PATCH 14/16] Fix broken spinach test --- features/steps/project/project_shortcuts.rb | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/features/steps/project/project_shortcuts.rb b/features/steps/project/project_shortcuts.rb index 8143b01ca40..cebf09750b0 100644 --- a/features/steps/project/project_shortcuts.rb +++ b/features/steps/project/project_shortcuts.rb @@ -20,9 +20,9 @@ class Spinach::Features::ProjectShortcuts < Spinach::FeatureSteps find('body').native.send_key('n') end - step 'I press "g" and "g"' do - find('body').native.send_key('g') + step 'I press "g" and "d"' do find('body').native.send_key('g') + find('body').native.send_key('d') end step 'I press "g" and "s"' do From 7eba42f5c08637eb0d46b40da62825981d0c7247 Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Fri, 31 Mar 2017 16:24:46 +0100 Subject: [PATCH 15/16] Update tests --- spec/features/dashboard/shortcuts_spec.rb | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/spec/features/dashboard/shortcuts_spec.rb b/spec/features/dashboard/shortcuts_spec.rb index 3642c0bfb5b..d5c5b344ffd 100644 --- a/spec/features/dashboard/shortcuts_spec.rb +++ b/spec/features/dashboard/shortcuts_spec.rb @@ -3,26 +3,26 @@ require 'spec_helper' feature 'Dashboard shortcuts', feature: true, js: true do before do login_as :user - visit dashboard_projects_path + visit root_dashboard_path end scenario 'Navigate to tabs' do - find('body').native.send_key('g') + find('body').native.send_key(:shift) find('body').native.send_key('p') check_page_title('Projects') - find('body').native.send_key('g') + find('body').native.send_key(:shift) find('body').native.send_key('i') check_page_title('Issues') - find('body').native.send_key('g') + find('body').native.send_key(:shift) find('body').native.send_key('m') check_page_title('Merge Requests') - find('body').native.send_key('g') + find('body').native.send_key(:shift) find('body').native.send_key('t') check_page_title('Todos') From 518203d5e181d9f5fdf5c4fd40635b076babbe57 Mon Sep 17 00:00:00 2001 From: Phil Hughes Date: Thu, 6 Apr 2017 14:27:48 +0100 Subject: [PATCH 16/16] Fixed specs Updated JS that was causing the hints to appear & then disappear --- app/assets/javascripts/shortcuts.js | 13 ++++++---- app/views/layouts/nav/_dashboard.html.haml | 28 ++++++++++++++++------ spec/features/dashboard/shortcuts_spec.rb | 12 ++++------ 3 files changed, 34 insertions(+), 19 deletions(-) diff --git a/app/assets/javascripts/shortcuts.js b/app/assets/javascripts/shortcuts.js index d9b20d2694b..5b6bb2bf3f5 100644 --- a/app/assets/javascripts/shortcuts.js +++ b/app/assets/javascripts/shortcuts.js @@ -17,15 +17,20 @@ import findAndFollowLink from './shortcuts_dashboard_navigation'; Mousetrap.bind('s', Shortcuts.focusSearch); Mousetrap.bind('f', (e => this.focusFilter(e))); - const globalDropdownMenu = $('.global-dropdown-menu'); + const $globalDropdownMenu = $('.global-dropdown-menu'); + const $globalDropdownToggle = $('.global-dropdown-toggle'); $('.global-dropdown').on('hide.bs.dropdown', () => { - globalDropdownMenu.toggleClass('shortcuts'); + $globalDropdownMenu.removeClass('shortcuts'); }); Mousetrap.bind('n', () => { - globalDropdownMenu.toggleClass('shortcuts'); - $('.global-dropdown-toggle').trigger('click'); + $globalDropdownMenu.toggleClass('shortcuts'); + $globalDropdownToggle.trigger('click'); + + if (!$globalDropdownMenu.is(':visible')) { + $globalDropdownToggle.blur(); + } }); Mousetrap.bind('shift+t', () => findAndFollowLink('.shortcuts-todos')); diff --git a/app/views/layouts/nav/_dashboard.html.haml b/app/views/layouts/nav/_dashboard.html.haml index 2f8d722c58a..444ecc414c0 100644 --- a/app/views/layouts/nav/_dashboard.html.haml +++ b/app/views/layouts/nav/_dashboard.html.haml @@ -2,13 +2,17 @@ = nav_link(path: ['root#index', 'projects#trending', 'projects#starred', 'dashboard/projects#index'], html_options: {class: "#{project_tab_class} home"}) do = link_to dashboard_projects_path, title: 'Projects', class: 'dashboard-shortcuts-projects' do .shortcut-mappings - .key shift p + .key + = icon('arrow-up', 'aria-label' => 'hidden') + P %span Projects = nav_link(path: 'dashboard#activity') do = link_to activity_dashboard_path, class: 'dashboard-shortcuts-activity', title: 'Activity' do .shortcut-mappings - .key shift a + .key + = icon('arrow-up', 'aria-label' => 'hidden') + A %span Activity - if koding_enabled? @@ -19,33 +23,43 @@ = nav_link(controller: [:groups, 'groups/milestones', 'groups/group_members']) do = link_to dashboard_groups_path, class: 'dashboard-shortcuts-groups', title: 'Groups' do .shortcut-mappings - .key shift g + .key + = icon('arrow-up', 'aria-label' => 'hidden') + G %span Groups = nav_link(controller: 'dashboard/milestones') do = link_to dashboard_milestones_path, class: 'dashboard-shortcuts-milestones', title: 'Milestones' do .shortcut-mappings - .key shift l + .key + = icon('arrow-up', 'aria-label' => 'hidden') + L %span Milestones = nav_link(path: 'dashboard#issues') do = link_to assigned_issues_dashboard_path, title: 'Issues', class: 'dashboard-shortcuts-issues' do .shortcut-mappings - .key shift i + .key + = icon('arrow-up', 'aria-label' => 'hidden') + I %span Issues .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :issues, :opened)) = nav_link(path: 'dashboard#merge_requests') do = link_to assigned_mrs_dashboard_path, title: 'Merge Requests', class: 'dashboard-shortcuts-merge_requests' do .shortcut-mappings - .key shift m + .key + = icon('arrow-up', 'aria-label' => 'hidden') + M %span Merge Requests .badge= number_with_delimiter(cached_assigned_issuables_count(current_user, :merge_requests, :opened)) = nav_link(controller: 'dashboard/snippets') do = link_to dashboard_snippets_path, class: 'dashboard-shortcuts-snippets', title: 'Snippets' do .shortcut-mappings - .key shift s + .key + = icon('arrow-up', 'aria-label' => 'hidden') + S %span Snippets %li.divider diff --git a/spec/features/dashboard/shortcuts_spec.rb b/spec/features/dashboard/shortcuts_spec.rb index d5c5b344ffd..fa5524e18d8 100644 --- a/spec/features/dashboard/shortcuts_spec.rb +++ b/spec/features/dashboard/shortcuts_spec.rb @@ -7,23 +7,19 @@ feature 'Dashboard shortcuts', feature: true, js: true do end scenario 'Navigate to tabs' do - find('body').native.send_key(:shift) - find('body').native.send_key('p') + find('body').native.send_keys([:shift, 'P']) check_page_title('Projects') - find('body').native.send_key(:shift) - find('body').native.send_key('i') + find('body').native.send_key([:shift, 'I']) check_page_title('Issues') - find('body').native.send_key(:shift) - find('body').native.send_key('m') + find('body').native.send_key([:shift, 'M']) check_page_title('Merge Requests') - find('body').native.send_key(:shift) - find('body').native.send_key('t') + find('body').native.send_keys([:shift, 'T']) check_page_title('Todos') end