Fixed web panel dragging

.github/workflows/alpha.yml

@@ -339,6 +339,7 @@ jobs:
         run: pnpm import
 
       - name: Bootstrap
+        continue-on-error: true
         run: |
           cd engine
           ./mach --no-interactive bootstrap --application-choice browser 

configs/common/mozconfig

@@ -1,6 +1,8 @@
 # Browser branding
 ac_add_options --enable-update-channel=release
 
+# ac_add_options --with-branding=beta
+
 ac_add_options --with-app-name=${binName}
 export MOZ_USER_DIR="${name}"
 export MOZ_APP_VENDOR="${vendor}"

gluon.json

@@ -29,7 +29,7 @@
       "brandShortName": "Zen Browser",
       "brandFullName": "Zen Browser",
       "release": {
-        "displayVersion": "1.0.0-a.1",
+        "displayVersion": "1.0.0-a.0",
         "github": {
           "repo": "zen-browser/desktop"
         },

src/browser/base/content/ZenSidebarManager.mjs

@@ -6,6 +6,7 @@ var gZenBrowserManagerSidebar = {
   _firstRun: 0,
   _hasChangedConfig: true,
   _splitterElement: null,
+  _isDragging: false,
   contextTab: null,
 
   DEFAULT_MOBILE_USER_AGENT: "Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Mobile Safari/537.36 Edg/114.0.1823.79",
@@ -31,19 +32,19 @@ var gZenBrowserManagerSidebar = {
     Services.prefs.addObserver("zen.sidebar.enabled", this.handleEvent.bind(this));
     Services.prefs.addObserver("zen.sidebar.pinned", this.handleEvent.bind(this));
 
-    let sidebar = document.getElementById("zen-sidebar-web-panel");
-    let computedStyle = window.getComputedStyle(sidebar);
-    let maxWidth = parseInt(computedStyle.getPropertyValue("max-width").replace("px", ""));
-    let minWidth = parseInt(computedStyle.getPropertyValue("min-width").replace("px", ""));
 
-    let isBeingResized = false;
+    let sidebar = document.getElementById("zen-sidebar-web-panel");
-    this.splitterElement.addEventListener("mousedown", function(event) {
+    this.splitterElement.addEventListener("mousedown", (function(event) {
-      if (!isBeingResized) { // Prevent multiple resizes
+      let computedStyle = window.getComputedStyle(sidebar);
-        isBeingResized = true;
+      let maxWidth = parseInt(computedStyle.getPropertyValue("max-width").replace("px", ""));
+      let minWidth = parseInt(computedStyle.getPropertyValue("min-width").replace("px", ""));
+      
+      if (!this._isDragging) { // Prevent multiple resizes
+        this._isDragging = true;
         let sidebarWidth = sidebar.getBoundingClientRect().width;
         let startX = event.clientX;
         let startWidth = sidebarWidth;
-        let mouseMove = function(event) {
+        let mouseMove = (function(event) {
           let newWidth = startWidth + event.clientX - startX;
           if (newWidth <= minWidth+10) {
             newWidth = minWidth+1;
@@ -51,16 +52,17 @@ var gZenBrowserManagerSidebar = {
             newWidth = maxWidth-1;
           }
           sidebar.style.width = `${newWidth}px`;
-        };
+        }).bind(this);
-        let mouseUp = function() {
+        let mouseUp = (function() {
-          isBeingResized = false;
+          this.handleEvent();
+          this._isDragging = false;
           document.removeEventListener("mousemove", mouseMove);
           document.removeEventListener("mouseup", mouseUp);
-        };
+        }).bind(this);
         document.addEventListener("mousemove", mouseMove);
         document.addEventListener("mouseup", mouseUp);
       }
-    });
+    }).bind(this));
   },
 
   handleEvent() {
@@ -79,7 +81,7 @@ var gZenBrowserManagerSidebar = {
 
   _handleClickOutside(event) {
     let sidebar = document.getElementById("zen-sidebar-web-panel");
-    if (!sidebar.hasAttribute("pinned") || !this._currentPanel) {
+    if (!sidebar.hasAttribute("pinned") || !this._currentPanel || this._isDragging) {
       return;
     }
     let target = event.target;
@@ -141,7 +143,7 @@ var gZenBrowserManagerSidebar = {
 
   _updateArrowScrollMaxHeight(num) {
     let content = document.querySelector("#tabbrowser-arrowscrollbox");
-    let height = (this.MAX_SIDEBAR_PANELS - num) * 81;
+    let height = (this.MAX_SIDEBAR_PANELS * 140) - (num * 120);
     content.style.maxHeight = `${height}px`;
   },
 

src/browser/base/content/browser-siteIdentity-js.patch

@@ -1,7 +1,16 @@
 diff --git a/browser/base/content/browser-siteIdentity.js b/browser/base/content/browser-siteIdentity.js
-index a2a5f6ff71b9a6587e2a033aee39385abd319645..789980baee419249c5bb206d6117abe9994631bf 100644
+index a2a5f6ff71b9a6587e2a033aee39385abd319645..8111c6bcffdcfd51d03cc9dea4aac902d57c83d8 100644
 --- a/browser/base/content/browser-siteIdentity.js
 +++ b/browser/base/content/browser-siteIdentity.js
+@@ -825,7 +825,7 @@ var gIdentityHandler = {
+       // This is a secure internal Firefox page.
+       this._identityBox.className = "chromeUI";
+       let brandBundle = document.getElementById("bundle_brand");
+-      icon_label = brandBundle.getString("brandShorterName");
++      icon_label = brandBundle.getString("brandShortName");
+     } else if (this._pageExtensionPolicy) {
+       // This is a WebExtension page.
+       this._identityBox.className = "extensionPage";
 @@ -1143,6 +1143,12 @@ var gIdentityHandler = {
        }
      }

src/browser/components/customizableui/content/zenCustomizationMode.inc.xhtml

@@ -1,4 +1,4 @@
 
-<toolbarseparator id="zen-customization-uidensity-separator"/>
+<toolbarseparator hidden="true" id="zen-customization-uidensity-separator"/>
-<html:input type="range" id="customization-zen-browser-space" min="0" max="16" step="4"></html:input>
+<html:input hidden="true" type="range" id="customization-zen-browser-space" min="0" max="16" step="4"></html:input>
-<label data-l10n-id="customization-zen-browser-space" for="customization-zen-browser-space"/>
+<label hidden="true" data-l10n-id="customization-zen-browser-space" for="customization-zen-browser-space"/>

src/browser/components/zen-welcome/welcome.css

@@ -16,7 +16,7 @@ body {
   width: 100%;
   height: 100%;
   overflow: hidden;
-  background: var(--zen-main-browser-background) !important;
+  /*background: var(--zen-main-browser-background) !important;*/
   transition: .1s;
   -moz-transform: scale(1.1); /* zoom */
 }
@@ -188,5 +188,5 @@ input[type='checkbox'] {
 }
 
 .dot.active {
-  background: var(--in-content-primary-button-background-hover);
+  background: light-dark(#000, #fff);
 }

src/browser/components/zen-welcome/welcome.js

@@ -296,8 +296,8 @@ class Pages {
 
 const pages = new Pages([
   new Page('welcome'),
-  new Import('import'),
   new Themes('theme'),
+  new Import('import'),
   new Search('search'),
   new Thanks('thanks'),
 ])

src/browser/themes/shared/zen-browser-shared.css

@@ -82,6 +82,10 @@
   border-radius: 999px;
 }
 
+#identity-icon-label {
+  padding-inline-start: 8px  !important;
+}
+
 #urlbar #identity-box.chromeUI #identity-icon-box {
   border-radius: 5px !important;
 }