keybindingSrv.ts 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223
  1. ///<reference path="../../headers/common.d.ts" />
  2. import $ from 'jquery';
  3. import _ from 'lodash';
  4. import coreModule from 'app/core/core_module';
  5. import appEvents from 'app/core/app_events';
  6. import Mousetrap from 'mousetrap';
  7. export class KeybindingSrv {
  8. helpModal: boolean;
  9. /** @ngInject */
  10. constructor(
  11. private $rootScope,
  12. private $modal,
  13. private $location,
  14. private contextSrv,
  15. private $timeout) {
  16. // clear out all shortcuts on route change
  17. $rootScope.$on('$routeChangeSuccess', () => {
  18. Mousetrap.reset();
  19. // rebind global shortcuts
  20. this.setupGlobal();
  21. });
  22. this.setupGlobal();
  23. }
  24. setupGlobal() {
  25. this.bind(['?', 'h'], this.showHelpModal);
  26. this.bind("g h", this.goToHome);
  27. this.bind("g a", this.openAlerting);
  28. this.bind("g p", this.goToProfile);
  29. this.bind("s s", this.openSearchStarred);
  30. this.bind('s o', this.openSearch);
  31. this.bind('s t', this.openSearchTags);
  32. this.bind('f', this.openSearch);
  33. }
  34. openSearchStarred() {
  35. this.$rootScope.appEvent('show-dash-search', {starred: true});
  36. }
  37. openSearchTags() {
  38. this.$rootScope.appEvent('show-dash-search', {tagsMode: true});
  39. }
  40. openSearch() {
  41. this.$rootScope.appEvent('show-dash-search');
  42. }
  43. openAlerting() {
  44. this.$location.url("/alerting");
  45. }
  46. goToHome() {
  47. this.$location.url("/");
  48. }
  49. goToProfile() {
  50. this.$location.url("/profile");
  51. }
  52. showHelpModal() {
  53. appEvents.emit('show-modal', {templateHtml: '<help-modal></help-modal>'});
  54. }
  55. bind(keyArg, fn) {
  56. Mousetrap.bind(keyArg, evt => {
  57. evt.preventDefault();
  58. evt.stopPropagation();
  59. evt.returnValue = false;
  60. return this.$rootScope.$apply(fn.bind(this));
  61. });
  62. }
  63. showDashEditView(view) {
  64. var search = _.extend(this.$location.search(), {editview: view});
  65. this.$location.search(search);
  66. }
  67. setupDashboardBindings(scope, dashboard) {
  68. // this.bind('b', () => {
  69. // dashboard.toggleEditMode();
  70. // });
  71. this.bind('mod+o', () => {
  72. dashboard.graphTooltip = (dashboard.graphTooltip + 1) % 3;
  73. appEvents.emit('graph-hover-clear');
  74. scope.broadcastRefresh();
  75. });
  76. this.bind('mod+h', () => {
  77. dashboard.hideControls = !dashboard.hideControls;
  78. });
  79. this.bind('mod+s', e => {
  80. scope.appEvent('save-dashboard');
  81. });
  82. this.bind('t z', () => {
  83. scope.appEvent('zoom-out', 2);
  84. });
  85. this.bind('ctrl+z', () => {
  86. scope.appEvent('zoom-out', 2);
  87. });
  88. this.bind('t left', () => {
  89. scope.appEvent('shift-time-backward');
  90. });
  91. this.bind('t right', () => {
  92. scope.appEvent('shift-time-forward');
  93. });
  94. this.bind('mod+i', () => {
  95. scope.appEvent('quick-snapshot');
  96. });
  97. // edit panel
  98. this.bind('e', () => {
  99. if (dashboard.meta.focusPanelId && dashboard.meta.canEdit) {
  100. this.$rootScope.appEvent('panel-change-view', {
  101. fullscreen: true,
  102. edit: true,
  103. panelId: dashboard.meta.focusPanelId,
  104. toggle: true
  105. });
  106. }
  107. });
  108. // view panel
  109. this.bind('v', () => {
  110. if (dashboard.meta.focusPanelId) {
  111. this.$rootScope.appEvent('panel-change-view', {
  112. fullscreen: true,
  113. edit: null,
  114. panelId: dashboard.meta.focusPanelId,
  115. toggle: true,
  116. });
  117. }
  118. });
  119. // delete panel
  120. this.bind('p r', () => {
  121. if (dashboard.meta.focusPanelId && dashboard.meta.canEdit) {
  122. var panelInfo = dashboard.getPanelInfoById(dashboard.meta.focusPanelId);
  123. panelInfo.row.removePanel(panelInfo.panel);
  124. dashboard.meta.focusPanelId = 0;
  125. }
  126. });
  127. // share panel
  128. this.bind('p s', () => {
  129. if (dashboard.meta.focusPanelId) {
  130. var shareScope = scope.$new();
  131. var panelInfo = dashboard.getPanelInfoById(dashboard.meta.focusPanelId);
  132. shareScope.panel = panelInfo.panel;
  133. shareScope.dashboard = dashboard;
  134. appEvents.emit('show-modal', {
  135. src: 'public/app/features/dashboard/partials/shareModal.html',
  136. scope: shareScope
  137. });
  138. }
  139. });
  140. // delete row
  141. this.bind('r r', () => {
  142. if (dashboard.meta.focusPanelId && dashboard.meta.canEdit) {
  143. var panelInfo = dashboard.getPanelInfoById(dashboard.meta.focusPanelId);
  144. dashboard.removeRow(panelInfo.row);
  145. dashboard.meta.focusPanelId = 0;
  146. }
  147. });
  148. // collapse row
  149. this.bind('r c', () => {
  150. if (dashboard.meta.focusPanelId) {
  151. var panelInfo = dashboard.getPanelInfoById(dashboard.meta.focusPanelId);
  152. panelInfo.row.toggleCollapse();
  153. dashboard.meta.focusPanelId = 0;
  154. }
  155. });
  156. this.bind('d r', () => {
  157. scope.broadcastRefresh();
  158. });
  159. this.bind('d s', () => {
  160. this.showDashEditView('settings');
  161. });
  162. this.bind('d k', () => {
  163. appEvents.emit('toggle-kiosk-mode');
  164. });
  165. this.bind('d v', () => {
  166. appEvents.emit('toggle-view-mode');
  167. });
  168. this.bind('esc', () => {
  169. var popups = $('.popover.in');
  170. if (popups.length > 0) {
  171. return;
  172. }
  173. // close modals
  174. var modalData = $(".modal").data();
  175. if (modalData && modalData.$scope && modalData.$scope.dismiss) {
  176. modalData.$scope.dismiss();
  177. }
  178. scope.appEvent('hide-dash-editor');
  179. scope.exitFullscreen();
  180. });
  181. }
  182. }
  183. coreModule.service('keybindingSrv', KeybindingSrv);