Fixed web panel dragging

This commit is contained in:
Mauro Balades
2024-04-28 23:33:54 +02:00
parent 762c2ad727
commit cae0c8d116
9 changed files with 43 additions and 25 deletions

View File

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

View File

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

View File

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

View File

@@ -6,6 +6,7 @@ var gZenBrowserManagerSidebar = {
_firstRun: 0, _firstRun: 0,
_hasChangedConfig: true, _hasChangedConfig: true,
_splitterElement: null, _splitterElement: null,
_isDragging: false,
contextTab: null, 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", 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.enabled", this.handleEvent.bind(this));
Services.prefs.addObserver("zen.sidebar.pinned", this.handleEvent.bind(this)); Services.prefs.addObserver("zen.sidebar.pinned", this.handleEvent.bind(this));
let sidebar = document.getElementById("zen-sidebar-web-panel"); let sidebar = document.getElementById("zen-sidebar-web-panel");
let computedStyle = window.getComputedStyle(sidebar); this.splitterElement.addEventListener("mousedown", (function(event) {
let maxWidth = parseInt(computedStyle.getPropertyValue("max-width").replace("px", "")); let computedStyle = window.getComputedStyle(sidebar);
let minWidth = parseInt(computedStyle.getPropertyValue("min-width").replace("px", "")); let maxWidth = parseInt(computedStyle.getPropertyValue("max-width").replace("px", ""));
let minWidth = parseInt(computedStyle.getPropertyValue("min-width").replace("px", ""));
let isBeingResized = false;
this.splitterElement.addEventListener("mousedown", function(event) { if (!this._isDragging) { // Prevent multiple resizes
if (!isBeingResized) { // Prevent multiple resizes this._isDragging = true;
isBeingResized = true;
let sidebarWidth = sidebar.getBoundingClientRect().width; let sidebarWidth = sidebar.getBoundingClientRect().width;
let startX = event.clientX; let startX = event.clientX;
let startWidth = sidebarWidth; let startWidth = sidebarWidth;
let mouseMove = function(event) { let mouseMove = (function(event) {
let newWidth = startWidth + event.clientX - startX; let newWidth = startWidth + event.clientX - startX;
if (newWidth <= minWidth+10) { if (newWidth <= minWidth+10) {
newWidth = minWidth+1; newWidth = minWidth+1;
@@ -51,16 +52,17 @@ var gZenBrowserManagerSidebar = {
newWidth = maxWidth-1; newWidth = maxWidth-1;
} }
sidebar.style.width = `${newWidth}px`; 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("mousemove", mouseMove);
document.removeEventListener("mouseup", mouseUp); document.removeEventListener("mouseup", mouseUp);
}; }).bind(this);
document.addEventListener("mousemove", mouseMove); document.addEventListener("mousemove", mouseMove);
document.addEventListener("mouseup", mouseUp); document.addEventListener("mouseup", mouseUp);
} }
}); }).bind(this));
}, },
handleEvent() { handleEvent() {
@@ -79,7 +81,7 @@ var gZenBrowserManagerSidebar = {
_handleClickOutside(event) { _handleClickOutside(event) {
let sidebar = document.getElementById("zen-sidebar-web-panel"); let sidebar = document.getElementById("zen-sidebar-web-panel");
if (!sidebar.hasAttribute("pinned") || !this._currentPanel) { if (!sidebar.hasAttribute("pinned") || !this._currentPanel || this._isDragging) {
return; return;
} }
let target = event.target; let target = event.target;
@@ -141,7 +143,7 @@ var gZenBrowserManagerSidebar = {
_updateArrowScrollMaxHeight(num) { _updateArrowScrollMaxHeight(num) {
let content = document.querySelector("#tabbrowser-arrowscrollbox"); 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`; content.style.maxHeight = `${height}px`;
}, },

View File

@@ -1,7 +1,16 @@
diff --git a/browser/base/content/browser-siteIdentity.js b/browser/base/content/browser-siteIdentity.js 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 --- a/browser/base/content/browser-siteIdentity.js
+++ b/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 = { @@ -1143,6 +1143,12 @@ var gIdentityHandler = {
} }
} }

View File

@@ -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"/>

View File

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

View File

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

View File

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