mirror of
https://github.com/zen-browser/desktop.git
synced 2025-07-07 21:49:58 +02:00
refactor: remove sidebar-related code and update localization references
This commit is contained in:
mr. M
parent
ce8013124b
commit
031926efb7
33 changed files with 226 additions and 1358 deletions
|
|
@ -1,15 +0,0 @@
|
|||
# Zen Side Panels
|
||||
|
||||
The `zen.sidepanels.data` configuration will be a JSON string that follows the following data:
|
||||
|
||||
```json
|
||||
{
|
||||
"data": {
|
||||
"p1": {
|
||||
"url": "https://google.com",
|
||||
"ua": false // "ua" may not be declared! (default: false)
|
||||
}
|
||||
},
|
||||
"index": ["p1"]
|
||||
}
|
||||
```
|
||||
2
l10n
2
l10n
|
|
@ -1 +1 @@
|
|||
Subproject commit 4094426d24cf3e131b5a07775478ed893112e9da
|
||||
Subproject commit 91a004c86085696aff68902dbed72504a0500f75
|
||||
|
|
@ -184,13 +184,6 @@ pref('zen.pinned-tab-manager.close-shortcut-behavior', 'reset-unload-switch');
|
|||
// TODO: Check this out!
|
||||
pref("browser.profiles.enabled", false);
|
||||
|
||||
// Zen webpanels (calling it sidebar due to legacy reasons)
|
||||
pref('zen.sidebar.data', "{\"data\":\n {\"p1\":{\n \"url\":\"https://www.wikipedia.org/\"\n },\n\"p2\":{\n \"url\":\"https://m.twitter.com/\",\n\"ua\": true\n },\n\"p3\": {\n \"url\": \"https://www.youtube.com/\",\n\"ua\": true\n},\n\"p4\": {\n \"url\": \"https://translate.google.com/\",\n\"ua\": true\n},\n\"p5\": {\n \"url\": \"https://todoist.com/\",\n\"ua\": true\n}},\n\"index\":[\"p1\",\"p2\",\"p3\",\"p4\",\"p5\"]}");
|
||||
pref('zen.sidebar.enabled', true);
|
||||
pref('zen.sidebar.close-on-blur', true);
|
||||
pref('zen.sidebar.max-webpanels', 8);
|
||||
pref('zen.sidebar.use-google-favicons', true);
|
||||
|
||||
// Zen Split View
|
||||
pref('zen.splitView.enable-tab-drop', true);
|
||||
pref('zen.splitView.min-resize-width', 7);
|
||||
|
|
|
|||
|
|
@ -334,7 +334,7 @@ var gZenVerticalTabsManager = {
|
|||
type="checkbox"
|
||||
${Services.prefs.getBoolPref(kConfigKey) ? 'checked="true"' : ''}
|
||||
data-lazy-l10n-id="zen-toolbar-context-tabs-right"
|
||||
oncommand="gZenVerticalTabsManager.toggleTabsOnRight();"
|
||||
command="cmd_zenToggleTabsOnRight"
|
||||
/>
|
||||
`);
|
||||
document.getElementById('viewToolbarsMenuSeparator').before(fragment);
|
||||
|
|
|
|||
|
|
@ -1,12 +1,11 @@
|
|||
diff --git a/browser/base/content/browser-box.inc.xhtml b/browser/base/content/browser-box.inc.xhtml
|
||||
index 2ca8bdd2674fb4addf3bbf94ff17abc5c93c6293..49c772ae71e6b3793ff806d22197d3028ff4385f 100644
|
||||
index 2ca8bdd2674fb4addf3bbf94ff17abc5c93c6293..dd965d8d190e8cdacbeb3d80995ad1a906e64079 100644
|
||||
--- a/browser/base/content/browser-box.inc.xhtml
|
||||
+++ b/browser/base/content/browser-box.inc.xhtml
|
||||
@@ -26,7 +26,14 @@
|
||||
@@ -26,7 +26,13 @@
|
||||
<splitter id="sidebar-splitter" class="chromeclass-extrachrome sidebar-splitter" resizebefore="sibling" resizeafter="none" hidden="true"/>
|
||||
<box id="after-splitter"></box>
|
||||
</div>
|
||||
+#include zen-sidebar-panel.inc.xhtml
|
||||
+<vbox flex="1" id="zen-appcontent-wrapper">
|
||||
+<html:div id="zen-appcontent-navbar-container"></html:div>
|
||||
+<hbox id="zen-tabbox-wrapper" flex="1">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
diff --git a/browser/base/content/browser-sets.inc b/browser/base/content/browser-sets.inc
|
||||
index 493c593d66883082c2a4df87c4706f919ea675f8..aaaa833b64b0fd890aa2a0794eaeb7e41f002f06 100644
|
||||
index 269b025d7fb942602c1b1b6c9747540bcde11375..9dcecfe205cadacace5195ec84d8b2ee292a0632 100644
|
||||
--- a/browser/base/content/browser-sets.inc
|
||||
+++ b/browser/base/content/browser-sets.inc
|
||||
@@ -393,3 +393,4 @@
|
||||
@@ -405,3 +405,4 @@
|
||||
internal="true"/>
|
||||
#endif
|
||||
</keyset>
|
||||
+ <keyset id="zenKeyset"></keyset>
|
||||
+#include zen-keysets.inc.xhtml
|
||||
|
|
|
|||
|
|
@ -36,7 +36,6 @@ Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/Zen
|
|||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenThemesImporter.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenCompactMode.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/ZenUIManager.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenSidebarManager.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenTabUnloader.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenPinnedTabsStorage.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenWorkspacesStorage.mjs", this);
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
content/browser/zenThemeModifier.js (content/zenThemeModifier.js)
|
||||
content/browser/ZenStartup.mjs (content/ZenStartup.mjs)
|
||||
content/browser/zen-sets.js (content/zen-sets.js)
|
||||
content/browser/ZenUIManager.mjs (content/ZenUIManager.mjs)
|
||||
content/browser/ZenCustomizableUI.sys.mjs (content/ZenCustomizableUI.sys.mjs)
|
||||
content/browser/zen-components/ZenUIMigration.mjs (zen-components/ZenUIMigration.mjs)
|
||||
|
|
@ -11,7 +12,6 @@
|
|||
content/browser/zen-components/ZenWorkspaces.mjs (zen-components/ZenWorkspaces.mjs)
|
||||
content/browser/zen-components/ZenWorkspacesStorage.mjs (zen-components/ZenWorkspacesStorage.mjs)
|
||||
content/browser/zen-components/ZenWorkspacesSync.mjs (zen-components/ZenWorkspacesSync.mjs)
|
||||
content/browser/zen-components/ZenSidebarManager.mjs (zen-components/ZenSidebarManager.mjs)
|
||||
content/browser/zen-components/ZenKeyboardShortcuts.mjs (zen-components/ZenKeyboardShortcuts.mjs)
|
||||
content/browser/zen-components/ZenThemesImporter.mjs (zen-components/ZenThemesImporter.mjs)
|
||||
content/browser/zen-components/ZenTabUnloader.mjs (zen-components/ZenTabUnloader.mjs)
|
||||
|
|
|
|||
48
src/browser/base/content/zen-keysets.inc.xhtml
Normal file
48
src/browser/base/content/zen-keysets.inc.xhtml
Normal file
|
|
@ -0,0 +1,48 @@
|
|||
<commandset id="zenCommandSet">
|
||||
<command id="cmd_zenCompactModeToggle" />
|
||||
<command id="cmd_zenCompactModeShowSidebar" />
|
||||
<command id="cmd_zenCompactModeShowToolbar" />
|
||||
|
||||
<command id="cmd_zenWorkspaceForward" />
|
||||
<command id="cmd_zenWorkspaceBackward" />
|
||||
|
||||
<command id="cmd_zenSplitViewGrid" />
|
||||
<command id="cmd_zenSplitViewVertical" />
|
||||
<command id="cmd_zenSplitViewHorizontal" />
|
||||
<command id="cmd_zenSplitViewUnsplit" />
|
||||
<command id="cmd_zenSplitViewLinkInNewTab" />
|
||||
|
||||
<!-- Workspace commands -->
|
||||
<command id="cmd_zenWorkspaceSwitch1" />
|
||||
<command id="cmd_zenWorkspaceSwitch2" />
|
||||
<command id="cmd_zenWorkspaceSwitch3" />
|
||||
<command id="cmd_zenWorkspaceSwitch4" />
|
||||
<command id="cmd_zenWorkspaceSwitch5" />
|
||||
<command id="cmd_zenWorkspaceSwitch6" />
|
||||
<command id="cmd_zenWorkspaceSwitch7" />
|
||||
<command id="cmd_zenWorkspaceSwitch8" />
|
||||
<command id="cmd_zenWorkspaceSwitch9" />
|
||||
<command id="cmd_zenWorkspaceSwitch10" />
|
||||
|
||||
<command id="cmd_zenOpenZenThemePicker" />
|
||||
<command id="cmd_zenChangeWorkspaceTabColor" />
|
||||
<command id="cmd_zenToggleTabsOnRight" />
|
||||
|
||||
<command id="cmd_zenReplacePinnedUrlWithCurrent" />
|
||||
<command id="cmd_zenAddToEssentials" />
|
||||
<command id="cmd_zenRemoveFromEssentials" />
|
||||
|
||||
<command id="cmd_zenPinnedTabReset" />
|
||||
<command id="cmd_zenPinnedTabResetNoTab" />
|
||||
|
||||
<command id="cmd_zenToggleSidebar" />
|
||||
|
||||
<command id="cmd_zenCopyCurrentURL" />
|
||||
<command id="cmd_zenCopyCurrentURLMarkdown" />
|
||||
|
||||
<command id="cmd_zenUnloadTab" />
|
||||
<command id="cmd_zenPreventUnloadTab" />
|
||||
<command id="cmd_zenIgnoreUnloadTab" />
|
||||
</commandset>
|
||||
|
||||
<keyset id="zenKeyset"></keyset>
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
<link rel="localization" href="browser/zen-web-side-panels.ftl"/>
|
||||
|
||||
<link rel="localization" href="browser/zen-workspaces.ftl"/>
|
||||
<link rel="localization" href="browser/zen-split-view.ftl"/>
|
||||
<link rel="localization" href="browser/zen-general.ftl"/>
|
||||
|
|
|
|||
|
|
@ -1,86 +1,3 @@
|
|||
<menupopup id="zenWebPanelContextMenu"
|
||||
onpopupshowing="if (event.target == this) gZenBrowserManagerSidebar.updateContextMenu(this);"
|
||||
onpopuphidden="if (event.target == this) gZenBrowserManagerSidebar.contextTab = null;">
|
||||
<menuitem id="context_zenUnloadWebPanel" oncommand="gZenBrowserManagerSidebar.contextUnload();" data-l10n-id="zen-web-side-panel-context-unload"/>
|
||||
<menuitem id="context_zenToggleMuteWebPanel" oncommand="gZenBrowserManagerSidebar.contextToggleMuteAudio();"/>
|
||||
<menuitem id="context_zenOpenNewTabWebPanel" oncommand="gZenBrowserManagerSidebar.contextOpenNewTab();" data-l10n-id="zen-web-side-panel-open-in-new-tab"/>
|
||||
<menuseparator/>
|
||||
<menu id="context_zenWebPanelContextInContainer"
|
||||
data-l10n-id="zen-web-side-panel-context-open-in-container-tab"
|
||||
selection-type="single"
|
||||
node-type="link"
|
||||
hide-if-private-browsing="true"
|
||||
hide-if-usercontext-disabled="true">
|
||||
<menupopup oncommand="gZenBrowserManagerSidebar.contextChangeContainerTab(event);"
|
||||
onpopupshowing="return gZenBrowserManagerSidebar.createContainerTabMenu(event);" />
|
||||
</menu>
|
||||
<menuitem id="context_zenToogleUAWebPanel" oncommand="gZenBrowserManagerSidebar.contextToggleUserAgent();"/>
|
||||
<menuseparator/>
|
||||
<menuitem id="context_zenDeleteWebPanel" oncommand="gZenBrowserManagerSidebar.contextDelete();" data-l10n-id="zen-web-side-panel-context-delete"/>
|
||||
</menupopup>
|
||||
|
||||
<html:template id="template-zen-split-view-modifier">
|
||||
<panel id="zenSplitViewModifier"
|
||||
class="panel-no-padding"
|
||||
orient="vertical"
|
||||
role="alertdialog"
|
||||
type="arrow"
|
||||
onpopupshowing="gZenViewSplitter.disableTabRearrangeView();"
|
||||
aria-labelledby="zen-split-view-modifier-header"
|
||||
tabspecific="true">
|
||||
<panelmultiview id="zenSplitViewModifierMultiview"
|
||||
mainViewId="zenSplitViewModifierViewDefault">
|
||||
<panelview id="zenSplitViewModifierViewDefault"
|
||||
class="PanelUI-subView"
|
||||
role="document"
|
||||
mainview-with-header="true"
|
||||
has-custom-header="true">
|
||||
<box id="zenSplitViewModifierHeader"
|
||||
class="panel-header panel-header-with-additional-element panel-header-with-info-button">
|
||||
<html:h1>
|
||||
<html:span data-l10n-id="zen-split-view-modifier-header"></html:span>
|
||||
</html:h1>
|
||||
<toolbarbutton id="zenSplitViewModifierActivateReallocation"
|
||||
class="panel-info-button"
|
||||
oncommand="gZenViewSplitter.enableTabRearrangeView();"
|
||||
data-l10n-id="zen-split-view-modifier-activate-reallocation">
|
||||
<image/>
|
||||
</toolbarbutton>
|
||||
</box>
|
||||
<hbox id="zenSplitViewModifierContent">
|
||||
<vbox>
|
||||
<box class="zen-split-view-modifier-preview grid">
|
||||
<box></box>
|
||||
<box></box>
|
||||
<box></box>
|
||||
</box>
|
||||
<p>Grid Layout</p>
|
||||
</vbox>
|
||||
<vbox>
|
||||
<box class="zen-split-view-modifier-preview vsep">
|
||||
<box></box>
|
||||
<box></box>
|
||||
</box>
|
||||
<p>Vertical</p>
|
||||
</vbox>
|
||||
<vbox>
|
||||
<box class="zen-split-view-modifier-preview hsep">
|
||||
<box></box>
|
||||
<box></box>
|
||||
</box>
|
||||
<p>Horizontal</p>
|
||||
</vbox>
|
||||
<vbox>
|
||||
<box class="zen-split-view-modifier-preview unsplit">
|
||||
<box></box>
|
||||
</box>
|
||||
<p>Unsplit</p>
|
||||
</vbox>
|
||||
</hbox>
|
||||
</panelview>
|
||||
</panelmultiview>
|
||||
</panel>
|
||||
</html:template>
|
||||
|
||||
<panel flip="side" type="arrow" orient="vertical" id="PanelUI-zen-gradient-generator" position="bottomright topright" mainview="true" side="left" onpopuphidden="gZenThemePicker.handlePanelClose();" onpopupshowing="gZenThemePicker.handlePanelOpen();">
|
||||
<panelmultiview id="PanelUI-zen-gradient-generator-multiview" mainViewId="PanelUI-zen-gradient-generator-view">
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
# the window is fully loaded.
|
||||
# Make sure they are loaded before the global-scripts.inc file.
|
||||
<script type="text/javascript">
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-sets.js", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenCommonUtils.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenKeyboardShortcuts.mjs", this);
|
||||
Services.scriptloader.loadSubScript("chrome://browser/content/zen-components/ZenWorkspaces.mjs", this);
|
||||
|
|
|
|||
92
src/browser/base/content/zen-sets.js
Normal file
92
src/browser/base/content/zen-sets.js
Normal file
|
|
@ -0,0 +1,92 @@
|
|||
document.addEventListener(
|
||||
'MozBeforeInitialXULLayout',
|
||||
() => {
|
||||
// <commandset id="mainCommandSet"> defined in browser-sets.inc
|
||||
document
|
||||
.getElementById('zenCommandSet')
|
||||
// eslint-disable-next-line complexity
|
||||
.addEventListener('command', (event) => {
|
||||
switch (event.target.id) {
|
||||
case 'cmd_zenCompactModeToggle':
|
||||
gZenCompactModeManager.toggle();
|
||||
break;
|
||||
case 'cmd_zenCompactModeShowSidebar':
|
||||
gZenCompactModeManager.toggleSidebar();
|
||||
break;
|
||||
case 'cmd_zenCompactModeShowToolbar':
|
||||
gZenCompactModeManager.toggleToolbar();
|
||||
break;
|
||||
case 'cmd_zenWorkspaceForward':
|
||||
ZenWorkspaces.changeWorkspaceShortcut();
|
||||
break;
|
||||
case 'cmd_zenWorkspaceBackward':
|
||||
ZenWorkspaces.changeWorkspaceShortcut(-1);
|
||||
break;
|
||||
case 'cmd_zenSplitViewGrid':
|
||||
gZenViewSplitter.toggleShortcut('grid');
|
||||
break;
|
||||
case 'cmd_zenSplitViewVertical':
|
||||
gZenViewSplitter.toggleShortcut('vsep');
|
||||
break;
|
||||
case 'cmd_zenSplitViewHorizontal':
|
||||
gZenViewSplitter.toggleShortcut('hsep');
|
||||
break;
|
||||
case 'cmd_zenSplitViewUnsplit':
|
||||
gZenViewSplitter.toggleShortcut('unsplit');
|
||||
break;
|
||||
case 'cmd_zenCopyCurrentURLMarkdown':
|
||||
gZenCommonActions.copyCurrentURLAsMarkdownToClipboard();
|
||||
break;
|
||||
case 'cmd_zenCopyCurrentURL':
|
||||
gZenCommonActions.copyCurrentURLToClipboard();
|
||||
break;
|
||||
case 'cmd_zenPinnedTabReset':
|
||||
gZenPinnedTabManager.resetPinnedTab(gBrowser.selectedTab);
|
||||
break;
|
||||
case 'cmd_zenPinnedTabResetNoTab':
|
||||
gZenPinnedTabManager.resetPinnedTab();
|
||||
break;
|
||||
case 'cmd_zenToggleSidebar':
|
||||
gZenVerticalTabsManager.toggleExpand();
|
||||
break;
|
||||
case 'cmd_zenOpenZenThemePicker':
|
||||
gZenThemePicker.openThemePicker(event);
|
||||
break;
|
||||
case 'cmd_zenChangeWorkspaceTab':
|
||||
ZenWorkspaces.changeTabWorkspace(event.target.getAttribute('zen-workspace-id'));
|
||||
break;
|
||||
case 'cmd_zenToggleTabsOnRight':
|
||||
gZenVerticalTabsManager.toggleTabsOnRight();
|
||||
break;
|
||||
case 'cmd_zenSplitViewLinkInNewTab':
|
||||
gZenViewSplitter.splitLinkInNewTab();
|
||||
break;
|
||||
case 'cmd_zenReplacePinnedUrlWithCurrent':
|
||||
gZenPinnedTabManager.replacePinnedUrlWithCurrent();
|
||||
break;
|
||||
case 'cmd_zenAddToEssentials':
|
||||
gZenPinnedTabManager.addToEssentials();
|
||||
break;
|
||||
case 'cmd_zenRemoveFromEssentials':
|
||||
gZenPinnedTabManager.removeEssentials();
|
||||
break;
|
||||
case 'cmd_zenUnloadTab':
|
||||
gZenTabUnloader.unloadTab();
|
||||
break;
|
||||
case 'cmd_zenPreventUnloadTab':
|
||||
gZenTabUnloader.preventUnloadTab();
|
||||
break;
|
||||
case 'cmd_zenIgnoreUnloadTab':
|
||||
gZenTabUnloader.ignoreUnloadTab();
|
||||
break;
|
||||
default:
|
||||
if (event.target.id.startsWith('cmd_zenWorkspaceSwitch')) {
|
||||
const index = parseInt(event.target.id.replace('cmd_zenWorkspaceSwitch', ''), 10) - 1;
|
||||
ZenWorkspaces.shortcutSwitchTo(index);
|
||||
}
|
||||
break;
|
||||
}
|
||||
});
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
|
|
@ -9,6 +9,5 @@
|
|||
context="toolbar-context-menu"
|
||||
mode="icons">
|
||||
<toolbarbutton removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-expand-sidebar-button" data-l10n-id="sidebar-zen-expand" cui-areatype="toolbar" oncommand="gZenVerticalTabsManager.toggleExpand();"></toolbarbutton>
|
||||
<toolbarbutton removable="true" class="toolbarbutton-1 zen-sidebar-action-button zen-compact-mode-ignore" id="zen-sidepanel-button" data-l10n-id="sidebar-zen-sidepanel" onclick="gZenBrowserManagerSidebar.toggle();"></toolbarbutton>
|
||||
<toolbarbutton id="zen-workspaces-button" class="chromeclass-toolbar-additional" overflows="false" removable="false"></toolbarbutton>
|
||||
</toolbar>
|
||||
|
|
|
|||
|
|
@ -1,34 +0,0 @@
|
|||
<hbox id="zen-sidebar-web-panel-wrapper">
|
||||
<box id="zen-sidebar-web-panel" class="chromeclass-extrachrome" hidden="true" persist="pinned style hidden" pinned="true">
|
||||
<toolbar mode="icons" flex="1" id="zen-sidebar-web-header" fullscreentoolbar="true">
|
||||
<hbox>
|
||||
<toolbarbutton id="zen-sidebar-web-panel-back" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.back();"/>
|
||||
<toolbarbutton id="zen-sidebar-web-panel-forward" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.forward();"/>
|
||||
<toolbarbutton id="zen-sidebar-web-panel-reload" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.reload();"/>
|
||||
</hbox>
|
||||
<hbox id="zen-sidebar-web-panel-title" flex="1">
|
||||
</hbox>
|
||||
<hbox>
|
||||
<toolbarbutton id="zen-sidebar-web-panel-home" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.home();"/>
|
||||
<toolbarbutton id="zen-sidebar-web-panel-pinned" class="toolbarbutton-1 chromeclass-toolbar-additional" pinned="true" oncommand="gZenBrowserManagerSidebar.togglePinned(this);"/>
|
||||
<toolbarbutton id="zen-sidebar-web-panel-close" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.close();"/>
|
||||
</hbox>
|
||||
</toolbar>
|
||||
<vbox id="zen-sidebar-web-panel-browser-containers">
|
||||
<vbox id="zen-sidebar-introduction-panel" hidden="true">
|
||||
<html:h1 data-l10n-id="zen-webpanel-introduction-title"/>
|
||||
<html:p data-l10n-id="zen-webpanel-introduction-description"/>
|
||||
</vbox>
|
||||
</vbox>
|
||||
<toolbar mode="icons" flex="1" id="zen-sidebar-panels-wrapper" fullscreentoolbar="true">
|
||||
<toolbar mode="icons" flex="1" id="zen-sidebar-panels-sites" fullscreentoolbar="true">
|
||||
|
||||
</toolbar>
|
||||
<toolbarbutton id="zen-sidebar-add-panel-button" class="zen-sidebar-panel-button toolbarbutton-1 chromeclass-toolbar-additional" onclick="gZenBrowserManagerSidebar._openAddPanelDialog();"/>
|
||||
</toolbar>
|
||||
<html:span class="zen-sidebar-web-panel-splitter" side="left"></html:span>
|
||||
<html:span class="zen-sidebar-web-panel-splitter" side="right"></html:span>
|
||||
<html:span class="zen-sidebar-web-panel-splitter" orient="horizontal" side="top"></html:span>
|
||||
<html:span class="zen-sidebar-web-panel-splitter" orient="horizontal" side="bottom"></html:span>
|
||||
</box>
|
||||
</hbox>
|
||||
|
|
@ -106,113 +106,6 @@
|
|||
display: flex !important;
|
||||
}
|
||||
|
||||
/* Split view panel */
|
||||
|
||||
#zenSplitViewModifierViewDefault {
|
||||
min-width: 180px;
|
||||
min-height: 180px;
|
||||
|
||||
padding: 15px;
|
||||
padding-top: 12px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent > vbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview {
|
||||
border-radius: 5px;
|
||||
border: 1px solid var(--zen-colors-border);
|
||||
width: 100px;
|
||||
height: 70px;
|
||||
overflow: hidden;
|
||||
padding: 5px;
|
||||
user-select: none;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.active {
|
||||
box-shadow: 0 0 0 2px var(--zen-primary-color);
|
||||
border-width: 0px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent p {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview {
|
||||
& box {
|
||||
background-color: var(--zen-colors-secondary);
|
||||
border-radius: 3px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
transition: 0.1s;
|
||||
}
|
||||
|
||||
&:hover box {
|
||||
background-color: var(--zen-primary-color);
|
||||
}
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.hsep {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.hsep box:last-child {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.vsep box:last-child {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.grid {
|
||||
display: grid;
|
||||
grid-template-areas: 'a b' 'c b';
|
||||
gap: 5px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.grid box:nth-child(1) {
|
||||
grid-area: a;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.grid box:nth-child(2) {
|
||||
grid-area: b;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierContent .zen-split-view-modifier-preview.grid box:nth-child(3) {
|
||||
grid-area: c;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierHeader {
|
||||
min-height: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
#zenSplitViewModifierEnabledToast {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#zenSplitViewModifier:not([has-enabled-realloc])[toast] #zenSplitViewModifierEnabledToast {
|
||||
display: revert;
|
||||
}
|
||||
|
||||
.zen-view-splitter-header-container {
|
||||
position: absolute;
|
||||
top: calc(var(--zen-split-column-gap) / -2);
|
||||
|
|
|
|||
|
|
@ -52,7 +52,7 @@
|
|||
const menu = window.MozXULElement.parseXULToFragment(`
|
||||
<menuitem id="zenToolbarThemePicker"
|
||||
data-lazy-l10n-id="zen-workspaces-change-gradient"
|
||||
oncommand="gZenThemePicker.openThemePicker(event);"/>
|
||||
command="cmd_zenOpenZenThemePicker"/>
|
||||
`);
|
||||
document.getElementById('toolbar-context-customize').before(menu);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -403,12 +403,8 @@ class KeyShortcut {
|
|||
}
|
||||
key.setAttribute('modifiers', this.#modifiers.toString());
|
||||
if (this.#action) {
|
||||
if (this.#action?.startsWith('code:')) {
|
||||
key.setAttribute('oncommand', this.#action.substring(5));
|
||||
} else {
|
||||
key.setAttribute('command', this.#action);
|
||||
}
|
||||
}
|
||||
if (this.#disabled) {
|
||||
key.setAttribute('disabled', this.#disabled);
|
||||
}
|
||||
|
|
@ -442,6 +438,11 @@ class KeyShortcut {
|
|||
return this.#action;
|
||||
}
|
||||
|
||||
// Only used for migration!
|
||||
_setAction(action) {
|
||||
this.#action = action;
|
||||
}
|
||||
|
||||
getL10NID() {
|
||||
return this.#l10nId;
|
||||
}
|
||||
|
|
@ -603,7 +604,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_COMPACT_MODE_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
'code:gZenCompactModeManager.toggle()',
|
||||
'cmd_zenCompactModeToggle',
|
||||
'zen-compact-mode-shortcut-toggle'
|
||||
)
|
||||
);
|
||||
|
|
@ -614,7 +615,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_COMPACT_MODE_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
'code:gZenCompactModeManager.toggleSidebar()',
|
||||
'cmd_zenCompactModeShowSidebar',
|
||||
'zen-compact-mode-shortcut-show-sidebar'
|
||||
)
|
||||
);
|
||||
|
|
@ -625,12 +626,12 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_COMPACT_MODE_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
'code:gZenCompactModeManager.toggleToolbar()',
|
||||
'cmd_zenCompactModeShowToolbar',
|
||||
'zen-compact-mode-shortcut-show-toolbar'
|
||||
)
|
||||
);
|
||||
|
||||
// Workspace's keyset
|
||||
// Workspace shortcuts
|
||||
for (let i = 10; i > 0; i--) {
|
||||
newShortcutList.push(
|
||||
new KeyShortcut(
|
||||
|
|
@ -639,7 +640,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_WORKSPACE_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({}),
|
||||
`code:ZenWorkspaces.shortcutSwitchTo(${i - 1})`,
|
||||
`cmd_zenWorkspaceSwitch${i}`,
|
||||
`zen-workspace-shortcut-switch-${i}`
|
||||
)
|
||||
);
|
||||
|
|
@ -651,7 +652,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_WORKSPACE_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
'code:ZenWorkspaces.changeWorkspaceShortcut()',
|
||||
'cmd_zenWorkspaceForward',
|
||||
'zen-workspace-shortcut-forward'
|
||||
)
|
||||
);
|
||||
|
|
@ -662,24 +663,11 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_WORKSPACE_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
'code:ZenWorkspaces.changeWorkspaceShortcut(-1)',
|
||||
'cmd_zenWorkspaceBackward',
|
||||
'zen-workspace-shortcut-backward'
|
||||
)
|
||||
);
|
||||
|
||||
// Other keyset
|
||||
newShortcutList.push(
|
||||
new KeyShortcut(
|
||||
'zen-toggle-web-panel',
|
||||
'P',
|
||||
'',
|
||||
ZEN_OTHER_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ alt: true }),
|
||||
'code:gZenBrowserManagerSidebar.toggle()',
|
||||
'zen-web-panel-shortcut-toggle'
|
||||
)
|
||||
);
|
||||
|
||||
// Split view
|
||||
newShortcutList.push(
|
||||
new KeyShortcut(
|
||||
|
|
@ -688,7 +676,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_SPLIT_VIEW_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
"code:gZenViewSplitter.toggleShortcut('grid')",
|
||||
'cmd_zenSplitViewGrid',
|
||||
'zen-split-view-shortcut-grid'
|
||||
)
|
||||
);
|
||||
|
|
@ -699,7 +687,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_SPLIT_VIEW_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
"code:gZenViewSplitter.toggleShortcut('vsep')",
|
||||
'cmd_zenSplitViewVertical',
|
||||
'zen-split-view-shortcut-vertical'
|
||||
)
|
||||
);
|
||||
|
|
@ -710,7 +698,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_SPLIT_VIEW_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
"code:gZenViewSplitter.toggleShortcut('hsep')",
|
||||
'cmd_zenSplitViewHorizontal',
|
||||
'zen-split-view-shortcut-horizontal'
|
||||
)
|
||||
);
|
||||
|
|
@ -721,7 +709,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
'',
|
||||
ZEN_SPLIT_VIEW_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, alt: true }),
|
||||
"code:gZenViewSplitter.toggleShortcut('unsplit')",
|
||||
'cmd_zenSplitViewUnsplit',
|
||||
'zen-split-view-shortcut-unsplit'
|
||||
)
|
||||
);
|
||||
|
|
@ -756,7 +744,7 @@ class ZenKeyboardShortcutsLoader {
|
|||
}
|
||||
|
||||
class ZenKeyboardShortcutsVersioner {
|
||||
static LATEST_KBS_VERSION = 8;
|
||||
static LATEST_KBS_VERSION = 9;
|
||||
|
||||
constructor() {}
|
||||
|
||||
|
|
@ -848,7 +836,7 @@ class ZenKeyboardShortcutsVersioner {
|
|||
'',
|
||||
ZEN_OTHER_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({}),
|
||||
'code:gZenPinnedTabManager.resetPinnedTab(gBrowser.selectedTab)',
|
||||
'cmd_zenPinnedTabReset',
|
||||
'zen-pinned-tab-shortcut-reset'
|
||||
)
|
||||
);
|
||||
|
|
@ -885,7 +873,7 @@ class ZenKeyboardShortcutsVersioner {
|
|||
'',
|
||||
ZEN_OTHER_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ alt: true }),
|
||||
'code:gZenVerticalTabsManager.toggleExpand()',
|
||||
'cmd_zenToggleSidebar',
|
||||
'zen-sidebar-shortcut-toggle'
|
||||
)
|
||||
);
|
||||
|
|
@ -900,7 +888,7 @@ class ZenKeyboardShortcutsVersioner {
|
|||
'',
|
||||
ZEN_OTHER_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, shift: true }),
|
||||
'code:gZenCommonActions.copyCurrentURLToClipboard()',
|
||||
'cmd_zenCopyCurrentURL',
|
||||
'zen-text-action-copy-url-shortcut'
|
||||
)
|
||||
);
|
||||
|
|
@ -932,11 +920,50 @@ class ZenKeyboardShortcutsVersioner {
|
|||
'',
|
||||
ZEN_OTHER_SHORTCUTS_GROUP,
|
||||
KeyShortcutModifiers.fromObject({ accel: true, shift: true, alt: true }),
|
||||
'code:gZenCommonActions.copyCurrentURLAsMarkdownToClipboard()',
|
||||
'cmd_zenCopyCurrentURLMarkdown',
|
||||
'zen-text-action-copy-url-markdown-shortcut'
|
||||
)
|
||||
);
|
||||
}
|
||||
if (version < 9) {
|
||||
// Migrate from version 8 to 9
|
||||
// Due to security concerns, replace "code:" actions with corresponding <command> IDs
|
||||
// we also remove 'zen-toggle-web-panel' since it's not used anymore
|
||||
data = data.filter((shortcut) => shortcut.getID() != 'zen-toggle-web-panel');
|
||||
for (let shortcut of data) {
|
||||
if (shortcut.getAction()?.startsWith('code:')) {
|
||||
const id = shortcut.getID();
|
||||
|
||||
// Map old shortcut IDs to new <command> IDs
|
||||
const commandMap = {
|
||||
'zen-compact-mode-toggle': 'cmd_zenCompactModeToggle',
|
||||
'zen-compact-mode-show-sidebar': 'cmd_zenCompactModeShowSidebar',
|
||||
'zen-compact-mode-show-toolbar': 'cmd_zenCompactModeShowToolbar',
|
||||
'zen-workspace-forward': 'cmd_zenWorkspaceForward',
|
||||
'zen-workspace-backward': 'cmd_zenWorkspaceBackward',
|
||||
'zen-split-view-grid': 'cmd_zenSplitViewGrid',
|
||||
'zen-split-view-vertical': 'cmd_zenSplitViewVertical',
|
||||
'zen-split-view-horizontal': 'cmd_zenSplitViewHorizontal',
|
||||
'zen-split-view-unsplit': 'cmd_zenSplitViewUnsplit',
|
||||
'zen-copy-url': 'cmd_zenCopyCurrentURL',
|
||||
'zen-copy-url-markdown': 'cmd_zenCopyCurrentURLMarkdown',
|
||||
'zen-pinned-tab-reset-shortcut': 'cmd_zenPinnedTabReset',
|
||||
'zen-toggle-sidebar': 'cmd_zenToggleSidebar',
|
||||
};
|
||||
|
||||
// Dynamically handle workspace switch shortcuts (zen-workspace-switch-1 to 10)
|
||||
if (id?.startsWith('zen-workspace-switch-')) {
|
||||
const num = id.replace('zen-workspace-switch-', '');
|
||||
commandMap[id] = `cmd_zenWorkspaceSwitch${num}`;
|
||||
}
|
||||
|
||||
// Replace action if a corresponding command exists
|
||||
if (commandMap[id]) {
|
||||
shortcut._setAction(commandMap[id]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return data;
|
||||
}
|
||||
}
|
||||
|
|
@ -944,6 +971,7 @@ class ZenKeyboardShortcutsVersioner {
|
|||
var gZenKeyboardShortcutsManager = {
|
||||
loader: new ZenKeyboardShortcutsLoader(),
|
||||
_hasToLoadDevtools: false,
|
||||
_inlineCommands: [],
|
||||
|
||||
beforeInit() {
|
||||
if (!this.inBrowserView) {
|
||||
|
|
|
|||
|
|
@ -442,9 +442,7 @@ class ZenMediaController {
|
|||
|
||||
onMediaFocus() {
|
||||
if (!this._currentBrowser) return;
|
||||
const sidebarId = this._currentBrowser.getAttribute('zen-sidebar-id');
|
||||
if (sidebarId) gZenBrowserManagerSidebar.open(sidebarId);
|
||||
else this._currentMediaController?.focus();
|
||||
this._currentMediaController?.focus();
|
||||
}
|
||||
|
||||
onMediaMute() {
|
||||
|
|
|
|||
|
|
@ -672,11 +672,11 @@
|
|||
<menuitem id="context_zen-replace-pinned-url-with-current"
|
||||
data-lazy-l10n-id="tab-context-zen-replace-pinned-url-with-current"
|
||||
hidden="true"
|
||||
oncommand="gZenPinnedTabManager.replacePinnedUrlWithCurrent();"/>
|
||||
command="cmd_zenReplacePinnedUrlWithCurrent"/>
|
||||
<menuitem id="context_zen-reset-pinned-tab"
|
||||
data-lazy-l10n-id="tab-context-zen-reset-pinned-tab"
|
||||
hidden="true"
|
||||
oncommand="gZenPinnedTabManager.resetPinnedTab();"/>
|
||||
command="cmd_zenPinnedTabResetNoTab"/>
|
||||
`);
|
||||
document.getElementById('tabContextMenu').appendChild(elements);
|
||||
|
||||
|
|
@ -684,11 +684,11 @@
|
|||
<menuitem id="context_zen-add-essential"
|
||||
data-lazy-l10n-id="tab-context-zen-add-essential"
|
||||
hidden="true"
|
||||
oncommand="gZenPinnedTabManager.addToEssentials();"/>
|
||||
command="cmd_zenAddToEssentials"/>
|
||||
<menuitem id="context_zen-remove-essential"
|
||||
data-lazy-l10n-id="tab-context-zen-remove-essential"
|
||||
hidden="true"
|
||||
oncommand="gZenPinnedTabManager.removeEssentials();"/>
|
||||
command="cmd_zenRemoveFromEssentials"/>
|
||||
`);
|
||||
|
||||
document.getElementById('context_pinTab')?.before(element);
|
||||
|
|
|
|||
|
|
@ -1,795 +0,0 @@
|
|||
class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
|
||||
_sidebarElement = null;
|
||||
_currentPanel = null;
|
||||
_lastOpenedPanel = null;
|
||||
_hasChangedConfig = true;
|
||||
_splitterElement = null;
|
||||
_hSplitterElement = null;
|
||||
_hasRegisteredPinnedClickOutside = false;
|
||||
_isDragging = false;
|
||||
contextTab = null;
|
||||
sidebar = null;
|
||||
forwardButton = null;
|
||||
backButton = null;
|
||||
progressListener = null;
|
||||
_tabBrowserSet = new WeakMap();
|
||||
tabBox;
|
||||
|
||||
DEFAULT_MOBILE_USER_AGENT = `Mozilla/5.0 (Android 12; Mobile; rv:129.0) Gecko/20100101 Firefox/${AppConstants.ZEN_FIREFOX_VERSION}`;
|
||||
MAX_SIDEBAR_PANELS = Services.prefs.getIntPref('zen.sidebar.max-webpanels');
|
||||
|
||||
init() {
|
||||
ChromeUtils.defineLazyGetter(this, 'sidebar', () => document.getElementById('zen-sidebar-web-panel'));
|
||||
ChromeUtils.defineLazyGetter(this, 'forwardButton', () => document.getElementById('zen-sidebar-web-panel-forward'));
|
||||
ChromeUtils.defineLazyGetter(this, 'backButton', () => document.getElementById('zen-sidebar-web-panel-back'));
|
||||
ChromeUtils.defineLazyGetter(this, 'tabBox', () => document.getElementById('tabbrowser-tabbox'));
|
||||
|
||||
this.onlySafeWidthAndHeight();
|
||||
|
||||
this.initProgressListener();
|
||||
this.close(); // avoid caching
|
||||
this.tabBox.prepend(this.sidebarWrapper);
|
||||
this.listenForPrefChanges();
|
||||
this.insertIntoContextMenu();
|
||||
this.addPositioningListeners();
|
||||
this.syncPinnedState();
|
||||
}
|
||||
|
||||
onlySafeWidthAndHeight() {
|
||||
const panel = this.sidebar;
|
||||
const width = panel.style.width;
|
||||
const height = panel.style.height;
|
||||
panel.setAttribute('style', '');
|
||||
panel.style.width = width;
|
||||
panel.style.height = height;
|
||||
}
|
||||
|
||||
initProgressListener() {
|
||||
this.progressListener = {
|
||||
QueryInterface: ChromeUtils.generateQI(['nsIWebProgressListener', 'nsISupportsWeakReference']),
|
||||
onLocationChange: function (aWebProgress, aRequest, aLocation, aFlags) {
|
||||
const browser = this._getCurrentBrowser();
|
||||
if (!browser) return;
|
||||
const forwardDisabled = this.forwardButton.hasAttribute('disabled');
|
||||
const backDisabled = this.backButton.hasAttribute('disabled');
|
||||
|
||||
if (browser.canGoForward === forwardDisabled) {
|
||||
if (browser.canGoForward) {
|
||||
this.forwardButton.removeAttribute('disabled');
|
||||
} else {
|
||||
this.forwardButton.setAttribute('disabled', true);
|
||||
}
|
||||
}
|
||||
if (browser.canGoBack === backDisabled) {
|
||||
if (browser.canGoBack) {
|
||||
this.backButton.removeAttribute('disabled');
|
||||
} else {
|
||||
this.backButton.setAttribute('disabled', true);
|
||||
}
|
||||
}
|
||||
}.bind(gZenBrowserManagerSidebar),
|
||||
};
|
||||
}
|
||||
|
||||
get sidebarData() {
|
||||
let services = Services.prefs.getStringPref('zen.sidebar.data');
|
||||
if (services === '') {
|
||||
return {};
|
||||
}
|
||||
return JSON.parse(services);
|
||||
}
|
||||
|
||||
get shouldCloseOnBlur() {
|
||||
return Services.prefs.getBoolPref('zen.sidebar.close-on-blur');
|
||||
}
|
||||
|
||||
listenForPrefChanges() {
|
||||
Services.prefs.addObserver('zen.sidebar.data', this.handleEvent.bind(this));
|
||||
Services.prefs.addObserver('zen.sidebar.enabled', this.handleEvent.bind(this));
|
||||
|
||||
this.handleEvent();
|
||||
}
|
||||
|
||||
addPositioningListeners() {
|
||||
this.sidebar
|
||||
.querySelectorAll('.zen-sidebar-web-panel-splitter')
|
||||
.forEach((s) => s.addEventListener('mousedown', this.handleSplitterMouseDown.bind(this)));
|
||||
this.sidebarHeader.addEventListener('mousedown', this.handleDragPanel.bind(this));
|
||||
window.addEventListener('resize', this.onWindowResize.bind(this));
|
||||
}
|
||||
|
||||
syncPinnedState() {
|
||||
const sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
const pinButton = document.getElementById('zen-sidebar-web-panel-pinned');
|
||||
|
||||
if (sidebar.hasAttribute('pinned')) {
|
||||
pinButton.setAttribute('pinned', 'true');
|
||||
} else {
|
||||
pinButton.removeAttribute('pinned');
|
||||
}
|
||||
}
|
||||
|
||||
handleSplitterMouseDown(mouseDownEvent) {
|
||||
if (this._isDragging) return;
|
||||
this._isDragging = true;
|
||||
|
||||
const isHorizontal = mouseDownEvent.target.getAttribute('orient') === 'horizontal';
|
||||
setCursor(isHorizontal ? 'ns-resize' : 'ew-resize');
|
||||
const reverse = ['left', 'top'].includes(mouseDownEvent.target.getAttribute('side'));
|
||||
const direction = isHorizontal ? 'height' : 'width';
|
||||
const axis = isHorizontal ? 'Y' : 'X';
|
||||
|
||||
const computedStyle = window.getComputedStyle(this.sidebar);
|
||||
const maxSize = parseInt(computedStyle.getPropertyValue(`max-${direction}`).match(/(\d+)px/)?.[1]) || Infinity;
|
||||
const minSize = parseInt(computedStyle.getPropertyValue(`min-${direction}`).match(/(\d+)px/)?.[1]) || 0;
|
||||
|
||||
const sidebarSizeStart = this.sidebar.getBoundingClientRect()[direction];
|
||||
|
||||
const startPos = mouseDownEvent[`screen${axis}`];
|
||||
|
||||
const toAdjust = isHorizontal ? 'top' : 'left';
|
||||
const sidebarPosStart = parseInt(this.sidebar.style[toAdjust].match(/\d+/));
|
||||
|
||||
let mouseMove = function (e) {
|
||||
let mouseMoved = e[`screen${axis}`] - startPos;
|
||||
if (reverse) {
|
||||
mouseMoved *= -1;
|
||||
}
|
||||
let newSize = sidebarSizeStart + mouseMoved;
|
||||
let currentMax = maxSize;
|
||||
const wrapperBox = this.sidebarWrapper.getBoundingClientRect();
|
||||
let maxWrapperSize = Infinity;
|
||||
if (this.isFloating) {
|
||||
maxWrapperSize = reverse ? sidebarPosStart + sidebarSizeStart : wrapperBox[direction] - sidebarPosStart;
|
||||
}
|
||||
newSize = Math.max(minSize, Math.min(currentMax, maxWrapperSize, newSize));
|
||||
|
||||
window.requestAnimationFrame(() => {
|
||||
if (reverse) {
|
||||
const actualMoved = newSize - sidebarSizeStart;
|
||||
this.sidebar.style[toAdjust] = sidebarPosStart - actualMoved + 'px';
|
||||
}
|
||||
this.sidebar.style[direction] = `${newSize}px`;
|
||||
});
|
||||
}.bind(this);
|
||||
|
||||
document.addEventListener('mousemove', mouseMove);
|
||||
document.addEventListener(
|
||||
'mouseup',
|
||||
() => {
|
||||
document.removeEventListener('mousemove', mouseMove);
|
||||
this._isDragging = false;
|
||||
setCursor('auto');
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
}
|
||||
|
||||
handleDragPanel(mouseDownEvent) {
|
||||
if (this.sidebarHeaderButtons.find((b) => b.contains(mouseDownEvent.target))) {
|
||||
return;
|
||||
}
|
||||
this._isDragging = true;
|
||||
const startTop = this.sidebar.style.top?.match(/\d+/)?.[0] || 0;
|
||||
const startLeft = this.sidebar.style.left?.match(/\d+/)?.[0] || 0;
|
||||
|
||||
const sidebarBBox = this.sidebar.getBoundingClientRect();
|
||||
const sideBarHeight = sidebarBBox.height;
|
||||
const sideBarWidth = sidebarBBox.width;
|
||||
|
||||
const topMouseOffset = startTop - mouseDownEvent.screenY;
|
||||
const leftMouseOffset = startLeft - mouseDownEvent.screenX;
|
||||
const moveListener = (mouseMoveEvent) => {
|
||||
window.requestAnimationFrame(() => {
|
||||
let top = mouseMoveEvent.clientY + topMouseOffset;
|
||||
let left = mouseMoveEvent.clientX + leftMouseOffset;
|
||||
|
||||
const wrapperBounds = this.sidebarWrapper.getBoundingClientRect();
|
||||
top = Math.max(0, Math.min(top, wrapperBounds.height - sideBarHeight));
|
||||
left = Math.max(0, Math.min(left, wrapperBounds.width - sideBarWidth));
|
||||
|
||||
this.sidebar.style.top = top + 'px';
|
||||
this.sidebar.style.left = left + 'px';
|
||||
});
|
||||
};
|
||||
|
||||
document.addEventListener('mousemove', moveListener);
|
||||
document.addEventListener(
|
||||
'mouseup',
|
||||
() => {
|
||||
document.removeEventListener('mousemove', moveListener);
|
||||
this._isDragging = false;
|
||||
},
|
||||
{ once: true }
|
||||
);
|
||||
}
|
||||
|
||||
onWindowResize() {
|
||||
if (!this.isFloating) return;
|
||||
const top = parseInt(this.sidebar.style.top?.match(/\d+/)?.[0] || 0);
|
||||
const left = parseInt(this.sidebar.style.left?.match(/\d+/)?.[0] || 0);
|
||||
const wrapperRect = this.sidebarWrapper.getBoundingClientRect();
|
||||
const sidebarRect = this.sidebar.getBoundingClientRect();
|
||||
|
||||
if (sidebarRect.height < wrapperRect.height && top + sidebarRect.height > wrapperRect.height) {
|
||||
this.sidebar.style.top = wrapperRect.height - sidebarRect.height + 'px';
|
||||
}
|
||||
if (sidebarRect.width < wrapperRect.width && left + sidebarRect.width > wrapperRect.width) {
|
||||
this.sidebar.style.left = wrapperRect.width - sidebarRect.width + 'px';
|
||||
}
|
||||
}
|
||||
|
||||
get isFloating() {
|
||||
return document.getElementById('zen-sidebar-web-panel').hasAttribute('pinned');
|
||||
}
|
||||
|
||||
handleEvent() {
|
||||
this._hasChangedConfig = true;
|
||||
this.update();
|
||||
this._hasChangedConfig = false;
|
||||
|
||||
// https://stackoverflow.com/questions/11565471/removing-event-listener-which-was-added-with-bind
|
||||
var clickOutsideHandler = this._handleClickOutside.bind(this);
|
||||
let isFloating = this.isFloating;
|
||||
if (isFloating && !this._hasRegisteredPinnedClickOutside) {
|
||||
document.addEventListener('mouseup', clickOutsideHandler);
|
||||
this._hasRegisteredPinnedClickOutside = true;
|
||||
} else if (!isFloating && this._hasRegisteredPinnedClickOutside) {
|
||||
document.removeEventListener('mouseup', clickOutsideHandler);
|
||||
this._hasRegisteredPinnedClickOutside = false;
|
||||
}
|
||||
|
||||
const button = document.getElementById('zen-sidepanel-button');
|
||||
if (!button) return;
|
||||
if (Services.prefs.getBoolPref('zen.sidebar.enabled')) {
|
||||
button.removeAttribute('hidden');
|
||||
} else {
|
||||
button.setAttribute('hidden', 'true');
|
||||
this._closeSidebarPanel();
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
_handleClickOutside(event) {
|
||||
if (!this.sidebar.hasAttribute('pinned') || this._isDragging || !this.shouldCloseOnBlur) {
|
||||
return;
|
||||
}
|
||||
let target = event.target;
|
||||
const closestSelector = [
|
||||
'#zen-sidebar-web-panel',
|
||||
'#zen-sidebar-panels-wrapper',
|
||||
'#zenWebPanelContextMenu',
|
||||
'#zen-sidebar-web-panel-splitter',
|
||||
'#contentAreaContextMenu',
|
||||
'#zen-sidepanel-button',
|
||||
].join(', ');
|
||||
if (target.closest(closestSelector)) {
|
||||
return;
|
||||
}
|
||||
this.close();
|
||||
}
|
||||
|
||||
toggle() {
|
||||
if (!this._currentPanel) {
|
||||
this._currentPanel = this._lastOpenedPanel;
|
||||
}
|
||||
if (document.getElementById('zen-sidebar-web-panel').hasAttribute('hidden')) {
|
||||
this.open();
|
||||
return;
|
||||
}
|
||||
this.close();
|
||||
}
|
||||
|
||||
open(id = null) {
|
||||
let sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
if (id) this._currentPanel = id;
|
||||
|
||||
sidebar.removeAttribute('hidden');
|
||||
this.update();
|
||||
}
|
||||
|
||||
update() {
|
||||
this._updateWebPanels();
|
||||
this._updateSidebarButton();
|
||||
this._updateWebPanel();
|
||||
this._updateButtons();
|
||||
}
|
||||
|
||||
_updateSidebarButton() {
|
||||
let button = document.getElementById('zen-sidepanel-button');
|
||||
if (!button) return;
|
||||
if (!document.getElementById('zen-sidebar-web-panel').hasAttribute('hidden')) {
|
||||
button.setAttribute('open', 'true');
|
||||
} else {
|
||||
button.removeAttribute('open');
|
||||
}
|
||||
}
|
||||
|
||||
_updateWebPanels() {
|
||||
if (Services.prefs.getBoolPref('zen.sidebar.enabled')) {
|
||||
this.sidebarElement.removeAttribute('hidden');
|
||||
} else {
|
||||
this.sidebarElement.setAttribute('hidden', 'true');
|
||||
this._closeSidebarPanel();
|
||||
return;
|
||||
}
|
||||
|
||||
// Don't reload content if at least one of the panel tabs was loaded
|
||||
if (this._lastOpenedPanel) {
|
||||
return;
|
||||
}
|
||||
|
||||
let data = this.sidebarData;
|
||||
if (!data.data || !data.index) {
|
||||
return;
|
||||
}
|
||||
this.sidebarElement.innerHTML = '';
|
||||
for (let site of data.index) {
|
||||
let panel = data.data[site];
|
||||
if (!panel || !panel.url) {
|
||||
continue;
|
||||
}
|
||||
let button = document.createXULElement('toolbarbutton');
|
||||
button.classList.add('zen-sidebar-panel-button', 'toolbarbutton-1', 'chromeclass-toolbar-additional');
|
||||
button.setAttribute('flex', '1');
|
||||
button.setAttribute('zen-sidebar-id', site);
|
||||
button.setAttribute('context', 'zenWebPanelContextMenu');
|
||||
this._getWebPanelIcon(panel.url, button);
|
||||
button.addEventListener('click', this._handleClick.bind(this));
|
||||
button.addEventListener('dragstart', this._handleDragStart.bind(this));
|
||||
button.addEventListener('dragover', this._handleDragOver.bind(this));
|
||||
button.addEventListener('dragenter', this._handleDragEnter.bind(this));
|
||||
button.addEventListener('dragend', this._handleDragEnd.bind(this));
|
||||
this.sidebarElement.appendChild(button);
|
||||
}
|
||||
const addButton = document.getElementById('zen-sidebar-add-panel-button');
|
||||
if (data.index.length < this.MAX_SIDEBAR_PANELS) {
|
||||
addButton.removeAttribute('hidden');
|
||||
} else {
|
||||
addButton.setAttribute('hidden', 'true');
|
||||
}
|
||||
}
|
||||
|
||||
async _openAddPanelDialog() {
|
||||
let dialogURL = 'chrome://browser/content/places/zenNewWebPanel.xhtml';
|
||||
let features = 'centerscreen,chrome,modal,resizable=no';
|
||||
let aParentWindow = Services.wm.getMostRecentWindow('navigator:browser');
|
||||
|
||||
if (aParentWindow?.gDialogBox) {
|
||||
await aParentWindow.gDialogBox.open(dialogURL, {});
|
||||
} else {
|
||||
aParentWindow.openDialog(dialogURL, '', features, {});
|
||||
}
|
||||
}
|
||||
|
||||
_setPinnedToElements() {
|
||||
let sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
sidebar.setAttribute('pinned', 'true');
|
||||
document.getElementById('zen-sidebar-web-panel-pinned').setAttribute('pinned', 'true');
|
||||
}
|
||||
|
||||
_removePinnedFromElements() {
|
||||
let sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
sidebar.removeAttribute('pinned');
|
||||
document.getElementById('zen-sidebar-web-panel-pinned').removeAttribute('pinned');
|
||||
}
|
||||
|
||||
_closeSidebarPanel() {
|
||||
let sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
sidebar.setAttribute('hidden', 'true');
|
||||
this._lastOpenedPanel = this._currentPanel;
|
||||
this._currentPanel = null;
|
||||
}
|
||||
|
||||
_handleClick(event) {
|
||||
let target = event.target;
|
||||
let panelId = target.getAttribute('zen-sidebar-id');
|
||||
if (this._currentPanel === panelId) {
|
||||
return;
|
||||
}
|
||||
this._currentPanel = panelId;
|
||||
this._updateWebPanel();
|
||||
}
|
||||
|
||||
_handleDragStart(event) {
|
||||
this.__dragingElement = event.target;
|
||||
this.__dragingIndex = Array.prototype.indexOf.call(event.target.parentNode.children, event.target);
|
||||
event.target.style.opacity = '0.7';
|
||||
|
||||
event.dataTransfer.effectAllowed = 'move';
|
||||
event.dataTransfer.setData('text/html', event.target.innerHTML);
|
||||
event.dataTransfer.setData('text/plain', event.target.id);
|
||||
}
|
||||
|
||||
_handleDragOver(event) {}
|
||||
|
||||
_handleDragEnter(event) {
|
||||
if (typeof this.__dragingElement === 'undefined') {
|
||||
return;
|
||||
}
|
||||
const target = event.target;
|
||||
const elIndex = Array.prototype.indexOf.call(target.parentNode.children, target);
|
||||
if (elIndex < this.__dragingIndex) {
|
||||
target.before(this.__dragingElement);
|
||||
this.__dragingIndex = elIndex - 1;
|
||||
}
|
||||
target.after(this.__dragingElement);
|
||||
this.__dragingIndex = elIndex + 1;
|
||||
}
|
||||
|
||||
_handleDragEnd(event) {
|
||||
event.target.style.opacity = '1';
|
||||
|
||||
let data = this.sidebarData;
|
||||
let newPos = [];
|
||||
for (let element of this.__dragingElement.parentNode.children) {
|
||||
let panelId = element.getAttribute('zen-sidebar-id');
|
||||
newPos.push(panelId);
|
||||
}
|
||||
data.index = newPos;
|
||||
Services.prefs.setStringPref('zen.sidebar.data', JSON.stringify(data));
|
||||
this._currentPanel = this.__dragingElement.getAttribute('zen-sidebar-id');
|
||||
this.open();
|
||||
this.__dragingElement = undefined;
|
||||
}
|
||||
|
||||
_createNewPanel(url) {
|
||||
let data = this.sidebarData;
|
||||
let newName = 'p' + new Date().getTime();
|
||||
data.index.push(newName);
|
||||
data.data[newName] = {
|
||||
url: url,
|
||||
ua: false,
|
||||
};
|
||||
Services.prefs.setStringPref('zen.sidebar.data', JSON.stringify(data));
|
||||
this._currentPanel = newName;
|
||||
this.open();
|
||||
}
|
||||
|
||||
_updateButtons() {
|
||||
for (let button of this.sidebarElement.querySelectorAll('.zen-sidebar-panel-button')) {
|
||||
if (button.getAttribute('zen-sidebar-id') === this._currentPanel) {
|
||||
button.setAttribute('selected', 'true');
|
||||
} else {
|
||||
button.removeAttribute('selected');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
_hideAllWebPanels() {
|
||||
let sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
for (let browser of sidebar.querySelectorAll('browser[zen-sidebar-id]')) {
|
||||
browser.setAttribute('hidden', 'true');
|
||||
browser.docShellIsActive = false;
|
||||
browser.zenModeActive = false;
|
||||
}
|
||||
}
|
||||
|
||||
get introductionPanel() {
|
||||
return document.getElementById('zen-sidebar-introduction-panel');
|
||||
}
|
||||
|
||||
_updateWebPanel() {
|
||||
this._updateButtons();
|
||||
// let sidebar = document.getElementById("zen-sidebar-web-panel");
|
||||
this._hideAllWebPanels();
|
||||
if (!this._currentPanel) {
|
||||
this.introductionPanel.removeAttribute('hidden');
|
||||
this.forwardButton.setAttribute('disabled', true);
|
||||
this.backButton.setAttribute('disabled', true);
|
||||
return;
|
||||
}
|
||||
this.introductionPanel.setAttribute('hidden', 'true');
|
||||
let existantWebview = this._getCurrentBrowser();
|
||||
if (existantWebview) {
|
||||
existantWebview.docShellIsActive = true;
|
||||
existantWebview.zenModeActive = true;
|
||||
existantWebview.removeAttribute('hidden');
|
||||
document.getElementById('zen-sidebar-web-panel-title').textContent = existantWebview.contentTitle;
|
||||
return;
|
||||
}
|
||||
let data = this._getWebPanelData(this._currentPanel);
|
||||
let browser = this._createWebPanelBrowser(data);
|
||||
let browserContainers = document.getElementById('zen-sidebar-web-panel-browser-containers');
|
||||
browserContainers.appendChild(browser);
|
||||
browser.addProgressListener(this.progressListener, Ci.nsIWebProgress.NOTIFY_LOCATION);
|
||||
if (data.ua) {
|
||||
browser.browsingContext.customUserAgent = this.DEFAULT_MOBILE_USER_AGENT;
|
||||
browser.reload();
|
||||
}
|
||||
browser.docShellIsActive = true;
|
||||
browser.zenModeActive = true;
|
||||
}
|
||||
|
||||
_getWebPanelData(id) {
|
||||
let data = this.sidebarData;
|
||||
let panel = data.data[id];
|
||||
if (!panel || !panel.url) {
|
||||
return {};
|
||||
}
|
||||
return {
|
||||
id: id,
|
||||
...panel,
|
||||
};
|
||||
}
|
||||
|
||||
getTabForBrowser(browser) {
|
||||
return this._tabBrowserSet.get(browser);
|
||||
}
|
||||
|
||||
setTabForBrowser(browser, tab) {
|
||||
this._tabBrowserSet.set(browser, tab);
|
||||
}
|
||||
|
||||
removeTabForBrowser(browser) {
|
||||
this._tabBrowserSet.delete(browser);
|
||||
}
|
||||
|
||||
_createWebPanelBrowser(data) {
|
||||
const titleContainer = document.getElementById('zen-sidebar-web-panel-title');
|
||||
titleContainer.textContent = 'Loading...';
|
||||
let browser = gBrowser.createBrowser({
|
||||
userContextId: data.userContextId,
|
||||
});
|
||||
const tab = this.sidebar.querySelector(`[zen-sidebar-id='${data.id}']`);
|
||||
this.setTabForBrowser(browser, tab);
|
||||
tab.linkedBrowser = browser;
|
||||
tab.permanentKey = browser.permanentKey;
|
||||
browser.setAttribute('disablefullscreen', 'true');
|
||||
browser.setAttribute('src', data.url);
|
||||
browser.setAttribute('zen-sidebar-id', data.id);
|
||||
browser.addEventListener(
|
||||
'pagetitlechanged',
|
||||
function (event) {
|
||||
let browser = event.target;
|
||||
let title = browser.contentTitle;
|
||||
if (!title) {
|
||||
return;
|
||||
}
|
||||
let id = browser.getAttribute('zen-sidebar-id');
|
||||
if (id === this._currentPanel) {
|
||||
titleContainer.textContent = title;
|
||||
}
|
||||
}.bind(this)
|
||||
);
|
||||
return browser;
|
||||
}
|
||||
|
||||
_getWebPanelIcon(url, element) {
|
||||
let { preferredURI } = Services.uriFixup.getFixupURIInfo(url);
|
||||
element.setAttribute('image', `page-icon:${preferredURI.spec}`);
|
||||
if (Services.prefs.getBoolPref('zen.sidebar.use-google-favicons')) {
|
||||
fetch(`https://s2.googleusercontent.com/s2/favicons?domain_url=${preferredURI.spec}`).then(async (response) => {
|
||||
if (response.ok) {
|
||||
let blob = await response.blob();
|
||||
let reader = new FileReader();
|
||||
reader.onload = function () {
|
||||
element.setAttribute('image', reader.result);
|
||||
};
|
||||
reader.readAsDataURL(blob);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
_getBrowserById(id) {
|
||||
let sidebar = document.getElementById('zen-sidebar-web-panel');
|
||||
return sidebar.querySelector(`browser[zen-sidebar-id="${id}"]`);
|
||||
}
|
||||
|
||||
_getCurrentBrowser() {
|
||||
return this._getBrowserById(this._currentPanel);
|
||||
}
|
||||
|
||||
reload() {
|
||||
let browser = this._getCurrentBrowser();
|
||||
if (browser) {
|
||||
browser.reload();
|
||||
}
|
||||
}
|
||||
|
||||
forward() {
|
||||
let browser = this._getCurrentBrowser();
|
||||
if (browser) {
|
||||
browser.goForward();
|
||||
}
|
||||
}
|
||||
|
||||
back() {
|
||||
let browser = this._getCurrentBrowser();
|
||||
if (browser) {
|
||||
browser.goBack();
|
||||
}
|
||||
}
|
||||
|
||||
home() {
|
||||
let browser = this._getCurrentBrowser();
|
||||
if (browser) {
|
||||
browser.gotoIndex();
|
||||
}
|
||||
}
|
||||
|
||||
close() {
|
||||
this._hideAllWebPanels();
|
||||
this._closeSidebarPanel();
|
||||
this._updateSidebarButton();
|
||||
}
|
||||
|
||||
togglePinned(elem) {
|
||||
if (this.sidebar.hasAttribute('pinned')) {
|
||||
this._removePinnedFromElements();
|
||||
} else {
|
||||
this._setPinnedToElements();
|
||||
}
|
||||
this.update();
|
||||
}
|
||||
|
||||
get sidebarElement() {
|
||||
if (!this._sidebarElement) {
|
||||
this._sidebarElement = document.getElementById('zen-sidebar-panels-sites');
|
||||
}
|
||||
return this._sidebarElement;
|
||||
}
|
||||
|
||||
get splitterElement() {
|
||||
if (!this._splitterElement) {
|
||||
this._splitterElement = document.getElementById('zen-sidebar-web-panel-splitter');
|
||||
}
|
||||
return this._splitterElement;
|
||||
}
|
||||
|
||||
get hSplitterElement() {
|
||||
if (!this._hSplitterElement) {
|
||||
this._hSplitterElement = document.getElementById('zen-sidebar-web-panel-hsplitter');
|
||||
}
|
||||
return this._hSplitterElement;
|
||||
}
|
||||
|
||||
get sidebarHeader() {
|
||||
if (!this._sidebarHeader) {
|
||||
this._sidebarHeader = document.getElementById('zen-sidebar-web-header');
|
||||
}
|
||||
return this._sidebarHeader;
|
||||
}
|
||||
|
||||
get sidebarWrapper() {
|
||||
if (!this._sideBarWrapper) {
|
||||
this._sideBarWrapper = document.getElementById('zen-sidebar-web-panel-wrapper');
|
||||
}
|
||||
return this._sideBarWrapper;
|
||||
}
|
||||
|
||||
get sidebarHeaderButtons() {
|
||||
if (!this._sidebarHeaderButtons) {
|
||||
this._sidebarHeaderButtons = [...this.sidebarHeader.querySelectorAll('.toolbarbutton-1')];
|
||||
}
|
||||
return this._sidebarHeaderButtons;
|
||||
}
|
||||
|
||||
// Context menu
|
||||
|
||||
updateContextMenu(aPopupMenu) {
|
||||
let panel =
|
||||
aPopupMenu.triggerNode && (aPopupMenu.triggerNode || aPopupMenu.triggerNode.closest('toolbarbutton[zen-sidebar-id]'));
|
||||
if (!panel) {
|
||||
return;
|
||||
}
|
||||
let id = panel.getAttribute('zen-sidebar-id');
|
||||
this.contextTab = id;
|
||||
let data = this._getWebPanelData(id);
|
||||
let browser = this._getBrowserById(id);
|
||||
let isMuted = browser && browser.audioMuted;
|
||||
let mutedContextItem = document.getElementById('context_zenToggleMuteWebPanel');
|
||||
document.l10n.setAttributes(
|
||||
mutedContextItem,
|
||||
!isMuted ? 'zen-web-side-panel-context-mute-panel' : 'zen-web-side-panel-context-unmute-panel'
|
||||
);
|
||||
if (!isMuted) {
|
||||
mutedContextItem.setAttribute('muted', 'true');
|
||||
} else {
|
||||
mutedContextItem.removeAttribute('muted');
|
||||
}
|
||||
document.l10n.setAttributes(
|
||||
document.getElementById('context_zenToogleUAWebPanel'),
|
||||
data.ua ? 'zen-web-side-panel-context-disable-ua' : 'zen-web-side-panel-context-enable-ua'
|
||||
);
|
||||
if (!browser) {
|
||||
document.getElementById('context_zenUnloadWebPanel').setAttribute('disabled', 'true');
|
||||
} else {
|
||||
document.getElementById('context_zenUnloadWebPanel').removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
|
||||
createContainerTabMenu(event) {
|
||||
let window = event.target.ownerGlobal;
|
||||
let data = this.sidebarData;
|
||||
let panelData = data.data[this.contextTab];
|
||||
return window.createUserContextMenu(event, {
|
||||
isContextMenu: true,
|
||||
excludeUserContextId: panelData.userContextId,
|
||||
showDefaultTab: true,
|
||||
});
|
||||
}
|
||||
|
||||
contextChangeContainerTab(event) {
|
||||
let data = this.sidebarData;
|
||||
let userContextId = parseInt(event.target.getAttribute('data-usercontextid'));
|
||||
data.data[this.contextTab].userContextId = userContextId;
|
||||
Services.prefs.setStringPref('zen.sidebar.data', JSON.stringify(data));
|
||||
let browser = this._getBrowserById(this.contextTab);
|
||||
if (browser) {
|
||||
browser.remove();
|
||||
// We need to re-apply a new browser so it takes the new userContextId
|
||||
this._updateWebPanel();
|
||||
}
|
||||
}
|
||||
|
||||
contextOpenNewTab() {
|
||||
let browser = this._getBrowserById(this.contextTab);
|
||||
let data = this.sidebarData;
|
||||
let panel = data.data[this.contextTab];
|
||||
let url = browser == null ? panel.url : browser.currentURI.spec;
|
||||
gZenUIManager.openAndChangeToTab(url);
|
||||
this.close();
|
||||
}
|
||||
|
||||
contextToggleMuteAudio() {
|
||||
let browser = this._getBrowserById(this.contextTab);
|
||||
if (browser.audioMuted) {
|
||||
browser.unmute();
|
||||
} else {
|
||||
browser.mute();
|
||||
}
|
||||
}
|
||||
|
||||
contextToggleUserAgent() {
|
||||
let browser = this._getBrowserById(this.contextTab);
|
||||
browser.browsingContext.customUserAgent = browser.browsingContext.customUserAgent ? null : this.DEFAULT_MOBILE_USER_AGENT;
|
||||
let data = this.sidebarData;
|
||||
data.data[this.contextTab].ua = !data.data[this.contextTab].ua;
|
||||
Services.prefs.setStringPref('zen.sidebar.data', JSON.stringify(data));
|
||||
browser.reload();
|
||||
}
|
||||
|
||||
contextDelete() {
|
||||
let data = this.sidebarData;
|
||||
delete data.data[this.contextTab];
|
||||
data.index = data.index.filter((id) => id !== this.contextTab);
|
||||
let browser = this._getBrowserById(this.contextTab);
|
||||
if (browser) {
|
||||
browser.remove();
|
||||
document.getElementById('zen-sidebar-web-panel-title').textContent = '';
|
||||
}
|
||||
this._currentPanel = null;
|
||||
this._lastOpenedPanel = null;
|
||||
this.update();
|
||||
Services.prefs.setStringPref('zen.sidebar.data', JSON.stringify(data));
|
||||
}
|
||||
|
||||
contextUnload() {
|
||||
let browser = this._getBrowserById(this.contextTab);
|
||||
this.removeTabForBrowser(browser);
|
||||
browser.remove();
|
||||
document.getElementById('zen-sidebar-web-panel-title').textContent = '';
|
||||
this._closeSidebarPanel();
|
||||
this.close();
|
||||
this._lastOpenedPanel = null;
|
||||
}
|
||||
|
||||
insertIntoContextMenu() {
|
||||
const sibling = document.getElementById('context-stripOnShareLink');
|
||||
const menuitem = document.createXULElement('menuitem');
|
||||
menuitem.setAttribute('id', 'context-zenAddToWebPanel');
|
||||
menuitem.setAttribute('hidden', 'true');
|
||||
menuitem.setAttribute('oncommand', 'gZenBrowserManagerSidebar.addPanelFromContextMenu();');
|
||||
menuitem.setAttribute('data-l10n-id', 'zen-web-side-panel-context-add-to-panel');
|
||||
sibling.insertAdjacentElement('afterend', menuitem);
|
||||
}
|
||||
|
||||
addPanelFromContextMenu() {
|
||||
const url = gContextMenu.linkURL || gContextMenu.target.ownerDocument.location.href;
|
||||
this._createNewPanel(url);
|
||||
}
|
||||
}
|
||||
|
||||
window.gZenBrowserManagerSidebar = new ZenBrowserManagerSidebar();
|
||||
|
|
@ -202,15 +202,15 @@
|
|||
<menuseparator/>
|
||||
<menuitem id="context_zenUnloadTab"
|
||||
data-lazy-l10n-id="tab-zen-unload"
|
||||
oncommand="gZenTabUnloader.unloadTab();"/>
|
||||
command="cmd_zenUnloadTab"/>
|
||||
<menu data-lazy-l10n-id="zen-tabs-unloader-tab-actions" id="context_zenTabActions">
|
||||
<menupopup>
|
||||
<menuitem id="context_zenPreventUnloadTab"
|
||||
data-lazy-l10n-id="tab-zen-prevent-unload"
|
||||
oncommand="gZenTabUnloader.preventUnloadTab();"/>
|
||||
command="cmd_zenPreventUnloadTab"/>
|
||||
<menuitem id="context_zenIgnoreUnloadTab"
|
||||
data-lazy-l10n-id="tab-zen-ignore-unload"
|
||||
oncommand="gZenTabUnloader.ignoreUnloadTab();"/>
|
||||
command="cmd_zenIgnoreUnloadTab"/>
|
||||
</menupopup>
|
||||
</menu>
|
||||
`);
|
||||
|
|
|
|||
|
|
@ -63,7 +63,6 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
|
|||
currentView = -1;
|
||||
_data = [];
|
||||
_tabBrowserPanel = null;
|
||||
__modifierElement = null;
|
||||
__hasSetMenuListener = false;
|
||||
overlay = null;
|
||||
_splitNodeToSplitters = new Map();
|
||||
|
|
@ -89,7 +88,6 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
|
|||
window.addEventListener('TabClose', this.handleTabClose.bind(this));
|
||||
window.addEventListener('TabSelect', this.onTabSelect.bind(this));
|
||||
this.initializeContextMenu();
|
||||
this.insertPageActionButton();
|
||||
this.insertIntoContextMenu();
|
||||
|
||||
// Add drag over listener to the browser view
|
||||
|
|
@ -105,7 +103,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
|
|||
const menuitem = document.createXULElement('menuitem');
|
||||
menuitem.setAttribute('id', 'context-zenSplitLink');
|
||||
menuitem.setAttribute('hidden', 'true');
|
||||
menuitem.setAttribute('oncommand', 'gZenViewSplitter.splitLinkInNewTab();');
|
||||
menuitem.setAttribute('command', 'cmd_zenSplitViewLinkInNewTab');
|
||||
menuitem.setAttribute('data-l10n-id', 'zen-split-link');
|
||||
sibling.insertAdjacentElement('beforebegin', menuitem);
|
||||
}
|
||||
|
|
@ -835,23 +833,6 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
|
|||
this.insetUpdateContextMenuItems();
|
||||
}
|
||||
|
||||
/**
|
||||
* Insert Page Action button
|
||||
*/
|
||||
insertPageActionButton() {
|
||||
const element = window.MozXULElement.parseXULToFragment(`
|
||||
<hbox id="zen-split-views-box"
|
||||
hidden="true"
|
||||
role="button"
|
||||
class="urlbar-page-action"
|
||||
onclick="gZenViewSplitter.openSplitViewPanel(event);">
|
||||
<image id="zen-split-views-button"
|
||||
class="urlbar-icon"/>
|
||||
</hbox>
|
||||
`);
|
||||
document.getElementById('star-button-box').after(element);
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the tab browser panel.
|
||||
*
|
||||
|
|
@ -1400,42 +1381,6 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the modifier element.
|
||||
*
|
||||
* @returns {Element} The modifier element.
|
||||
*/
|
||||
get modifierElement() {
|
||||
if (!this.__modifierElement) {
|
||||
const wrapper = document.getElementById('template-zen-split-view-modifier');
|
||||
const panel = wrapper.content.firstElementChild;
|
||||
wrapper.replaceWith(wrapper.content);
|
||||
this.__modifierElement = panel;
|
||||
}
|
||||
return this.__modifierElement;
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens the split view panel.
|
||||
*
|
||||
* @param {Event} event - The event that triggered the panel opening.
|
||||
*/
|
||||
async openSplitViewPanel(event) {
|
||||
const panel = this.modifierElement;
|
||||
const target = event.target.parentNode;
|
||||
this.updatePanelUI(panel);
|
||||
|
||||
if (!this.__hasSetMenuListener) {
|
||||
this.setupPanelListeners(panel);
|
||||
this.__hasSetMenuListener = true;
|
||||
}
|
||||
|
||||
window.PanelMultiView.openPopup(panel, target, {
|
||||
position: 'bottomright topright',
|
||||
triggerEvent: event,
|
||||
}).catch(console.error);
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the UI of the panel.
|
||||
*
|
||||
|
|
@ -1451,34 +1396,6 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @description sets up the listeners for the panel.
|
||||
* @param {Element} panel - The panel element
|
||||
*/
|
||||
setupPanelListeners(panel) {
|
||||
for (const gridType of ['hsep', 'vsep', 'grid', 'unsplit']) {
|
||||
const selector = panel.querySelector(`.zen-split-view-modifier-preview.${gridType}`);
|
||||
selector.addEventListener('click', () => this.handlePanelSelection(gridType, panel));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @description handles the panel selection.
|
||||
* @param {string} gridType - The grid type
|
||||
* @param {Element} panel - The panel element
|
||||
*/
|
||||
handlePanelSelection(gridType, panel) {
|
||||
if (gridType === 'unsplit') {
|
||||
this.unsplitCurrentView();
|
||||
} else {
|
||||
const group = this._data[this.currentView];
|
||||
group.gridType = gridType;
|
||||
group.layoutTree = this.calculateLayoutTree(group.tabs, gridType);
|
||||
this.activateSplitView(group, true);
|
||||
}
|
||||
panel.hidePopup();
|
||||
}
|
||||
|
||||
/**
|
||||
* @description unsplit the current view.]
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -2199,7 +2199,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
|
|||
|
||||
const menuPopup = document.createXULElement('menupopup');
|
||||
menuPopup.setAttribute('id', 'context-zen-change-workspace-tab-menu-popup');
|
||||
menuPopup.setAttribute('oncommand', "ZenWorkspaces.changeTabWorkspace(event.target.getAttribute('zen-workspace-id'))");
|
||||
menuPopup.setAttribute('command', 'cmd_zenChangeWorkspaceTab');
|
||||
|
||||
menu.appendChild(menuPopup);
|
||||
|
||||
|
|
|
|||
|
|
@ -1,62 +0,0 @@
|
|||
// This Source Code Form is subject to the terms of the Mozilla Public
|
||||
// License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
// file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
|
||||
var gZenNewWebPanel = {
|
||||
init: function () {
|
||||
document.addEventListener('dialogaccept', this.handleDialogAccept.bind(this));
|
||||
},
|
||||
|
||||
handleURLChange: async function (aURL) {
|
||||
try {
|
||||
let url = new URL(aURL.value);
|
||||
} catch (_) {
|
||||
// TODO: Show error message
|
||||
return;
|
||||
}
|
||||
},
|
||||
|
||||
addHttpIfMissing(url) {
|
||||
// List of schemes to avoid
|
||||
const avoidSchemes = ['about:', 'chrome:', 'moz-extension:', 'view-source:'];
|
||||
// Check if the URL starts with any of the avoid schemes
|
||||
for (let scheme of avoidSchemes) {
|
||||
if (url.startsWith(scheme)) {
|
||||
return url;
|
||||
}
|
||||
}
|
||||
if (!url.startsWith('http://') && !url.startsWith('https://')) {
|
||||
return 'https://' + url;
|
||||
}
|
||||
return url;
|
||||
},
|
||||
|
||||
handleDialogAccept: async function (aEvent) {
|
||||
document.commandDispatcher.focusedElement?.blur();
|
||||
let url = document.getElementById('zenNWP_url');
|
||||
let ua = document.getElementById('zenNWP_userAgent'); // checbkox
|
||||
if (!url || !ua) {
|
||||
return;
|
||||
}
|
||||
let urlValue = url.value;
|
||||
try {
|
||||
new URL(urlValue);
|
||||
} catch (_) {
|
||||
urlValue = this.addHttpIfMissing(url.value);
|
||||
}
|
||||
if (!url.value) {
|
||||
return;
|
||||
}
|
||||
let newSite = {
|
||||
url: urlValue,
|
||||
ua: ua.checked,
|
||||
};
|
||||
let currentData = JSON.parse(Services.prefs.getStringPref('zen.sidebar.data'));
|
||||
let newName = 'p' + new Date().getTime();
|
||||
currentData.index.push(newName);
|
||||
currentData.data[newName] = newSite;
|
||||
Services.prefs.setStringPref('zen.sidebar.data', JSON.stringify(currentData));
|
||||
},
|
||||
};
|
||||
|
||||
gZenNewWebPanel.init();
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
<?xml version="1.0"?>
|
||||
|
||||
<!-- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
|
||||
|
||||
<!DOCTYPE window>
|
||||
|
||||
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
||||
xmlns:html="http://www.w3.org/1999/xhtml"
|
||||
id="zenNewWebPanel"
|
||||
headerparent="zenNewWebPanelDialog"
|
||||
style="min-width: 40em;">
|
||||
<dialog id="zenNewWebPanelDialog"
|
||||
buttons="accept, cancel">
|
||||
|
||||
<linkset>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/global.css" />
|
||||
<html:link
|
||||
rel="stylesheet"
|
||||
href="chrome://global/content/commonDialog.css"
|
||||
/>
|
||||
<html:link rel="stylesheet" href="chrome://global/skin/commonDialog.css" />
|
||||
|
||||
<html:link rel="localization" href="browser/zenNewWebPanel.ftl"/>
|
||||
<script src="chrome://browser/content/zenThemeModifier.js"></script>
|
||||
</linkset>
|
||||
|
||||
<script src="chrome://browser/content/places/zenNewWebPanel.js"/>
|
||||
|
||||
<label data-l10n-id="zen-new-web-panel-url"
|
||||
control="zenNWP_url"/>
|
||||
<html:input id="zenNWP_url"
|
||||
type="url" onchange="gZenNewWebPanel.handleURLChange(this);"/>
|
||||
|
||||
<hbox flex="1" style="margin: 10px 5px;">
|
||||
<html:input id="zenNWP_userAgent"
|
||||
type="checkbox"/>
|
||||
<label data-l10n-id="zen-new-web-panel-user-agent"
|
||||
control="zenNWP_userAgent" for="zenNWP_userAgent"/>
|
||||
</hbox>
|
||||
|
||||
</dialog>
|
||||
</window>
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
diff --git a/browser/components/places/jar.mn b/browser/components/places/jar.mn
|
||||
index e12c6bbf449f062fd22ef260909b539857f52c6a..2dcc143109de015e4c9d486b83119ae1122d2e71 100644
|
||||
--- a/browser/components/places/jar.mn
|
||||
+++ b/browser/components/places/jar.mn
|
||||
@@ -25,3 +25,5 @@ browser.jar:
|
||||
content/browser/places/interactionsViewer.css (metadataViewer/interactionsViewer.css)
|
||||
content/browser/places/interactionsViewer.html (metadataViewer/interactionsViewer.html)
|
||||
content/browser/places/interactionsViewer.js (metadataViewer/interactionsViewer.js)
|
||||
+ content/browser/places/zenNewWebPanel.xhtml (content/zenNewWebPanel.xhtml)
|
||||
+ content/browser/places/zenNewWebPanel.js (content/zenNewWebPanel.js)
|
||||
|
|
@ -919,16 +919,6 @@ var gZenCKSSettings = {
|
|||
};
|
||||
|
||||
Preferences.addAll([
|
||||
{
|
||||
id: 'zen.sidebar.enabled',
|
||||
type: 'bool',
|
||||
default: true,
|
||||
},
|
||||
{
|
||||
id: 'zen.sidebar.close-on-blur',
|
||||
type: 'bool',
|
||||
default: true,
|
||||
},
|
||||
{
|
||||
id: 'zen.view.compact.hide-toolbar',
|
||||
type: 'bool',
|
||||
|
|
|
|||
|
|
@ -134,27 +134,6 @@
|
|||
</vbox>
|
||||
</groupbox>
|
||||
|
||||
<hbox id="zenSidePanelsCategory"
|
||||
class="subcategory"
|
||||
hidden="true"
|
||||
data-category="paneZenLooks">
|
||||
<html:h1 data-l10n-id="pane-zen-side-panels-title"/>
|
||||
</hbox>
|
||||
|
||||
<groupbox id="zenSidePanelsGroup" data-category="paneZenLooks" hidden="true" class="highlighting-group">
|
||||
<label><html:h2 data-l10n-id="zen-side-panels-header"/></label>
|
||||
<description class="description-deemphasized" data-l10n-id="zen-side-panels-description" />
|
||||
|
||||
<checkbox id="zenLooksAndFeelUseThemedToolbar"
|
||||
data-l10n-id="zen-side-panels-enabled"
|
||||
preference="zen.sidebar.enabled"/>
|
||||
<hbox class="indent">
|
||||
<checkbox id="zenLooksAndFeelSidebarCloseOnBlur"
|
||||
data-l10n-id="zen-side-panels-close-on-blur"
|
||||
preference="zen.sidebar.close-on-blur"/>
|
||||
</hbox>
|
||||
</groupbox>
|
||||
|
||||
<hbox id="zenGlanceCategory"
|
||||
class="subcategory"
|
||||
hidden="true"
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<html:h1 data-l10n-id="pane-workspaces-title"/>
|
||||
</hbox>
|
||||
|
||||
<hbox id="zenSidePanelsCategory"
|
||||
<hbox id="zenTabManagementCategory"
|
||||
class="subcategory"
|
||||
hidden="true"
|
||||
data-category="paneZenTabManagement">
|
||||
|
|
|
|||
|
|
@ -82,10 +82,6 @@
|
|||
list-style-image: url('chrome://browser/skin/sidebars.svg') !important;
|
||||
}
|
||||
|
||||
#zen-sidepanel-button {
|
||||
list-style-image: url('sidebar.svg');
|
||||
}
|
||||
|
||||
#downloads-button,
|
||||
#downloads-indicator-anchor,
|
||||
#appMenu-downloads-button,
|
||||
|
|
|
|||
|
|
@ -72,10 +72,6 @@
|
|||
list-style-image: url('chrome://browser/skin/sidebars.svg') !important;
|
||||
}
|
||||
|
||||
#zen-sidepanel-button {
|
||||
list-style-image: url('sidebar.svg');
|
||||
}
|
||||
|
||||
#downloads-button,
|
||||
#downloads-indicator-anchor,
|
||||
#appMenu-downloads-button,
|
||||
|
|
|
|||
|
|
@ -1,16 +1,8 @@
|
|||
diff --git a/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs b/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs
|
||||
index 5da0404b2672ba8cce7bcf808bf2373474776654..44b62bd752294c2af96dd5b5d08c90ddf3dc513f 100644
|
||||
index 5da0404b2672ba8cce7bcf808bf2373474776654..1405c53a927a64ecda8255d78d9aa5ddf8806685 100644
|
||||
--- a/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs
|
||||
+++ b/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs
|
||||
@@ -488,13 +488,13 @@ export var PictureInPicture = {
|
||||
return;
|
||||
}
|
||||
|
||||
- let gBrowser = browser.getTabBrowser();
|
||||
- let tab = gBrowser.getTabForBrowser(browser);
|
||||
+ let gBrowser = browser?.ownerGlobal?.gBrowser;
|
||||
+ let tab = browser?.ownerGlobal?.gZenBrowserManagerSidebar.getTabForBrowser(browser) ?? gBrowser.getTabForBrowser(browser);
|
||||
|
||||
@@ -494,7 +494,7 @@ export var PictureInPicture = {
|
||||
// focus the tab's window
|
||||
tab.ownerGlobal.focus();
|
||||
|
||||
|
|
@ -27,12 +19,3 @@ index 5da0404b2672ba8cce7bcf808bf2373474776654..44b62bd752294c2af96dd5b5d08c90dd
|
|||
let browserHasPip = !!this.browserWeakMap.get(browser);
|
||||
if (browserHasPip) {
|
||||
this.setUrlbarPipIconActive(browser.ownerGlobal);
|
||||
@@ -877,7 +878,7 @@ export var PictureInPicture = {
|
||||
win.setIsMutedState(videoData.isMuted);
|
||||
|
||||
// set attribute which shows pip icon in tab
|
||||
- let tab = parentWin.gBrowser.getTabForBrowser(browser);
|
||||
+ let tab = parentWin.gBrowser.getTabForBrowser(browser) ?? parentWin.gZenBrowserManagerSidebar.getTabForBrowser(browser);;
|
||||
tab.setAttribute("pictureinpicture", true);
|
||||
|
||||
this.setUrlbarPipIconActive(parentWin);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue