Fixed download button bug

On touch devices, it was impossible to tap the download button on the dino
page after playing the dino game (without reloading the page). This is now
fixed.

Bug: 886603
Change-Id: I61d572850cd5cefa81e667369352c997c1fdac57
Reviewed-on: https://chromium-review.googlesource.com/1234018Reviewed-by: Edward Jung <edwardjung@chromium.org>
Commit-Queue: Dan H <harringtond@chromium.org>
Cr-Commit-Position: refs/heads/master@{#593372}

components/neterror/resources/offline.js

@@ -20,6 +20,8 @@ function Runner(outerContainerId, opt_config) {
   this.outerContainerEl = document.querySelector(outerContainerId);
   this.containerEl = null;
   this.snackbarEl = null;
+  // A div to intercept touch events. Only set while (playing && useTouch).
+  this.touchController = null;
 
   this.config = opt_config || Runner.config;
   // Logical dimensions of the container.
@@ -408,6 +410,7 @@ Runner.prototype = {
     this.touchController.className = Runner.classes.TOUCH_CONTROLLER;
     this.touchController.addEventListener(Runner.events.TOUCHSTART, this);
     this.touchController.addEventListener(Runner.events.TOUCHEND, this);
+    this.outerContainerEl.appendChild(this.touchController);
   },
 
   /**
@@ -491,10 +494,7 @@ Runner.prototype = {
       this.containerEl.style.webkitAnimation = 'intro .4s ease-out 1 both';
       this.containerEl.style.width = this.dimensions.WIDTH + 'px';
 
-      if (this.touchController) {
-        this.outerContainerEl.appendChild(this.touchController);
-      }
-      this.playing = true;
+      this.setPlayStatus(true);
       this.activated = true;
     } else if (this.crashed) {
       this.restart();
@@ -711,7 +711,7 @@ Runner.prototype = {
             this.createTouchController();
           }
           this.loadSounds();
-          this.playing = true;
+          this.setPlayStatus(true);
           this.update();
           if (window.errorPageController) {
             errorPageController.trackEasterEgg();
@@ -832,7 +832,7 @@ Runner.prototype = {
   },
 
   stop: function() {
-    this.playing = false;
+    this.setPlayStatus(false);
     this.paused = true;
     cancelAnimationFrame(this.raqId);
     this.raqId = 0;
@@ -840,7 +840,7 @@ Runner.prototype = {
 
   play: function() {
     if (!this.crashed) {
-      this.playing = true;
+      this.setPlayStatus(true);
       this.paused = false;
       this.tRex.update(0, Trex.status.RUNNING);
       this.time = getTimeStamp();
@@ -852,7 +852,7 @@ Runner.prototype = {
     if (!this.raqId) {
       this.playCount++;
       this.runningTime = 0;
-      this.playing = true;
+      this.setPlayStatus(true);
       this.paused = false;
       this.crashed = false;
       this.distanceRan = 0;
@@ -870,6 +870,12 @@ Runner.prototype = {
     }
   },
 
+  setPlayStatus: function(isPlaying) {
+    if (this.touchController)
+      this.touchController.classList.toggle(HIDDEN_CLASS, !isPlaying);
+    this.playing = isPlaying;
+  },
+
   /**
    * Whether the game should go into arcade mode.
    * @return {boolean}