Bug 1238870 - [TV][2.5] Listen to Backspace not esc key for back func…

…tion. r=lchang , a=jocheng
mozilla-b2g · Jan 29, 2016 · 01cafaf · 01cafaf
1 parent 241a874
commit 01cafaf
Show file tree

Hide file tree

Showing 17 changed files with 157 additions and 51 deletions.
diff --git a/shared/js/smart-screen/key_navigation_adapter.js b/shared/js/smart-screen/key_navigation_adapter.js
@@ -66,6 +66,9 @@
         case 'enter':
           this.fire(evtPrefix + 'enter' + evtPostfix);
           break;
+        case 'back':
+          this.fire(evtPrefix + 'back' + evtPostfix);
+          break;
         case 'esc':
           this.fire(evtPrefix + 'esc' + evtPostfix);
           break;
@@ -87,7 +90,7 @@
         case KeyEvent.DOM_VK_ESCAPE:
           return 'esc';
         case KeyEvent.DOM_VK_BACK_SPACE:
-          return 'esc';
+          return 'back';
         default:// we don't consume other keys.
           return null;
       }

diff --git a/tv_apps/app-deck/bower_components/smart-dialog/script.js b/tv_apps/app-deck/bower_components/smart-dialog/script.js
@@ -96,10 +96,13 @@ window.SmartDialog = (function(win) {
         }
         break;
       case 'keyup':
-        // close dialog when ESC is clicked
+        // close dialog when Back is triggered
         if (this.getAttribute('esc-close') != 'false' &&
-            (evt.keyCode === 27 || evt.key === 'Esc') &&
+            (evt.keyCode === window.KeyEvent.DOM_VK_BACK_SPACE ||
+            evt.key === 'Backspace') &&
             this.classList.contains('opened')) {
+          evt.preventDefault();
+          evt.stopPropagation();
           this.close();
         }
         break;

diff --git a/tv_apps/browser/js/settings.js b/tv_apps/browser/js/settings.js
@@ -701,7 +701,6 @@ var Settings = {
         break;
 
       case KeyEvent.DOM_VK_BACK_SPACE :
-      case KeyEvent.DOM_VK_ESCAPE:
         if( Settings.isDialogHomepageDisplayed() ) {
           Settings.hideDialogHomepage();
           return true;

diff --git a/tv_apps/browser/js/smartList.js b/tv_apps/browser/js/smartList.js
@@ -774,8 +774,8 @@
 
     handleListKeyUp: function(e) {
       switch(e.keyCode){
-        case KeyEvent.DOM_VK_ESCAPE:
-          this.handleKeyEscape();
+        case KeyEvent.DOM_VK_BACK_SPACE:
+          this.handleKeyBackspace();
           break;
         default:
           return;
@@ -892,7 +892,7 @@
       }
     },
 
-    handleKeyEscape: function() {
+    handleKeyBackspace: function() {
       if (!this.navState) {
         this.close();
       } else {

diff --git a/tv_apps/remote-control-client/client.html b/tv_apps/remote-control-client/client.html
@@ -25,7 +25,7 @@ <h1 data-l10n-id="client-title"></h1>
     <div id="scroll-panel" class="panel"></div>
   </section>
   <section id="section-buttons">
-    <div id="button-back" class="button" data-key="DOM_VK_ESCAPE"></div>
+    <div id="button-back" class="button" data-key="DOM_VK_BACK_SPACE"></div>
     <div id="button-home" class="button" data-key="DOM_VK_HOME"></div>
     <div id="button-option" class="button" data-key="DOM_VK_CONTEXT_MENU"></div>
   </section>

diff --git a/tv_apps/remote-control/js/bootstrap.js b/tv_apps/remote-control/js/bootstrap.js
@@ -10,7 +10,7 @@ window.addEventListener('load', function onLoad() {
   keyNav.init();
   keyNav.on('move', app.handleMove.bind(app));
   keyNav.on('enter', app.handleClick.bind(app));
-  keyNav.on('esc', app.handleBack.bind(app));
+  keyNav.on('back', app.handleBack.bind(app));
 
   Settings.start();
   Settings.once('ready', app.show.bind(app));

diff --git a/tv_apps/smart-home/bower_components/smart-dialog/script.js b/tv_apps/smart-home/bower_components/smart-dialog/script.js
@@ -96,10 +96,13 @@ window.SmartDialog = (function(win) {
         }
         break;
       case 'keyup':
-        // close dialog when ESC is clicked
+        // close dialog when Back is triggered
         if (this.getAttribute('esc-close') != 'false' &&
-            (evt.keyCode === 27 || evt.key === 'Esc') &&
+            (evt.keyCode === window.KeyEvent.DOM_VK_BACK_SPACE ||
+            evt.key === 'Backspace') &&
             this.classList.contains('opened')) {
+          evt.preventDefault();
+          evt.stopPropagation();
           this.close();
         }
         break;

diff --git a/tv_apps/smart-settings/js/settings.js b/tv_apps/smart-settings/js/settings.js
@@ -193,8 +193,6 @@
         return 'left';
       case KeyEvent.DOM_VK_RETURN:
         return 'enter';
-      case KeyEvent.DOM_VK_ESCAPE:
-        return 'esc';
       case KeyEvent.DOM_VK_BACK_SPACE:
         return 'esc';
       default:// we don't consume other keys.

diff --git a/tv_apps/smart-system/bower_components/smart-dialog/script.js b/tv_apps/smart-system/bower_components/smart-dialog/script.js
@@ -96,10 +96,13 @@ window.SmartDialog = (function(win) {
         }
         break;
       case 'keyup':
-        // close dialog when ESC is clicked
+        // close dialog when Back is triggered
         if (this.getAttribute('esc-close') != 'false' &&
-            (evt.keyCode === 27 || evt.key === 'Esc') &&
+            (evt.keyCode === window.KeyEvent.DOM_VK_BACK_SPACE ||
+            evt.key === 'Backspace') &&
             this.classList.contains('opened')) {
+          evt.preventDefault();
+          evt.stopPropagation();
           this.close();
         }
         break;

diff --git a/tv_apps/smart-system/fxa/js/fxam_error_overlay.js b/tv_apps/smart-system/fxa/js/fxam_error_overlay.js
@@ -37,7 +37,7 @@ var FxaModuleErrorOverlay = {
     this.fxaErrorOk.addEventListener('keyup', e => {
       if (e.keyCode &&
           (e.keyCode === KeyEvent.DOM_VK_RETURN ||
-          e.keyCode === KeyEvent.DOM_VK_ESCAPE)) {
+          e.keyCode === KeyEvent.DOM_VK_BACK_SPACE)) {
         this.fxaErrorOk.classList.remove('active');
         this.hide();
       }
@@ -62,15 +62,15 @@ var FxaModuleErrorOverlay = {
     document.activeElement.blur();
     this.fxaErrorOk.focus();
 
-    FxaModuleUI.disableEscapeButton();
+    FxaModuleUI.disableBackButton();
   },
 
   hide: function fxam_overlay_hide() {
     this.init();
 
     this.fxaErrorOverlay.classList.remove('show');
     FxaModuleKeyNavigation.enable();
-    FxaModuleUI.enableEscapeButton();
+    FxaModuleUI.enableBackButton();
   },
 
   prevent: function fxam_prevent(event) {

diff --git a/tv_apps/smart-system/fxa/js/fxam_ui.js b/tv_apps/smart-system/fxa/js/fxam_ui.js
@@ -80,7 +80,7 @@ var FxaModuleUI = {
       }, OFFLINE_TIMEOUT);
     });
 
-    this.enableEscapeButton();
+    this.enableBackButton();
 
     FxaModuleNavigation.init(flow);
   },
@@ -197,14 +197,18 @@ var FxaModuleUI = {
     this.fxaModuleDone.removeAttribute('disabled');
   },
   onkeypress: function(e) {
-    if (e.keyCode === KeyEvent.DOM_VK_ESCAPE) {
+    var inputElementTypes = ['INPUT', 'TEXTAREA'];
+    var active = document.activeElement;
+    var isInputElementType = inputElementTypes.indexOf(active.nodeName) !== -1;
+    if (e.keyCode === KeyEvent.DOM_VK_BACK_SPACE &&
+        (!isInputElementType || (isInputElementType && !active.value))) {
       FxaModuleNavigation.back();
     }
   },
-  disableEscapeButton: function() {
+  disableBackButton: function() {
     window.removeEventListener('keypress', this.onkeypress);
   },
-  enableEscapeButton: function() {
+  enableBackButton: function() {
     window.addEventListener('keypress', this.onkeypress);
   },
   focusDoneButton: function() {

diff --git a/tv_apps/smart-system/js/app_window.js b/tv_apps/smart-system/js/app_window.js
@@ -708,7 +708,7 @@
      '_closed'];
 
   AppWindow.REGISTERED_GLOBAL_EVENTS =
-    ['mozbrowserafterkeyup'];
+    ['back'];
 
   AppWindow.SUB_COMPONENTS = {
     'transitionController': window.AppTransitionController,
@@ -1046,13 +1046,11 @@
 
     };
 
-  AppWindow.prototype._handle_mozbrowserafterkeyup =
-    function aw__handle_mozbrowserafterkeyup(evt) {
+  AppWindow.prototype._handle_back = function aw__handle_back(evt) {
       if (document.activeElement !== this.iframe) {
         return;
       }
-      if ((evt.keyCode === 27 || evt.key === 'Escape') &&
-          !evt.embeddedCancelled && !this.config.url.startsWith('app://')) {
+      if (!this.config.url.startsWith('app://')) {
         var goBackReq = this.iframe.getCanGoBack();
         goBackReq.onsuccess = () => {
           if (goBackReq.result) {

diff --git a/tv_apps/smart-system/js/browser_key_event_manager.js b/tv_apps/smart-system/js/browser_key_event_manager.js
@@ -1,4 +1,7 @@
 'use strict';
+
+/* global KeyboardManager */
+
 (function(exports) {
   var BrowserKeyEventManager = function BrowserKeyEventManager() {
   };
@@ -32,6 +35,7 @@
       'power': 'sleep-button',
       'exit': 'home-button',
       'home': 'home-button',
+      'backspace': 'back-button',
       'mozhomescreen': 'home-button',
       'volumeup': 'volume-up-button',
       'volumedown': 'volume-down-button'
@@ -53,6 +57,12 @@
       var key = this._getLowerCaseKeyName(event);
       return (this.SYSTEM_ONLY_KEYS.indexOf(key) > -1);
     },
+    _isBackspace: function bkem_isBackspace(event) {
+      var key = this._getLowerCaseKeyName(event);
+      return (key === 'backspace' ||
+              event.keyCode === window.KeyEvent.DOM_VK_BACK_SPACE) &&
+        !KeyboardManager.getHasActiveKeyboard();
+    },
     _isAppCancelledKey: function bkem_isAppCancelledKey(event) {
       var key = this._getLowerCaseKeyName(event);
       return (this.APP_CANCELLED_KEYS.indexOf(key) > -1);
@@ -80,11 +90,11 @@
           (this._isBeforeEvent(event) || this._isKeyEvent(event))) {
         event.preventDefault();
         needTranslation = true;
-      } else if (this._isAppCancelledKey(event) && this._isAfterEvent(event)) {
+      } else if (this.isAppCancelledKeyEvent(event) &&
+                 this._isAfterEvent(event)) {
         // if embedded frame cancel the event, we need to translate it then
         needTranslation = !event.embeddedCancelled;
-      } else if (this._isKeyEvent(event) &&
-          !this._targetToIframe(event)) {
+      } else if (this._isKeyEvent(event) && !this._targetToIframe(event)) {
         // When focus is on embedded iframe and user press hardware key, system
         // app will receive an extra keydown keyup event targeted to the iframe.
         // We should ignore this event otherwise we will have strange state
@@ -102,6 +112,9 @@
     isHardwareKeyEvent: function bkem_isHardwareKeyEvent(type) {
       return (this.KEY_EVENTS.indexOf(type) > -1);
     },
+    isAppCancelledKeyEvent: function bkem_isAppCancelledKeyEvent(event) {
+      return this._isAppCancelledKey(event) || this._isBackspace(event);
+    },
     getButtonEventType: function bkem_getButtonEventType(event) {
       var translatedType;
       var key;