From c16aa5bbf01534872046f0a1cc64cca8d350bd2f Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Wed, 20 Jan 2016 11:35:46 +0100 Subject: [PATCH] Fixes: U4-7745 7.4 Property Editor & Keyboard Shortcuts --- .../components/buttons/umbbutton.directive.js | 1 + .../components/forms/hotkey.directive.js | 90 ++++++++++--------- .../services/contenteditinghelper.service.js | 12 ++- .../src/common/services/keyboard.service.js | 39 ++++---- .../components/buttons/umb-button-group.html | 5 +- .../views/components/buttons/umb-button.html | 6 +- .../views/documenttypes/edit.controller.js | 2 + 7 files changed, 82 insertions(+), 73 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js index 1bb70e2b6c..6ba7777171 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbutton.directive.js @@ -50,6 +50,7 @@ buttonStyle: "@?", state: "=?", shortcut: "@?", + shortcutWhenHidden: "@", label: "@?", labelKey: "@?", icon: "@?", diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/hotkey.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/hotkey.directive.js index 398918eea2..310d69a8a2 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/hotkey.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/forms/hotkey.directive.js @@ -1,55 +1,59 @@ /** -* @ngdoc directive -* @name umbraco.directives.directive:headline -**/ + * @ngdoc directive + * @name umbraco.directives.directive:headline + **/ angular.module("umbraco.directives") - .directive('hotkey', function ($window, keyboardService, $log) { + .directive('hotkey', function($window, keyboardService, $log) { - return function (scope, el, attrs) { + return function(scope, el, attrs) { - var options = {}; - var keyCombo = attrs.hotkey; + var options = {}; + var keyCombo = attrs.hotkey; - if (!keyCombo) { - //support data binding - keyCombo = scope.$eval(attrs["hotkey"]); - } + if (!keyCombo) { + //support data binding + keyCombo = scope.$eval(attrs["hotkey"]); + } - // disable shortcuts in input fields if keycombo is 1 character - if(keyCombo) { + // disable shortcuts in input fields if keycombo is 1 character + if (keyCombo) { - if(keyCombo.length === 1) { - options = { - inputDisabled: true - }; - } - - keyboardService.bind(keyCombo, function(){ - - var element = $(el); - var activeElementType = document.activeElement.tagName; - var clickableElements = ["A", "BUTTON"]; - - if(element.is("a,div,button,input[type='button'],input[type='submit'],input[type='checkbox']") && !element.is(':disabled') ){ - - // when keycombo is enter and a link or button has focus - click the link or button instead of using the hotkey - if(keyCombo === "enter" && clickableElements.indexOf(activeElementType) === 0) { - document.activeElement.click(); - } else { - element.click(); - } - - }else{ - element.focus(); + if (keyCombo.length === 1) { + options = { + inputDisabled: true + }; } - }, options); + keyboardService.bind(keyCombo, function() { - el.on('$destroy', function(){ - keyboardService.unbind(keyCombo); - }); + var element = $(el); + var activeElementType = document.activeElement.tagName; + var clickableElements = ["A", "BUTTON"]; - } + if (element.is("a,div,button,input[type='button'],input[type='submit'],input[type='checkbox']") && !element.is(':disabled')) { - }; - }); + if (element.is(':visible') || attrs.hotkeyWhenHidden) { + + // when keycombo is enter and a link or button has focus - click the link or button instead of using the hotkey + if (keyCombo === "enter" && clickableElements.indexOf(activeElementType) === 0) { + document.activeElement.click(); + } else { + element.click(); + } + + } + + } else { + element.focus(); + } + + }, options); + + el.on('$destroy', function() { + keyboardService.unbind(keyCombo); + }); + + } + + }; + }); diff --git a/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js b/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js index 7d21ed6351..13936a6733 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/contenteditinghelper.service.js @@ -132,7 +132,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica letter: ch, labelKey: "buttons_saveAndPublish", handler: args.methods.saveAndPublish, - hotKey: "ctrl+p" + hotKey: "ctrl+p", + hotKeyWhenHidden: true }; case "H": //send to publish @@ -140,7 +141,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica letter: ch, labelKey: "buttons_saveToPublish", handler: args.methods.sendToPublish, - hotKey: "ctrl+p" + hotKey: "ctrl+p", + hotKeyWhenHidden: true }; case "A": //save @@ -148,7 +150,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica letter: ch, labelKey: "buttons_save", handler: args.methods.save, - hotKey: "ctrl+s" + hotKey: "ctrl+s", + hotKeyWhenHidden: true }; case "Z": //unpublish @@ -156,7 +159,8 @@ function contentEditingHelper(fileManager, $q, $location, $routeParams, notifica letter: ch, labelKey: "content_unPublish", handler: args.methods.unPublish, - hotKey: "ctrl+u" + hotKey: "ctrl+u", + hotKeyWhenHidden: true }; default: return null; diff --git a/src/Umbraco.Web.UI.Client/src/common/services/keyboard.service.js b/src/Umbraco.Web.UI.Client/src/common/services/keyboard.service.js index 0a7be9f5a4..a9fb9eed84 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/keyboard.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/keyboard.service.js @@ -10,7 +10,7 @@ angular.module('umbraco.services') 'target': $window.document, 'keyCode': false }; - + var isMac = navigator.platform.toUpperCase().indexOf('MAC')>=0; // Store all keyboard combination shortcuts @@ -25,19 +25,16 @@ angular.module('umbraco.services') label = label.replace("ctrl","meta"); } - //always try to unbind first, so we dont have multiple actions on the same key - keyboardManagerService.unbind(label); - var fct, elt, code, k; // Initialize opt object opt = angular.extend({}, defaultOpt, opt); label = label.toLowerCase(); elt = opt.target; if(typeof opt.target === 'string'){ - elt = document.getElementById(opt.target); - } + elt = document.getElementById(opt.target); + } + - fct = function (e) { e = e || $window.event; @@ -45,21 +42,21 @@ angular.module('umbraco.services') if (opt['inputDisabled']) { var elt; if (e.target){ - elt = e.target; + elt = e.target; }else if (e.srcElement){ - elt = e.srcElement; - } + elt = e.srcElement; + } - if (elt.nodeType === 3){elt = elt.parentNode;} + if (elt.nodeType === 3){elt = elt.parentNode;} if (elt.tagName === 'INPUT' || elt.tagName === 'TEXTAREA'){return;} } // Find out which key is pressed if (e.keyCode){ - code = e.keyCode; + code = e.keyCode; }else if (e.which){ - code = e.which; - } + code = e.which; + } var character = String.fromCharCode(code).toLowerCase(); @@ -95,7 +92,7 @@ angular.module('umbraco.services') var special_keys = { 'esc':27, 'escape':27, - 'tab':9, + 'tab':9, 'space':32, 'return':13, 'enter':13, @@ -148,11 +145,11 @@ angular.module('umbraco.services') // Some modifiers key var modifiers = { shift: { - wanted: false, + wanted: false, pressed: e.shiftKey ? true : false }, ctrl : { - wanted: false, + wanted: false, pressed: e.ctrlKey ? true : false }, alt : { @@ -160,7 +157,7 @@ angular.module('umbraco.services') pressed: e.altKey ? true : false }, meta : { //Meta is Mac specific - wanted: false, + wanted: false, pressed: e.metaKey ? true : false } }; @@ -252,13 +249,13 @@ angular.module('umbraco.services') label = label.toLowerCase(); var binding = keyboardManagerService.keyboardEvent[label]; delete(keyboardManagerService.keyboardEvent[label]); - + if(!binding){return;} var type = binding['event'], elt = binding['target'], callback = binding['callback']; - + if(elt.detachEvent){ elt.detachEvent('on' + type, callback); }else if(elt.removeEventListener){ @@ -270,4 +267,4 @@ angular.module('umbraco.services') // return keyboardManagerService; -}]); \ No newline at end of file +}]); \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button-group.html b/src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button-group.html index b6d266e784..46e1adbde2 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button-group.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/buttons/umb-button-group.html @@ -7,7 +7,8 @@ state="state" label="{{defaultButton.labelKey}}" label-key="{{defaultButton.labelKey}}" - shortcut="{{defaultButton.hotKey}}"> + shortcut="{{defaultButton.hotKey}}" + shortcut-when-hidden="{{defaultButton.hotKeyWhenHidden}}"> @@ -16,7 +17,7 @@