diff --git a/Packages/ohif-hotkeys/client/classes/HotkeysManager.js b/Packages/ohif-hotkeys/client/classes/HotkeysManager.js
index 6b44b17e1..27ee66972 100644
--- a/Packages/ohif-hotkeys/client/classes/HotkeysManager.js
+++ b/Packages/ohif-hotkeys/client/classes/HotkeysManager.js
@@ -58,9 +58,11 @@ export class HotkeysManager {
}
load(contextName) {
+ const context = this.getContext(contextName);
+ if (!context) return;
const definitions = this.retrieve(contextName);
if (!definitions) return;
- this.set(contextName, definitions);
+ context.extend(definitions);
}
set(contextName, contextDefinitions) {
diff --git a/Packages/ohif-hotkeys/client/components/dialog.html b/Packages/ohif-hotkeys/client/components/dialog.html
new file mode 100644
index 000000000..18fb11fca
--- /dev/null
+++ b/Packages/ohif-hotkeys/client/components/dialog.html
@@ -0,0 +1,5 @@
+
+ {{#dialogSimple title='Keyboard Shortcuts'}}
+ {{>hotkeysForm}}
+ {{/dialogSimple}}
+
diff --git a/Packages/ohif-hotkeys/client/components/form.html b/Packages/ohif-hotkeys/client/components/form.html
new file mode 100644
index 000000000..ab2fa2de6
--- /dev/null
+++ b/Packages/ohif-hotkeys/client/components/form.html
@@ -0,0 +1,5 @@
+
+ {{#form class='form-themed'}}
+ {{>inputText class='hotkey' label='Window W/L'}}
+ {{/form}}
+
diff --git a/Packages/ohif-hotkeys/client/components/form.js b/Packages/ohif-hotkeys/client/components/form.js
new file mode 100644
index 000000000..2c1141220
--- /dev/null
+++ b/Packages/ohif-hotkeys/client/components/form.js
@@ -0,0 +1,58 @@
+import { Template } from 'meteor/templating';
+import { $ } from 'meteor/jquery';
+import { _ } from 'meteor/underscore';
+
+Template.hotkeysForm.onCreated(() => {
+ const instance = Template.instance();
+
+ const rg = (start, end) => _.range(start, end + 1);
+ instance.allowedKeys = _.union(rg(32, 40), rg(48, 57), rg(65, 90), rg(112, 121), [123]);
+
+ instance.updateInputText = (event, displayPressedKey=false) => {
+ const $target = $(event.currentTarget);
+ const keysPressedArray = instance.getKeysPressedArray(event);
+
+ if (displayPressedKey) {
+ const specialKeyName = jQuery.hotkeys.specialKeys[event.which];
+ const keyName = specialKeyName || event.key;
+ keysPressedArray.push(keyName.toUpperCase());
+ }
+
+ $target.val(keysPressedArray.join('+'));
+ };
+
+ instance.getKeysPressedArray = event => {
+ const keysPressedArray = [];
+
+ if (event.ctrlKey && !event.altKey) {
+ keysPressedArray.push('CTRL');
+ }
+
+ if (event.shiftKey && !event.altKey) {
+ keysPressedArray.push('SHIFT');
+ }
+
+ if (event.altKey && !event.ctrlKey) {
+ keysPressedArray.push('ALT');
+ }
+
+ return keysPressedArray;
+ };
+});
+
+Template.hotkeysForm.events({
+ 'keydown .hotkey'(event, instance) {
+ if (instance.allowedKeys.indexOf(event.keyCode) > -1) {
+ instance.updateInputText(event, true);
+ $(event.currentTarget).blur();
+ } else {
+ instance.updateInputText(event);
+ }
+
+ event.preventDefault();
+ },
+
+ 'keyup .hotkey'(event, instance) {
+ instance.updateInputText(event);
+ }
+});
diff --git a/Packages/ohif-hotkeys/client/components/index.js b/Packages/ohif-hotkeys/client/components/index.js
new file mode 100644
index 000000000..28804bee3
--- /dev/null
+++ b/Packages/ohif-hotkeys/client/components/index.js
@@ -0,0 +1,4 @@
+import './dialog.html';
+
+import './form.html';
+import './form.js';
diff --git a/Packages/ohif-hotkeys/client/index.js b/Packages/ohif-hotkeys/client/index.js
index cf327e497..a3b6ff5b9 100644
--- a/Packages/ohif-hotkeys/client/index.js
+++ b/Packages/ohif-hotkeys/client/index.js
@@ -1 +1,2 @@
+import './components';
import './lib';
diff --git a/Packages/ohif-hotkeys/main.js b/Packages/ohif-hotkeys/main.js
index c473b8b17..9c359fe6e 100644
--- a/Packages/ohif-hotkeys/main.js
+++ b/Packages/ohif-hotkeys/main.js
@@ -1,5 +1,6 @@
import { OHIF } from 'meteor/ohif:core';
import { HotkeysManager } from 'meteor/ohif:hotkeys/client/classes/HotkeysManager';
+import 'jquery.hotkeys';
// Create hotkeys namespace using a HotkeysManager class instance
const hotkeys = new HotkeysManager();
diff --git a/Packages/ohif-hotkeys/package.js b/Packages/ohif-hotkeys/package.js
index 2f3f010b2..0985263a7 100644
--- a/Packages/ohif-hotkeys/package.js
+++ b/Packages/ohif-hotkeys/package.js
@@ -4,12 +4,17 @@ Package.describe({
version: '0.0.1'
});
+Npm.depends({
+ 'jquery.hotkeys': '0.1.0'
+});
+
Package.onUse(function(api) {
api.versionsFrom('1.4');
// Meteor packages
api.use([
'ecmascript',
+ 'templating',
'reactive-var',
'session',
'iron:router',
diff --git a/Packages/ohif-viewerbase/client/compatibility/jquery.hotkeys.js b/Packages/ohif-viewerbase/client/compatibility/jquery.hotkeys.js
deleted file mode 100644
index b791f4529..000000000
--- a/Packages/ohif-viewerbase/client/compatibility/jquery.hotkeys.js
+++ /dev/null
@@ -1,204 +0,0 @@
-/*jslint browser: true*/
-/*jslint jquery: true*/
-
-/*
- * jQuery Hotkeys Plugin
- * Copyright 2010, John Resig
- * Dual licensed under the MIT or GPL Version 2 licenses.
- *
- * Based upon the plugin by Tzury Bar Yochay:
- * https://github.com/tzuryby/jquery.hotkeys
- *
- * Original idea by:
- * Binny V A, http://www.openjs.com/scripts/events/keyboard_shortcuts/
- */
-
-/*
- * One small change is: now keys are passed by object { keys: '...' }
- * Might be useful, when you want to pass some other data to your handler
- */
-
-(function(jQuery) {
-
- jQuery.hotkeys = {
- version: "0.8",
-
- specialKeys: {
- 8: "backspace",
- 9: "tab",
- 10: "return",
- 13: "return",
- 16: "shift",
- 17: "ctrl",
- 18: "alt",
- 19: "pause",
- 20: "capslock",
- 27: "esc",
- 32: "space",
- 33: "pageup",
- 34: "pagedown",
- 35: "end",
- 36: "home",
- 37: "left",
- 38: "up",
- 39: "right",
- 40: "down",
- 45: "insert",
- 46: "del",
- 59: ";",
- 61: "=",
- 96: "0",
- 97: "1",
- 98: "2",
- 99: "3",
- 100: "4",
- 101: "5",
- 102: "6",
- 103: "7",
- 104: "8",
- 105: "9",
- 106: "*",
- 107: "+",
- 109: "-",
- 110: ".",
- 111: "/",
- 112: "f1",
- 113: "f2",
- 114: "f3",
- 115: "f4",
- 116: "f5",
- 117: "f6",
- 118: "f7",
- 119: "f8",
- 120: "f9",
- 121: "f10",
- 122: "f11",
- 123: "f12",
- 144: "numlock",
- 145: "scroll",
- 173: "-",
- 186: ";",
- 187: "=",
- 188: ",",
- 189: "-",
- 190: ".",
- 191: "/",
- 192: "`",
- 219: "[",
- 220: "\\",
- 221: "]",
- 222: "'"
- },
-
- shiftNums: {
- "`": "~",
- "1": "!",
- "2": "@",
- "3": "#",
- "4": "$",
- "5": "%",
- "6": "^",
- "7": "&",
- "8": "*",
- "9": "(",
- "0": ")",
- "-": "_",
- "=": "+",
- ";": ": ",
- "'": "\"",
- ",": "<",
- ".": ">",
- "/": "?",
- "\\": "|"
- },
-
- // excludes: button, checkbox, file, hidden, image, password, radio, reset, search, submit, url
- textAcceptingInputTypes: [
- "text", "password", "number", "email", "url", "range", "date", "month", "week", "time", "datetime",
- "datetime-local", "search", "color", "tel"],
-
- // default input types not to bind to unless bound directly
- textInputTypes: /textarea|input|select/i,
-
- options: {
- filterInputAcceptingElements: true,
- filterTextInputs: true,
- filterContentEditable: true
- }
- };
-
- function keyHandler(handleObj) {
- if (typeof handleObj.data === "string") {
- handleObj.data = {
- keys: handleObj.data
- };
- }
-
- // Only care when a possible input has been specified
- if (!handleObj.data || !handleObj.data.keys || typeof handleObj.data.keys !== "string") {
- return;
- }
-
- var origHandler = handleObj.handler,
- keys = handleObj.data.keys.toLowerCase().split(" ");
-
- handleObj.handler = function(event) {
- // Don't fire in text-accepting inputs that we didn't directly bind to
- if (this !== event.target &&
- (jQuery.hotkeys.options.filterInputAcceptingElements &&
- jQuery.hotkeys.textInputTypes.test(event.target.nodeName) ||
- (jQuery.hotkeys.options.filterContentEditable && jQuery(event.target).attr('contenteditable')) ||
- (jQuery.hotkeys.options.filterTextInputs &&
- jQuery.inArray(event.target.type, jQuery.hotkeys.textAcceptingInputTypes) > -1))) {
- return;
- }
-
- var special = event.type !== "keypress" && jQuery.hotkeys.specialKeys[event.which],
- character = String.fromCharCode(event.which).toLowerCase(),
- modif = "",
- possible = {};
-
- jQuery.each(["alt", "ctrl", "shift"], function(index, specialKey) {
-
- if (event[specialKey + 'Key'] && special !== specialKey) {
- modif += specialKey + '+';
- }
- });
-
- // metaKey is triggered off ctrlKey erronously
- if (event.metaKey && !event.ctrlKey && special !== "meta") {
- modif += "meta+";
- }
-
- if (event.metaKey && special !== "meta" && modif.indexOf("alt+ctrl+shift+") > -1) {
- modif = modif.replace("alt+ctrl+shift+", "hyper+");
- }
-
- if (special) {
- possible[modif + special] = true;
- }
- else {
- possible[modif + character] = true;
- possible[modif + jQuery.hotkeys.shiftNums[character]] = true;
-
- // "$" can be triggered as "Shift+4" or "Shift+$" or just "$"
- if (modif === "shift+") {
- possible[jQuery.hotkeys.shiftNums[character]] = true;
- }
- }
-
- for (var i = 0, l = keys.length; i < l; i++) {
- if (possible[keys[i]]) {
- return origHandler.apply(this, arguments);
- }
- }
- };
- }
-
- jQuery.each(["keydown", "keyup", "keypress"], function() {
- jQuery.event.special[this] = {
- add: keyHandler
- };
- });
-
-})(jQuery || this.jQuery || window.jQuery);
\ No newline at end of file
diff --git a/Packages/ohif-viewerbase/package.js b/Packages/ohif-viewerbase/package.js
index 6135750d0..d5cf77355 100644
--- a/Packages/ohif-viewerbase/package.js
+++ b/Packages/ohif-viewerbase/package.js
@@ -83,10 +83,6 @@ Package.onUse(function(api) {
api.addAssets(assets, 'client');
- // TODO: Use NPM depends for these
- api.addFiles('client/compatibility/jquery.hotkeys.js', 'client', {
- bare: true
- });
api.addFiles('client/compatibility/dialogPolyfill.js', 'client', {
bare: true
});