0036730: A mechanism to avoid to lose the focus is needed in Mobile Apps

diff -r 9ffd371ff43c web/org.openbravo.mobile.core/source/component/ob-terminal-component.js
--- a/web/org.openbravo.mobile.core/source/component/ob-terminal-component.js	Thu Aug 24 09:59:43 2017 +0200
+++ b/web/org.openbravo.mobile.core/source/component/ob-terminal-component.js	Mon Aug 28 16:27:39 2017 +0200
@@ -19,6 +19,9 @@
   published: {
     scanning: false
   },
+  handlers: {
+    onmousedown: 'mouseDownHandler'
+  },
 
   classes: 'pos-container',
   style: 'height:700px',
@@ -186,6 +189,70 @@
   },
 
   /**
+   * When using focus keeper for barcode scanners, keep always the focus there
+   */
+
+  preventFocusScape: function (loc) {
+    console.log('preventFocusScape ' + loc);
+    var nodes = document.getElementsByTagName("*"),
+        revNodes = [],
+        isFirstMatch = true,
+        i;
+    if (loc === 'asc') {
+      for (i = nodes.length - 1; i > -1; i--) {
+        revNodes.push(nodes[i]);
+      }
+      nodes = revNodes;
+    }
+    for (i = 0; i < nodes.length; i++) {
+      if ((nodes[i].tagName.toLowerCase() === 'button' || nodes[i].tagName.toLowerCase() === 'a' || nodes[i].tagName.toLowerCase() === 'input') && nodes[i].offsetParent && !nodes[i].disabled) {
+        if (isFirstMatch) {
+          isFirstMatch = false;
+        } else {
+          nodes[i].focus();
+          return;
+        }
+      }
+    }
+  },
+
+  setFocusVisualization: function (value) {
+    console.log('setFocusVisualization ' + value);
+    var i, j, styleSht, cssRule;
+    if (document.styleSheets) {
+      for (i = 0; i < document.styleSheets.length; i++) {
+        styleSht = document.styleSheets[i];
+        if (styleSht.cssRules) {
+          for (j = 0; j < styleSht.cssRules.length; j++) {
+            cssRule = styleSht.cssRules[j];
+            if (cssRule.selectorText && cssRule.selectorText.toLowerCase().indexOf('textinput') === -1 && cssRule.selectorText.indexOf('sco') === 1) {
+              // "indexOf('textinput')" check is to ensure that input type 'text' (containing 'textinput' in its css class) always have the focus visualization.
+              // "indexOf('sco')" check is to ensure it only applies to 'sco' classes. Once the WebPOS/AWO/... be reviewed, it could be removed to apply to any mobile.core application.
+              if (!value) {
+                if (cssRule.selectorText && cssRule.selectorText.indexOf('.--tmpFocus') !== -1) {
+                  return;
+                }
+                if (cssRule.selectorText && cssRule.selectorText.indexOf(':focus') !== -1) {
+                  styleSht.insertRule(cssRule.cssText.replace(/:focus/g, '.--tmpFocus'), j);
+                  styleSht.deleteRule(j + 1);
+                }
+              } else {
+                if (cssRule.selectorText && cssRule.selectorText.indexOf(':focus') !== -1) {
+                  return;
+                }
+                if (cssRule.selectorText && cssRule.selectorText.indexOf('.--tmpFocus') !== -1) {
+                  styleSht.insertRule(cssRule.cssText.replace(/\.--tmpFocus/g, ':focus'), j);
+                  styleSht.deleteRule(j + 1);
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  },
+
+  /**
    * Key up on focus keeper. We are using key up event because keydown doesn't work
    * properly on Android Chrome 26
    */
@@ -256,11 +323,20 @@
     });
   },
 
+  mouseDownHandler: function (inSender, inEvent) {
+    this.setFocusVisualization(false);
+  },
+
   /**
    * Global key up event. Used when not using focusKeeper
    */
   keypressHandler: function (inSender, inEvent) {
     var keyCode = inEvent.keyCode;
+    if (keyCode === 9) {
+      console.log('Call to setFocusVisualization TRUE');
+      this.setFocusVisualization(true);
+      return true;
+    }
     if (keyCode === 17) {
       OB.MobileApp.model.ctrlPressed = false;
     }
@@ -325,6 +401,7 @@
 
   rendered: function () {
     var keeper;
+    var focusAscContainer, focusAscInput, focusDescContainer, focusDescInput, firstBodyChild;
     this.inherited(arguments);
     //Do not allow showing context menu (mouse right click)
     window.oncontextmenu = function () {
@@ -365,6 +442,41 @@
       document.body.appendChild(keeper);
     }
     this.scanningFocus();
+
+    focusAscContainer = document.getElementById('_focusAsc');
+    if (!focusAscContainer) {
+      focusAscContainer = document.createElement('div');
+      focusAscContainer.setAttribute('id', '_focusAsc');
+      focusAscContainer.setAttribute('style', 'width: 0px; height: 0px; border: 0px solid; padding: 0px; margin: 0px; position: absolute; top: 18px; left: 18px;');
+      focusAscInput = document.createElement('input');
+      focusAscInput.setAttribute('style', 'width: 0px; height: 0px; border: 0px solid; padding: 0px; margin: 0px;');
+      focusAscInput.setAttribute('onFocus', 'OB.MobileApp.view.preventFocusScape("asc");');
+      focusAscContainer.appendChild(focusAscInput);
+      var firstBodyChild = document.body.firstChild;
+      if (firstBodyChild) {
+        document.body.insertBefore(focusAscContainer, firstBodyChild);
+      } else {
+        document.body.appendChild(focusAscContainer);
+      }
+    }
+
+    focusDescContainer = document.getElementById('_focusDesc');
+    if (!focusDescContainer) {
+      focusDescContainer = document.createElement('div');
+      focusDescContainer.setAttribute('id', '_focusDesc');
+      focusDescContainer.setAttribute('style', 'width: 0px; height: 0px; border: 0px solid; padding: 0px; margin: 0px; position: absolute; bottom: 18px; right: 18px;');
+      focusDescInput = document.createElement('input');
+      focusDescInput.setAttribute('style', 'width: 0px; height: 0px; border: 0px solid; padding: 0px; margin: 0px;');
+      focusDescInput.setAttribute('onFocus', 'OB.MobileApp.view.preventFocusScape("desc");');
+      focusDescContainer.appendChild(focusDescInput);
+      //To ensure that it is drawn as last element of body
+      setTimeout(function () {
+        var focusDescContainer_2 = document.getElementById('_focusDesc');
+        if (!focusDescContainer_2) {
+          document.body.appendChild(focusDescContainer);
+        }
+      }, 500);
+    }
   },
 
   initComponents: function () {