First cut of JS closure compiler use for VR HTML UI.

chrome/browser/resources/vr_shell/vr_shell_ui.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 var vrShellUi = (function() {
   'use strict';
 
   let scene = new ui.Scene();
   let sceneManager;
 
@@ skipping 59 matching lines @@
       let pixelY = Math.floor(rect.top);
       let pixelWidth = Math.ceil(rect.right) - pixelX;
       let pixelHeight = Math.ceil(rect.bottom) - pixelY;
 
       let element = new api.UiElement(pixelX, pixelY, pixelWidth, pixelHeight);
       element.setSize(pixelWidth / 1000, pixelHeight / 1000);
 
       // Pull additional custom properties from CSS.
       let style = window.getComputedStyle(domElement);
       element.setTranslation(
-          getStyleFloat(style, '--tranX'),
-          getStyleFloat(style, '--tranY'),
+          getStyleFloat(style, '--tranX'), getStyleFloat(style, '--tranY'),
           getStyleFloat(style, '--tranZ'));
 
       this.uiElementId = scene.addElement(element);
       this.uiAnimationId = -1;
       this.domElement = domElement;
     }
   };
 
   class RoundButton extends DomUiElement {
     constructor(domId, callback) {
@@ skipping 23 matching lines @@
       this.configure(1, 1, 0.015);
     }
 
     onMouseLeave() {
       this.configure(0.8, 0, 0);
     }
   };
 
   class Controls {
     constructor(contentQuadId) {
+      this.enabled = false;
+      this.reloadUiEnabled = false;
+
       this.buttons = [];
       let descriptors = [
-          ['#back', function() {
+        [
+          '#back',
+          function() {
             api.doAction(api.Action.HISTORY_BACK);
-          }],
-          ['#reload', function() {
+          }
+        ],
+        [
+          '#reload',
+          function() {
             api.doAction(api.Action.RELOAD);
-          }],
-          ['#forward', function() {
+          }
+        ],
+        [
+          '#forward',
+          function() {
             api.doAction(api.Action.HISTORY_FORWARD);
-          }],
+          }
+        ],
       ];
 
       /** @const */ var BUTTON_SPACING = 0.136;
 
       let startPosition = -BUTTON_SPACING * (descriptors.length / 2.0 - 0.5);
       for (let i = 0; i < descriptors.length; i++) {
         // Use an invisible parent to simplify Z-axis movement on hover.
         let position = new api.UiElement(0, 0, 0, 0);
         position.setVisible(false);
         position.setTranslation(startPosition + i * BUTTON_SPACING, -0.68, -1);
@@ skipping 45 matching lines @@
       update.setVisible(this.enabled && this.reloadUiEnabled);
       scene.updateElement(this.reloadUiButton.uiElementId, update);
     }
   };
 
   class SecureOriginWarnings {
     constructor() {
       /** @const */ var DISTANCE = 0.7;
       /** @const */ var ANGLE_UP = 16.3 * Math.PI / 180.0;
 
+      this.enabled = false;
+      this.secure = false;
+      this.secureOriginTimer = null;
+
       // Permanent WebVR security warning. This warning is shown near the top of
       // the field of view.
       this.webVrSecureWarning = new DomUiElement('#webvr-not-secure-permanent');
       let update = new api.UiElementUpdate();
       update.setScale(DISTANCE, DISTANCE, 1);
-      update.setTranslation(0, DISTANCE * Math.sin(ANGLE_UP),
-          -DISTANCE * Math.cos(ANGLE_UP));
+      update.setTranslation(
+          0, DISTANCE * Math.sin(ANGLE_UP), -DISTANCE * Math.cos(ANGLE_UP));
       update.setRotation(1.0, 0.0, 0.0, ANGLE_UP);
       update.setHitTestable(false);
       update.setVisible(false);
       update.setLockToFieldOfView(true);
       scene.updateElement(this.webVrSecureWarning.uiElementId, update);
 
       // Temporary WebVR security warning. This warning is shown in the center
       // of the field of view, for a limited period of time.
-      this.transientWarning = new DomUiElement(
-          '#webvr-not-secure-transient');
+      this.transientWarning = new DomUiElement('#webvr-not-secure-transient');
       update = new api.UiElementUpdate();
       update.setScale(DISTANCE, DISTANCE, 1);
       update.setTranslation(0, 0, -DISTANCE);
       update.setHitTestable(false);
       update.setVisible(false);
       update.setLockToFieldOfView(true);
       scene.updateElement(this.transientWarning.uiElementId, update);
     }
 
     setEnabled(enabled) {
       this.enabled = enabled;
       this.updateState();
     }
 
     setSecure(secure) {
       this.secure = secure;
       this.updateState();
     }
 
     updateState() {
       /** @const */ var TRANSIENT_TIMEOUT_MS = 30000;
 
       let visible = (this.enabled && !this.secure);
       if (this.secureOriginTimer) {
         clearInterval(this.secureOriginTimer);
         this.secureOriginTimer = null;
       }
       if (visible) {
-        this.secureOriginTimer = setTimeout(
-            this.onTransientTimer.bind(this), TRANSIENT_TIMEOUT_MS);
+        this.secureOriginTimer =
+            setTimeout(this.onTransientTimer.bind(this), TRANSIENT_TIMEOUT_MS);
       }
       this.showOrHideWarnings(visible);
     }
 
     showOrHideWarnings(visible) {
       let update = new api.UiElementUpdate();
       update.setVisible(visible);
       scene.updateElement(this.webVrSecureWarning.uiElementId, update);
       update = new api.UiElementUpdate();
       update.setVisible(visible);
       scene.updateElement(this.transientWarning.uiElementId, update);
     }
 
     onTransientTimer() {
       let update = new api.UiElementUpdate();
       update.setVisible(false);
       scene.updateElement(this.transientWarning.uiElementId, update);
       this.secureOriginTimer = null;
       scene.flush();
     }
   };
 
   class Omnibox {
     constructor(contentQuadId) {
       this.domUiElement = new DomUiElement('#omni-container');
       this.enabled = false;
+      this.loading = false;
       this.level = 0;
       this.visibilityTimeout = 0;
       this.visibilityTimer = null;
+      this.visibleAfterTransition = false;
       this.nativeState = {};
 
       // Initially invisible.
       let update = new api.UiElementUpdate();
       update.setVisible(false);
       scene.updateElement(this.domUiElement.uiElementId, update);
       this.nativeState.visible = false;
 
       // Listen to the end of transitions, so that the box can be natively
       // hidden after it finishes hiding itself.
-      document.querySelector('#omni').addEventListener('transitionend',
-          this.onAnimationDone.bind(this));
+      document.querySelector('#omni').addEventListener(
+          'transitionend', this.onAnimationDone.bind(this));
     }
 
     getSecurityIconElementId(level) {
       // See security_state.h and getSecurityIconResource() for this mapping.
       switch (level) {
-        case 0: // NONE
-        case 1: // HTTP_SHOW_WARNING
-        case 4: // SECURITY_WARNING
+        case 0:  // NONE
+        case 1:  // HTTP_SHOW_WARNING
+        case 4:  // SECURITY_WARNING
           return '#omni-info-icon';
-        case 2: // SECURE:
-        case 3: // EV_SECURE:
+        case 2:  // SECURE:
+        case 3:  // EV_SECURE:
           return '#omni-lock-icon';
-        case 5: // SECURE_WITH_POLICY_INSTALLED_CERT (ChromeOS only)
-        case 6: // DANGEROUS
+        case 5:  // SECURE_WITH_POLICY_INSTALLED_CERT (ChromeOS only)
+        case 6:  // DANGEROUS
         default:
           return '#omni-warning-icon';
       }
     }
 
     setEnabled(enabled) {
       this.enabled = enabled;
       this.resetVisibilityTimer();
       this.updateState();
     }
@@ skipping 24 matching lines @@
       this.updateState();
     }
 
     resetVisibilityTimer() {
       if (this.visibilityTimer) {
         clearInterval(this.visibilityTimer);
         this.visibilityTimer = null;
       }
       if (this.enabled && this.visibilityTimeout > 0 && !this.loading) {
         this.visibilityTimer = setTimeout(
-          this.onVisibilityTimer.bind(this), this.visibilityTimeout);
+            this.onVisibilityTimer.bind(this), this.visibilityTimeout);
       }
     }
 
     onVisibilityTimer() {
       this.visibilityTimer = null;
       this.updateState();
     }
 
     onAnimationDone(e) {
       if (e.propertyName == 'opacity' && !this.visibleAfterTransition) {
@@ skipping 61 matching lines @@
 
       this.contentQuad.setEnabled(mode == api.Mode.STANDARD && !menuMode);
       this.contentQuad.setFullscreen(fullscreen);
       // TODO(crbug/643815): Set aspect ratio on content quad when available.
       // TODO(amp): Don't show controls in fullscreen once MENU mode lands.
       this.controls.setEnabled(mode == api.Mode.STANDARD && !menuMode);
       this.omnibox.setEnabled(mode == api.Mode.STANDARD && !menuMode);
       // TODO(amp): Don't show controls in CINEMA mode once MENU mode lands.
       this.omnibox.setVisibilityTimeout(
           mode == api.Mode.STANDARD && !menuMode ?
-          0 : OMNIBOX_VISIBILITY_TIMEOUT_MS);
+              0 :
+              OMNIBOX_VISIBILITY_TIMEOUT_MS);
       this.secureOriginWarnings.setEnabled(mode == api.Mode.WEB_VR);
 
-      api.setUiCssSize(uiRootElement.clientWidth, uiRootElement.clientHeight,
-          UI_DPR);
+      api.setUiCssSize(
+          uiRootElement.clientWidth, uiRootElement.clientHeight, UI_DPR);
     }
 
     setSecurityLevel(level) {
       this.omnibox.setSecurityLevel(level);
     }
 
     setWebVRSecureOrigin(secure) {
       this.secureOriginWarnings.setSecure(secure);
     }
 
@@ skipping 32 matching lines @@
     scene.flush();
   }
 
   return {
     initialize: initialize,
     command: command,
   };
 })();
 
 document.addEventListener('DOMContentLoaded', vrShellUi.initialize);