From 7f0d45ce47970a2d17c12c72262c42fcf21b34e2 Mon Sep 17 00:00:00 2001
From: Calixte Denizet <calixte.denizet@gmail.com>
Date: Thu, 13 Apr 2023 19:15:08 +0200
Subject: [PATCH] [GeckoView] Show the download button by default and add a
 pref to disable it (bug 1827963)

For the moment there is no real consensus on how we should download a pdf on Android.
Hence we keep this solution for the moment but behind a pref (which will be true on
nightly only).
---
 web/app.js               | 23 ++++++++++----------
 web/app_options.js       |  5 +++++
 web/toolbar-geckoview.js | 45 +++++++++++++++++++++++++++++++++-------
 web/viewer-geckoview.css | 11 ++++++----
 4 files changed, 61 insertions(+), 23 deletions(-)

diff --git a/web/app.js b/web/app.js
index 085d13b0f..847915af9 100644
--- a/web/app.js
+++ b/web/app.js
@@ -588,7 +588,17 @@ const PDFViewerApplication = {
     }
 
     if (appConfig.toolbar) {
-      this.toolbar = new Toolbar(appConfig.toolbar, eventBus, this.l10n);
+      if (
+        typeof PDFJSDev === "undefined"
+          ? window.isGECKOVIEW
+          : PDFJSDev.test("GECKOVIEW")
+      ) {
+        if (AppOptions.get("enableFloatingToolbar")) {
+          this.toolbar = new Toolbar(appConfig.toolbar, eventBus, this.l10n);
+        }
+      } else {
+        this.toolbar = new Toolbar(appConfig.toolbar, eventBus, this.l10n);
+      }
     }
 
     if (appConfig.secondaryToolbar) {
@@ -2917,17 +2927,6 @@ function webViewerTouchEnd(evt) {
 }
 
 function webViewerClick(evt) {
-  if (
-    typeof PDFJSDev === "undefined"
-      ? window.isGECKOVIEW
-      : PDFJSDev.test("GECKOVIEW")
-  ) {
-    if (
-      document.activeElement === PDFViewerApplication.appConfig.mainContainer
-    ) {
-      PDFViewerApplication.toolbar?.toggle();
-    }
-  }
   if (!PDFViewerApplication.secondaryToolbar?.isOpen) {
     return;
   }
diff --git a/web/app_options.js b/web/app_options.js
index ce0f96a85..c6a4f2be0 100644
--- a/web/app_options.js
+++ b/web/app_options.js
@@ -88,6 +88,11 @@ const defaultOptions = {
     value: false,
     kind: OptionKind.VIEWER + OptionKind.PREFERENCE,
   },
+  enableFloatingToolbar: {
+    /** @type {boolean} */
+    value: typeof PDFJSDev === "undefined",
+    kind: OptionKind.VIEWER + OptionKind.PREFERENCE,
+  },
   enablePermissions: {
     /** @type {boolean} */
     value: false,
diff --git a/web/toolbar-geckoview.js b/web/toolbar-geckoview.js
index adfa8f644..a873dbacd 100644
--- a/web/toolbar-geckoview.js
+++ b/web/toolbar-geckoview.js
@@ -20,16 +20,24 @@
  * @property {HTMLButtonElement} download - Button to download the document.
  */
 
+const TIME_BEFORE_SHOWING_TOOLBAR = 200;
+
 class Toolbar {
   #buttons;
 
+  #checkForScrollEndBound = this.#checkForScrollEnd.bind(this);
+
   #eventBus;
 
-  #toolbar;
+  #hideBound = this.#hide.bind(this);
 
   #mainContainer;
 
-  #toggleBound = this.toggle.bind(this);
+  #scrollEndTimeoutId = null;
+
+  #showBound = this.#show.bind(this);
+
+  #toolbar;
 
   /**
    * @param {ToolbarOptions} options
@@ -44,6 +52,7 @@ class Toolbar {
 
     // Bind the event listeners for click and various other actions.
     this.#bindListeners(options);
+    this.#checkForScrollEnd();
   }
 
   setPageNumber(pageNumber, pageLabel) {}
@@ -67,12 +76,34 @@ class Toolbar {
 
   updateLoadingIndicatorState(loading = false) {}
 
-  toggle() {
-    if (this.#toolbar.classList.toggle("show")) {
-      this.#mainContainer.addEventListener("scroll", this.#toggleBound);
-    } else {
-      this.#mainContainer.removeEventListener("scroll", this.#toggleBound);
+  #checkForScrollEnd() {
+    if (this.#scrollEndTimeoutId !== null) {
+      clearTimeout(this.#scrollEndTimeoutId);
     }
+    this.#scrollEndTimeoutId = setTimeout(
+      this.#showBound,
+      TIME_BEFORE_SHOWING_TOOLBAR
+    );
+  }
+
+  #show() {
+    this.#toolbar.classList.toggle("show", true);
+    this.#mainContainer.removeEventListener(
+      "scroll",
+      this.#checkForScrollEndBound
+    );
+    this.#scrollEndTimeoutId = null;
+    this.#mainContainer.addEventListener("scroll", this.#hideBound);
+  }
+
+  #hide() {
+    this.#toolbar.classList.toggle("show", false);
+    this.#mainContainer.removeEventListener("scroll", this.#hideBound);
+    this.#mainContainer.addEventListener(
+      "scroll",
+      this.#checkForScrollEndBound
+    );
+    this.#checkForScrollEnd();
   }
 }
 
diff --git a/web/viewer-geckoview.css b/web/viewer-geckoview.css
index 6a37002fa..ddaa204da 100644
--- a/web/viewer-geckoview.css
+++ b/web/viewer-geckoview.css
@@ -19,7 +19,7 @@
   --dir-factor: 1;
   --scale-select-width: 140px;
 
-  --toolbar-icon-opacity: 0.7;
+  --toolbar-icon-opacity: 1;
   --doorhanger-icon-opacity: 0.9;
 
   --main-color: rgba(12, 12, 13, 1);
@@ -158,15 +158,18 @@ body {
   bottom: 5%;
   right: 5%;
   background-color: transparent;
-  z-index: 100000;
+  transition-property: opacity;
+  transition-duration: 400ms;
 }
 
 #floatingToolbar.show {
-  display: block;
+  z-index: 100000;
+  opacity: 1;
 }
 
 #floatingToolbar:not(show) {
-  display: none;
+  z-index: -1;
+  opacity: 0;
 }
 
 .toolbarButton {