mirror of
https://github.com/zulip/zulip-desktop.git
synced 2025-11-04 14:03:27 +00:00
Compare commits
2 Commits
v5.9.5
...
new-repo-u
| Author | SHA1 | Date | |
|---|---|---|---|
|
d9e09374c2 | ||
|
|
04e9936e52 |
@@ -1,11 +1,15 @@
|
||||
root = true
|
||||
|
||||
[*]
|
||||
indent_style = tab
|
||||
end_of_line = lf
|
||||
charset = utf-8
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
|
||||
[{*.css,*.html,*.js,*.json,*.ts}]
|
||||
[{package.json,*.yml}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = false
|
||||
2
.gitattributes
vendored
2
.gitattributes
vendored
@@ -1,5 +1,7 @@
|
||||
* text=auto eol=lf
|
||||
|
||||
package-lock.json binary
|
||||
app/package-lock.json binary
|
||||
*.gif binary
|
||||
*.jpg binary
|
||||
*.jpeg binary
|
||||
|
||||
3
.github/FUNDING.yml
vendored
3
.github/FUNDING.yml
vendored
@@ -1,3 +0,0 @@
|
||||
github: zulip
|
||||
patreon: zulip
|
||||
open_collective: zulip
|
||||
8
.github/ISSUE_TEMPLATE.md
vendored
Normal file
8
.github/ISSUE_TEMPLATE.md
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
---
|
||||
<!-- Please Include: -->
|
||||
- **Operating System**:
|
||||
- [ ] Windows
|
||||
- [ ] Linux/Ubuntu
|
||||
- [ ] macOS
|
||||
- **Clear steps to reproduce the issue**:
|
||||
- **Relevant error messages and/or screenshots**:
|
||||
31
.github/ISSUE_TEMPLATE/bug_report.md
vendored
31
.github/ISSUE_TEMPLATE/bug_report.md
vendored
@@ -1,31 +0,0 @@
|
||||
---
|
||||
name: Bug report
|
||||
about: Create a report to help us improve
|
||||
---
|
||||
|
||||
**Describe the bug**
|
||||
|
||||
<!-- A clear and concise description of what the bug is. -->
|
||||
|
||||
**To Reproduce**
|
||||
|
||||
<!-- Clear steps to reproduce the issue. -->
|
||||
|
||||
**Expected behavior**
|
||||
|
||||
<!-- A clear and concise description of what you expected to happen. -->
|
||||
|
||||
**Screenshots**
|
||||
|
||||
<!-- If applicable, add screenshots to help explain your problem. -->
|
||||
|
||||
**Desktop (please complete the following information):**
|
||||
|
||||
- Operating System:
|
||||
<!-- (Platform and Version) e.g. macOS 10.13.6 / Windows 10 (1803) / Ubuntu 18.04 x64 -->
|
||||
- Zulip Desktop Version:
|
||||
<!-- e.g. 5.2.0 -->
|
||||
|
||||
**Additional context**
|
||||
|
||||
<!-- Add any other context about the problem here. -->
|
||||
4
.github/ISSUE_TEMPLATE/custom.md
vendored
4
.github/ISSUE_TEMPLATE/custom.md
vendored
@@ -1,4 +0,0 @@
|
||||
---
|
||||
name: Custom issue template
|
||||
about: Describe this issue template's purpose here.
|
||||
---
|
||||
20
.github/ISSUE_TEMPLATE/feature_request.md
vendored
20
.github/ISSUE_TEMPLATE/feature_request.md
vendored
@@ -1,20 +0,0 @@
|
||||
---
|
||||
name: Feature request
|
||||
about: Suggest an idea for this project
|
||||
---
|
||||
|
||||
**Problem Description**
|
||||
|
||||
<!-- Please add a clear and concise description of what the problem is. -->
|
||||
|
||||
**Proposed Solution**
|
||||
|
||||
<!-- Describe the solution you'd like in a clear and concise manner -->
|
||||
|
||||
**Describe alternatives you've considered**
|
||||
|
||||
<!-- A clear and concise description of any alternative solutions or features you've considered. -->
|
||||
|
||||
**Additional context**
|
||||
|
||||
<!-- Add any other context or screenshots about the feature request here. -->
|
||||
2
.github/PULL_REQUEST_TEMPLATE.md
vendored
2
.github/PULL_REQUEST_TEMPLATE.md
vendored
@@ -1,5 +1,4 @@
|
||||
---
|
||||
|
||||
<!--
|
||||
Remove the fields that are not appropriate
|
||||
Please include:
|
||||
@@ -12,7 +11,6 @@ Please include:
|
||||
**Screenshots?**
|
||||
|
||||
**You have tested this PR on:**
|
||||
|
||||
- [ ] Windows
|
||||
- [ ] Linux/Ubuntu
|
||||
- [ ] macOS
|
||||
|
||||
15
.github/workflows/node.js.yml
vendored
15
.github/workflows/node.js.yml
vendored
@@ -1,15 +0,0 @@
|
||||
name: Node.js CI
|
||||
|
||||
on:
|
||||
push:
|
||||
branches: [main]
|
||||
pull_request:
|
||||
branches: [main]
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v2
|
||||
- run: npm ci
|
||||
- run: npm test
|
||||
10
.gitignore
vendored
10
.gitignore
vendored
@@ -1,15 +1,11 @@
|
||||
# Dependency directory
|
||||
/node_modules/
|
||||
# Dependency directories
|
||||
node_modules/
|
||||
|
||||
# npm cache directory
|
||||
.npm
|
||||
|
||||
# transifexrc - if user prefers it to be in working tree
|
||||
.transifexrc
|
||||
|
||||
# Compiled binary build directory
|
||||
/dist/
|
||||
/dist-electron/
|
||||
dist/
|
||||
|
||||
#snap generated files
|
||||
snap/parts
|
||||
|
||||
@@ -1,7 +1,12 @@
|
||||
{
|
||||
"tagname-lowercase": true,
|
||||
"attr-lowercase": true,
|
||||
"attr-value-double-quotes": true,
|
||||
"attr-value-not-empty": false,
|
||||
"attr-no-duplication": true,
|
||||
"doctype-first": true,
|
||||
"tag-pair": true,
|
||||
"empty-tag-not-self-closed": true,
|
||||
"spec-char-escape": true,
|
||||
"id-unique": true,
|
||||
"src-not-empty": true,
|
||||
@@ -12,6 +17,7 @@
|
||||
"style-disabled": false,
|
||||
"inline-style-disabled": false,
|
||||
"inline-script-disabled": false,
|
||||
"space-tab-mixed-disabled": "space4",
|
||||
"id-class-ad-disabled": false,
|
||||
"href-abs-or-rel": false,
|
||||
"attr-unsafe-chars": true,
|
||||
|
||||
5
.mailmap
5
.mailmap
@@ -1,5 +0,0 @@
|
||||
Anders Kaseorg <anders@zulip.com> <anders@zulipchat.com>
|
||||
Rishi Gupta <rishig@zulip.com> <rishig@zulipchat.com>
|
||||
Rishi Gupta <rishig@zulip.com> <rishig@users.noreply.github.com>
|
||||
Tim Abbott <tabbott@zulip.com> <tabbott@zulipchat.com>
|
||||
Tim Abbott <tabbott@zulip.com> <tabbott@mit.edu>
|
||||
1
.node-version
Normal file
1
.node-version
Normal file
@@ -0,0 +1 @@
|
||||
6.9.4
|
||||
@@ -1,3 +0,0 @@
|
||||
/dist
|
||||
/dist-electron
|
||||
/public/translations/*.json
|
||||
69
.stylelintrc
69
.stylelintrc
@@ -1,12 +1,67 @@
|
||||
{
|
||||
"extends": ["stylelint-config-standard", "stylelint-config-prettier"],
|
||||
"rules": {
|
||||
"color-named": "never",
|
||||
# Stylistic rules for CSS.
|
||||
"function-comma-space-after": "always",
|
||||
"function-comma-space-before": "never",
|
||||
"function-max-empty-lines": 0,
|
||||
"function-whitespace-after": "always",
|
||||
|
||||
"value-keyword-case": "lower",
|
||||
"value-list-comma-newline-after": "always-multi-line",
|
||||
"value-list-comma-space-after": "always-single-line",
|
||||
"value-list-comma-space-before": "never",
|
||||
"value-list-max-empty-lines": 0,
|
||||
|
||||
"unit-case": "lower",
|
||||
"property-case": "lower",
|
||||
"color-hex-case": "lower",
|
||||
|
||||
"declaration-bang-space-before": "always",
|
||||
"declaration-colon-newline-after": "always-multi-line",
|
||||
"declaration-colon-space-after": "always-single-line",
|
||||
"declaration-colon-space-before": "never",
|
||||
"declaration-block-semicolon-newline-after": "always",
|
||||
"declaration-block-semicolon-space-before": "never",
|
||||
"declaration-block-trailing-semicolon": "always",
|
||||
|
||||
"block-closing-brace-empty-line-before": "never",
|
||||
"block-closing-brace-newline-after": "always",
|
||||
"block-closing-brace-newline-before": "always",
|
||||
"block-opening-brace-newline-after": "always",
|
||||
"block-opening-brace-space-before": "always",
|
||||
|
||||
"selector-attribute-brackets-space-inside": "never",
|
||||
"selector-attribute-operator-space-after": "never",
|
||||
"selector-attribute-operator-space-before": "never",
|
||||
"selector-combinator-space-after": "always",
|
||||
"selector-combinator-space-before": "always",
|
||||
"selector-descendant-combinator-no-non-space": true,
|
||||
"selector-pseudo-class-parentheses-space-inside": "never",
|
||||
"selector-pseudo-element-case": "lower",
|
||||
"selector-pseudo-element-colon-notation": "double",
|
||||
"selector-type-case": "lower",
|
||||
"selector-list-comma-newline-after": "always",
|
||||
"selector-list-comma-space-before": "never",
|
||||
|
||||
"media-feature-colon-space-after": "always",
|
||||
"media-feature-colon-space-before": "never",
|
||||
"media-feature-name-case": "lower",
|
||||
"media-feature-parentheses-space-inside": "never",
|
||||
"media-feature-range-operator-space-after": "always",
|
||||
"media-feature-range-operator-space-before": "always",
|
||||
"media-query-list-comma-newline-after": "always",
|
||||
"media-query-list-comma-space-before": "never",
|
||||
|
||||
"at-rule-name-case": "lower",
|
||||
"at-rule-name-space-after": "always",
|
||||
"at-rule-semicolon-newline-after": "always",
|
||||
"at-rule-semicolon-space-before": "never",
|
||||
|
||||
"comment-whitespace-inside": "always",
|
||||
"indentation": 4,
|
||||
|
||||
# Limit language features
|
||||
"color-no-hex": true,
|
||||
"font-family-no-missing-generic-family-keyword": [
|
||||
true,
|
||||
{"ignoreFontFamilies": ["Material Icons"]}
|
||||
],
|
||||
"selector-type-no-unknown": [true, {"ignoreTypes": ["webview"]}]
|
||||
"color-named": "never",
|
||||
}
|
||||
}
|
||||
37
.travis.yml
Normal file
37
.travis.yml
Normal file
@@ -0,0 +1,37 @@
|
||||
sudo: required
|
||||
dist: trusty
|
||||
|
||||
os:
|
||||
- osx
|
||||
- linux
|
||||
|
||||
addons:
|
||||
apt:
|
||||
packages:
|
||||
- build-essential
|
||||
- libxext-dev
|
||||
- libxtst-dev
|
||||
- libxkbfile-dev
|
||||
|
||||
language: node_js
|
||||
node_js:
|
||||
- '8'
|
||||
|
||||
before_install:
|
||||
- ./scripts/travis-xvfb.sh
|
||||
- npm install -g gulp
|
||||
- npm install
|
||||
|
||||
cache:
|
||||
directories:
|
||||
- node_modules
|
||||
- app/node_modules
|
||||
|
||||
script:
|
||||
- npm run travis
|
||||
notifications:
|
||||
webhooks:
|
||||
urls:
|
||||
- https://zulip.org/zulipbot/travis
|
||||
on_success: always
|
||||
on_failure: always
|
||||
@@ -1,9 +0,0 @@
|
||||
[main]
|
||||
host = https://www.transifex.com
|
||||
|
||||
[zulip.desktopjson]
|
||||
file_filter = public/translations/<lang>.json
|
||||
minimum_perc = 0
|
||||
source_file = public/translations/en.json
|
||||
source_lang = en
|
||||
type = KEYVALUEJSON
|
||||
@@ -6,16 +6,15 @@ The following is a set of guidelines for contributing to Zulip's desktop Client.
|
||||
|
||||
## Getting Started
|
||||
|
||||
Zulip-Desktop app is built on top of [Electron](http://electron.atom.io/). If you are new to Electron, please head over to [this](https://jlord.us/essential-electron) great article.
|
||||
Zulip-Desktop app is built on top of [Electron](http://electron.atom.io/). If you are new to Electron, please head over to [this](https://jlord.dev/blog/essential-electron) great article.
|
||||
|
||||
## Community
|
||||
|
||||
- The whole Zulip documentation, such as setting up a development environment, setting up with the Zulip webapp project, and testing, can be read [here](https://zulip.readthedocs.io).
|
||||
* The whole Zulip documentation, such as setting up a development environment, setting up with the Zulip webapp project, and testing, can be read [here](https://zulip.readthedocs.io).
|
||||
|
||||
- If you have any questions regarding zulip-desktop, open an [issue](https://github.com/zulip/zulip-desktop/issues/new/) or ask it on [chat.zulip.org](https://chat.zulip.org/#narrow/stream/16-desktop).
|
||||
* If you have any questions regarding zulip-desktop, open an [issue](https://github.com/zulip/zulip-desktop/issues/new/) or ask it on [chat.zulip.org](https://chat.zulip.org/#narrow/stream/16-desktop).
|
||||
|
||||
## Issue
|
||||
|
||||
Ensure the bug was not already reported by searching on GitHub under [issues](https://github.com/zulip/zulip-desktop/issues). If you're unable to find an open issue addressing the bug, open a [new issue](https://github.com/zulip/zulip-desktop/issues/new).
|
||||
|
||||
The [zulipbot](https://github.com/zulip/zulipbot) helps to claim an issue by commenting the following in the comment section: "**@zulipbot** claim". **@zulipbot** will assign you to the issue and label the issue as **in progress**. For more details, check out [**@zulipbot**](https://github.com/zulip/zulipbot).
|
||||
@@ -23,29 +22,26 @@ The [zulipbot](https://github.com/zulip/zulipbot) helps to claim an issue by com
|
||||
Please pay attention to the following points while opening an issue.
|
||||
|
||||
### Does it happen on web browsers? (especially Chrome)
|
||||
|
||||
Zulip's desktop client is based on Electron, which integrates the Chrome engine within a standalone application.
|
||||
If the problem you encounter can be reproduced on web browsers, it may be an issue with [Zulip web app](https://github.com/zulip/zulip).
|
||||
|
||||
### Write detailed information
|
||||
|
||||
Detailed information is very helpful to understand an issue.
|
||||
|
||||
For example:
|
||||
* How to reproduce the issue, step-by-step.
|
||||
* The expected behavior (or what is wrong).
|
||||
* Screenshots for GUI issues.
|
||||
* The application version.
|
||||
* The operating system.
|
||||
* The Zulip-Desktop version.
|
||||
|
||||
- How to reproduce the issue, step-by-step.
|
||||
- The expected behavior (or what is wrong).
|
||||
- Screenshots for GUI issues.
|
||||
- The application version.
|
||||
- The operating system.
|
||||
- The Zulip-Desktop version.
|
||||
|
||||
## Pull Requests
|
||||
|
||||
Pull Requests are always welcome.
|
||||
|
||||
1. When you edit the code, please run `npm run test` to check the formatting of your code before you `git commit`.
|
||||
2. Ensure the PR description clearly describes the problem and solution. It should include:
|
||||
- The operating system on which you tested.
|
||||
- The Zulip-Desktop version on which you tested.
|
||||
- The relevant issue number, if applicable.
|
||||
* The operating system on which you tested.
|
||||
* The Zulip-Desktop version on which you tested.
|
||||
* The relevant issue number, if applicable.
|
||||
|
||||
32
README.md
32
README.md
@@ -1,35 +1,22 @@
|
||||
# Zulip Desktop Client
|
||||
|
||||
[](https://travis-ci.com/github/zulip/zulip-desktop)
|
||||
[](https://ci.appveyor.com/project/zulip/zulip-desktop/branch/main)
|
||||
[](https://travis-ci.org/zulip/zulip-desktop)
|
||||
[](https://ci.appveyor.com/project/zulip/zulip-desktop/branch/master)
|
||||
[](https://github.com/sindresorhus/xo)
|
||||
[](https://chat.zulip.org)
|
||||
|
||||
Desktop client for Zulip. Available for Mac, Linux, and Windows.
|
||||
|
||||
|
||||
|
||||
<img src="http://i.imgur.com/ChzTq4F.png"/>
|
||||
|
||||
# Download
|
||||
|
||||
Please see the [installation guide](https://zulip.com/help/desktop-app-install-guide).
|
||||
Please see the [installation guide](https://zulipchat.com/help/desktop-app-install-guide).
|
||||
|
||||
# Features
|
||||
|
||||
- Sign in to multiple organizations
|
||||
- Desktop notifications with inline reply
|
||||
- Tray/dock integration
|
||||
- Multi-language spell checker
|
||||
- Automatic updates
|
||||
|
||||
# Reporting issues
|
||||
|
||||
This desktop client shares most of its code with the Zulip webapp.
|
||||
Issues in an individual organization's Zulip window should be reported
|
||||
in the [Zulip server and webapp
|
||||
project](https://github.com/zulip/zulip/issues/new). Other
|
||||
issues in the desktop app and its settings should be reported [in this
|
||||
project](https://github.com/zulip/zulip-desktop/issues/new).
|
||||
* Sign in to multiple organizations
|
||||
* Desktop notifications with inline reply
|
||||
* Tray/dock integration
|
||||
* Multi-language spell checker
|
||||
* Automatic updates
|
||||
|
||||
# Contribute
|
||||
|
||||
@@ -37,5 +24,4 @@ First, join us on the [Zulip community server](https://zulip.readthedocs.io/en/l
|
||||
Also see our [contribution guidelines](./CONTRIBUTING.md) and our [development guide](./development.md).
|
||||
|
||||
# License
|
||||
|
||||
Released under the [Apache-2.0](./LICENSE) license.
|
||||
|
||||
@@ -1,44 +0,0 @@
|
||||
import * as z from "zod";
|
||||
|
||||
export const dndSettingsSchemata = {
|
||||
showNotification: z.boolean(),
|
||||
silent: z.boolean(),
|
||||
flashTaskbarOnMessage: z.boolean(),
|
||||
};
|
||||
|
||||
export const configSchemata = {
|
||||
...dndSettingsSchemata,
|
||||
appLanguage: z.string().nullable(),
|
||||
autoHideMenubar: z.boolean(),
|
||||
autoUpdate: z.boolean(),
|
||||
badgeOption: z.boolean(),
|
||||
betaUpdate: z.boolean(),
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
customCSS: z.string().or(z.literal(false)).nullable(),
|
||||
dnd: z.boolean(),
|
||||
dndPreviousSettings: z.object(dndSettingsSchemata).partial(),
|
||||
dockBouncing: z.boolean(),
|
||||
downloadsPath: z.string(),
|
||||
enableSpellchecker: z.boolean(),
|
||||
errorReporting: z.boolean(),
|
||||
lastActiveTab: z.number(),
|
||||
promptDownload: z.boolean(),
|
||||
proxyBypass: z.string(),
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
proxyPAC: z.string(),
|
||||
proxyRules: z.string(),
|
||||
quitOnClose: z.boolean(),
|
||||
showSidebar: z.boolean(),
|
||||
spellcheckerLanguages: z.string().array().nullable(),
|
||||
startAtLogin: z.boolean(),
|
||||
startMinimized: z.boolean(),
|
||||
trayIcon: z.boolean(),
|
||||
useManualProxy: z.boolean(),
|
||||
useProxy: z.boolean(),
|
||||
useSystemProxy: z.boolean(),
|
||||
};
|
||||
|
||||
export const enterpriseConfigSchemata = {
|
||||
...configSchemata,
|
||||
presetOrganizations: z.string().array(),
|
||||
};
|
||||
@@ -1,100 +0,0 @@
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
|
||||
import * as Sentry from "@sentry/electron";
|
||||
import {JsonDB} from "node-json-db";
|
||||
import {DataError} from "node-json-db/dist/lib/Errors";
|
||||
import type * as z from "zod";
|
||||
import {app, dialog} from "zulip:remote";
|
||||
|
||||
import {configSchemata} from "./config-schemata.js";
|
||||
import * as EnterpriseUtil from "./enterprise-util.js";
|
||||
import Logger from "./logger-util.js";
|
||||
|
||||
export type Config = {
|
||||
[Key in keyof typeof configSchemata]: z.output<(typeof configSchemata)[Key]>;
|
||||
};
|
||||
|
||||
const logger = new Logger({
|
||||
file: "config-util.log",
|
||||
});
|
||||
|
||||
let db: JsonDB;
|
||||
|
||||
reloadDb();
|
||||
|
||||
export function getConfigItem<Key extends keyof Config>(
|
||||
key: Key,
|
||||
defaultValue: Config[Key],
|
||||
): z.output<(typeof configSchemata)[Key]> {
|
||||
try {
|
||||
db.reload();
|
||||
} catch (error: unknown) {
|
||||
logger.error("Error while reloading settings.json: ");
|
||||
logger.error(error);
|
||||
}
|
||||
|
||||
try {
|
||||
return configSchemata[key].parse(db.getObject<unknown>(`/${key}`));
|
||||
} catch (error: unknown) {
|
||||
if (!(error instanceof DataError)) throw error;
|
||||
setConfigItem(key, defaultValue);
|
||||
return defaultValue;
|
||||
}
|
||||
}
|
||||
|
||||
// This function returns whether a key exists in the configuration file (settings.json)
|
||||
export function isConfigItemExists(key: string): boolean {
|
||||
try {
|
||||
db.reload();
|
||||
} catch (error: unknown) {
|
||||
logger.error("Error while reloading settings.json: ");
|
||||
logger.error(error);
|
||||
}
|
||||
|
||||
return db.exists(`/${key}`);
|
||||
}
|
||||
|
||||
export function setConfigItem<Key extends keyof Config>(
|
||||
key: Key,
|
||||
value: Config[Key],
|
||||
override?: boolean,
|
||||
): void {
|
||||
if (EnterpriseUtil.configItemExists(key) && !override) {
|
||||
// If item is in global config and we're not trying to override
|
||||
return;
|
||||
}
|
||||
|
||||
configSchemata[key].parse(value);
|
||||
db.push(`/${key}`, value, true);
|
||||
db.save();
|
||||
}
|
||||
|
||||
export function removeConfigItem(key: string): void {
|
||||
db.delete(`/${key}`);
|
||||
db.save();
|
||||
}
|
||||
|
||||
function reloadDb(): void {
|
||||
const settingsJsonPath = path.join(
|
||||
app.getPath("userData"),
|
||||
"/config/settings.json",
|
||||
);
|
||||
try {
|
||||
const file = fs.readFileSync(settingsJsonPath, "utf8");
|
||||
JSON.parse(file);
|
||||
} catch (error: unknown) {
|
||||
if (fs.existsSync(settingsJsonPath)) {
|
||||
fs.unlinkSync(settingsJsonPath);
|
||||
dialog.showErrorBox(
|
||||
"Error saving settings",
|
||||
"We encountered an error while saving the settings.",
|
||||
);
|
||||
logger.error("Error while JSON parsing settings.json: ");
|
||||
logger.error(error);
|
||||
Sentry.captureException(error);
|
||||
}
|
||||
}
|
||||
|
||||
db = new JsonDB(settingsJsonPath, true, true);
|
||||
}
|
||||
@@ -1,61 +0,0 @@
|
||||
import fs from "node:fs";
|
||||
|
||||
import {app} from "zulip:remote";
|
||||
|
||||
let setupCompleted = false;
|
||||
|
||||
const zulipDir = app.getPath("userData");
|
||||
const logDir = `${zulipDir}/Logs/`;
|
||||
const configDir = `${zulipDir}/config/`;
|
||||
export const initSetUp = (): void => {
|
||||
// If it is the first time the app is running
|
||||
// create zulip dir in userData folder to
|
||||
// avoid errors
|
||||
if (!setupCompleted) {
|
||||
if (!fs.existsSync(zulipDir)) {
|
||||
fs.mkdirSync(zulipDir);
|
||||
}
|
||||
|
||||
if (!fs.existsSync(logDir)) {
|
||||
fs.mkdirSync(logDir);
|
||||
}
|
||||
|
||||
// Migrate config files from app data folder to config folder inside app
|
||||
// data folder. This will be done once when a user updates to the new version.
|
||||
if (!fs.existsSync(configDir)) {
|
||||
fs.mkdirSync(configDir);
|
||||
const domainJson = `${zulipDir}/domain.json`;
|
||||
const settingsJson = `${zulipDir}/settings.json`;
|
||||
const updatesJson = `${zulipDir}/updates.json`;
|
||||
const windowStateJson = `${zulipDir}/window-state.json`;
|
||||
const configData = [
|
||||
{
|
||||
path: domainJson,
|
||||
fileName: "domain.json",
|
||||
},
|
||||
{
|
||||
path: settingsJson,
|
||||
fileName: "settings.json",
|
||||
},
|
||||
{
|
||||
path: updatesJson,
|
||||
fileName: "updates.json",
|
||||
},
|
||||
];
|
||||
for (const data of configData) {
|
||||
if (fs.existsSync(data.path)) {
|
||||
fs.copyFileSync(data.path, configDir + data.fileName);
|
||||
fs.unlinkSync(data.path);
|
||||
}
|
||||
}
|
||||
|
||||
// `window-state.json` is only deleted not moved, as the electron-window-state
|
||||
// package will recreate the file in the config folder.
|
||||
if (fs.existsSync(windowStateJson)) {
|
||||
fs.unlinkSync(windowStateJson);
|
||||
}
|
||||
}
|
||||
|
||||
setupCompleted = true;
|
||||
}
|
||||
};
|
||||
@@ -1,60 +0,0 @@
|
||||
import process from "node:process";
|
||||
|
||||
import type * as z from "zod";
|
||||
|
||||
import type {dndSettingsSchemata} from "./config-schemata.js";
|
||||
import * as ConfigUtil from "./config-util.js";
|
||||
|
||||
export type DndSettings = {
|
||||
[Key in keyof typeof dndSettingsSchemata]: z.output<
|
||||
(typeof dndSettingsSchemata)[Key]
|
||||
>;
|
||||
};
|
||||
|
||||
type SettingName = keyof DndSettings;
|
||||
|
||||
type Toggle = {
|
||||
dnd: boolean;
|
||||
newSettings: Partial<DndSettings>;
|
||||
};
|
||||
|
||||
export function toggle(): Toggle {
|
||||
const dnd = !ConfigUtil.getConfigItem("dnd", false);
|
||||
const dndSettingList: SettingName[] = ["showNotification", "silent"];
|
||||
if (process.platform === "win32") {
|
||||
dndSettingList.push("flashTaskbarOnMessage");
|
||||
}
|
||||
|
||||
let newSettings: Partial<DndSettings>;
|
||||
if (dnd) {
|
||||
const oldSettings: Partial<DndSettings> = {};
|
||||
newSettings = {};
|
||||
|
||||
// Iterate through the dndSettingList.
|
||||
for (const settingName of dndSettingList) {
|
||||
// Store the current value of setting.
|
||||
oldSettings[settingName] = ConfigUtil.getConfigItem(
|
||||
settingName,
|
||||
settingName !== "silent",
|
||||
);
|
||||
// New value of setting.
|
||||
newSettings[settingName] = settingName === "silent";
|
||||
}
|
||||
|
||||
// Store old value in oldSettings.
|
||||
ConfigUtil.setConfigItem("dndPreviousSettings", oldSettings);
|
||||
} else {
|
||||
newSettings = ConfigUtil.getConfigItem("dndPreviousSettings", {
|
||||
showNotification: true,
|
||||
silent: false,
|
||||
...(process.platform === "win32" && {flashTaskbarOnMessage: true}),
|
||||
});
|
||||
}
|
||||
|
||||
for (const settingName of dndSettingList) {
|
||||
ConfigUtil.setConfigItem(settingName, newSettings[settingName]!);
|
||||
}
|
||||
|
||||
ConfigUtil.setConfigItem("dnd", dnd);
|
||||
return {dnd, newSettings};
|
||||
}
|
||||
@@ -1,94 +0,0 @@
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
import process from "node:process";
|
||||
|
||||
import * as z from "zod";
|
||||
|
||||
import {enterpriseConfigSchemata} from "./config-schemata.js";
|
||||
import Logger from "./logger-util.js";
|
||||
|
||||
type EnterpriseConfig = {
|
||||
[Key in keyof typeof enterpriseConfigSchemata]: z.output<
|
||||
(typeof enterpriseConfigSchemata)[Key]
|
||||
>;
|
||||
};
|
||||
|
||||
const logger = new Logger({
|
||||
file: "enterprise-util.log",
|
||||
});
|
||||
|
||||
let enterpriseSettings: Partial<EnterpriseConfig>;
|
||||
let configFile: boolean;
|
||||
|
||||
reloadDb();
|
||||
|
||||
function reloadDb(): void {
|
||||
let enterpriseFile = "/etc/zulip-desktop-config/global_config.json";
|
||||
if (process.platform === "win32") {
|
||||
enterpriseFile =
|
||||
"C:\\Program Files\\Zulip-Desktop-Config\\global_config.json";
|
||||
}
|
||||
|
||||
enterpriseFile = path.resolve(enterpriseFile);
|
||||
if (fs.existsSync(enterpriseFile)) {
|
||||
configFile = true;
|
||||
try {
|
||||
const file = fs.readFileSync(enterpriseFile, "utf8");
|
||||
const data: unknown = JSON.parse(file);
|
||||
enterpriseSettings = z
|
||||
.object(enterpriseConfigSchemata)
|
||||
.partial()
|
||||
.parse(data);
|
||||
} catch (error: unknown) {
|
||||
logger.log("Error while JSON parsing global_config.json: ");
|
||||
logger.log(error);
|
||||
}
|
||||
} else {
|
||||
configFile = false;
|
||||
}
|
||||
}
|
||||
|
||||
export function hasConfigFile(): boolean {
|
||||
return configFile;
|
||||
}
|
||||
|
||||
export function getConfigItem<Key extends keyof EnterpriseConfig>(
|
||||
key: Key,
|
||||
defaultValue: EnterpriseConfig[Key],
|
||||
): EnterpriseConfig[Key] {
|
||||
reloadDb();
|
||||
if (!configFile) {
|
||||
return defaultValue;
|
||||
}
|
||||
|
||||
const value = enterpriseSettings[key];
|
||||
return value === undefined ? defaultValue : (value as EnterpriseConfig[Key]);
|
||||
}
|
||||
|
||||
export function configItemExists(key: keyof EnterpriseConfig): boolean {
|
||||
reloadDb();
|
||||
if (!configFile) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return enterpriseSettings[key] !== undefined;
|
||||
}
|
||||
|
||||
export function isPresetOrg(url: string): boolean {
|
||||
if (!configFile || !configItemExists("presetOrganizations")) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const presetOrgs = enterpriseSettings.presetOrganizations;
|
||||
if (!Array.isArray(presetOrgs)) {
|
||||
throw new TypeError("Expected array for presetOrgs");
|
||||
}
|
||||
|
||||
for (const org of presetOrgs) {
|
||||
if (url.includes(org)) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
import {htmlEscape} from "escape-goat";
|
||||
|
||||
export class Html {
|
||||
html: string;
|
||||
|
||||
constructor({html}: {html: string}) {
|
||||
this.html = html;
|
||||
}
|
||||
|
||||
join(htmls: readonly Html[]): Html {
|
||||
return new Html({html: htmls.map((html) => html.html).join(this.html)});
|
||||
}
|
||||
}
|
||||
|
||||
export function html(
|
||||
template: TemplateStringsArray,
|
||||
...values: unknown[]
|
||||
): Html {
|
||||
let html = template[0];
|
||||
for (const [index, value] of values.entries()) {
|
||||
html += value instanceof Html ? value.html : htmlEscape(String(value));
|
||||
html += template[index + 1];
|
||||
}
|
||||
|
||||
return new Html({html});
|
||||
}
|
||||
@@ -1,43 +0,0 @@
|
||||
import {shell} from "electron/common";
|
||||
import fs from "node:fs";
|
||||
import os from "node:os";
|
||||
import path from "node:path";
|
||||
|
||||
import {html} from "./html.js";
|
||||
|
||||
export async function openBrowser(url: URL): Promise<void> {
|
||||
if (["http:", "https:", "mailto:"].includes(url.protocol)) {
|
||||
await shell.openExternal(url.href);
|
||||
} else {
|
||||
// For security, indirect links to non-whitelisted protocols
|
||||
// through a real web browser via a local HTML file.
|
||||
const dir = fs.mkdtempSync(path.join(os.tmpdir(), "zulip-redirect-"));
|
||||
const file = path.join(dir, "redirect.html");
|
||||
fs.writeFileSync(
|
||||
file,
|
||||
html`
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta http-equiv="Refresh" content="0; url=${url.href}" />
|
||||
<title>Redirecting</title>
|
||||
<style>
|
||||
html {
|
||||
font-family: menu, "Helvetica Neue", sans-serif;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<p>Opening <a href="${url.href}">${url.href}</a>…</p>
|
||||
</body>
|
||||
</html>
|
||||
`.html,
|
||||
);
|
||||
await shell.openPath(file);
|
||||
setTimeout(() => {
|
||||
fs.unlinkSync(file);
|
||||
fs.rmdirSync(dir);
|
||||
}, 15_000);
|
||||
}
|
||||
}
|
||||
@@ -1,90 +0,0 @@
|
||||
import {Console} from "node:console"; // eslint-disable-line n/prefer-global/console
|
||||
import fs from "node:fs";
|
||||
import os from "node:os";
|
||||
import process from "node:process";
|
||||
|
||||
import {app} from "zulip:remote";
|
||||
|
||||
import {initSetUp} from "./default-util.js";
|
||||
|
||||
type LoggerOptions = {
|
||||
file?: string;
|
||||
};
|
||||
|
||||
initSetUp();
|
||||
|
||||
const logDir = `${app.getPath("userData")}/Logs`;
|
||||
|
||||
type Level = "log" | "debug" | "info" | "warn" | "error";
|
||||
|
||||
export default class Logger {
|
||||
nodeConsole: Console;
|
||||
|
||||
constructor(options: LoggerOptions = {}) {
|
||||
let {file = "console.log"} = options;
|
||||
|
||||
file = `${logDir}/${file}`;
|
||||
|
||||
// Trim log according to type of process
|
||||
if (process.type === "renderer") {
|
||||
requestIdleCallback(async () => this.trimLog(file));
|
||||
} else {
|
||||
process.nextTick(async () => this.trimLog(file));
|
||||
}
|
||||
|
||||
const fileStream = fs.createWriteStream(file, {flags: "a"});
|
||||
const nodeConsole = new Console(fileStream);
|
||||
|
||||
this.nodeConsole = nodeConsole;
|
||||
}
|
||||
|
||||
_log(type: Level, ...args: unknown[]): void {
|
||||
args.unshift(this.getTimestamp() + " |\t");
|
||||
args.unshift(type.toUpperCase() + " |");
|
||||
this.nodeConsole[type](...args);
|
||||
console[type](...args);
|
||||
}
|
||||
|
||||
log(...args: unknown[]): void {
|
||||
this._log("log", ...args);
|
||||
}
|
||||
|
||||
debug(...args: unknown[]): void {
|
||||
this._log("debug", ...args);
|
||||
}
|
||||
|
||||
info(...args: unknown[]): void {
|
||||
this._log("info", ...args);
|
||||
}
|
||||
|
||||
warn(...args: unknown[]): void {
|
||||
this._log("warn", ...args);
|
||||
}
|
||||
|
||||
error(...args: unknown[]): void {
|
||||
this._log("error", ...args);
|
||||
}
|
||||
|
||||
getTimestamp(): string {
|
||||
const date = new Date();
|
||||
const timestamp =
|
||||
`${date.getMonth()}/${date.getDate()} ` +
|
||||
`${date.getMinutes()}:${date.getSeconds()}`;
|
||||
return timestamp;
|
||||
}
|
||||
|
||||
async trimLog(file: string): Promise<void> {
|
||||
const data = await fs.promises.readFile(file, "utf8");
|
||||
|
||||
const maxLogFileLines = 500;
|
||||
const logs = data.split(os.EOL);
|
||||
const logLength = logs.length - 1;
|
||||
|
||||
// Keep bottom maxLogFileLines of each log instance
|
||||
if (logLength > maxLogFileLines) {
|
||||
const trimmedLogs = logs.slice(logLength - maxLogFileLines);
|
||||
const toWrite = trimmedLogs.join(os.EOL);
|
||||
await fs.promises.writeFile(file, toWrite);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,38 +0,0 @@
|
||||
type DialogBoxError = {
|
||||
title: string;
|
||||
content: string;
|
||||
};
|
||||
|
||||
export function invalidZulipServerError(domain: string): string {
|
||||
return `${domain} does not appear to be a valid Zulip server. Make sure that
|
||||
• You can connect to that URL in a web browser.
|
||||
• If you need a proxy to connect to the Internet, that you've configured your proxy in the Network settings.
|
||||
• It's a Zulip server. (The oldest supported version is 1.6).
|
||||
• The server has a valid certificate.
|
||||
• The SSL is correctly configured for the certificate. Check out the SSL troubleshooting guide -
|
||||
https://zulip.readthedocs.io/en/stable/production/ssl-certificates.html`;
|
||||
}
|
||||
|
||||
export function enterpriseOrgError(
|
||||
length: number,
|
||||
domains: string[],
|
||||
): DialogBoxError {
|
||||
let domainList = "";
|
||||
for (const domain of domains) {
|
||||
domainList += `• ${domain}\n`;
|
||||
}
|
||||
|
||||
return {
|
||||
title: `Could not add the following ${
|
||||
length === 1 ? "organization" : "organizations"
|
||||
}`,
|
||||
content: `${domainList}\nPlease contact your system administrator.`,
|
||||
};
|
||||
}
|
||||
|
||||
export function orgRemovalError(url: string): DialogBoxError {
|
||||
return {
|
||||
title: `Removing ${url} is a restricted operation.`,
|
||||
content: "Please contact your system administrator.",
|
||||
};
|
||||
}
|
||||
@@ -1,15 +0,0 @@
|
||||
import path from "node:path";
|
||||
import process from "node:process";
|
||||
import url from "node:url";
|
||||
|
||||
export const bundlePath = __dirname;
|
||||
|
||||
export const publicPath = import.meta.env.DEV
|
||||
? path.join(bundlePath, "../public")
|
||||
: bundlePath;
|
||||
|
||||
export const bundleUrl = import.meta.env.DEV
|
||||
? process.env.VITE_DEV_SERVER_URL
|
||||
: url.pathToFileURL(__dirname).href + "/";
|
||||
|
||||
export const publicUrl = bundleUrl;
|
||||
@@ -1,19 +0,0 @@
|
||||
import path from "node:path";
|
||||
|
||||
import i18n from "i18n";
|
||||
|
||||
import * as ConfigUtil from "./config-util.js";
|
||||
import {publicPath} from "./paths.js";
|
||||
|
||||
i18n.configure({
|
||||
directory: path.join(publicPath, "translations/"),
|
||||
updateFiles: false,
|
||||
});
|
||||
|
||||
/* Fetches the current appLocale from settings.json */
|
||||
const appLocale = ConfigUtil.getConfigItem("appLanguage", "en");
|
||||
|
||||
/* If no locale present in the json, en is set default */
|
||||
export function __(phrase: string): string {
|
||||
return i18n.__({phrase, locale: appLocale ?? "en"});
|
||||
}
|
||||
@@ -1,85 +0,0 @@
|
||||
import type {DndSettings} from "./dnd-util.js";
|
||||
import type {MenuProps, ServerConf} from "./types.js";
|
||||
|
||||
export type MainMessage = {
|
||||
"clear-app-settings": () => void;
|
||||
"configure-spell-checker": () => void;
|
||||
"fetch-user-agent": () => string;
|
||||
"focus-app": () => void;
|
||||
"focus-this-webview": () => void;
|
||||
"get-injected-js": () => string;
|
||||
"new-clipboard-key": () => {key: Uint8Array; sig: Uint8Array};
|
||||
"permission-callback": (permissionCallbackId: number, grant: boolean) => void;
|
||||
"quit-app": () => void;
|
||||
"realm-icon-changed": (serverURL: string, iconURL: string) => void;
|
||||
"realm-name-changed": (serverURL: string, realmName: string) => void;
|
||||
"reload-full-app": () => void;
|
||||
"save-last-tab": (index: number) => void;
|
||||
"switch-server-tab": (index: number) => void;
|
||||
"toggle-app": () => void;
|
||||
"toggle-badge-option": (newValue: boolean) => void;
|
||||
"toggle-menubar": (showMenubar: boolean) => void;
|
||||
toggleAutoLauncher: (AutoLaunchValue: boolean) => void;
|
||||
"unread-count": (unreadCount: number) => void;
|
||||
"update-badge": (messageCount: number) => void;
|
||||
"update-menu": (props: MenuProps) => void;
|
||||
"update-taskbar-icon": (data: string, text: string) => void;
|
||||
};
|
||||
|
||||
export type MainCall = {
|
||||
"get-server-settings": (domain: string) => ServerConf;
|
||||
"is-online": (url: string) => boolean;
|
||||
"poll-clipboard": (key: Uint8Array, sig: Uint8Array) => string | undefined;
|
||||
"save-server-icon": (iconURL: string) => string;
|
||||
};
|
||||
|
||||
export type RendererMessage = {
|
||||
back: () => void;
|
||||
"copy-zulip-url": () => void;
|
||||
destroytray: () => void;
|
||||
"enter-fullscreen": () => void;
|
||||
focus: () => void;
|
||||
"focus-webview-with-id": (webviewId: number) => void;
|
||||
forward: () => void;
|
||||
"hard-reload": () => void;
|
||||
"leave-fullscreen": () => void;
|
||||
"log-out": () => void;
|
||||
logout: () => void;
|
||||
"new-server": () => void;
|
||||
"open-about": () => void;
|
||||
"open-help": () => void;
|
||||
"open-network-settings": () => void;
|
||||
"open-org-tab": () => void;
|
||||
"open-settings": () => void;
|
||||
"permission-request": (
|
||||
options: {webContentsId: number | null; origin: string; permission: string},
|
||||
rendererCallbackId: number,
|
||||
) => void;
|
||||
"play-ding-sound": () => void;
|
||||
"reload-current-viewer": () => void;
|
||||
"reload-proxy": (showAlert: boolean) => void;
|
||||
"reload-viewer": () => void;
|
||||
"render-taskbar-icon": (messageCount: number) => void;
|
||||
"set-active": () => void;
|
||||
"set-idle": () => void;
|
||||
"show-keyboard-shortcuts": () => void;
|
||||
"show-notification-settings": () => void;
|
||||
"switch-server-tab": (index: number) => void;
|
||||
"tab-devtools": () => void;
|
||||
"toggle-autohide-menubar": (
|
||||
autoHideMenubar: boolean,
|
||||
updateMenu: boolean,
|
||||
) => void;
|
||||
"toggle-dnd": (state: boolean, newSettings: Partial<DndSettings>) => void;
|
||||
"toggle-sidebar": (show: boolean) => void;
|
||||
"toggle-silent": (state: boolean) => void;
|
||||
"toggle-tray": (state: boolean) => void;
|
||||
toggletray: () => void;
|
||||
tray: (arg: number) => void;
|
||||
"update-realm-icon": (serverURL: string, iconURL: string) => void;
|
||||
"update-realm-name": (serveRURL: string, realmName: string) => void;
|
||||
"webview-reload": () => void;
|
||||
zoomActualSize: () => void;
|
||||
zoomIn: () => void;
|
||||
zoomOut: () => void;
|
||||
};
|
||||
@@ -1,26 +0,0 @@
|
||||
export type MenuProps = {
|
||||
tabs: TabData[];
|
||||
activeTabIndex?: number;
|
||||
enableMenu?: boolean;
|
||||
};
|
||||
|
||||
export type NavItem =
|
||||
| "General"
|
||||
| "Network"
|
||||
| "AddServer"
|
||||
| "Organizations"
|
||||
| "Shortcuts";
|
||||
|
||||
export type ServerConf = {
|
||||
url: string;
|
||||
alias: string;
|
||||
icon: string;
|
||||
};
|
||||
|
||||
export type TabRole = "server" | "function";
|
||||
|
||||
export type TabData = {
|
||||
role: TabRole;
|
||||
name: string;
|
||||
index: number;
|
||||
};
|
||||
112
app/main/autoupdater.js
Normal file
112
app/main/autoupdater.js
Normal file
@@ -0,0 +1,112 @@
|
||||
'use strict';
|
||||
const { app, dialog, shell } = require('electron');
|
||||
const { autoUpdater } = require('electron-updater');
|
||||
const isDev = require('electron-is-dev');
|
||||
|
||||
const ConfigUtil = require('./../renderer/js/utils/config-util.js');
|
||||
|
||||
function appUpdater(updateFromMenu = false) {
|
||||
// Don't initiate auto-updates in development
|
||||
if (isDev) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (process.platform === 'linux' && !process.env.APPIMAGE) {
|
||||
const { linuxUpdateNotification } = require('./linuxupdater');
|
||||
linuxUpdateNotification();
|
||||
return;
|
||||
}
|
||||
|
||||
let updateAvailable = false;
|
||||
|
||||
// Create Logs directory
|
||||
const LogsDir = `${app.getPath('userData')}/Logs`;
|
||||
|
||||
// Log whats happening
|
||||
const log = require('electron-log');
|
||||
|
||||
log.transports.file.file = `${LogsDir}/updates.log`;
|
||||
log.transports.file.level = 'info';
|
||||
autoUpdater.logger = log;
|
||||
|
||||
// Handle auto updates for beta/pre releases
|
||||
const isBetaUpdate = ConfigUtil.getConfigItem('betaUpdate');
|
||||
|
||||
autoUpdater.allowPrerelease = isBetaUpdate || false;
|
||||
|
||||
const eventsListenerRemove = ['update-available', 'update-not-available'];
|
||||
autoUpdater.on('update-available', info => {
|
||||
if (updateFromMenu) {
|
||||
dialog.showMessageBox({
|
||||
message: `A new version ${info.version}, of Zulip Desktop is available`,
|
||||
detail: 'The update will be downloaded in the background. You will be notified when it is ready to be installed.'
|
||||
});
|
||||
|
||||
updateAvailable = true;
|
||||
|
||||
// This is to prevent removal of 'update-downloaded' and 'error' event listener.
|
||||
eventsListenerRemove.forEach(event => {
|
||||
autoUpdater.removeAllListeners(event);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
autoUpdater.on('update-not-available', () => {
|
||||
if (updateFromMenu) {
|
||||
dialog.showMessageBox({
|
||||
message: 'No updates available',
|
||||
detail: `You are running the latest version of Zulip Desktop.\nVersion: ${app.getVersion()}`
|
||||
});
|
||||
// Remove all autoUpdator listeners so that next time autoUpdator is manually called these
|
||||
// listeners don't trigger multiple times.
|
||||
autoUpdater.removeAllListeners();
|
||||
}
|
||||
});
|
||||
|
||||
autoUpdater.on('error', error => {
|
||||
if (updateFromMenu) {
|
||||
const messageText = (updateAvailable) ? ('Unable to download the updates') : ('Unable to check for updates');
|
||||
dialog.showMessageBox({
|
||||
type: 'error',
|
||||
buttons: ['Manual Download', 'Cancel'],
|
||||
message: messageText,
|
||||
detail: (error).toString() + `\n\nThe latest version of Zulip Desktop is available at -\nhttps://zulipchat.com/apps/.\n
|
||||
Current Version: ${app.getVersion()}`
|
||||
}, response => {
|
||||
if (response === 0) {
|
||||
shell.openExternal('https://zulipchat.com/apps/');
|
||||
}
|
||||
});
|
||||
// Remove all autoUpdator listeners so that next time autoUpdator is manually called these
|
||||
// listeners don't trigger multiple times.
|
||||
autoUpdater.removeAllListeners();
|
||||
}
|
||||
});
|
||||
|
||||
// Ask the user if update is available
|
||||
// eslint-disable-next-line no-unused-vars
|
||||
autoUpdater.on('update-downloaded', event => {
|
||||
// Ask user to update the app
|
||||
dialog.showMessageBox({
|
||||
type: 'question',
|
||||
buttons: ['Install and Relaunch', 'Install Later'],
|
||||
defaultId: 0,
|
||||
message: `A new update ${event.version} has been downloaded`,
|
||||
detail: 'It will be installed the next time you restart the application'
|
||||
}, response => {
|
||||
if (response === 0) {
|
||||
setTimeout(() => {
|
||||
autoUpdater.quitAndInstall();
|
||||
// force app to quit. This is just a workaround, ideally autoUpdater.quitAndInstall() should relaunch the app.
|
||||
app.quit();
|
||||
}, 1000);
|
||||
}
|
||||
});
|
||||
});
|
||||
// Init for updates
|
||||
autoUpdater.checkForUpdates();
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
appUpdater
|
||||
};
|
||||
@@ -1,119 +0,0 @@
|
||||
import {shell} from "electron/common";
|
||||
import {app, dialog, session} from "electron/main";
|
||||
import process from "node:process";
|
||||
|
||||
import log from "electron-log";
|
||||
import type {UpdateDownloadedEvent, UpdateInfo} from "electron-updater";
|
||||
import {autoUpdater} from "electron-updater";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
|
||||
import {linuxUpdateNotification} from "./linuxupdater.js"; // Required only in case of linux
|
||||
|
||||
let quitting = false;
|
||||
|
||||
export function shouldQuitForUpdate(): boolean {
|
||||
return quitting;
|
||||
}
|
||||
|
||||
export async function appUpdater(updateFromMenu = false): Promise<void> {
|
||||
// Don't initiate auto-updates in development
|
||||
if (!app.isPackaged) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (process.platform === "linux" && !process.env.APPIMAGE) {
|
||||
const ses = session.fromPartition("persist:webviewsession");
|
||||
await linuxUpdateNotification(ses);
|
||||
return;
|
||||
}
|
||||
|
||||
let updateAvailable = false;
|
||||
|
||||
// Log whats happening
|
||||
log.transports.file.fileName = "updates.log";
|
||||
log.transports.file.level = "info";
|
||||
autoUpdater.logger = log;
|
||||
|
||||
// Handle auto updates for beta/pre releases
|
||||
const isBetaUpdate = ConfigUtil.getConfigItem("betaUpdate", false);
|
||||
|
||||
autoUpdater.allowPrerelease = isBetaUpdate;
|
||||
|
||||
const eventsListenerRemove = [
|
||||
"update-available",
|
||||
"update-not-available",
|
||||
] as const;
|
||||
autoUpdater.on("update-available", async (info: UpdateInfo) => {
|
||||
if (updateFromMenu) {
|
||||
updateAvailable = true;
|
||||
|
||||
// This is to prevent removal of 'update-downloaded' and 'error' event listener.
|
||||
for (const event of eventsListenerRemove) {
|
||||
autoUpdater.removeAllListeners(event);
|
||||
}
|
||||
|
||||
await dialog.showMessageBox({
|
||||
message: `A new version ${info.version}, of Zulip Desktop is available`,
|
||||
detail:
|
||||
"The update will be downloaded in the background. You will be notified when it is ready to be installed.",
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
autoUpdater.on("update-not-available", async () => {
|
||||
if (updateFromMenu) {
|
||||
// Remove all autoUpdator listeners so that next time autoUpdator is manually called these
|
||||
// listeners don't trigger multiple times.
|
||||
autoUpdater.removeAllListeners();
|
||||
|
||||
await dialog.showMessageBox({
|
||||
message: "No updates available",
|
||||
detail: `You are running the latest version of Zulip Desktop.\nVersion: ${app.getVersion()}`,
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
autoUpdater.on("error", async (error: Error) => {
|
||||
if (updateFromMenu) {
|
||||
// Remove all autoUpdator listeners so that next time autoUpdator is manually called these
|
||||
// listeners don't trigger multiple times.
|
||||
autoUpdater.removeAllListeners();
|
||||
|
||||
const messageText = updateAvailable
|
||||
? "Unable to download the updates"
|
||||
: "Unable to check for updates";
|
||||
const {response} = await dialog.showMessageBox({
|
||||
type: "error",
|
||||
buttons: ["Manual Download", "Cancel"],
|
||||
message: messageText,
|
||||
detail: `Error: ${error.message}
|
||||
|
||||
The latest version of Zulip Desktop is available at -
|
||||
https://zulip.com/apps/.
|
||||
Current Version: ${app.getVersion()}`,
|
||||
});
|
||||
if (response === 0) {
|
||||
await shell.openExternal("https://zulip.com/apps/");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Ask the user if update is available
|
||||
autoUpdater.on("update-downloaded", async (event: UpdateDownloadedEvent) => {
|
||||
// Ask user to update the app
|
||||
const {response} = await dialog.showMessageBox({
|
||||
type: "question",
|
||||
buttons: ["Install and Relaunch", "Install Later"],
|
||||
defaultId: 0,
|
||||
message: `A new update ${event.version} has been downloaded`,
|
||||
detail: "It will be installed the next time you restart the application",
|
||||
});
|
||||
if (response === 0) {
|
||||
quitting = true;
|
||||
autoUpdater.quitAndInstall();
|
||||
}
|
||||
});
|
||||
// Init for updates
|
||||
await autoUpdater.checkForUpdates();
|
||||
}
|
||||
@@ -1,61 +0,0 @@
|
||||
import {nativeImage} from "electron/common";
|
||||
import type {BrowserWindow} from "electron/main";
|
||||
import {app} from "electron/main";
|
||||
import process from "node:process";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
|
||||
import {send} from "./typed-ipc-main.js";
|
||||
|
||||
function showBadgeCount(messageCount: number, mainWindow: BrowserWindow): void {
|
||||
if (process.platform === "win32") {
|
||||
updateOverlayIcon(messageCount, mainWindow);
|
||||
} else {
|
||||
app.badgeCount = messageCount;
|
||||
}
|
||||
}
|
||||
|
||||
function hideBadgeCount(mainWindow: BrowserWindow): void {
|
||||
if (process.platform === "win32") {
|
||||
mainWindow.setOverlayIcon(null, "");
|
||||
} else {
|
||||
app.badgeCount = 0;
|
||||
}
|
||||
}
|
||||
|
||||
export function updateBadge(
|
||||
badgeCount: number,
|
||||
mainWindow: BrowserWindow,
|
||||
): void {
|
||||
if (ConfigUtil.getConfigItem("badgeOption", true)) {
|
||||
showBadgeCount(badgeCount, mainWindow);
|
||||
} else {
|
||||
hideBadgeCount(mainWindow);
|
||||
}
|
||||
}
|
||||
|
||||
function updateOverlayIcon(
|
||||
messageCount: number,
|
||||
mainWindow: BrowserWindow,
|
||||
): void {
|
||||
if (!mainWindow.isFocused()) {
|
||||
mainWindow.flashFrame(
|
||||
ConfigUtil.getConfigItem("flashTaskbarOnMessage", true),
|
||||
);
|
||||
}
|
||||
|
||||
if (messageCount === 0) {
|
||||
mainWindow.setOverlayIcon(null, "");
|
||||
} else {
|
||||
send(mainWindow.webContents, "render-taskbar-icon", messageCount);
|
||||
}
|
||||
}
|
||||
|
||||
export function updateTaskbarIcon(
|
||||
data: string,
|
||||
text: string,
|
||||
mainWindow: BrowserWindow,
|
||||
): void {
|
||||
const img = nativeImage.createFromDataURL(data);
|
||||
mainWindow.setOverlayIcon(img, text);
|
||||
}
|
||||
@@ -1,163 +0,0 @@
|
||||
import {shell} from "electron/common";
|
||||
import type {
|
||||
HandlerDetails,
|
||||
SaveDialogOptions,
|
||||
WebContents,
|
||||
} from "electron/main";
|
||||
import {Notification, app} from "electron/main";
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
import * as LinkUtil from "../common/link-util.js";
|
||||
|
||||
import {send} from "./typed-ipc-main.js";
|
||||
|
||||
function isUploadsUrl(server: string, url: URL): boolean {
|
||||
return url.origin === server && url.pathname.startsWith("/user_uploads/");
|
||||
}
|
||||
|
||||
function downloadFile({
|
||||
contents,
|
||||
url,
|
||||
downloadPath,
|
||||
completed,
|
||||
failed,
|
||||
}: {
|
||||
contents: WebContents;
|
||||
url: string;
|
||||
downloadPath: string;
|
||||
completed(filePath: string, fileName: string): Promise<void>;
|
||||
failed(state: string): void;
|
||||
}) {
|
||||
contents.downloadURL(url);
|
||||
contents.session.once("will-download", async (_event: Event, item) => {
|
||||
if (ConfigUtil.getConfigItem("promptDownload", false)) {
|
||||
const showDialogOptions: SaveDialogOptions = {
|
||||
defaultPath: path.join(downloadPath, item.getFilename()),
|
||||
};
|
||||
item.setSaveDialogOptions(showDialogOptions);
|
||||
} else {
|
||||
const getTimeStamp = (): number => {
|
||||
const date = new Date();
|
||||
return date.getTime();
|
||||
};
|
||||
|
||||
const formatFile = (filePath: string): string => {
|
||||
const fileExtension = path.extname(filePath);
|
||||
const baseName = path.basename(filePath, fileExtension);
|
||||
return `${baseName}-${getTimeStamp()}${fileExtension}`;
|
||||
};
|
||||
|
||||
const filePath = path.join(downloadPath, item.getFilename());
|
||||
|
||||
// Update the name and path of the file if it already exists
|
||||
const updatedFilePath = path.join(downloadPath, formatFile(filePath));
|
||||
const setFilePath: string = fs.existsSync(filePath)
|
||||
? updatedFilePath
|
||||
: filePath;
|
||||
item.setSavePath(setFilePath);
|
||||
}
|
||||
|
||||
const updatedListener = (_event: Event, state: string): void => {
|
||||
switch (state) {
|
||||
case "interrupted": {
|
||||
// Can interrupted to due to network error, cancel download then
|
||||
console.log(
|
||||
"Download interrupted, cancelling and fallback to dialog download.",
|
||||
);
|
||||
item.cancel();
|
||||
break;
|
||||
}
|
||||
|
||||
case "progressing": {
|
||||
if (item.isPaused()) {
|
||||
item.cancel();
|
||||
}
|
||||
|
||||
// This event can also be used to show progress in percentage in future.
|
||||
break;
|
||||
}
|
||||
|
||||
default: {
|
||||
console.info("Unknown updated state of download item");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
item.on("updated", updatedListener);
|
||||
item.once("done", async (_event: Event, state) => {
|
||||
if (state === "completed") {
|
||||
await completed(item.getSavePath(), path.basename(item.getSavePath()));
|
||||
} else {
|
||||
console.log("Download failed state:", state);
|
||||
failed(state);
|
||||
}
|
||||
|
||||
// To stop item for listening to updated events of this file
|
||||
item.removeListener("updated", updatedListener);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
export default function handleExternalLink(
|
||||
contents: WebContents,
|
||||
details: HandlerDetails,
|
||||
mainContents: WebContents,
|
||||
): void {
|
||||
let url: URL;
|
||||
try {
|
||||
url = new URL(details.url);
|
||||
} catch {
|
||||
return;
|
||||
}
|
||||
|
||||
const downloadPath = ConfigUtil.getConfigItem(
|
||||
"downloadsPath",
|
||||
`${app.getPath("downloads")}`,
|
||||
);
|
||||
|
||||
if (isUploadsUrl(new URL(contents.getURL()).origin, url)) {
|
||||
downloadFile({
|
||||
contents,
|
||||
url: url.href,
|
||||
downloadPath,
|
||||
async completed(filePath: string, fileName: string) {
|
||||
const downloadNotification = new Notification({
|
||||
title: "Download Complete",
|
||||
body: `Click to show ${fileName} in folder`,
|
||||
silent: true, // We'll play our own sound - ding.ogg
|
||||
});
|
||||
downloadNotification.on("click", () => {
|
||||
// Reveal file in download folder
|
||||
shell.showItemInFolder(filePath);
|
||||
});
|
||||
downloadNotification.show();
|
||||
|
||||
// Play sound to indicate download complete
|
||||
if (!ConfigUtil.getConfigItem("silent", false)) {
|
||||
send(mainContents, "play-ding-sound");
|
||||
}
|
||||
},
|
||||
failed(state: string) {
|
||||
// Automatic download failed, so show save dialog prompt and download
|
||||
// through webview
|
||||
// Only do this if it is the automatic download, otherwise show an error (so we aren't showing two save
|
||||
// prompts right after each other)
|
||||
// Check that the download is not cancelled by user
|
||||
if (state !== "cancelled") {
|
||||
if (ConfigUtil.getConfigItem("promptDownload", false)) {
|
||||
new Notification({
|
||||
title: "Download Complete",
|
||||
body: "Download failed",
|
||||
}).show();
|
||||
} else {
|
||||
contents.downloadURL(url.href);
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
} else {
|
||||
(async () => LinkUtil.openBrowser(url))();
|
||||
}
|
||||
}
|
||||
366
app/main/index.js
Normal file
366
app/main/index.js
Normal file
@@ -0,0 +1,366 @@
|
||||
'use strict';
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
|
||||
const electron = require('electron');
|
||||
const windowStateKeeper = require('electron-window-state');
|
||||
const isDev = require('electron-is-dev');
|
||||
const appMenu = require('./menu');
|
||||
const { appUpdater } = require('./autoupdater');
|
||||
|
||||
const { setAutoLaunch } = require('./startup');
|
||||
|
||||
const { app, ipcMain } = electron;
|
||||
|
||||
const BadgeSettings = require('./../renderer/js/pages/preference/badge-settings.js');
|
||||
const ConfigUtil = require('./../renderer/js/utils/config-util.js');
|
||||
const ProxyUtil = require('./../renderer/js/utils/proxy-util.js');
|
||||
const { sentryInit } = require('./../renderer/js/utils/sentry-util.js');
|
||||
|
||||
// Adds debug features like hotkeys for triggering dev tools and reload
|
||||
// in development mode
|
||||
if (isDev) {
|
||||
require('electron-debug')();
|
||||
}
|
||||
|
||||
// Prevent window being garbage collected
|
||||
let mainWindow;
|
||||
let badgeCount;
|
||||
|
||||
let isQuitting = false;
|
||||
|
||||
// Load this url in main window
|
||||
const mainURL = 'file://' + path.join(__dirname, '../renderer', 'main.html');
|
||||
|
||||
const singleInstanceLock = app.requestSingleInstanceLock();
|
||||
if (singleInstanceLock) {
|
||||
app.on('second-instance', () => {
|
||||
if (mainWindow) {
|
||||
if (mainWindow.isMinimized()) {
|
||||
mainWindow.restore();
|
||||
}
|
||||
|
||||
mainWindow.show();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
app.quit();
|
||||
}
|
||||
|
||||
const APP_ICON = path.join(__dirname, '../resources', 'Icon');
|
||||
|
||||
const iconPath = () => {
|
||||
return APP_ICON + (process.platform === 'win32' ? '.ico' : '.png');
|
||||
};
|
||||
|
||||
function createMainWindow() {
|
||||
// Load the previous state with fallback to defaults
|
||||
const mainWindowState = windowStateKeeper({
|
||||
defaultWidth: 1100,
|
||||
defaultHeight: 720,
|
||||
path: `${app.getPath('userData')}/config`
|
||||
});
|
||||
|
||||
// Let's keep the window position global so that we can access it in other process
|
||||
global.mainWindowState = mainWindowState;
|
||||
|
||||
const win = new electron.BrowserWindow({
|
||||
// This settings needs to be saved in config
|
||||
title: 'Zulip',
|
||||
icon: iconPath(),
|
||||
x: mainWindowState.x,
|
||||
y: mainWindowState.y,
|
||||
width: mainWindowState.width,
|
||||
height: mainWindowState.height,
|
||||
minWidth: 300,
|
||||
minHeight: 400,
|
||||
webPreferences: {
|
||||
plugins: true,
|
||||
nodeIntegration: true,
|
||||
partition: 'persist:webviewsession'
|
||||
},
|
||||
show: false
|
||||
});
|
||||
|
||||
win.on('focus', () => {
|
||||
win.webContents.send('focus');
|
||||
});
|
||||
|
||||
win.loadURL(mainURL);
|
||||
|
||||
// Keep the app running in background on close event
|
||||
win.on('close', e => {
|
||||
if (!isQuitting) {
|
||||
e.preventDefault();
|
||||
|
||||
if (process.platform === 'darwin') {
|
||||
app.hide();
|
||||
} else {
|
||||
win.hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
win.setTitle('Zulip');
|
||||
|
||||
win.on('enter-full-screen', () => {
|
||||
win.webContents.send('enter-fullscreen');
|
||||
});
|
||||
|
||||
win.on('leave-full-screen', () => {
|
||||
win.webContents.send('leave-fullscreen');
|
||||
});
|
||||
|
||||
// To destroy tray icon when navigate to a new URL
|
||||
win.webContents.on('will-navigate', e => {
|
||||
if (e) {
|
||||
win.webContents.send('destroytray');
|
||||
}
|
||||
});
|
||||
|
||||
// Let us register listeners on the window, so we can update the state
|
||||
// automatically (the listeners will be removed when the window is closed)
|
||||
// and restore the maximized or full screen state
|
||||
mainWindowState.manage(win);
|
||||
|
||||
return win;
|
||||
}
|
||||
|
||||
// Decrease load on GPU (experimental)
|
||||
app.disableHardwareAcceleration();
|
||||
|
||||
// Temporary fix for Electron render colors differently
|
||||
// More info here - https://github.com/electron/electron/issues/10732
|
||||
app.commandLine.appendSwitch('force-color-profile', 'srgb');
|
||||
|
||||
// eslint-disable-next-line max-params
|
||||
app.on('certificate-error', (event, webContents, url, error, certificate, callback) => {
|
||||
event.preventDefault();
|
||||
callback(true);
|
||||
});
|
||||
|
||||
app.on('activate', () => {
|
||||
if (!mainWindow) {
|
||||
mainWindow = createMainWindow();
|
||||
}
|
||||
});
|
||||
|
||||
app.on('ready', () => {
|
||||
appMenu.setMenu({
|
||||
tabs: []
|
||||
});
|
||||
mainWindow = createMainWindow();
|
||||
|
||||
// Auto-hide menu bar on Windows + Linux
|
||||
if (process.platform !== 'darwin') {
|
||||
const shouldHideMenu = ConfigUtil.getConfigItem('autoHideMenubar') || false;
|
||||
mainWindow.setAutoHideMenuBar(shouldHideMenu);
|
||||
mainWindow.setMenuBarVisibility(!shouldHideMenu);
|
||||
}
|
||||
|
||||
// Initialize sentry for main process
|
||||
const errorReporting = ConfigUtil.getConfigItem('errorReporting');
|
||||
if (errorReporting) {
|
||||
sentryInit();
|
||||
}
|
||||
|
||||
const isSystemProxy = ConfigUtil.getConfigItem('useSystemProxy');
|
||||
|
||||
if (isSystemProxy) {
|
||||
ProxyUtil.resolveSystemProxy(mainWindow);
|
||||
}
|
||||
|
||||
const page = mainWindow.webContents;
|
||||
|
||||
page.on('dom-ready', () => {
|
||||
if (ConfigUtil.getConfigItem('startMinimized')) {
|
||||
mainWindow.hide();
|
||||
} else {
|
||||
mainWindow.show();
|
||||
}
|
||||
});
|
||||
|
||||
page.once('did-frame-finish-load', () => {
|
||||
// Initiate auto-updates on MacOS and Windows
|
||||
if (ConfigUtil.getConfigItem('autoUpdate')) {
|
||||
appUpdater();
|
||||
}
|
||||
});
|
||||
|
||||
// Temporarily remove this event
|
||||
// electron.powerMonitor.on('resume', () => {
|
||||
// mainWindow.reload();
|
||||
// page.send('destroytray');
|
||||
// });
|
||||
|
||||
ipcMain.on('focus-app', () => {
|
||||
mainWindow.show();
|
||||
});
|
||||
|
||||
ipcMain.on('quit-app', () => {
|
||||
app.quit();
|
||||
});
|
||||
|
||||
// Code to show pdf in a new BrowserWindow (currently commented out due to bug-upstream)
|
||||
// ipcMain.on('pdf-view', (event, url) => {
|
||||
// // Paddings for pdfWindow so that it fits into the main browserWindow
|
||||
// const paddingWidth = 55;
|
||||
// const paddingHeight = 22;
|
||||
|
||||
// // Get the config of main browserWindow
|
||||
// const mainWindowState = global.mainWindowState;
|
||||
|
||||
// // Window to view the pdf file
|
||||
// const pdfWindow = new electron.BrowserWindow({
|
||||
// x: mainWindowState.x + paddingWidth,
|
||||
// y: mainWindowState.y + paddingHeight,
|
||||
// width: mainWindowState.width - paddingWidth,
|
||||
// height: mainWindowState.height - paddingHeight,
|
||||
// webPreferences: {
|
||||
// plugins: true,
|
||||
// partition: 'persist:webviewsession'
|
||||
// }
|
||||
// });
|
||||
// pdfWindow.loadURL(url);
|
||||
|
||||
// // We don't want to have the menu bar in pdf window
|
||||
// pdfWindow.setMenu(null);
|
||||
// });
|
||||
|
||||
// Reload full app not just webview, useful in debugging
|
||||
ipcMain.on('reload-full-app', () => {
|
||||
mainWindow.reload();
|
||||
page.send('destroytray');
|
||||
});
|
||||
|
||||
ipcMain.on('clear-app-settings', () => {
|
||||
global.mainWindowState.unmanage(mainWindow);
|
||||
app.relaunch();
|
||||
app.exit();
|
||||
});
|
||||
|
||||
ipcMain.on('toggle-app', () => {
|
||||
if (!mainWindow.isVisible() || mainWindow.isMinimized()) {
|
||||
mainWindow.show();
|
||||
} else {
|
||||
mainWindow.hide();
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.on('toggle-badge-option', () => {
|
||||
BadgeSettings.updateBadge(badgeCount, mainWindow);
|
||||
});
|
||||
|
||||
ipcMain.on('toggle-menubar', (event, showMenubar) => {
|
||||
mainWindow.setAutoHideMenuBar(showMenubar);
|
||||
mainWindow.setMenuBarVisibility(!showMenubar);
|
||||
});
|
||||
|
||||
ipcMain.on('update-badge', (event, messageCount) => {
|
||||
badgeCount = messageCount;
|
||||
BadgeSettings.updateBadge(badgeCount, mainWindow);
|
||||
page.send('tray', messageCount);
|
||||
});
|
||||
|
||||
ipcMain.on('update-taskbar-icon', (event, data, text) => {
|
||||
BadgeSettings.updateTaskbarIcon(data, text, mainWindow);
|
||||
});
|
||||
|
||||
ipcMain.on('forward-message', (event, listener, ...params) => {
|
||||
page.send(listener, ...params);
|
||||
});
|
||||
|
||||
ipcMain.on('update-menu', (event, props) => {
|
||||
appMenu.setMenu(props);
|
||||
const activeTab = props.tabs[props.activeTabIndex];
|
||||
if (activeTab) {
|
||||
mainWindow.setTitle(`Zulip - ${activeTab.webview.props.name}`);
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.on('toggleAutoLauncher', (event, AutoLaunchValue) => {
|
||||
setAutoLaunch(AutoLaunchValue);
|
||||
});
|
||||
|
||||
ipcMain.on('downloadFile', (event, url, downloadPath) => {
|
||||
page.downloadURL(url);
|
||||
page.session.once('will-download', (event, item) => {
|
||||
const filePath = path.join(downloadPath, item.getFilename());
|
||||
|
||||
const getTimeStamp = () => {
|
||||
const date = new Date();
|
||||
return date.getTime();
|
||||
};
|
||||
|
||||
const formatFile = filePath => {
|
||||
const fileExtension = path.extname(filePath);
|
||||
const baseName = path.basename(filePath, fileExtension);
|
||||
return `${baseName}-${getTimeStamp()}${fileExtension}`;
|
||||
};
|
||||
|
||||
// Update the name and path of the file if it already exists
|
||||
|
||||
const updatedFilePath = path.join(downloadPath, formatFile(filePath));
|
||||
|
||||
const setFilePath = fs.existsSync(filePath) ? updatedFilePath : filePath;
|
||||
|
||||
item.setSavePath(setFilePath);
|
||||
|
||||
item.on('updated', (event, state) => {
|
||||
switch (state) {
|
||||
case 'interrupted': {
|
||||
// Can interrupted to due to network error, cancel download then
|
||||
console.log('Download interrupted, cancelling and fallback to dialog download.');
|
||||
item.cancel();
|
||||
break;
|
||||
}
|
||||
case 'progressing': {
|
||||
if (item.isPaused()) {
|
||||
item.cancel();
|
||||
}
|
||||
// This event can also be used to show progress in percentage in future.
|
||||
break;
|
||||
}
|
||||
default: {
|
||||
console.info('Unknown updated state of download item');
|
||||
}
|
||||
}
|
||||
});
|
||||
item.once('done', (event, state) => {
|
||||
const getFileName = fs.existsSync(filePath) ? formatFile(filePath) : item.getFilename();
|
||||
if (state === 'completed') {
|
||||
page.send('downloadFileCompleted', item.getSavePath(), getFileName);
|
||||
} else {
|
||||
console.log('Download failed state: ', state);
|
||||
page.send('downloadFileFailed');
|
||||
}
|
||||
// To stop item for listening to updated events of this file
|
||||
item.removeAllListeners('updated');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
ipcMain.on('realm-name-changed', (event, serverURL, realmName) => {
|
||||
page.send('update-realm-name', serverURL, realmName);
|
||||
});
|
||||
|
||||
ipcMain.on('realm-icon-changed', (event, serverURL, iconURL) => {
|
||||
page.send('update-realm-icon', serverURL, iconURL);
|
||||
});
|
||||
|
||||
// Using event.sender.send instead of page.send here to
|
||||
// make sure the value of errorReporting is sent only once on load.
|
||||
ipcMain.on('error-reporting', event => {
|
||||
event.sender.send('error-reporting-val', errorReporting);
|
||||
});
|
||||
});
|
||||
|
||||
app.on('before-quit', () => {
|
||||
isQuitting = true;
|
||||
});
|
||||
|
||||
// Send crash reports
|
||||
process.on('uncaughtException', err => {
|
||||
console.error(err);
|
||||
console.error(err.stack);
|
||||
});
|
||||
@@ -1,462 +0,0 @@
|
||||
import {clipboard} from "electron/common";
|
||||
import type {IpcMainEvent, WebContents} from "electron/main";
|
||||
import {BrowserWindow, app, dialog, powerMonitor, session} from "electron/main";
|
||||
import {Buffer} from "node:buffer";
|
||||
import crypto from "node:crypto";
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
import process from "node:process";
|
||||
|
||||
import * as remoteMain from "@electron/remote/main";
|
||||
import windowStateKeeper from "electron-window-state";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
import {bundlePath, bundleUrl, publicPath} from "../common/paths.js";
|
||||
import type {RendererMessage} from "../common/typed-ipc.js";
|
||||
import type {MenuProps} from "../common/types.js";
|
||||
|
||||
import {appUpdater, shouldQuitForUpdate} from "./autoupdater.js";
|
||||
import * as BadgeSettings from "./badge-settings.js";
|
||||
import handleExternalLink from "./handle-external-link.js";
|
||||
import * as AppMenu from "./menu.js";
|
||||
import {_getServerSettings, _isOnline, _saveServerIcon} from "./request.js";
|
||||
import {sentryInit} from "./sentry.js";
|
||||
import {setAutoLaunch} from "./startup.js";
|
||||
import {ipcMain, send} from "./typed-ipc-main.js";
|
||||
|
||||
import "gatemaker/electron-setup"; // eslint-disable-line import/no-unassigned-import
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
const {GDK_BACKEND} = process.env;
|
||||
|
||||
// Initialize sentry for main process
|
||||
sentryInit();
|
||||
|
||||
let mainWindowState: windowStateKeeper.State;
|
||||
|
||||
// Prevent window being garbage collected
|
||||
let mainWindow: BrowserWindow;
|
||||
let badgeCount: number;
|
||||
|
||||
let isQuitting = false;
|
||||
|
||||
// Load this file in main window
|
||||
const mainUrl = new URL("app/renderer/main.html", bundleUrl).href;
|
||||
|
||||
const permissionCallbacks = new Map<number, (grant: boolean) => void>();
|
||||
let nextPermissionCallbackId = 0;
|
||||
|
||||
const appIcon = path.join(publicPath, "resources/Icon");
|
||||
|
||||
const iconPath = (): string =>
|
||||
appIcon + (process.platform === "win32" ? ".ico" : ".png");
|
||||
|
||||
// Toggle the app window
|
||||
const toggleApp = (): void => {
|
||||
if (!mainWindow.isVisible() || mainWindow.isMinimized()) {
|
||||
mainWindow.show();
|
||||
} else {
|
||||
mainWindow.hide();
|
||||
}
|
||||
};
|
||||
|
||||
function createMainWindow(): BrowserWindow {
|
||||
// Load the previous state with fallback to defaults
|
||||
mainWindowState = windowStateKeeper({
|
||||
defaultWidth: 1100,
|
||||
defaultHeight: 720,
|
||||
path: `${app.getPath("userData")}/config`,
|
||||
});
|
||||
|
||||
const win = new BrowserWindow({
|
||||
// This settings needs to be saved in config
|
||||
title: "Zulip",
|
||||
icon: iconPath(),
|
||||
x: mainWindowState.x,
|
||||
y: mainWindowState.y,
|
||||
width: mainWindowState.width,
|
||||
height: mainWindowState.height,
|
||||
minWidth: 500,
|
||||
minHeight: 400,
|
||||
webPreferences: {
|
||||
preload: path.join(bundlePath, "renderer.js"),
|
||||
sandbox: false,
|
||||
webviewTag: true,
|
||||
},
|
||||
show: false,
|
||||
});
|
||||
remoteMain.enable(win.webContents);
|
||||
|
||||
win.on("focus", () => {
|
||||
send(win.webContents, "focus");
|
||||
});
|
||||
|
||||
(async () => win.loadURL(mainUrl))();
|
||||
|
||||
// Keep the app running in background on close event
|
||||
win.on("close", (event) => {
|
||||
if (ConfigUtil.getConfigItem("quitOnClose", false)) {
|
||||
app.quit();
|
||||
}
|
||||
|
||||
if (!isQuitting && !shouldQuitForUpdate()) {
|
||||
event.preventDefault();
|
||||
|
||||
if (process.platform === "darwin") {
|
||||
app.hide();
|
||||
} else {
|
||||
win.hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
win.setTitle("Zulip");
|
||||
|
||||
win.on("enter-full-screen", () => {
|
||||
send(win.webContents, "enter-fullscreen");
|
||||
});
|
||||
|
||||
win.on("leave-full-screen", () => {
|
||||
send(win.webContents, "leave-fullscreen");
|
||||
});
|
||||
|
||||
// To destroy tray icon when navigate to a new URL
|
||||
win.webContents.on("will-navigate", (event) => {
|
||||
if (event) {
|
||||
send(win.webContents, "destroytray");
|
||||
}
|
||||
});
|
||||
|
||||
// Let us register listeners on the window, so we can update the state
|
||||
// automatically (the listeners will be removed when the window is closed)
|
||||
// and restore the maximized or full screen state
|
||||
mainWindowState.manage(win);
|
||||
|
||||
return win;
|
||||
}
|
||||
|
||||
(async () => {
|
||||
if (!app.requestSingleInstanceLock()) {
|
||||
app.quit();
|
||||
return;
|
||||
}
|
||||
|
||||
await app.whenReady();
|
||||
|
||||
if (process.env.GDK_BACKEND !== GDK_BACKEND) {
|
||||
console.warn(
|
||||
"Reverting GDK_BACKEND to work around https://github.com/electron/electron/issues/28436",
|
||||
);
|
||||
if (GDK_BACKEND === undefined) {
|
||||
delete process.env.GDK_BACKEND;
|
||||
} else {
|
||||
process.env.GDK_BACKEND = GDK_BACKEND;
|
||||
}
|
||||
}
|
||||
|
||||
// Used for notifications on Windows
|
||||
app.setAppUserModelId("org.zulip.zulip-electron");
|
||||
|
||||
remoteMain.initialize();
|
||||
|
||||
app.on("second-instance", () => {
|
||||
if (mainWindow) {
|
||||
if (mainWindow.isMinimized()) {
|
||||
mainWindow.restore();
|
||||
}
|
||||
|
||||
mainWindow.show();
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.on(
|
||||
"permission-callback",
|
||||
(event: Event, permissionCallbackId: number, grant: boolean) => {
|
||||
permissionCallbacks.get(permissionCallbackId)?.(grant);
|
||||
permissionCallbacks.delete(permissionCallbackId);
|
||||
},
|
||||
);
|
||||
|
||||
// This event is only available on macOS. Triggers when you click on the dock icon.
|
||||
app.on("activate", () => {
|
||||
mainWindow.show();
|
||||
});
|
||||
|
||||
app.on("web-contents-created", (_event: Event, contents: WebContents) => {
|
||||
contents.setWindowOpenHandler((details) => {
|
||||
handleExternalLink(contents, details, page);
|
||||
return {action: "deny"};
|
||||
});
|
||||
});
|
||||
|
||||
const ses = session.fromPartition("persist:webviewsession");
|
||||
ses.setUserAgent(`ZulipElectron/${app.getVersion()} ${ses.getUserAgent()}`);
|
||||
|
||||
function configureSpellChecker() {
|
||||
const enable = ConfigUtil.getConfigItem("enableSpellchecker", true);
|
||||
if (enable && process.platform !== "darwin") {
|
||||
ses.setSpellCheckerLanguages(
|
||||
ConfigUtil.getConfigItem("spellcheckerLanguages", null) ?? [],
|
||||
);
|
||||
}
|
||||
|
||||
ses.setSpellCheckerEnabled(enable);
|
||||
}
|
||||
|
||||
configureSpellChecker();
|
||||
ipcMain.on("configure-spell-checker", configureSpellChecker);
|
||||
|
||||
ipcMain.on("get-injected-js", (event) => {
|
||||
event.returnValue = fs.readFileSync(
|
||||
path.join(bundlePath, "injected.js"),
|
||||
"utf8",
|
||||
);
|
||||
});
|
||||
|
||||
const clipboardSigKey = crypto.randomBytes(32);
|
||||
|
||||
ipcMain.on("new-clipboard-key", (event) => {
|
||||
const key = crypto.randomBytes(32);
|
||||
const hmac = crypto.createHmac("sha256", clipboardSigKey);
|
||||
hmac.update(key);
|
||||
event.returnValue = {key, sig: hmac.digest()};
|
||||
});
|
||||
|
||||
ipcMain.handle("poll-clipboard", (event, key, sig) => {
|
||||
// Check that the key was generated here.
|
||||
const hmac = crypto.createHmac("sha256", clipboardSigKey);
|
||||
hmac.update(key);
|
||||
if (!crypto.timingSafeEqual(sig, hmac.digest())) return;
|
||||
|
||||
try {
|
||||
// Check that the data on the clipboard was encrypted to the key.
|
||||
const data = Buffer.from(clipboard.readText(), "hex");
|
||||
const iv = data.slice(0, 12);
|
||||
const ciphertext = data.slice(12, -16);
|
||||
const authTag = data.slice(-16);
|
||||
const decipher = crypto.createDecipheriv("aes-256-gcm", key, iv, {
|
||||
authTagLength: 16,
|
||||
});
|
||||
decipher.setAuthTag(authTag);
|
||||
return (
|
||||
decipher.update(ciphertext, undefined, "utf8") + decipher.final("utf8")
|
||||
);
|
||||
} catch {
|
||||
// If the parsing or decryption failed in any way,
|
||||
// the correct token hasn’t been copied yet; try
|
||||
// again next time.
|
||||
return undefined;
|
||||
}
|
||||
});
|
||||
|
||||
AppMenu.setMenu({
|
||||
tabs: [],
|
||||
});
|
||||
mainWindow = createMainWindow();
|
||||
|
||||
// Auto-hide menu bar on Windows + Linux
|
||||
if (process.platform !== "darwin") {
|
||||
const shouldHideMenu = ConfigUtil.getConfigItem("autoHideMenubar", false);
|
||||
mainWindow.autoHideMenuBar = shouldHideMenu;
|
||||
mainWindow.setMenuBarVisibility(!shouldHideMenu);
|
||||
}
|
||||
|
||||
const page = mainWindow.webContents;
|
||||
|
||||
page.on("dom-ready", () => {
|
||||
if (ConfigUtil.getConfigItem("startMinimized", false)) {
|
||||
mainWindow.hide();
|
||||
} else {
|
||||
mainWindow.show();
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.on("fetch-user-agent", (event) => {
|
||||
event.returnValue = session
|
||||
.fromPartition("persist:webviewsession")
|
||||
.getUserAgent();
|
||||
});
|
||||
|
||||
ipcMain.handle("get-server-settings", async (event, domain: string) =>
|
||||
_getServerSettings(domain, ses),
|
||||
);
|
||||
|
||||
ipcMain.handle("save-server-icon", async (event, url: string) =>
|
||||
_saveServerIcon(url, ses),
|
||||
);
|
||||
|
||||
ipcMain.handle("is-online", async (event, url: string) =>
|
||||
_isOnline(url, ses),
|
||||
);
|
||||
|
||||
page.once("did-frame-finish-load", async () => {
|
||||
// Initiate auto-updates on MacOS and Windows
|
||||
if (ConfigUtil.getConfigItem("autoUpdate", true)) {
|
||||
await appUpdater();
|
||||
}
|
||||
});
|
||||
|
||||
app.on(
|
||||
"certificate-error",
|
||||
(
|
||||
event: Event,
|
||||
webContents: WebContents,
|
||||
urlString: string,
|
||||
error: string,
|
||||
) => {
|
||||
const url = new URL(urlString);
|
||||
dialog.showErrorBox(
|
||||
"Certificate error",
|
||||
`The server presented an invalid certificate for ${url.origin}:
|
||||
|
||||
${error}`,
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
ses.setPermissionRequestHandler(
|
||||
(webContents, permission, callback, details) => {
|
||||
const {origin} = new URL(details.requestingUrl);
|
||||
const permissionCallbackId = nextPermissionCallbackId++;
|
||||
permissionCallbacks.set(permissionCallbackId, callback);
|
||||
send(
|
||||
page,
|
||||
"permission-request",
|
||||
{
|
||||
webContentsId:
|
||||
webContents.id === mainWindow.webContents.id
|
||||
? null
|
||||
: webContents.id,
|
||||
origin,
|
||||
permission,
|
||||
},
|
||||
permissionCallbackId,
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
// Temporarily remove this event
|
||||
// powerMonitor.on('resume', () => {
|
||||
// mainWindow.reload();
|
||||
// send(page, 'destroytray');
|
||||
// });
|
||||
|
||||
ipcMain.on("focus-app", () => {
|
||||
mainWindow.show();
|
||||
});
|
||||
|
||||
ipcMain.on("quit-app", () => {
|
||||
app.quit();
|
||||
});
|
||||
|
||||
// Reload full app not just webview, useful in debugging
|
||||
ipcMain.on("reload-full-app", () => {
|
||||
mainWindow.reload();
|
||||
send(page, "destroytray");
|
||||
});
|
||||
|
||||
ipcMain.on("clear-app-settings", () => {
|
||||
mainWindowState.unmanage();
|
||||
app.relaunch();
|
||||
app.exit();
|
||||
});
|
||||
|
||||
ipcMain.on("toggle-app", () => {
|
||||
toggleApp();
|
||||
});
|
||||
|
||||
ipcMain.on("toggle-badge-option", () => {
|
||||
BadgeSettings.updateBadge(badgeCount, mainWindow);
|
||||
});
|
||||
|
||||
ipcMain.on("toggle-menubar", (_event: IpcMainEvent, showMenubar: boolean) => {
|
||||
mainWindow.autoHideMenuBar = showMenubar;
|
||||
mainWindow.setMenuBarVisibility(!showMenubar);
|
||||
send(page, "toggle-autohide-menubar", showMenubar, true);
|
||||
});
|
||||
|
||||
ipcMain.on("update-badge", (_event: IpcMainEvent, messageCount: number) => {
|
||||
badgeCount = messageCount;
|
||||
BadgeSettings.updateBadge(badgeCount, mainWindow);
|
||||
send(page, "tray", messageCount);
|
||||
});
|
||||
|
||||
ipcMain.on(
|
||||
"update-taskbar-icon",
|
||||
(_event: IpcMainEvent, data: string, text: string) => {
|
||||
BadgeSettings.updateTaskbarIcon(data, text, mainWindow);
|
||||
},
|
||||
);
|
||||
|
||||
ipcMain.on(
|
||||
"forward-message",
|
||||
<Channel extends keyof RendererMessage>(
|
||||
_event: IpcMainEvent,
|
||||
listener: Channel,
|
||||
...parameters: Parameters<RendererMessage[Channel]>
|
||||
) => {
|
||||
send(page, listener, ...parameters);
|
||||
},
|
||||
);
|
||||
|
||||
ipcMain.on("update-menu", (_event: IpcMainEvent, props: MenuProps) => {
|
||||
AppMenu.setMenu(props);
|
||||
if (props.activeTabIndex !== undefined) {
|
||||
const activeTab = props.tabs[props.activeTabIndex];
|
||||
mainWindow.setTitle(`Zulip - ${activeTab.name}`);
|
||||
}
|
||||
});
|
||||
|
||||
ipcMain.on(
|
||||
"toggleAutoLauncher",
|
||||
async (_event: IpcMainEvent, AutoLaunchValue: boolean) => {
|
||||
await setAutoLaunch(AutoLaunchValue);
|
||||
},
|
||||
);
|
||||
|
||||
ipcMain.on(
|
||||
"realm-name-changed",
|
||||
(_event: IpcMainEvent, serverURL: string, realmName: string) => {
|
||||
send(page, "update-realm-name", serverURL, realmName);
|
||||
},
|
||||
);
|
||||
|
||||
ipcMain.on(
|
||||
"realm-icon-changed",
|
||||
(_event: IpcMainEvent, serverURL: string, iconURL: string) => {
|
||||
send(page, "update-realm-icon", serverURL, iconURL);
|
||||
},
|
||||
);
|
||||
|
||||
ipcMain.on("save-last-tab", (_event: IpcMainEvent, index: number) => {
|
||||
ConfigUtil.setConfigItem("lastActiveTab", index);
|
||||
});
|
||||
|
||||
ipcMain.on("focus-this-webview", (event: IpcMainEvent) => {
|
||||
send(page, "focus-webview-with-id", event.sender.id);
|
||||
mainWindow.show();
|
||||
});
|
||||
|
||||
// Update user idle status for each realm after every 15s
|
||||
const idleCheckInterval = 15 * 1000; // 15 seconds
|
||||
setInterval(() => {
|
||||
// Set user idle if no activity in 1 second (idleThresholdSeconds)
|
||||
const idleThresholdSeconds = 1; // 1 second
|
||||
const idleState = powerMonitor.getSystemIdleState(idleThresholdSeconds);
|
||||
if (idleState === "active") {
|
||||
send(page, "set-active");
|
||||
} else {
|
||||
send(page, "set-idle");
|
||||
}
|
||||
}, idleCheckInterval);
|
||||
})();
|
||||
|
||||
app.on("before-quit", () => {
|
||||
isQuitting = true;
|
||||
});
|
||||
|
||||
// Send crash reports
|
||||
process.on("uncaughtException", (error) => {
|
||||
console.error(error);
|
||||
console.error(error.stack);
|
||||
});
|
||||
@@ -1,69 +0,0 @@
|
||||
import {app, dialog} from "electron/main";
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
|
||||
import {JsonDB} from "node-json-db";
|
||||
import {DataError} from "node-json-db/dist/lib/Errors";
|
||||
|
||||
import Logger from "../common/logger-util.js";
|
||||
|
||||
const logger = new Logger({
|
||||
file: "linux-update-util.log",
|
||||
});
|
||||
|
||||
let db: JsonDB;
|
||||
|
||||
reloadDb();
|
||||
|
||||
export function getUpdateItem(
|
||||
key: string,
|
||||
defaultValue: true | null = null,
|
||||
): true | null {
|
||||
reloadDb();
|
||||
let value: unknown;
|
||||
try {
|
||||
value = db.getObject<unknown>(`/${key}`);
|
||||
} catch (error: unknown) {
|
||||
if (!(error instanceof DataError)) throw error;
|
||||
}
|
||||
|
||||
if (value !== true && value !== null) {
|
||||
setUpdateItem(key, defaultValue);
|
||||
return defaultValue;
|
||||
}
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
export function setUpdateItem(key: string, value: true | null): void {
|
||||
db.push(`/${key}`, value, true);
|
||||
reloadDb();
|
||||
}
|
||||
|
||||
export function removeUpdateItem(key: string): void {
|
||||
db.delete(`/${key}`);
|
||||
reloadDb();
|
||||
}
|
||||
|
||||
function reloadDb(): void {
|
||||
const linuxUpdateJsonPath = path.join(
|
||||
app.getPath("userData"),
|
||||
"/config/updates.json",
|
||||
);
|
||||
try {
|
||||
const file = fs.readFileSync(linuxUpdateJsonPath, "utf8");
|
||||
JSON.parse(file);
|
||||
} catch (error: unknown) {
|
||||
if (fs.existsSync(linuxUpdateJsonPath)) {
|
||||
fs.unlinkSync(linuxUpdateJsonPath);
|
||||
dialog.showErrorBox(
|
||||
"Error saving update notifications.",
|
||||
"We encountered an error while saving the update notifications.",
|
||||
);
|
||||
logger.error("Error while JSON parsing updates.json: ");
|
||||
logger.error(error);
|
||||
}
|
||||
}
|
||||
|
||||
db = new JsonDB(linuxUpdateJsonPath, true, true);
|
||||
}
|
||||
53
app/main/linuxupdater.js
Normal file
53
app/main/linuxupdater.js
Normal file
@@ -0,0 +1,53 @@
|
||||
const { app } = require('electron');
|
||||
const { Notification } = require('electron');
|
||||
|
||||
const request = require('request');
|
||||
const semver = require('semver');
|
||||
const ConfigUtil = require('../renderer/js/utils/config-util');
|
||||
const ProxyUtil = require('../renderer/js/utils/proxy-util');
|
||||
const LinuxUpdateUtil = require('../renderer/js/utils/linux-update-util');
|
||||
const Logger = require('../renderer/js/utils/logger-util');
|
||||
|
||||
const logger = new Logger({
|
||||
file: 'linux-update-util.log',
|
||||
timestamp: true
|
||||
});
|
||||
|
||||
function linuxUpdateNotification() {
|
||||
let url = 'https://api.github.com/repos/zulip/zulip-desktop/releases';
|
||||
url = ConfigUtil.getConfigItem('betaUpdate') ? url : url + '/latest';
|
||||
const proxyEnabled = ConfigUtil.getConfigItem('useManualProxy') || ConfigUtil.getConfigItem('useSystemProxy');
|
||||
|
||||
const options = {
|
||||
url,
|
||||
headers: {'User-Agent': 'request'},
|
||||
proxy: proxyEnabled ? ProxyUtil.getProxy(url) : '',
|
||||
ecdhCurve: 'auto'
|
||||
};
|
||||
|
||||
request(options, (error, response, body) => {
|
||||
if (error) {
|
||||
logger.error('Linux update error.');
|
||||
logger.error(error);
|
||||
return;
|
||||
}
|
||||
if (response.statusCode < 400) {
|
||||
const data = JSON.parse(body);
|
||||
const latestVersion = ConfigUtil.getConfigItem('betaUpdate') ? data[0].tag_name : data.tag_name;
|
||||
|
||||
if (semver.gt(latestVersion, app.getVersion())) {
|
||||
const notified = LinuxUpdateUtil.getUpdateItem(latestVersion);
|
||||
if (notified === null) {
|
||||
new Notification({title: 'Zulip Update', body: 'A new version ' + latestVersion + ' is available. Please update using your package manager.'}).show();
|
||||
LinuxUpdateUtil.setUpdateItem(latestVersion, true);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
logger.log('Linux update response status: ', response.statusCode);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
linuxUpdateNotification
|
||||
};
|
||||
@@ -1,50 +0,0 @@
|
||||
import type {Session} from "electron/main";
|
||||
import {Notification, app, net} from "electron/main";
|
||||
|
||||
import getStream from "get-stream";
|
||||
import * as semver from "semver";
|
||||
import * as z from "zod";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
import Logger from "../common/logger-util.js";
|
||||
|
||||
import * as LinuxUpdateUtil from "./linux-update-util.js";
|
||||
import {fetchResponse} from "./request.js";
|
||||
|
||||
const logger = new Logger({
|
||||
file: "linux-update-util.log",
|
||||
});
|
||||
|
||||
export async function linuxUpdateNotification(session: Session): Promise<void> {
|
||||
let url = "https://api.github.com/repos/zulip/zulip-desktop/releases";
|
||||
url = ConfigUtil.getConfigItem("betaUpdate", false) ? url : url + "/latest";
|
||||
|
||||
try {
|
||||
const response = await fetchResponse(net.request({url, session}));
|
||||
if (response.statusCode !== 200) {
|
||||
logger.log("Linux update response status: ", response.statusCode);
|
||||
return;
|
||||
}
|
||||
|
||||
const data: unknown = JSON.parse(await getStream(response));
|
||||
/* eslint-disable @typescript-eslint/naming-convention */
|
||||
const latestVersion = ConfigUtil.getConfigItem("betaUpdate", false)
|
||||
? z.array(z.object({tag_name: z.string()})).parse(data)[0].tag_name
|
||||
: z.object({tag_name: z.string()}).parse(data).tag_name;
|
||||
/* eslint-enable @typescript-eslint/naming-convention */
|
||||
|
||||
if (semver.gt(latestVersion, app.getVersion())) {
|
||||
const notified = LinuxUpdateUtil.getUpdateItem(latestVersion);
|
||||
if (notified === null) {
|
||||
new Notification({
|
||||
title: "Zulip Update",
|
||||
body: `A new version ${latestVersion} is available. Please update using your package manager.`,
|
||||
}).show();
|
||||
LinuxUpdateUtil.setUpdateItem(latestVersion, true);
|
||||
}
|
||||
}
|
||||
} catch (error: unknown) {
|
||||
logger.error("Linux update error.");
|
||||
logger.error(error);
|
||||
}
|
||||
}
|
||||
539
app/main/menu.js
Normal file
539
app/main/menu.js
Normal file
@@ -0,0 +1,539 @@
|
||||
'use strict';
|
||||
const path = require('path');
|
||||
|
||||
const { app, shell, BrowserWindow, Menu, dialog } = require('electron');
|
||||
|
||||
const fs = require('fs-extra');
|
||||
const AdmZip = require('adm-zip');
|
||||
const { appUpdater } = require('./autoupdater');
|
||||
|
||||
const ConfigUtil = require(__dirname + '/../renderer/js/utils/config-util.js');
|
||||
const DNDUtil = require(__dirname + '/../renderer/js/utils/dnd-util.js');
|
||||
const Logger = require(__dirname + '/../renderer/js/utils/logger-util.js');
|
||||
|
||||
const appName = app.getName();
|
||||
|
||||
const logger = new Logger({
|
||||
file: 'errors.log',
|
||||
timestamp: true
|
||||
});
|
||||
|
||||
class AppMenu {
|
||||
getHistorySubmenu() {
|
||||
return [{
|
||||
label: 'Back',
|
||||
accelerator: process.platform === 'darwin' ? 'Command+Left' : 'Alt+Left',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('back');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Forward',
|
||||
accelerator: process.platform === 'darwin' ? 'Command+Right' : 'Alt+Right',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('forward');
|
||||
}
|
||||
}
|
||||
}];
|
||||
}
|
||||
|
||||
getToolsSubmenu() {
|
||||
return [{
|
||||
label: `Check for Updates`,
|
||||
click() {
|
||||
AppMenu.checkForUpdate();
|
||||
}
|
||||
},
|
||||
{
|
||||
label: `Release Notes`,
|
||||
click() {
|
||||
shell.openExternal(`https://github.com/zulip/zulip-desktop/releases/tag/v${app.getVersion()}`);
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
label: 'Factory Reset',
|
||||
accelerator: process.platform === 'darwin' ? 'Command+Shift+D' : 'Ctrl+Shift+D',
|
||||
click() {
|
||||
AppMenu.resetAppSettings();
|
||||
}
|
||||
}, {
|
||||
label: 'Download App Logs',
|
||||
click() {
|
||||
const zip = new AdmZip();
|
||||
let date = new Date();
|
||||
date = date.toLocaleDateString().replace(/\//g, '-');
|
||||
|
||||
// Create a zip file of all the logs and config data
|
||||
zip.addLocalFolder(`${app.getPath('appData')}/${appName}/Logs`);
|
||||
zip.addLocalFolder(`${app.getPath('appData')}/${appName}/config`);
|
||||
|
||||
// Put the log file in downloads folder
|
||||
const logFilePath = `${app.getPath('downloads')}/Zulip-logs-${date}.zip`;
|
||||
zip.writeZip(logFilePath);
|
||||
|
||||
// Open and select the log file
|
||||
shell.showItemInFolder(logFilePath);
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
label: 'Toggle DevTools for Zulip App',
|
||||
accelerator: process.platform === 'darwin' ? 'Alt+Command+I' : 'Ctrl+Shift+I',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
focusedWindow.webContents.toggleDevTools();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Toggle DevTools for Active Tab',
|
||||
accelerator: process.platform === 'darwin' ? 'Alt+Command+U' : 'Ctrl+Shift+U',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('tab-devtools');
|
||||
}
|
||||
}
|
||||
}];
|
||||
}
|
||||
|
||||
getViewSubmenu() {
|
||||
return [{
|
||||
label: 'Reload',
|
||||
accelerator: 'CommandOrControl+R',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('reload-current-viewer');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Hard Reload',
|
||||
accelerator: 'CommandOrControl+Shift+R',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('hard-reload');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'togglefullscreen'
|
||||
}, {
|
||||
label: 'Zoom In',
|
||||
accelerator: process.platform === 'darwin' ? 'Command+Plus' : 'Control+=',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('zoomIn');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Zoom Out',
|
||||
accelerator: 'CommandOrControl+-',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('zoomOut');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Actual Size',
|
||||
accelerator: 'CommandOrControl+0',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('zoomActualSize');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
label: 'Toggle Tray Icon',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
focusedWindow.webContents.send('toggletray');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Toggle Sidebar',
|
||||
accelerator: 'CommandOrControl+Shift+S',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
const newValue = !ConfigUtil.getConfigItem('showSidebar');
|
||||
focusedWindow.webContents.send('toggle-sidebar', newValue);
|
||||
ConfigUtil.setConfigItem('showSidebar', newValue);
|
||||
}
|
||||
}
|
||||
}];
|
||||
}
|
||||
|
||||
getHelpSubmenu() {
|
||||
return [
|
||||
{
|
||||
label: `${appName + ' Desktop'} v${app.getVersion()}`,
|
||||
enabled: false
|
||||
},
|
||||
{
|
||||
label: 'About Zulip',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('open-about');
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
label: `Help Center`,
|
||||
click() {
|
||||
shell.openExternal('https://zulipchat.com/help/');
|
||||
}
|
||||
}, {
|
||||
label: 'Report an Issue',
|
||||
click() {
|
||||
// the goal is to notify the main.html BrowserWindow
|
||||
// which may not be the focused window.
|
||||
BrowserWindow.getAllWindows().forEach(window => {
|
||||
window.webContents.send('open-feedback-modal');
|
||||
});
|
||||
}
|
||||
}];
|
||||
}
|
||||
|
||||
getWindowSubmenu(tabs, activeTabIndex) {
|
||||
const initialSubmenu = [{
|
||||
role: 'minimize'
|
||||
}, {
|
||||
role: 'close'
|
||||
}];
|
||||
|
||||
if (tabs.length > 0) {
|
||||
const ShortcutKey = process.platform === 'darwin' ? 'Cmd' : 'Ctrl';
|
||||
initialSubmenu.push({
|
||||
type: 'separator'
|
||||
});
|
||||
for (let i = 0; i < tabs.length; i++) {
|
||||
// Do not add functional tab settings to list of windows in menu bar
|
||||
if (tabs[i].props.role === 'function' && tabs[i].webview.props.name === 'Settings') {
|
||||
continue;
|
||||
}
|
||||
|
||||
initialSubmenu.push({
|
||||
label: tabs[i].webview.props.name,
|
||||
accelerator: tabs[i].props.role === 'function' ? '' : `${ShortcutKey} + ${tabs[i].props.index + 1}`,
|
||||
checked: tabs[i].props.index === activeTabIndex,
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('switch-server-tab', tabs[i].props.index);
|
||||
}
|
||||
},
|
||||
type: 'checkbox'
|
||||
});
|
||||
}
|
||||
initialSubmenu.push({
|
||||
type: 'separator'
|
||||
});
|
||||
initialSubmenu.push({
|
||||
label: 'Switch to Next Organization',
|
||||
accelerator: `Ctrl+Tab`,
|
||||
enabled: tabs[activeTabIndex].props.role === 'server',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('switch-server-tab', AppMenu.getNextServer(tabs, activeTabIndex));
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Switch to Previous Organization',
|
||||
accelerator: `Ctrl+Shift+Tab`,
|
||||
enabled: tabs[activeTabIndex].props.role === 'server',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('switch-server-tab', AppMenu.getPreviousServer(tabs, activeTabIndex));
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return initialSubmenu;
|
||||
}
|
||||
|
||||
getDarwinTpl(props) {
|
||||
const { tabs, activeTabIndex, enableMenu } = props;
|
||||
|
||||
return [{
|
||||
label: `${app.getName()}`,
|
||||
submenu: [{
|
||||
label: 'Add Organization',
|
||||
accelerator: 'Cmd+Shift+N',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('new-server');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Toggle Do Not Disturb',
|
||||
accelerator: 'Cmd+Shift+M',
|
||||
click() {
|
||||
const dndUtil = DNDUtil.toggle();
|
||||
AppMenu.sendAction('toggle-dnd', dndUtil.dnd, dndUtil.newSettings);
|
||||
}
|
||||
}, {
|
||||
label: 'Desktop Settings',
|
||||
accelerator: 'Cmd+,',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('open-settings');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Keyboard Shortcuts',
|
||||
accelerator: 'Cmd+Shift+K',
|
||||
enabled: enableMenu,
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('shortcut');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
label: 'Copy Zulip URL',
|
||||
accelerator: 'Cmd+Shift+C',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('copy-zulip-url');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Log Out of Organization',
|
||||
accelerator: 'Cmd+L',
|
||||
enabled: enableMenu,
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('log-out');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'services',
|
||||
submenu: []
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'hide'
|
||||
}, {
|
||||
role: 'hideothers'
|
||||
}, {
|
||||
role: 'unhide'
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'quit'
|
||||
}]
|
||||
}, {
|
||||
label: 'Edit',
|
||||
submenu: [{
|
||||
role: 'undo'
|
||||
}, {
|
||||
role: 'redo'
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'cut'
|
||||
}, {
|
||||
role: 'copy'
|
||||
}, {
|
||||
role: 'paste'
|
||||
}, {
|
||||
role: 'pasteandmatchstyle'
|
||||
}, {
|
||||
role: 'selectall'
|
||||
}]
|
||||
}, {
|
||||
label: 'View',
|
||||
submenu: this.getViewSubmenu()
|
||||
}, {
|
||||
label: 'History',
|
||||
submenu: this.getHistorySubmenu()
|
||||
}, {
|
||||
label: 'Window',
|
||||
submenu: this.getWindowSubmenu(tabs, activeTabIndex)
|
||||
}, {
|
||||
label: 'Tools',
|
||||
submenu: this.getToolsSubmenu()
|
||||
}, {
|
||||
role: 'help',
|
||||
submenu: this.getHelpSubmenu()
|
||||
}];
|
||||
}
|
||||
|
||||
getOtherTpl(props) {
|
||||
const { tabs, activeTabIndex, enableMenu } = props;
|
||||
|
||||
return [{
|
||||
label: '&File',
|
||||
submenu: [{
|
||||
label: 'Add Organization',
|
||||
accelerator: 'Ctrl+Shift+N',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('new-server');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
label: 'Toggle Do Not Disturb',
|
||||
accelerator: 'Ctrl+Shift+M',
|
||||
click() {
|
||||
const dndUtil = DNDUtil.toggle();
|
||||
AppMenu.sendAction('toggle-dnd', dndUtil.dnd, dndUtil.newSettings);
|
||||
}
|
||||
}, {
|
||||
label: 'Desktop Settings',
|
||||
accelerator: 'Ctrl+,',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('open-settings');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Keyboard Shortcuts',
|
||||
accelerator: 'Ctrl+Shift+K',
|
||||
enabled: enableMenu,
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('shortcut');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
label: 'Copy Zulip URL',
|
||||
accelerator: 'Ctrl+Shift+C',
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('copy-zulip-url');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
label: 'Log Out of Organization',
|
||||
accelerator: 'Ctrl+L',
|
||||
enabled: enableMenu,
|
||||
click(item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
AppMenu.sendAction('log-out');
|
||||
}
|
||||
}
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'quit',
|
||||
accelerator: 'Ctrl+Q'
|
||||
}]
|
||||
}, {
|
||||
label: '&Edit',
|
||||
submenu: [{
|
||||
role: 'undo'
|
||||
}, {
|
||||
role: 'redo'
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'cut'
|
||||
}, {
|
||||
role: 'copy'
|
||||
}, {
|
||||
role: 'paste'
|
||||
}, {
|
||||
role: 'pasteandmatchstyle'
|
||||
}, {
|
||||
type: 'separator'
|
||||
}, {
|
||||
role: 'selectall'
|
||||
}]
|
||||
}, {
|
||||
label: '&View',
|
||||
submenu: this.getViewSubmenu()
|
||||
}, {
|
||||
label: '&History',
|
||||
submenu: this.getHistorySubmenu()
|
||||
}, {
|
||||
label: '&Window',
|
||||
submenu: this.getWindowSubmenu(tabs, activeTabIndex)
|
||||
}, {
|
||||
label: '&Tools',
|
||||
submenu: this.getToolsSubmenu()
|
||||
}, {
|
||||
label: '&Help',
|
||||
role: 'help',
|
||||
submenu: this.getHelpSubmenu()
|
||||
}];
|
||||
}
|
||||
|
||||
static sendAction(action, ...params) {
|
||||
const win = BrowserWindow.getAllWindows()[0];
|
||||
|
||||
if (process.platform === 'darwin') {
|
||||
win.restore();
|
||||
}
|
||||
|
||||
win.webContents.send(action, ...params);
|
||||
}
|
||||
|
||||
static checkForUpdate() {
|
||||
appUpdater(true);
|
||||
}
|
||||
|
||||
static getNextServer(tabs, activeTabIndex) {
|
||||
do {
|
||||
activeTabIndex = (activeTabIndex + 1) % tabs.length;
|
||||
}
|
||||
while (tabs[activeTabIndex].props.role !== 'server');
|
||||
return activeTabIndex;
|
||||
}
|
||||
|
||||
static getPreviousServer(tabs, activeTabIndex) {
|
||||
do {
|
||||
activeTabIndex = (activeTabIndex - 1 + tabs.length) % tabs.length;
|
||||
}
|
||||
while (tabs[activeTabIndex].props.role !== 'server');
|
||||
return activeTabIndex;
|
||||
}
|
||||
|
||||
static resetAppSettings() {
|
||||
const resetAppSettingsMessage = 'By proceeding you will be removing all connected organizations and preferences from Zulip.';
|
||||
|
||||
// We save App's settings/configurations in following files
|
||||
const settingFiles = ['config/window-state.json', 'config/domain.json', 'config/settings.json', 'config/certificates.json'];
|
||||
|
||||
dialog.showMessageBox({
|
||||
type: 'warning',
|
||||
buttons: ['YES', 'NO'],
|
||||
defaultId: 0,
|
||||
message: 'Are you sure?',
|
||||
detail: resetAppSettingsMessage
|
||||
}, response => {
|
||||
if (response === 0) {
|
||||
settingFiles.forEach(settingFileName => {
|
||||
const getSettingFilesPath = path.join(app.getPath('appData'), appName, settingFileName);
|
||||
fs.access(getSettingFilesPath, error => {
|
||||
if (error) {
|
||||
logger.error('Error while resetting app settings.');
|
||||
logger.error(error);
|
||||
} else {
|
||||
fs.unlink(getSettingFilesPath, () => {
|
||||
AppMenu.sendAction('clear-app-data');
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
setMenu(props) {
|
||||
const tpl = process.platform === 'darwin' ? this.getDarwinTpl(props) : this.getOtherTpl(props);
|
||||
const menu = Menu.buildFromTemplate(tpl);
|
||||
Menu.setApplicationMenu(menu);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = new AppMenu();
|
||||
722
app/main/menu.ts
722
app/main/menu.ts
@@ -1,722 +0,0 @@
|
||||
import {shell} from "electron/common";
|
||||
import type {MenuItemConstructorOptions} from "electron/main";
|
||||
import {BrowserWindow, Menu, app} from "electron/main";
|
||||
import process from "node:process";
|
||||
|
||||
import AdmZip from "adm-zip";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
import * as DNDUtil from "../common/dnd-util.js";
|
||||
import * as t from "../common/translation-util.js";
|
||||
import type {RendererMessage} from "../common/typed-ipc.js";
|
||||
import type {MenuProps, TabData} from "../common/types.js";
|
||||
|
||||
import {appUpdater} from "./autoupdater.js";
|
||||
import {send} from "./typed-ipc-main.js";
|
||||
|
||||
const appName = app.name;
|
||||
|
||||
function getHistorySubmenu(enableMenu: boolean): MenuItemConstructorOptions[] {
|
||||
return [
|
||||
{
|
||||
label: t.__("Back"),
|
||||
accelerator: process.platform === "darwin" ? "Command+Left" : "Alt+Left",
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("back");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Forward"),
|
||||
accelerator:
|
||||
process.platform === "darwin" ? "Command+Right" : "Alt+Right",
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("forward");
|
||||
}
|
||||
},
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
function getToolsSubmenu(): MenuItemConstructorOptions[] {
|
||||
return [
|
||||
{
|
||||
label: t.__("Check for Updates"),
|
||||
async click() {
|
||||
await checkForUpdate();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Release Notes"),
|
||||
async click() {
|
||||
await shell.openExternal(
|
||||
`https://github.com/zulip/zulip-desktop/releases/tag/v${app.getVersion()}`,
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Download App Logs"),
|
||||
click() {
|
||||
const zip = new AdmZip();
|
||||
const date = new Date();
|
||||
const dateString = date.toLocaleDateString().replace(/\//g, "-");
|
||||
|
||||
// Create a zip file of all the logs and config data
|
||||
zip.addLocalFolder(`${app.getPath("appData")}/${appName}/Logs`);
|
||||
zip.addLocalFolder(`${app.getPath("appData")}/${appName}/config`);
|
||||
|
||||
// Put the log file in downloads folder
|
||||
const logFilePath = `${app.getPath(
|
||||
"downloads",
|
||||
)}/Zulip-logs-${dateString}.zip`;
|
||||
zip.writeZip(logFilePath);
|
||||
|
||||
// Open and select the log file
|
||||
shell.showItemInFolder(logFilePath);
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle DevTools for Zulip App"),
|
||||
accelerator:
|
||||
process.platform === "darwin" ? "Alt+Command+I" : "Ctrl+Shift+I",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
focusedWindow.webContents.openDevTools({mode: "undocked"});
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle DevTools for Active Tab"),
|
||||
accelerator:
|
||||
process.platform === "darwin" ? "Alt+Command+U" : "Ctrl+Shift+U",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("tab-devtools");
|
||||
}
|
||||
},
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
function getViewSubmenu(): MenuItemConstructorOptions[] {
|
||||
return [
|
||||
{
|
||||
label: t.__("Reload"),
|
||||
accelerator: "CommandOrControl+R",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("reload-current-viewer");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Hard Reload"),
|
||||
accelerator: "CommandOrControl+Shift+R",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("hard-reload");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Hard Reload"),
|
||||
visible: false,
|
||||
accelerator: "F5",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("hard-reload");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle Full Screen"),
|
||||
role: "togglefullscreen",
|
||||
},
|
||||
{
|
||||
label: t.__("Zoom In"),
|
||||
accelerator: "CommandOrControl+=",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomIn");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Zoom In"),
|
||||
visible: false,
|
||||
accelerator: "CommandOrControl+Plus",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomIn");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Zoom In"),
|
||||
visible: false,
|
||||
accelerator: "CommandOrControl+numadd",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomIn");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Zoom Out"),
|
||||
accelerator: "CommandOrControl+-",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomOut");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Zoom Out"),
|
||||
visible: false,
|
||||
accelerator: "CommandOrControl+numsub",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomOut");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Actual Size"),
|
||||
accelerator: "CommandOrControl+0",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomActualSize");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Actual Size"),
|
||||
visible: false,
|
||||
accelerator: "CommandOrControl+num0",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("zoomActualSize");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle Tray Icon"),
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
send(focusedWindow.webContents, "toggletray");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle Sidebar"),
|
||||
accelerator: "CommandOrControl+Shift+S",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
const newValue = !ConfigUtil.getConfigItem("showSidebar", true);
|
||||
send(focusedWindow.webContents, "toggle-sidebar", newValue);
|
||||
ConfigUtil.setConfigItem("showSidebar", newValue);
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Auto hide Menu bar"),
|
||||
checked: ConfigUtil.getConfigItem("autoHideMenubar", false),
|
||||
visible: process.platform !== "darwin",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
const newValue = !ConfigUtil.getConfigItem("autoHideMenubar", false);
|
||||
focusedWindow.autoHideMenuBar = newValue;
|
||||
focusedWindow.setMenuBarVisibility(!newValue);
|
||||
send(
|
||||
focusedWindow.webContents,
|
||||
"toggle-autohide-menubar",
|
||||
newValue,
|
||||
false,
|
||||
);
|
||||
ConfigUtil.setConfigItem("autoHideMenubar", newValue);
|
||||
}
|
||||
},
|
||||
type: "checkbox",
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
function getHelpSubmenu(): MenuItemConstructorOptions[] {
|
||||
return [
|
||||
{
|
||||
label: `${appName + " Desktop"} v${app.getVersion()}`,
|
||||
enabled: false,
|
||||
},
|
||||
{
|
||||
label: t.__("About Zulip"),
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("open-about");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Help Center"),
|
||||
click(focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("open-help");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Report an Issue"),
|
||||
async click() {
|
||||
await shell.openExternal("https://zulip.com/help/contact-support");
|
||||
},
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
function getWindowSubmenu(
|
||||
tabs: TabData[],
|
||||
activeTabIndex?: number,
|
||||
): MenuItemConstructorOptions[] {
|
||||
const initialSubmenu: MenuItemConstructorOptions[] = [
|
||||
{
|
||||
label: t.__("Minimize"),
|
||||
role: "minimize",
|
||||
},
|
||||
{
|
||||
label: t.__("Close"),
|
||||
role: "close",
|
||||
},
|
||||
];
|
||||
|
||||
if (tabs.length > 0) {
|
||||
const shortcutKey = process.platform === "darwin" ? "Cmd" : "Ctrl";
|
||||
initialSubmenu.push({
|
||||
type: "separator",
|
||||
});
|
||||
for (const tab of tabs) {
|
||||
// Skip missing elements left by `delete this.tabs[index]` in
|
||||
// ServerManagerView.
|
||||
if (tab === undefined) continue;
|
||||
|
||||
// Do not add functional tab settings to list of windows in menu bar
|
||||
if (tab.role === "function" && tab.name === "Settings") {
|
||||
continue;
|
||||
}
|
||||
|
||||
initialSubmenu.push({
|
||||
label: tab.name,
|
||||
accelerator:
|
||||
tab.role === "function" ? "" : `${shortcutKey} + ${tab.index + 1}`,
|
||||
checked: tab.index === activeTabIndex,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("switch-server-tab", tab.index);
|
||||
}
|
||||
},
|
||||
type: "checkbox",
|
||||
});
|
||||
}
|
||||
|
||||
initialSubmenu.push(
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Switch to Next Organization"),
|
||||
accelerator: "Ctrl+Tab",
|
||||
enabled: tabs.length > 1,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction(
|
||||
"switch-server-tab",
|
||||
getNextServer(tabs, activeTabIndex!),
|
||||
);
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Switch to Previous Organization"),
|
||||
accelerator: "Ctrl+Shift+Tab",
|
||||
enabled: tabs.length > 1,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction(
|
||||
"switch-server-tab",
|
||||
getPreviousServer(tabs, activeTabIndex!),
|
||||
);
|
||||
}
|
||||
},
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
return initialSubmenu;
|
||||
}
|
||||
|
||||
function getDarwinTpl(props: MenuProps): MenuItemConstructorOptions[] {
|
||||
const {tabs, activeTabIndex, enableMenu = false} = props;
|
||||
|
||||
return [
|
||||
{
|
||||
label: app.name,
|
||||
submenu: [
|
||||
{
|
||||
label: t.__("Add Organization"),
|
||||
accelerator: "Cmd+Shift+N",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("new-server");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle Do Not Disturb"),
|
||||
accelerator: "Cmd+Shift+M",
|
||||
click() {
|
||||
const dndUtil = DNDUtil.toggle();
|
||||
sendAction("toggle-dnd", dndUtil.dnd, dndUtil.newSettings);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Desktop Settings"),
|
||||
accelerator: "Cmd+,",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("open-settings");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Keyboard Shortcuts"),
|
||||
accelerator: "Cmd+Shift+K",
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("show-keyboard-shortcuts");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Copy Zulip URL"),
|
||||
accelerator: "Cmd+Shift+C",
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("copy-zulip-url");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Log Out of Organization"),
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("log-out");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Services"),
|
||||
role: "services",
|
||||
submenu: [],
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Hide"),
|
||||
role: "hide",
|
||||
},
|
||||
{
|
||||
label: t.__("Hide Others"),
|
||||
role: "hideOthers",
|
||||
},
|
||||
{
|
||||
label: t.__("Unhide"),
|
||||
role: "unhide",
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Minimize"),
|
||||
role: "minimize",
|
||||
},
|
||||
{
|
||||
label: t.__("Close"),
|
||||
role: "close",
|
||||
},
|
||||
{
|
||||
label: t.__("Quit"),
|
||||
role: "quit",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t.__("Edit"),
|
||||
submenu: [
|
||||
{
|
||||
label: t.__("Undo"),
|
||||
role: "undo",
|
||||
},
|
||||
{
|
||||
label: t.__("Redo"),
|
||||
role: "redo",
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Cut"),
|
||||
role: "cut",
|
||||
},
|
||||
{
|
||||
label: t.__("Copy"),
|
||||
role: "copy",
|
||||
},
|
||||
{
|
||||
label: t.__("Paste"),
|
||||
role: "paste",
|
||||
},
|
||||
{
|
||||
label: t.__("Paste and Match Style"),
|
||||
role: "pasteAndMatchStyle",
|
||||
},
|
||||
{
|
||||
label: t.__("Select All"),
|
||||
role: "selectAll",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t.__("View"),
|
||||
submenu: getViewSubmenu(),
|
||||
},
|
||||
{
|
||||
label: t.__("History"),
|
||||
submenu: getHistorySubmenu(enableMenu),
|
||||
},
|
||||
{
|
||||
label: t.__("Window"),
|
||||
submenu: getWindowSubmenu(tabs, activeTabIndex),
|
||||
},
|
||||
{
|
||||
label: t.__("Tools"),
|
||||
submenu: getToolsSubmenu(),
|
||||
},
|
||||
{
|
||||
label: t.__("Help"),
|
||||
role: "help",
|
||||
submenu: getHelpSubmenu(),
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
function getOtherTpl(props: MenuProps): MenuItemConstructorOptions[] {
|
||||
const {tabs, activeTabIndex, enableMenu = false} = props;
|
||||
return [
|
||||
{
|
||||
label: t.__("File"),
|
||||
submenu: [
|
||||
{
|
||||
label: t.__("Add Organization"),
|
||||
accelerator: "Ctrl+Shift+N",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("new-server");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Toggle Do Not Disturb"),
|
||||
accelerator: "Ctrl+Shift+M",
|
||||
click() {
|
||||
const dndUtil = DNDUtil.toggle();
|
||||
sendAction("toggle-dnd", dndUtil.dnd, dndUtil.newSettings);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Desktop Settings"),
|
||||
accelerator: "Ctrl+,",
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("open-settings");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Keyboard Shortcuts"),
|
||||
accelerator: "Ctrl+Shift+K",
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("show-keyboard-shortcuts");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Copy Zulip URL"),
|
||||
accelerator: "Ctrl+Shift+C",
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("copy-zulip-url");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Log Out of Organization"),
|
||||
enabled: enableMenu,
|
||||
click(_item, focusedWindow) {
|
||||
if (focusedWindow) {
|
||||
sendAction("log-out");
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Minimize"),
|
||||
role: "minimize",
|
||||
},
|
||||
{
|
||||
label: t.__("Close"),
|
||||
role: "close",
|
||||
},
|
||||
{
|
||||
label: t.__("Quit"),
|
||||
role: "quit",
|
||||
accelerator: "Ctrl+Q",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t.__("Edit"),
|
||||
submenu: [
|
||||
{
|
||||
label: t.__("Undo"),
|
||||
role: "undo",
|
||||
},
|
||||
{
|
||||
label: t.__("Redo"),
|
||||
role: "redo",
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Cut"),
|
||||
role: "cut",
|
||||
},
|
||||
{
|
||||
label: t.__("Copy"),
|
||||
role: "copy",
|
||||
},
|
||||
{
|
||||
label: t.__("Paste"),
|
||||
role: "paste",
|
||||
},
|
||||
{
|
||||
label: t.__("Paste and Match Style"),
|
||||
role: "pasteAndMatchStyle",
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label: t.__("Select All"),
|
||||
role: "selectAll",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: t.__("View"),
|
||||
submenu: getViewSubmenu(),
|
||||
},
|
||||
{
|
||||
label: t.__("History"),
|
||||
submenu: getHistorySubmenu(enableMenu),
|
||||
},
|
||||
{
|
||||
label: t.__("Window"),
|
||||
submenu: getWindowSubmenu(tabs, activeTabIndex),
|
||||
},
|
||||
{
|
||||
label: t.__("Tools"),
|
||||
submenu: getToolsSubmenu(),
|
||||
},
|
||||
{
|
||||
label: t.__("Help"),
|
||||
role: "help",
|
||||
submenu: getHelpSubmenu(),
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
function sendAction<Channel extends keyof RendererMessage>(
|
||||
channel: Channel,
|
||||
...args: Parameters<RendererMessage[Channel]>
|
||||
): void {
|
||||
const win = BrowserWindow.getAllWindows()[0];
|
||||
|
||||
if (process.platform === "darwin") {
|
||||
win.restore();
|
||||
}
|
||||
|
||||
send(win.webContents, channel, ...args);
|
||||
}
|
||||
|
||||
async function checkForUpdate(): Promise<void> {
|
||||
await appUpdater(true);
|
||||
}
|
||||
|
||||
function getNextServer(tabs: TabData[], activeTabIndex: number): number {
|
||||
do {
|
||||
activeTabIndex = (activeTabIndex + 1) % tabs.length;
|
||||
} while (tabs[activeTabIndex]?.role !== "server");
|
||||
|
||||
return activeTabIndex;
|
||||
}
|
||||
|
||||
function getPreviousServer(tabs: TabData[], activeTabIndex: number): number {
|
||||
do {
|
||||
activeTabIndex = (activeTabIndex - 1 + tabs.length) % tabs.length;
|
||||
} while (tabs[activeTabIndex]?.role !== "server");
|
||||
|
||||
return activeTabIndex;
|
||||
}
|
||||
|
||||
export function setMenu(props: MenuProps): void {
|
||||
const tpl =
|
||||
process.platform === "darwin" ? getDarwinTpl(props) : getOtherTpl(props);
|
||||
const menu = Menu.buildFromTemplate(tpl);
|
||||
Menu.setApplicationMenu(menu);
|
||||
}
|
||||
@@ -1,137 +0,0 @@
|
||||
import type {ClientRequest, IncomingMessage, Session} from "electron/main";
|
||||
import {app, net} from "electron/main";
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
import stream from "node:stream";
|
||||
import util from "node:util";
|
||||
|
||||
import * as Sentry from "@sentry/electron";
|
||||
import getStream from "get-stream";
|
||||
import * as z from "zod";
|
||||
|
||||
import Logger from "../common/logger-util.js";
|
||||
import * as Messages from "../common/messages.js";
|
||||
import type {ServerConf} from "../common/types.js";
|
||||
|
||||
export async function fetchResponse(
|
||||
request: ClientRequest,
|
||||
): Promise<IncomingMessage> {
|
||||
return new Promise((resolve, reject) => {
|
||||
request.on("response", resolve);
|
||||
request.on("abort", () => {
|
||||
reject(new Error("Request aborted"));
|
||||
});
|
||||
request.on("error", reject);
|
||||
request.end();
|
||||
});
|
||||
}
|
||||
|
||||
const pipeline = util.promisify(stream.pipeline);
|
||||
|
||||
/* Request: domain-util */
|
||||
|
||||
const defaultIconUrl = "../renderer/img/icon.png";
|
||||
|
||||
const logger = new Logger({
|
||||
file: "domain-util.log",
|
||||
});
|
||||
|
||||
const generateFilePath = (url: string): string => {
|
||||
const dir = `${app.getPath("userData")}/server-icons`;
|
||||
const extension = path.extname(url).split("?")[0];
|
||||
|
||||
let hash = 5381;
|
||||
let {length} = url;
|
||||
|
||||
while (length) {
|
||||
// eslint-disable-next-line no-bitwise, unicorn/prefer-code-point
|
||||
hash = (hash * 33) ^ url.charCodeAt(--length);
|
||||
}
|
||||
|
||||
// Create 'server-icons' directory if not existed
|
||||
if (!fs.existsSync(dir)) {
|
||||
fs.mkdirSync(dir);
|
||||
}
|
||||
|
||||
// eslint-disable-next-line no-bitwise
|
||||
return `${dir}/${hash >>> 0}${extension}`;
|
||||
};
|
||||
|
||||
export const _getServerSettings = async (
|
||||
domain: string,
|
||||
session: Session,
|
||||
): Promise<ServerConf> => {
|
||||
const response = await fetchResponse(
|
||||
net.request({
|
||||
url: domain + "/api/v1/server_settings",
|
||||
session,
|
||||
}),
|
||||
);
|
||||
if (response.statusCode !== 200) {
|
||||
throw new Error(Messages.invalidZulipServerError(domain));
|
||||
}
|
||||
|
||||
const data: unknown = JSON.parse(await getStream(response));
|
||||
/* eslint-disable @typescript-eslint/naming-convention */
|
||||
const {realm_name, realm_uri, realm_icon} = z
|
||||
.object({
|
||||
realm_name: z.string(),
|
||||
realm_uri: z.string(),
|
||||
realm_icon: z.string(),
|
||||
})
|
||||
.parse(data);
|
||||
/* eslint-enable @typescript-eslint/naming-convention */
|
||||
|
||||
return {
|
||||
// Some Zulip Servers use absolute URL for server icon whereas others use relative URL
|
||||
// Following check handles both the cases
|
||||
icon: realm_icon.startsWith("/") ? realm_uri + realm_icon : realm_icon,
|
||||
url: realm_uri,
|
||||
alias: realm_name,
|
||||
};
|
||||
};
|
||||
|
||||
export const _saveServerIcon = async (
|
||||
url: string,
|
||||
session: Session,
|
||||
): Promise<string> => {
|
||||
try {
|
||||
const response = await fetchResponse(net.request({url, session}));
|
||||
if (response.statusCode !== 200) {
|
||||
logger.log("Could not get server icon.");
|
||||
return defaultIconUrl;
|
||||
}
|
||||
|
||||
const filePath = generateFilePath(url);
|
||||
await pipeline(response, fs.createWriteStream(filePath));
|
||||
return filePath;
|
||||
} catch (error: unknown) {
|
||||
logger.log("Could not get server icon.");
|
||||
logger.log(error);
|
||||
Sentry.captureException(error);
|
||||
return defaultIconUrl;
|
||||
}
|
||||
};
|
||||
|
||||
/* Request: reconnect-util */
|
||||
|
||||
export const _isOnline = async (
|
||||
url: string,
|
||||
session: Session,
|
||||
): Promise<boolean> => {
|
||||
try {
|
||||
const response = await fetchResponse(
|
||||
net.request({
|
||||
method: "HEAD",
|
||||
url: `${url}/api/v1/server_settings`,
|
||||
session,
|
||||
}),
|
||||
);
|
||||
const isValidResponse =
|
||||
response.statusCode >= 200 && response.statusCode < 400;
|
||||
return isValidResponse;
|
||||
} catch (error: unknown) {
|
||||
logger.log(error);
|
||||
return false;
|
||||
}
|
||||
};
|
||||
@@ -1,22 +0,0 @@
|
||||
import {app} from "electron/main";
|
||||
|
||||
import * as Sentry from "@sentry/electron/main"; // eslint-disable-line n/file-extension-in-import
|
||||
|
||||
import {getConfigItem} from "../common/config-util.js";
|
||||
|
||||
export const sentryInit = (): void => {
|
||||
Sentry.init({
|
||||
dsn: "https://628dc2f2864243a08ead72e63f94c7b1@o48127.ingest.sentry.io/204668",
|
||||
|
||||
// Don't report errors in development or if disabled by the user.
|
||||
beforeSend: (event) =>
|
||||
app.isPackaged && getConfigItem("errorReporting", true) ? event : null,
|
||||
|
||||
// We should ignore this error since it's harmless and we know the reason behind this
|
||||
// This error mainly comes from the console logs.
|
||||
// This is a temp solution until Sentry supports disabling the console logs
|
||||
ignoreErrors: ["does not appear to be a valid Zulip server"],
|
||||
|
||||
/// sendTimeout: 30 // wait 30 seconds before considering the sending capture to have failed, default is 1 second
|
||||
});
|
||||
};
|
||||
34
app/main/startup.js
Normal file
34
app/main/startup.js
Normal file
@@ -0,0 +1,34 @@
|
||||
'use strict';
|
||||
const { app } = require('electron');
|
||||
const AutoLaunch = require('auto-launch');
|
||||
const isDev = require('electron-is-dev');
|
||||
const ConfigUtil = require('./../renderer/js/utils/config-util.js');
|
||||
|
||||
const setAutoLaunch = AutoLaunchValue => {
|
||||
// Don't run this in development
|
||||
if (isDev) {
|
||||
return;
|
||||
}
|
||||
|
||||
// On Mac, work around a bug in auto-launch where it opens a Terminal window
|
||||
// See https://github.com/Teamwork/node-auto-launch/issues/28#issuecomment-222194437
|
||||
|
||||
const appPath = process.platform === 'darwin' ? app.getPath('exe').replace(/\.app\/Content.*/, '.app') : undefined; // Use the default
|
||||
|
||||
const ZulipAutoLauncher = new AutoLaunch({
|
||||
name: 'Zulip',
|
||||
path: appPath,
|
||||
isHidden: false
|
||||
});
|
||||
const autoLaunchOption = ConfigUtil.getConfigItem('startAtLogin', AutoLaunchValue);
|
||||
|
||||
if (autoLaunchOption) {
|
||||
ZulipAutoLauncher.enable();
|
||||
} else {
|
||||
ZulipAutoLauncher.disable();
|
||||
}
|
||||
};
|
||||
|
||||
module.exports = {
|
||||
setAutoLaunch
|
||||
};
|
||||
@@ -1,36 +0,0 @@
|
||||
import {app} from "electron/main";
|
||||
import process from "node:process";
|
||||
|
||||
import AutoLaunch from "auto-launch";
|
||||
|
||||
import * as ConfigUtil from "../common/config-util.js";
|
||||
|
||||
export const setAutoLaunch = async (
|
||||
AutoLaunchValue: boolean,
|
||||
): Promise<void> => {
|
||||
// Don't run this in development
|
||||
if (!app.isPackaged) {
|
||||
return;
|
||||
}
|
||||
|
||||
const autoLaunchOption = ConfigUtil.getConfigItem(
|
||||
"startAtLogin",
|
||||
AutoLaunchValue,
|
||||
);
|
||||
|
||||
// `setLoginItemSettings` doesn't support linux
|
||||
if (process.platform === "linux") {
|
||||
const zulipAutoLauncher = new AutoLaunch({
|
||||
name: "Zulip",
|
||||
isHidden: false,
|
||||
});
|
||||
await (autoLaunchOption
|
||||
? zulipAutoLauncher.enable()
|
||||
: zulipAutoLauncher.disable());
|
||||
} else {
|
||||
app.setLoginItemSettings({
|
||||
openAtLogin: autoLaunchOption,
|
||||
openAsHidden: false,
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -1,75 +0,0 @@
|
||||
import type {
|
||||
IpcMainEvent,
|
||||
IpcMainInvokeEvent,
|
||||
WebContents,
|
||||
} from "electron/main";
|
||||
import {
|
||||
ipcMain as untypedIpcMain, // eslint-disable-line no-restricted-imports
|
||||
} from "electron/main";
|
||||
|
||||
import type {
|
||||
MainCall,
|
||||
MainMessage,
|
||||
RendererMessage,
|
||||
} from "../common/typed-ipc.js";
|
||||
|
||||
type MainListener<Channel extends keyof MainMessage> =
|
||||
MainMessage[Channel] extends (...args: infer Args) => infer Return
|
||||
? (event: IpcMainEvent & {returnValue: Return}, ...args: Args) => void
|
||||
: never;
|
||||
|
||||
type MainHandler<Channel extends keyof MainCall> = MainCall[Channel] extends (
|
||||
...args: infer Args
|
||||
) => infer Return
|
||||
? (event: IpcMainInvokeEvent, ...args: Args) => Return | Promise<Return>
|
||||
: never;
|
||||
|
||||
export const ipcMain: {
|
||||
on(
|
||||
channel: "forward-message",
|
||||
listener: <Channel extends keyof RendererMessage>(
|
||||
event: IpcMainEvent,
|
||||
channel: Channel,
|
||||
...args: Parameters<RendererMessage[Channel]>
|
||||
) => void,
|
||||
): void;
|
||||
on<Channel extends keyof MainMessage>(
|
||||
channel: Channel,
|
||||
listener: MainListener<Channel>,
|
||||
): void;
|
||||
once<Channel extends keyof MainMessage>(
|
||||
channel: Channel,
|
||||
listener: MainListener<Channel>,
|
||||
): void;
|
||||
removeListener<Channel extends keyof MainMessage>(
|
||||
channel: Channel,
|
||||
listener: MainListener<Channel>,
|
||||
): void;
|
||||
removeAllListeners(channel?: keyof MainMessage): void;
|
||||
handle<Channel extends keyof MainCall>(
|
||||
channel: Channel,
|
||||
handler: MainHandler<Channel>,
|
||||
): void;
|
||||
handleOnce<Channel extends keyof MainCall>(
|
||||
channel: Channel,
|
||||
handler: MainHandler<Channel>,
|
||||
): void;
|
||||
removeHandler(channel: keyof MainCall): void;
|
||||
} = untypedIpcMain;
|
||||
|
||||
export function send<Channel extends keyof RendererMessage>(
|
||||
contents: WebContents,
|
||||
channel: Channel,
|
||||
...args: Parameters<RendererMessage[Channel]>
|
||||
): void {
|
||||
contents.send(channel, ...args);
|
||||
}
|
||||
|
||||
export function sendToFrame<Channel extends keyof RendererMessage>(
|
||||
contents: WebContents,
|
||||
frameId: number | [number, number],
|
||||
channel: Channel,
|
||||
...args: Parameters<RendererMessage[Channel]>
|
||||
): void {
|
||||
contents.sendToFrame(frameId, channel, ...args);
|
||||
}
|
||||
1676
app/package-lock.json
generated
Normal file
1676
app/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
48
app/package.json
Normal file
48
app/package.json
Normal file
@@ -0,0 +1,48 @@
|
||||
{
|
||||
"name": "zulip",
|
||||
"productName": "Zulip",
|
||||
"version": "2.5.0-beta",
|
||||
"description": "Zulip Desktop App",
|
||||
"license": "Apache-2.0",
|
||||
"copyright": "Kandra Labs, Inc.",
|
||||
"author": {
|
||||
"name": "Kandra Labs, Inc.",
|
||||
"email": "support@zulipchat.com"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/zulip/zulip-desktop.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/zulip/zulip-desktop/issues"
|
||||
},
|
||||
"main": "main/index.js",
|
||||
"keywords": [
|
||||
"Zulip",
|
||||
"Group Chat app",
|
||||
"electron-app",
|
||||
"electron",
|
||||
"Desktop app",
|
||||
"InstantMessaging"
|
||||
],
|
||||
"dependencies": {
|
||||
"@electron-elements/send-feedback": "1.0.8",
|
||||
"@sentry/electron": "0.14.0",
|
||||
"adm-zip": "0.4.11",
|
||||
"auto-launch": "5.0.5",
|
||||
"electron-is-dev": "0.3.0",
|
||||
"electron-log": "2.2.14",
|
||||
"electron-spellchecker": "1.1.2",
|
||||
"electron-updater": "4.0.6",
|
||||
"electron-window-state": "5.0.3",
|
||||
"escape-html": "1.0.3",
|
||||
"is-online": "7.0.0",
|
||||
"node-json-db": "0.9.1",
|
||||
"request": "2.85.0",
|
||||
"semver": "5.4.1",
|
||||
"wurl": "2.5.0"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"node-mac-notifier": "1.1.0"
|
||||
}
|
||||
}
|
||||
@@ -1,26 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="stylesheet" href="css/about.css" />
|
||||
<html lang="en">
|
||||
|
||||
<!-- Initially hidden to prevent FOUC -->
|
||||
<div class="about" hidden>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="css/about.css">
|
||||
<title>Zulip - About</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="about">
|
||||
<img class="logo" src="../resources/zulip.png" />
|
||||
<p class="detail" id="version"></p>
|
||||
<p class="detail" id="version">v?.?.?</p>
|
||||
<div class="maintenance-info">
|
||||
<p class="detail maintainer">
|
||||
Maintained by
|
||||
<a href="https://zulip.com" target="_blank" rel="noopener noreferrer"
|
||||
>Zulip</a
|
||||
>
|
||||
<a onclick="linkInBrowser('website')">Zulip</a>
|
||||
</p>
|
||||
<p class="detail license">
|
||||
Available under the
|
||||
<a
|
||||
href="https://github.com/zulip/zulip-desktop/blob/main/LICENSE"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>Apache 2.0 License</a
|
||||
>
|
||||
<a onclick="linkInBrowser('license')">Apache 2.0 License</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
const { app } = require('electron').remote;
|
||||
const { shell } = require('electron');
|
||||
const version_tag = document.querySelector('#version');
|
||||
version_tag.innerHTML = 'v' + app.getVersion();
|
||||
|
||||
function linkInBrowser(type) {
|
||||
let url;
|
||||
switch (type) {
|
||||
case 'website':
|
||||
url = "https://zulipchat.com";
|
||||
break;
|
||||
case 'license':
|
||||
url = "https://github.com/zulip/zulip-desktop/blob/master/LICENSE";
|
||||
break;
|
||||
}
|
||||
shell.openExternal(url);
|
||||
}
|
||||
</script>
|
||||
<script>require('./js/shared/preventdrag.js')</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
:host {
|
||||
contain: strict;
|
||||
display: flow-root;
|
||||
background: rgb(250 250 250 / 100%);
|
||||
body {
|
||||
background: rgba(250, 250, 250, 1.000);
|
||||
font-family: menu, "Helvetica Neue", sans-serif;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
}
|
||||
@@ -12,13 +10,12 @@
|
||||
}
|
||||
|
||||
#version {
|
||||
color: rgb(68 67 67 / 100%);
|
||||
color: rgba(68, 67, 67, 1.000);
|
||||
font-size: 1.3em;
|
||||
padding-top: 40px;
|
||||
}
|
||||
|
||||
.about {
|
||||
display: block !important;
|
||||
margin: 25vh auto;
|
||||
height: 25vh;
|
||||
text-align: center;
|
||||
@@ -26,7 +23,7 @@
|
||||
|
||||
.about p {
|
||||
font-size: 20px;
|
||||
color: rgb(0 0 0 / 62%);
|
||||
color: rgba(0, 0, 0, 0.62);
|
||||
}
|
||||
|
||||
.about img {
|
||||
@@ -50,8 +47,8 @@
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
color: rgb(68 68 68 / 100%);
|
||||
left: 0px;
|
||||
color: rgba(68, 68, 68, 1.000);
|
||||
}
|
||||
|
||||
.maintenance-info p {
|
||||
@@ -61,7 +58,7 @@
|
||||
}
|
||||
|
||||
p.detail a {
|
||||
color: rgb(53 95 76 / 100%);
|
||||
color: rgba(53, 95, 76, 1.000);
|
||||
}
|
||||
|
||||
p.detail a:hover {
|
||||
|
||||
@@ -1,19 +0,0 @@
|
||||
:host {
|
||||
--button-color: rgb(69 166 149);
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: var(--button-color);
|
||||
border-color: var(--button-color);
|
||||
}
|
||||
|
||||
button:hover,
|
||||
button:focus {
|
||||
border-color: var(--button-color);
|
||||
color: var(--button-color);
|
||||
}
|
||||
|
||||
button:active {
|
||||
background-color: rgb(241 241 241);
|
||||
color: var(--button-color);
|
||||
}
|
||||
@@ -1,12 +0,0 @@
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local("Material Icons"), local("MaterialIcons-Regular"),
|
||||
url("../fonts/MaterialIcons-Regular.ttf") format("truetype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Montserrat;
|
||||
src: url("../fonts/Montserrat-Regular.ttf") format("truetype");
|
||||
}
|
||||
@@ -16,9 +16,9 @@ body {
|
||||
}
|
||||
|
||||
.toggle-sidebar {
|
||||
background: rgb(34 44 49 / 100%);
|
||||
background: rgba(34, 44, 49, 1.000);
|
||||
width: 54px;
|
||||
padding: 27px 0 20px;
|
||||
padding: 27px 0 20px 0;
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -47,23 +47,31 @@ body {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
#view-controls-container:hover {
|
||||
overflow-y: overlay;
|
||||
}
|
||||
|
||||
#view-controls-container::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
#view-controls-container::-webkit-scrollbar-track {
|
||||
box-shadow: inset 0 0 6px rgb(0 0 0 / 30%);
|
||||
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
#view-controls-container::-webkit-scrollbar-thumb {
|
||||
background-color: rgb(169 169 169 / 100%);
|
||||
outline: 1px solid rgb(169 169 169 / 100%);
|
||||
background-color: rgba(169, 169, 169, 1.000);
|
||||
outline: 1px solid rgba(169, 169, 169, 1.000);
|
||||
}
|
||||
|
||||
#view-controls-container:hover {
|
||||
overflow-y: overlay;
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Material Icons'), local('MaterialIcons-Regular'), url(../fonts/MaterialIcons-Regular.ttf) format('truetype');
|
||||
}
|
||||
|
||||
|
||||
/*******************
|
||||
* Left Sidebar *
|
||||
*******************/
|
||||
@@ -75,10 +83,9 @@ body {
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
/* Preferred icon size */
|
||||
font-size: 24px;
|
||||
display: inline-block;
|
||||
@@ -88,12 +95,10 @@ body {
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizelegibility;
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
#actions-container {
|
||||
@@ -114,23 +119,12 @@ body {
|
||||
}
|
||||
|
||||
.action-button i {
|
||||
color: rgb(108 133 146 / 100%);
|
||||
color: rgba(108, 133, 146, 1.000);
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.action-button:hover i {
|
||||
color: rgb(152 169 179 / 100%);
|
||||
}
|
||||
|
||||
.action-button.active {
|
||||
/* background-color: rgba(255, 255, 255, 0.25); */
|
||||
background-color: rgb(239 239 239 / 100%);
|
||||
opacity: 0.9;
|
||||
padding-right: 14px;
|
||||
}
|
||||
|
||||
.action-button.active i {
|
||||
color: rgb(28 38 43 / 100%);
|
||||
color: rgba(152, 169, 179, 1.000);
|
||||
}
|
||||
|
||||
.action-button.disable {
|
||||
@@ -142,7 +136,22 @@ body {
|
||||
}
|
||||
|
||||
.action-button.disable:hover i {
|
||||
color: rgb(108 133 146 / 100%);
|
||||
color: rgba(108, 133, 146, 1.000);
|
||||
}
|
||||
|
||||
.action-button.active {
|
||||
/* background-color: rgba(255, 255, 255, 0.25); */
|
||||
background-color: rgba(239, 239, 239, 1.000);
|
||||
opacity: 0.9;
|
||||
padding-right: 14px;
|
||||
}
|
||||
|
||||
.action-button.active i {
|
||||
color: rgba(28, 38, 43, 1.000);
|
||||
}
|
||||
|
||||
.tab:first-child {
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
.tab {
|
||||
@@ -155,10 +164,6 @@ body {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tab:first-child {
|
||||
margin-top: 9px;
|
||||
}
|
||||
|
||||
.tab .server-icons {
|
||||
width: 35px;
|
||||
vertical-align: top;
|
||||
@@ -172,7 +177,7 @@ body {
|
||||
margin-top: 5px;
|
||||
z-index: 11;
|
||||
line-height: 31px;
|
||||
color: rgb(238 238 238 / 100%);
|
||||
color: rgba(238, 238, 238, 1.000);
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
opacity: 0.6;
|
||||
@@ -180,10 +185,10 @@ body {
|
||||
}
|
||||
|
||||
.server-tab .alt-icon {
|
||||
font-family: Verdana, sans-serif;
|
||||
font-family: Verdana;
|
||||
font-weight: 600;
|
||||
font-size: 22px;
|
||||
border: 2px solid rgb(34 44 49 / 100%);
|
||||
border: 2px solid rgba(34, 44, 49, 1.000);
|
||||
margin-left: 17%;
|
||||
width: 35px;
|
||||
border-radius: 4px;
|
||||
@@ -193,11 +198,6 @@ body {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.tab.active .server-tab {
|
||||
opacity: 1;
|
||||
background-color: rgb(100 132 120 / 100%);
|
||||
}
|
||||
|
||||
.tab.functional-tab {
|
||||
height: 46px;
|
||||
padding: 0;
|
||||
@@ -206,7 +206,7 @@ body {
|
||||
.tab.functional-tab.active .server-tab {
|
||||
padding: 2px 0;
|
||||
height: 40px;
|
||||
background-color: rgb(255 255 255 / 25%);
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.tab.functional-tab .server-tab i {
|
||||
@@ -214,19 +214,25 @@ body {
|
||||
line-height: 36px;
|
||||
}
|
||||
|
||||
.tab.active .server-tab {
|
||||
opacity: 1;
|
||||
background-color: rgba(100, 132, 120, 1.000);
|
||||
}
|
||||
|
||||
.tab .server-tab-badge.active {
|
||||
border-radius: 9px;
|
||||
min-width: 11px;
|
||||
padding: 0 3px;
|
||||
height: 17px;
|
||||
background-color: rgb(244 67 54 / 100%);
|
||||
background-color: rgba(244, 67, 54, 1.000);
|
||||
font-size: 10px;
|
||||
font-family: sans-serif;
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
z-index: 15;
|
||||
top: 6px;
|
||||
float: right;
|
||||
color: rgb(255 255 255 / 100%);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
text-align: center;
|
||||
line-height: 17px;
|
||||
display: block;
|
||||
@@ -254,26 +260,13 @@ body {
|
||||
}
|
||||
|
||||
.tab .server-tab-shortcut {
|
||||
color: rgb(100 132 120 / 100%);
|
||||
color: rgba(100, 132, 120, 1.000);
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
font-family: sans-serif;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.refresh {
|
||||
animation: rotate-loader 1s linear infinite;
|
||||
}
|
||||
|
||||
@keyframes rotate-loader {
|
||||
from {
|
||||
transform: rotate(0);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(-360deg);
|
||||
}
|
||||
}
|
||||
|
||||
/*******************
|
||||
* Webview Area *
|
||||
@@ -290,7 +283,7 @@ body {
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
background: rgb(255 255 255 / 100%) url("../img/ic_loading.gif") no-repeat;
|
||||
background: rgba(255, 255, 255, 1.000) url(../img/ic_loading.gif) no-repeat;
|
||||
background-size: 60px 60px;
|
||||
background-position: center;
|
||||
width: 100%;
|
||||
@@ -299,51 +292,60 @@ body {
|
||||
|
||||
/* When the active webview is loaded */
|
||||
#webviews-container.loaded::before {
|
||||
opacity: 0;
|
||||
z-index: -1;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
webview,
|
||||
.functional-view {
|
||||
webview {
|
||||
/* transition: opacity 0.3s ease-in; */
|
||||
flex-grow: 1;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex-grow: 1;
|
||||
visibility: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
webview.active,
|
||||
.functional-view.active {
|
||||
webview.onload {
|
||||
transition: opacity 1s cubic-bezier(0.95, 0.05, 0.795, 0.035);
|
||||
}
|
||||
|
||||
webview.active {
|
||||
opacity: 1;
|
||||
z-index: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
webview.disabled {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
webview.focus {
|
||||
outline: 0 solid transparent;
|
||||
outline: 0px solid transparent;
|
||||
}
|
||||
|
||||
/* Tooltip styling */
|
||||
|
||||
#loading-tooltip,
|
||||
#dnd-tooltip,
|
||||
#back-tooltip,
|
||||
#reload-tooltip,
|
||||
#setting-tooltip {
|
||||
font-family: sans-serif;
|
||||
background: rgb(34 44 49 / 100%);
|
||||
background: rgba(34, 44, 49, 1.000);
|
||||
margin-left: 48px;
|
||||
padding: 6px 8px;
|
||||
position: absolute;
|
||||
margin-top: 0;
|
||||
margin-top: 0px;
|
||||
z-index: 1000;
|
||||
color: rgb(255 255 255 / 100%);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
width: 55px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#loading-tooltip::after,
|
||||
#dnd-tooltip::after,
|
||||
#back-tooltip::after,
|
||||
#reload-tooltip::after,
|
||||
@@ -351,7 +353,7 @@ webview.focus {
|
||||
content: " ";
|
||||
border-top: 8px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
border-right: 8px solid rgb(34 44 49 / 100%);
|
||||
border-right: 8px solid rgba(34, 44, 49, 1.000);
|
||||
position: absolute;
|
||||
top: 7px;
|
||||
right: 68px;
|
||||
@@ -359,14 +361,14 @@ webview.focus {
|
||||
|
||||
#add-server-tooltip,
|
||||
.server-tooltip {
|
||||
font-family: arial, sans-serif;
|
||||
background: rgb(34 44 49 / 100%);
|
||||
font-family: 'arial';
|
||||
background: rgba(34, 44, 49, 1.000);
|
||||
left: 56px;
|
||||
padding: 10px 20px;
|
||||
position: fixed;
|
||||
margin-top: 11px;
|
||||
z-index: 5000 !important;
|
||||
color: rgb(255 255 255 / 100%);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
width: max-content;
|
||||
@@ -378,7 +380,7 @@ webview.focus {
|
||||
content: " ";
|
||||
border-top: 8px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
border-right: 8px solid rgb(34 44 49 / 100%);
|
||||
border-right: 8px solid rgba(34, 44, 49, 1.000);
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: -5px;
|
||||
@@ -390,14 +392,14 @@ webview.focus {
|
||||
position: absolute;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
background: rgb(34 44 49 / 100%);
|
||||
background: rgba(34, 44, 49, 1.000);
|
||||
border-radius: 20px;
|
||||
cursor: pointer;
|
||||
box-shadow: rgb(153 153 153 / 100%) 1px 1px;
|
||||
box-shadow: rgba(153, 153, 153, 1.000) 1px 1px;
|
||||
}
|
||||
|
||||
#collapse-button i {
|
||||
color: rgb(239 239 239 / 100%);
|
||||
color: rgba(239, 239, 239, 1.000);
|
||||
}
|
||||
|
||||
#main-container {
|
||||
@@ -406,25 +408,26 @@ webview.focus {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
flex-grow: 1;
|
||||
flex-basis: 0;
|
||||
flex-basis: 0px;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
/* Full screen Popup container */
|
||||
|
||||
.popup .popuptext {
|
||||
visibility: hidden;
|
||||
background-color: rgb(85 85 85 / 100%);
|
||||
color: rgb(255 255 255 / 100%);
|
||||
background-color: rgba(85, 85, 85, 1.000);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
text-align: center;
|
||||
border-radius: 6px;
|
||||
padding: 9px 0;
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
font-family: arial, sans-serif;
|
||||
font-family: arial;
|
||||
width: 240px;
|
||||
top: 15px;
|
||||
height: 20px;
|
||||
@@ -433,15 +436,14 @@ webview.focus {
|
||||
|
||||
.popup .show {
|
||||
visibility: visible;
|
||||
animation: full-screen-popup 0s ease-in 1s forwards;
|
||||
animation: cssAnimation 0s ease-in 5s forwards;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes full-screen-popup {
|
||||
@keyframes cssAnimation {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
width: 0;
|
||||
height: 0;
|
||||
@@ -449,3 +451,26 @@ webview.focus {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
send-feedback {
|
||||
width: 60%;
|
||||
height: 85%;
|
||||
}
|
||||
|
||||
#feedback-modal {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(68, 67, 67, 0.81);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 2;
|
||||
transition: all 1s ease-out;
|
||||
}
|
||||
|
||||
#feedback-modal.show {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
@@ -3,8 +3,8 @@ body {
|
||||
margin: 0;
|
||||
cursor: default;
|
||||
font-size: 14px;
|
||||
color: rgb(51 51 51 / 100%);
|
||||
background: rgb(255 255 255 / 100%);
|
||||
color: rgba(51, 51, 51, 1.000);
|
||||
background: rgba(255, 255, 255, 1.000);
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@@ -17,43 +17,27 @@ body {
|
||||
}
|
||||
|
||||
#title {
|
||||
text-align: left;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
#subtitle {
|
||||
font-size: 20px;
|
||||
text-align: left;
|
||||
margin: 12px 0;
|
||||
}
|
||||
|
||||
#description {
|
||||
text-align: left;
|
||||
font-size: 16px;
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
#reconnect {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#settings {
|
||||
margin-left: 116px;
|
||||
}
|
||||
|
||||
.button {
|
||||
font-size: 16px;
|
||||
background: rgb(0 150 136 / 100%);
|
||||
color: rgb(255 255 255 / 100%);
|
||||
width: 96px;
|
||||
background: rgba(0, 150, 136, 1.000);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
width: 84px;
|
||||
height: 32px;
|
||||
border-radius: 5px;
|
||||
line-height: 32px;
|
||||
margin: 20px auto 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
#reconnect:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
@@ -1,30 +1,31 @@
|
||||
:host {
|
||||
contain: strict;
|
||||
display: flow-root;
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
cursor: default;
|
||||
user-select: none;
|
||||
font-family: menu, "Helvetica Neue", sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-size: 14px;
|
||||
background: rgb(239 239 239 / 100%);
|
||||
letter-spacing: -0.08px;
|
||||
background: rgba(239, 239, 239, 1.000);
|
||||
letter-spacing: -.08px;
|
||||
line-height: 18px;
|
||||
color: rgb(139 142 143 / 100%);
|
||||
color: rgba(139, 142, 143, 1.000);
|
||||
}
|
||||
|
||||
kbd {
|
||||
display: inline-block;
|
||||
border: 1px solid rgb(204 204 204 / 100%);
|
||||
border: 1px solid rgba(204, 204, 204, 1.000);
|
||||
border-radius: 4px;
|
||||
font-size: 15px;
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
font-family: Courier New, Courier, monospace;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
background-color: rgb(247 247 247 / 100%);
|
||||
color: rgb(51 51 51 / 100%);
|
||||
background-color: rgba(247, 247, 247, 1.000);
|
||||
color: rgba(51, 51, 51, 1.000);
|
||||
margin: 0 0.1em;
|
||||
padding: 0.3em 0.8em;
|
||||
text-shadow: 0 1px 0 rgb(255 255 255 / 100%);
|
||||
text-shadow: 0 1px 0 rgba(255, 255, 255, 1.000);
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@@ -32,7 +33,7 @@ table,
|
||||
th,
|
||||
td {
|
||||
border-collapse: collapse;
|
||||
color: rgb(56 52 48 / 100%);
|
||||
color: rgba(56, 52, 48, 1.000);
|
||||
}
|
||||
|
||||
table {
|
||||
@@ -41,6 +42,14 @@ table {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
table tr:nth-child(even) {
|
||||
background-color: rgba(250, 250, 250, 1.000);
|
||||
}
|
||||
|
||||
table tr:nth-child(odd) {
|
||||
background-color: rgba(255, 255, 255, 1.000);
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 5px;
|
||||
}
|
||||
@@ -50,11 +59,22 @@ td:nth-child(odd) {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Material Icons'), local('MaterialIcons-Regular'), url(../fonts/MaterialIcons-Regular.ttf) format('truetype');
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
src: url(../fonts/Montserrat-Regular.ttf) format('truetype');
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
/* Preferred icon size */
|
||||
font-size: 24px;
|
||||
display: inline-block;
|
||||
@@ -64,18 +84,16 @@ td:nth-child(odd) {
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizelegibility;
|
||||
text-rendering: optimizeLegibility;
|
||||
}
|
||||
|
||||
#content {
|
||||
display: flex !important;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
font-family: Montserrat, sans-serif;
|
||||
font-family: 'Montserrat';
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
@@ -85,7 +103,7 @@ td:nth-child(odd) {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 16px;
|
||||
background: rgb(242 242 242 / 100%);
|
||||
background: rgba(242, 242, 242, 1.000);
|
||||
}
|
||||
|
||||
#nav-container {
|
||||
@@ -94,35 +112,34 @@ td:nth-child(odd) {
|
||||
|
||||
.nav {
|
||||
padding: 7px 0;
|
||||
color: rgb(153 153 153 / 100%);
|
||||
color: rgba(153, 153, 153, 1.000);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.nav.active {
|
||||
color: rgb(78 191 172 / 100%);
|
||||
color: rgba(78, 191, 172, 1.000);
|
||||
cursor: default;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav.active::before {
|
||||
background: rgb(70 78 90 / 100%);
|
||||
background: rgba(70, 78, 90, 1.000);
|
||||
width: 3px;
|
||||
height: 18px;
|
||||
position: absolute;
|
||||
left: -8px;
|
||||
content: "";
|
||||
content: '';
|
||||
}
|
||||
|
||||
/* We don't want to show this in nav item since we have the + button for adding an Organization */
|
||||
|
||||
/* stylelint-disable-next-line selector-id-pattern */
|
||||
#nav-AddServer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#settings-header {
|
||||
font-size: 22px;
|
||||
color: rgb(34 44 49 / 100%);
|
||||
color: rgba(34, 44, 49, 1.000);
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -142,19 +159,19 @@ td:nth-child(odd) {
|
||||
|
||||
.title {
|
||||
font-weight: 500;
|
||||
color: rgb(34 44 49 / 100%);
|
||||
color: rgba(34, 44, 49, 1.000);
|
||||
}
|
||||
|
||||
.page-title {
|
||||
color: rgb(34 44 49 / 100%);
|
||||
color: rgba(34, 44, 49, 1.000);
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
padding: 4px 0 6px;
|
||||
padding: 4px 0 6px 0;
|
||||
}
|
||||
|
||||
.add-server-info-row {
|
||||
display: flex;
|
||||
margin: 8px 0 0;
|
||||
margin: 8px 0 0 0;
|
||||
}
|
||||
|
||||
.add-server-info-right {
|
||||
@@ -163,9 +180,9 @@ td:nth-child(odd) {
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
padding: 4px 0 6px;
|
||||
padding: 4px 0 6px 0;
|
||||
font-weight: bold;
|
||||
color: rgb(97 97 97 / 100%);
|
||||
color: rgba(97, 97, 97, 1.000);
|
||||
}
|
||||
|
||||
img.server-info-icon {
|
||||
@@ -192,7 +209,7 @@ img.server-info-icon {
|
||||
|
||||
.server-info-row {
|
||||
display: inline-block;
|
||||
margin: 5px 0 0;
|
||||
margin: 5px 0 0 0;
|
||||
}
|
||||
|
||||
.server-info-left .server-info-row {
|
||||
@@ -232,18 +249,14 @@ img.server-info-icon {
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
padding: 13px;
|
||||
border: rgb(237 237 237 / 100%) 2px solid;
|
||||
border: rgba(237, 237, 237, 1.000) 2px solid;
|
||||
outline-width: 0;
|
||||
background: transparent;
|
||||
max-width: 450px;
|
||||
}
|
||||
|
||||
.setting-input-value:focus {
|
||||
border: rgb(78 191 172 / 100%) 2px solid;
|
||||
}
|
||||
|
||||
.invalid-input-value:focus {
|
||||
border: rgb(239 83 80 / 100%) 2px solid;
|
||||
border: rgba(78, 191, 172, 1.000) 2px solid;
|
||||
}
|
||||
|
||||
.manual-proxy-block {
|
||||
@@ -253,7 +266,7 @@ img.server-info-icon {
|
||||
.actions-container {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
color: rgb(35 93 58 / 100%);
|
||||
color: rgba(35, 93, 58, 1.000);
|
||||
vertical-align: middle;
|
||||
margin: 10px 0;
|
||||
flex-wrap: wrap;
|
||||
@@ -281,26 +294,26 @@ img.server-info-icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.action.disabled {
|
||||
color: rgb(153 153 153 / 100%);
|
||||
}
|
||||
|
||||
.action.disabled:hover {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.action.disabled {
|
||||
color: rgba(153, 153, 153, 1.000);
|
||||
}
|
||||
|
||||
.settings-card {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 12px 30px;
|
||||
margin: 10px 0 20px;
|
||||
background: rgb(255 255 255 / 100%);
|
||||
margin: 10px 0 20px 0;
|
||||
background: rgba(255, 255, 255, 1.000);
|
||||
width: 80%;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.settings-card:hover {
|
||||
box-shadow: 0 2px 5px 0 rgb(0 0 0 / 16%), 0 2px 0 0 rgb(0 0 0 / 12%);
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 0px 0px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.hidden {
|
||||
@@ -309,11 +322,11 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
.red {
|
||||
color: rgb(240 148 148);
|
||||
background: rgb(255 255 255 / 100%);
|
||||
color: rgb(240, 148, 148);
|
||||
background: rgba(255, 255, 255, 1.000);
|
||||
border-radius: 4px;
|
||||
display: inline-block;
|
||||
border: 2px solid rgb(240 148 148);
|
||||
border: 2px solid rgb(240, 148, 148);
|
||||
padding: 10px;
|
||||
width: 100px;
|
||||
cursor: pointer;
|
||||
@@ -325,13 +338,13 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
.red:hover {
|
||||
background-color: rgb(240 148 148);
|
||||
color: rgb(255 255 255 / 100%);
|
||||
background-color: rgb(240, 148, 148);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
}
|
||||
|
||||
.green {
|
||||
color: rgb(255 255 255 / 100%);
|
||||
background: rgb(78 191 172 / 100%);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
background: rgba(78, 191, 172, 1.000);
|
||||
border-radius: 4px;
|
||||
display: inline-block;
|
||||
border: none;
|
||||
@@ -346,8 +359,8 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
.green:hover {
|
||||
background-color: rgb(60 159 141 / 100%);
|
||||
color: rgb(255 255 255 / 100%);
|
||||
background-color: rgba(60, 159, 141, 1.000);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
}
|
||||
|
||||
.w-150 {
|
||||
@@ -359,9 +372,9 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
.grey {
|
||||
color: rgb(158 158 158 / 100%);
|
||||
background: rgb(250 250 250 / 100%);
|
||||
border: 1px solid rgb(158 158 158 / 100%);
|
||||
color: rgba(158, 158, 158, 1.000);
|
||||
background: rgba(250, 250, 250, 1.000);
|
||||
border: 1px solid rgba(158, 158, 158, 1.000);
|
||||
}
|
||||
|
||||
.setting-row {
|
||||
@@ -372,12 +385,8 @@ img.server-info-icon {
|
||||
margin: 6px;
|
||||
}
|
||||
|
||||
#note {
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.code {
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
font-family: Courier New, Courier, monospace;
|
||||
}
|
||||
|
||||
i.open-tab-button {
|
||||
@@ -386,22 +395,13 @@ i.open-tab-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#css-delete-action {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-sizing: border-box;
|
||||
|
||||
/*
|
||||
.action class will add extra margin to right which
|
||||
we don't want for a button; the extra margin is intended for radio buttons
|
||||
*/
|
||||
margin-right: 0;
|
||||
.css-delete-action {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.selected-css-path,
|
||||
.download-folder-path {
|
||||
background: rgb(238 238 238 / 100%);
|
||||
background: rgba(238, 238, 238, 1.000);
|
||||
padding: 5px 10px;
|
||||
margin-right: 10px;
|
||||
display: flex;
|
||||
@@ -418,7 +418,7 @@ i.open-tab-button {
|
||||
}
|
||||
|
||||
#new-org-button {
|
||||
margin: 30px 0;
|
||||
margin: 30px 0px 30px 0px;
|
||||
}
|
||||
|
||||
#create-organization-container {
|
||||
@@ -449,16 +449,11 @@ i.open-tab-button {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.disallowed:hover {
|
||||
background-color: rgb(241 241 241 / 100%);
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
input.toggle-round + label {
|
||||
padding: 2px;
|
||||
width: 50px;
|
||||
height: 25px;
|
||||
background-color: rgb(221 221 221 / 100%);
|
||||
background-color: rgba(221, 221, 221, 1.000);
|
||||
border-radius: 25px;
|
||||
}
|
||||
|
||||
@@ -473,27 +468,27 @@ input.toggle-round + label::after {
|
||||
}
|
||||
|
||||
input.toggle-round + label::before {
|
||||
background-color: rgb(241 241 241 / 100%);
|
||||
background-color: rgba(241, 241, 241, 1.000);
|
||||
border-radius: 25px;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0px;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
}
|
||||
|
||||
input.toggle-round + label::after {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background-color: rgb(255 255 255 / 100%);
|
||||
background-color: rgba(255, 255, 255, 1.000);
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
input.toggle-round:checked + label::before {
|
||||
background-color: rgb(78 191 172 / 100%);
|
||||
background-color: rgba(78, 191, 172, 1.000);
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0px;
|
||||
left: 0px;
|
||||
bottom: 0px;
|
||||
}
|
||||
|
||||
input.toggle-round:checked + label::after {
|
||||
@@ -512,23 +507,18 @@ input.toggle-round:checked + label::after {
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
/* background: rgba(61, 64, 67, 15); */
|
||||
background: linear-gradient(
|
||||
35deg,
|
||||
rgb(0 59 82 / 100%),
|
||||
rgb(69 181 155 / 100%)
|
||||
);
|
||||
background: linear-gradient(35deg, rgba(0, 59, 82, 1.000), rgba(69, 181, 155, 1.000));
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* Modal Content */
|
||||
|
||||
.modal-container {
|
||||
background-color: rgb(244 247 248 / 100%);
|
||||
background-color: rgba(244, 247, 248, 1.000);
|
||||
margin: auto;
|
||||
padding: 57px;
|
||||
border: rgb(218 225 227 / 100%) 1px solid;
|
||||
border: rgba(218, 225, 227, 1.000) 1px solid;
|
||||
width: 550px;
|
||||
height: 370px;
|
||||
border-radius: 4px;
|
||||
@@ -542,7 +532,7 @@ input.toggle-round:checked + label::after {
|
||||
.divider {
|
||||
margin-bottom: 30px;
|
||||
margin-top: 30px;
|
||||
color: rgb(125 135 138 / 100%);
|
||||
color: rgba(125, 135, 138, 1.000);
|
||||
}
|
||||
|
||||
.divider hr {
|
||||
@@ -573,8 +563,8 @@ input.toggle-round:checked + label::after {
|
||||
margin: auto;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
color: rgb(255 255 255 / 100%);
|
||||
background: rgb(78 191 172 / 100%);
|
||||
color: rgba(255, 255, 255, 1.000);
|
||||
background: rgba(78, 191, 172, 1.000);
|
||||
border-color: none;
|
||||
border: none;
|
||||
width: 98%;
|
||||
@@ -584,11 +574,11 @@ input.toggle-round:checked + label::after {
|
||||
}
|
||||
|
||||
.server-center button:hover {
|
||||
background: rgb(50 149 136 / 100%);
|
||||
background: rgba(50, 149, 136, 1.000);
|
||||
}
|
||||
|
||||
.server-center button:focus {
|
||||
background: rgb(50 149 136 / 100%);
|
||||
background: rgba(50, 149, 136, 1.000);
|
||||
}
|
||||
|
||||
.certificates-card {
|
||||
@@ -610,6 +600,10 @@ input.toggle-round:checked + label::after {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
#add-certificate-button {
|
||||
margin: 10px 10px 10px 37px;
|
||||
}
|
||||
|
||||
.tip {
|
||||
background: none;
|
||||
padding: 0;
|
||||
@@ -630,60 +624,16 @@ input.toggle-round:checked + label::after {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.server-network-option {
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
margin-top: 10px;
|
||||
padding-top: 15px;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
color: rgb(78 191 172);
|
||||
width: 98%;
|
||||
height: 46px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
i.open-network-button {
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
padding-left: 5px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
/* responsive grid */
|
||||
@media (min-width: 500px) and (max-width: 720px) {
|
||||
#new-server-container {
|
||||
padding-left: 0;
|
||||
width: 60vw;
|
||||
padding-right: 4vh;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
width: 60vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
#new-server-container {
|
||||
padding-left: 0;
|
||||
width: 54%;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
width: 54%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 650px) {
|
||||
.selected-css-path,
|
||||
.download-folder-path {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
#css-delete-action {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
#css-delete-action span {
|
||||
display: none;
|
||||
}
|
||||
@@ -695,28 +645,27 @@ i.open-network-button {
|
||||
padding: 40px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
.server-center button {
|
||||
margin-right: -12px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.divider {
|
||||
margin-right: -8px;
|
||||
}
|
||||
|
||||
.divider hr {
|
||||
margin-left: 6px;
|
||||
margin-right: 6px;
|
||||
width: 43%;
|
||||
}
|
||||
#new-server-container {
|
||||
padding-left: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
.divider {
|
||||
margin-left: 4%;
|
||||
}
|
||||
|
||||
.divider hr {
|
||||
margin-left: 2px;
|
||||
margin-right: 2px;
|
||||
@@ -729,34 +678,11 @@ i.open-network-button {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.server-info-right {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.action {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.lang-menu {
|
||||
font-size: 13px;
|
||||
font-weight: bold;
|
||||
background: rgb(78 191 172 / 100%);
|
||||
width: 100px;
|
||||
height: 38px;
|
||||
color: rgb(255 255 255 / 100%);
|
||||
border-color: rgb(0 0 0 / 0%);
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-class-pattern */
|
||||
.tagify__input {
|
||||
min-width: 130px !important;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line selector-class-pattern */
|
||||
.tagify__input::before {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 27 KiB |
@@ -1,67 +0,0 @@
|
||||
import {ipcRenderer} from "./typed-ipc-renderer.js";
|
||||
|
||||
// This helper is exposed via electron_bridge for use in the social
|
||||
// login flow.
|
||||
//
|
||||
// It consists of a key and a promised token. The in-app page sends
|
||||
// the key to the server, and opens the user’s browser to a page where
|
||||
// they can log in and get a token encrypted to that key. When the
|
||||
// user copies the encrypted token from their browser to the
|
||||
// clipboard, we decrypt it and resolve the promise. The in-app page
|
||||
// then uses the decrypted token to log the user in within the app.
|
||||
//
|
||||
// The encryption is authenticated (AES-GCM) to guarantee that we
|
||||
// don’t leak anything from the user’s clipboard other than the token
|
||||
// intended for us.
|
||||
|
||||
export type ClipboardDecrypter = {
|
||||
version: number;
|
||||
key: Uint8Array;
|
||||
pasted: Promise<string>;
|
||||
};
|
||||
|
||||
export class ClipboardDecrypterImpl implements ClipboardDecrypter {
|
||||
version: number;
|
||||
key: Uint8Array;
|
||||
pasted: Promise<string>;
|
||||
|
||||
constructor(_: number) {
|
||||
// At this time, the only version is 1.
|
||||
this.version = 1;
|
||||
const {key, sig} = ipcRenderer.sendSync("new-clipboard-key");
|
||||
this.key = key;
|
||||
this.pasted = new Promise((resolve) => {
|
||||
let interval: NodeJS.Timeout | null = null;
|
||||
const startPolling = () => {
|
||||
if (interval === null) {
|
||||
interval = setInterval(poll, 1000);
|
||||
}
|
||||
|
||||
void poll();
|
||||
};
|
||||
|
||||
const stopPolling = () => {
|
||||
if (interval !== null) {
|
||||
clearInterval(interval);
|
||||
interval = null;
|
||||
}
|
||||
};
|
||||
|
||||
const poll = async () => {
|
||||
const plaintext = await ipcRenderer.invoke("poll-clipboard", key, sig);
|
||||
if (plaintext === undefined) return;
|
||||
|
||||
window.removeEventListener("focus", startPolling);
|
||||
window.removeEventListener("blur", stopPolling);
|
||||
stopPolling();
|
||||
resolve(plaintext);
|
||||
};
|
||||
|
||||
window.addEventListener("focus", startPolling);
|
||||
window.addEventListener("blur", stopPolling);
|
||||
if (document.hasFocus()) {
|
||||
startPolling();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
11
app/renderer/js/components/base.js
Normal file
11
app/renderer/js/components/base.js
Normal file
@@ -0,0 +1,11 @@
|
||||
'use strict';
|
||||
|
||||
class BaseComponent {
|
||||
generateNodeFromTemplate(template) {
|
||||
const wrapper = document.createElement('div');
|
||||
wrapper.innerHTML = template;
|
||||
return wrapper.firstElementChild;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = BaseComponent;
|
||||
@@ -1,12 +0,0 @@
|
||||
import type {Html} from "../../../common/html.js";
|
||||
|
||||
export function generateNodeFromHtml(html: Html): Element {
|
||||
const wrapper = document.createElement("div");
|
||||
wrapper.innerHTML = html.html;
|
||||
|
||||
if (wrapper.firstElementChild === null) {
|
||||
throw new Error("No element found in HTML");
|
||||
}
|
||||
|
||||
return wrapper.firstElementChild;
|
||||
}
|
||||
@@ -1,149 +0,0 @@
|
||||
import {clipboard} from "electron/common";
|
||||
import type {WebContents} from "electron/main";
|
||||
import type {
|
||||
ContextMenuParams,
|
||||
MenuItemConstructorOptions,
|
||||
} from "electron/renderer";
|
||||
import process from "node:process";
|
||||
|
||||
import {Menu} from "@electron/remote";
|
||||
|
||||
import * as t from "../../../common/translation-util.js";
|
||||
|
||||
export const contextMenu = (
|
||||
webContents: WebContents,
|
||||
event: Event,
|
||||
props: ContextMenuParams,
|
||||
) => {
|
||||
const isText = props.selectionText !== "";
|
||||
const isLink = props.linkURL !== "";
|
||||
const linkUrl = isLink ? new URL(props.linkURL) : undefined;
|
||||
|
||||
const makeSuggestion = (suggestion: string) => ({
|
||||
label: suggestion,
|
||||
visible: true,
|
||||
async click() {
|
||||
await webContents.insertText(suggestion);
|
||||
},
|
||||
});
|
||||
|
||||
let menuTemplate: MenuItemConstructorOptions[] = [
|
||||
{
|
||||
label: t.__("Add to Dictionary"),
|
||||
visible: props.isEditable && isText && props.misspelledWord.length > 0,
|
||||
click(_item) {
|
||||
webContents.session.addWordToSpellCheckerDictionary(
|
||||
props.misspelledWord,
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
visible: props.isEditable && isText && props.misspelledWord.length > 0,
|
||||
},
|
||||
{
|
||||
label: `${t.__("Look Up")} "${props.selectionText}"`,
|
||||
visible: process.platform === "darwin" && isText,
|
||||
click(_item) {
|
||||
webContents.showDefinitionForSelection();
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
visible: process.platform === "darwin" && isText,
|
||||
},
|
||||
{
|
||||
label: t.__("Cut"),
|
||||
visible: isText,
|
||||
enabled: props.isEditable,
|
||||
accelerator: "CommandOrControl+X",
|
||||
click(_item) {
|
||||
webContents.cut();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Copy"),
|
||||
accelerator: "CommandOrControl+C",
|
||||
enabled: props.editFlags.canCopy,
|
||||
click(_item) {
|
||||
webContents.copy();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Paste"), // Bug: Paste replaces text
|
||||
accelerator: "CommandOrControl+V",
|
||||
enabled: props.isEditable,
|
||||
click() {
|
||||
webContents.paste();
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
},
|
||||
{
|
||||
label:
|
||||
linkUrl?.protocol === "mailto:"
|
||||
? t.__("Copy Email Address")
|
||||
: t.__("Copy Link"),
|
||||
visible: isLink,
|
||||
click(_item) {
|
||||
clipboard.write({
|
||||
bookmark: props.linkText,
|
||||
text:
|
||||
linkUrl?.protocol === "mailto:" ? linkUrl.pathname : props.linkURL,
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Copy Image"),
|
||||
visible: props.mediaType === "image",
|
||||
click(_item) {
|
||||
webContents.copyImageAt(props.x, props.y);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: t.__("Copy Image URL"),
|
||||
visible: props.mediaType === "image",
|
||||
click(_item) {
|
||||
clipboard.write({
|
||||
bookmark: props.srcURL,
|
||||
text: props.srcURL,
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "separator",
|
||||
visible: isLink || props.mediaType === "image",
|
||||
},
|
||||
{
|
||||
label: t.__("Services"),
|
||||
visible: process.platform === "darwin",
|
||||
role: "services",
|
||||
},
|
||||
];
|
||||
|
||||
if (props.misspelledWord) {
|
||||
if (props.dictionarySuggestions.length > 0) {
|
||||
const suggestions: MenuItemConstructorOptions[] =
|
||||
props.dictionarySuggestions.map((suggestion: string) =>
|
||||
makeSuggestion(suggestion),
|
||||
);
|
||||
menuTemplate = [...suggestions, ...menuTemplate];
|
||||
} else {
|
||||
menuTemplate.unshift({
|
||||
label: t.__("No Suggestion Found"),
|
||||
enabled: false,
|
||||
});
|
||||
}
|
||||
}
|
||||
// Hide the invisible separators on Linux and Windows
|
||||
// Electron has a bug which ignores visible: false parameter for separator menuitems. So we remove them here.
|
||||
// https://github.com/electron/electron/issues/5869
|
||||
// https://github.com/electron/electron/issues/6906
|
||||
|
||||
const filteredMenuTemplate = menuTemplate.filter(
|
||||
(menuItem) => menuItem.visible ?? true,
|
||||
);
|
||||
const menu = Menu.buildFromTemplate(filteredMenuTemplate);
|
||||
menu.popup();
|
||||
};
|
||||
44
app/renderer/js/components/functional-tab.js
Normal file
44
app/renderer/js/components/functional-tab.js
Normal file
@@ -0,0 +1,44 @@
|
||||
'use strict';
|
||||
|
||||
const Tab = require(__dirname + '/../components/tab.js');
|
||||
|
||||
class FunctionalTab extends Tab {
|
||||
template() {
|
||||
return `<div class="tab functional-tab" data-tab-id="${this.props.tabIndex}">
|
||||
<div class="server-tab-badge close-button">
|
||||
<i class="material-icons">close</i>
|
||||
</div>
|
||||
<div class="server-tab">
|
||||
<i class="material-icons">${this.props.materialIcon}</i>
|
||||
</div>
|
||||
</div>`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$el = this.generateNodeFromTemplate(this.template());
|
||||
if (this.props.name !== 'Settings') {
|
||||
this.props.$root.appendChild(this.$el);
|
||||
this.$closeButton = this.$el.getElementsByClassName('server-tab-badge')[0];
|
||||
this.registerListeners();
|
||||
}
|
||||
}
|
||||
|
||||
registerListeners() {
|
||||
super.registerListeners();
|
||||
|
||||
this.$el.addEventListener('mouseover', () => {
|
||||
this.$closeButton.classList.add('active');
|
||||
});
|
||||
|
||||
this.$el.addEventListener('mouseout', () => {
|
||||
this.$closeButton.classList.remove('active');
|
||||
});
|
||||
|
||||
this.$closeButton.addEventListener('click', e => {
|
||||
this.props.onDestroy();
|
||||
e.stopPropagation();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = FunctionalTab;
|
||||
@@ -1,73 +0,0 @@
|
||||
import type {Html} from "../../../common/html.js";
|
||||
import {html} from "../../../common/html.js";
|
||||
|
||||
import {generateNodeFromHtml} from "./base.js";
|
||||
import type {TabProps} from "./tab.js";
|
||||
import Tab from "./tab.js";
|
||||
|
||||
export type FunctionalTabProps = {
|
||||
$view: Element;
|
||||
} & TabProps;
|
||||
|
||||
export default class FunctionalTab extends Tab {
|
||||
$view: Element;
|
||||
$el: Element;
|
||||
$closeButton?: Element;
|
||||
|
||||
constructor({$view, ...props}: FunctionalTabProps) {
|
||||
super(props);
|
||||
|
||||
this.$view = $view;
|
||||
this.$el = generateNodeFromHtml(this.templateHtml());
|
||||
if (this.props.name !== "Settings") {
|
||||
this.props.$root.append(this.$el);
|
||||
this.$closeButton = this.$el.querySelector(".server-tab-badge")!;
|
||||
this.registerListeners();
|
||||
}
|
||||
}
|
||||
|
||||
override async activate(): Promise<void> {
|
||||
await super.activate();
|
||||
this.$view.classList.add("active");
|
||||
}
|
||||
|
||||
override async deactivate(): Promise<void> {
|
||||
await super.deactivate();
|
||||
this.$view.classList.remove("active");
|
||||
}
|
||||
|
||||
override async destroy(): Promise<void> {
|
||||
await super.destroy();
|
||||
this.$view.remove();
|
||||
}
|
||||
|
||||
templateHtml(): Html {
|
||||
return html`
|
||||
<div class="tab functional-tab" data-tab-id="${this.props.tabIndex}">
|
||||
<div class="server-tab-badge close-button">
|
||||
<i class="material-icons">close</i>
|
||||
</div>
|
||||
<div class="server-tab">
|
||||
<i class="material-icons">${this.props.materialIcon}</i>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
override registerListeners(): void {
|
||||
super.registerListeners();
|
||||
|
||||
this.$el.addEventListener("mouseover", () => {
|
||||
this.$closeButton?.classList.add("active");
|
||||
});
|
||||
|
||||
this.$el.addEventListener("mouseout", () => {
|
||||
this.$closeButton?.classList.remove("active");
|
||||
});
|
||||
|
||||
this.$closeButton?.addEventListener("click", (event: Event) => {
|
||||
this.props.onDestroy?.();
|
||||
event.stopPropagation();
|
||||
});
|
||||
}
|
||||
}
|
||||
80
app/renderer/js/components/handle-external-link.js
Normal file
80
app/renderer/js/components/handle-external-link.js
Normal file
@@ -0,0 +1,80 @@
|
||||
const { ipcRenderer } = require('electron');
|
||||
const { shell, app } = require('electron').remote;
|
||||
const LinkUtil = require('../utils/link-util');
|
||||
const DomainUtil = require('../utils/domain-util');
|
||||
const ConfigUtil = require('../utils/config-util');
|
||||
|
||||
const dingSound = new Audio('../resources/sounds/ding.ogg');
|
||||
|
||||
function handleExternalLink(event) {
|
||||
const { url } = event;
|
||||
const domainPrefix = DomainUtil.getDomain(this.props.index).url;
|
||||
const downloadPath = ConfigUtil.getConfigItem('downloadsPath', `${app.getPath('downloads')}`);
|
||||
const shouldShowInFolder = ConfigUtil.getConfigItem('showDownloadFolder', false);
|
||||
|
||||
// Whitelist URLs which are allowed to be opened in the app
|
||||
const {
|
||||
isInternalUrl: isWhiteListURL,
|
||||
isUploadsUrl: isUploadsURL
|
||||
} = LinkUtil.isInternal(domainPrefix, url);
|
||||
|
||||
if (isWhiteListURL) {
|
||||
event.preventDefault();
|
||||
|
||||
// Code to show pdf in a new BrowserWindow (currently commented out due to bug-upstream)
|
||||
// Show pdf attachments in a new window
|
||||
// if (LinkUtil.isPDF(url) && isUploadsURL) {
|
||||
// ipcRenderer.send('pdf-view', url);
|
||||
// return;
|
||||
// }
|
||||
|
||||
// download txt, mp3, mp4 etc.. by using downloadURL in the
|
||||
// main process which allows the user to save the files to their desktop
|
||||
// and not trigger webview reload while image in webview will
|
||||
// do nothing and will not save it
|
||||
|
||||
// Code to show pdf in a new BrowserWindow (currently commented out due to bug-upstream)
|
||||
// if (!LinkUtil.isImage(url) && !LinkUtil.isPDF(url) && isUploadsURL) {
|
||||
if (!LinkUtil.isImage(url) && isUploadsURL) {
|
||||
ipcRenderer.send('downloadFile', url, downloadPath);
|
||||
ipcRenderer.once('downloadFileCompleted', (event, filePath, fileName) => {
|
||||
const downloadNotification = new Notification('Download Complete', {
|
||||
body: shouldShowInFolder ? `Click to show ${fileName} in folder` : `Click to open ${fileName}`,
|
||||
silent: true // We'll play our own sound - ding.ogg
|
||||
});
|
||||
|
||||
// Play sound to indicate download complete
|
||||
if (!ConfigUtil.getConfigItem('silent')) {
|
||||
dingSound.play();
|
||||
}
|
||||
|
||||
downloadNotification.onclick = () => {
|
||||
if (shouldShowInFolder) {
|
||||
// Reveal file in download folder
|
||||
shell.showItemInFolder(filePath);
|
||||
} else {
|
||||
// Open file in the default native app
|
||||
shell.openItem(filePath);
|
||||
}
|
||||
};
|
||||
ipcRenderer.removeAllListeners('downloadFileFailed');
|
||||
});
|
||||
|
||||
ipcRenderer.once('downloadFileFailed', () => {
|
||||
// Automatic download failed, so show save dialog prompt and download
|
||||
// through webview
|
||||
this.$el.downloadURL(url);
|
||||
ipcRenderer.removeAllListeners('downloadFileCompleted');
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// open internal urls inside the current webview.
|
||||
this.$el.loadURL(url);
|
||||
} else {
|
||||
event.preventDefault();
|
||||
shell.openExternal(url);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = handleExternalLink;
|
||||
60
app/renderer/js/components/server-tab.js
Normal file
60
app/renderer/js/components/server-tab.js
Normal file
@@ -0,0 +1,60 @@
|
||||
'use strict';
|
||||
|
||||
const Tab = require(__dirname + '/../components/tab.js');
|
||||
const SystemUtil = require(__dirname + '/../utils/system-util.js');
|
||||
|
||||
const {ipcRenderer} = require('electron');
|
||||
|
||||
class ServerTab extends Tab {
|
||||
template() {
|
||||
return `<div class="tab" data-tab-id="${this.props.tabIndex}">
|
||||
<div class="server-tooltip" style="display:none">${this.props.name}</div>
|
||||
<div class="server-tab-badge"></div>
|
||||
<div class="server-tab">
|
||||
<img class="server-icons" src='${this.props.icon}'/>
|
||||
</div>
|
||||
<div class="server-tab-shortcut">${this.generateShortcutText()}</div>
|
||||
</div>`;
|
||||
}
|
||||
|
||||
init() {
|
||||
super.init();
|
||||
|
||||
this.$badge = this.$el.getElementsByClassName('server-tab-badge')[0];
|
||||
}
|
||||
|
||||
updateBadge(count) {
|
||||
if (count > 0) {
|
||||
const formattedCount = count > 999 ? '1K+' : count;
|
||||
|
||||
this.$badge.innerHTML = formattedCount;
|
||||
this.$badge.classList.add('active');
|
||||
} else {
|
||||
this.$badge.classList.remove('active');
|
||||
}
|
||||
}
|
||||
|
||||
generateShortcutText() {
|
||||
// Only provide shortcuts for server [0..10]
|
||||
if (this.props.index >= 10) {
|
||||
return '';
|
||||
}
|
||||
|
||||
const shownIndex = this.props.index + 1;
|
||||
|
||||
let shortcutText = '';
|
||||
|
||||
if (SystemUtil.getOS() === 'Mac') {
|
||||
shortcutText = `⌘ ${shownIndex}`;
|
||||
} else {
|
||||
shortcutText = `Ctrl+${shownIndex}`;
|
||||
}
|
||||
|
||||
// Array index == Shown index - 1
|
||||
ipcRenderer.send('switch-server-tab', shownIndex - 1);
|
||||
|
||||
return shortcutText;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = ServerTab;
|
||||
@@ -1,81 +0,0 @@
|
||||
import process from "node:process";
|
||||
|
||||
import type {Html} from "../../../common/html.js";
|
||||
import {html} from "../../../common/html.js";
|
||||
import {ipcRenderer} from "../typed-ipc-renderer.js";
|
||||
|
||||
import {generateNodeFromHtml} from "./base.js";
|
||||
import type {TabProps} from "./tab.js";
|
||||
import Tab from "./tab.js";
|
||||
import type WebView from "./webview.js";
|
||||
|
||||
export type ServerTabProps = {
|
||||
webview: Promise<WebView>;
|
||||
} & TabProps;
|
||||
|
||||
export default class ServerTab extends Tab {
|
||||
webview: Promise<WebView>;
|
||||
$el: Element;
|
||||
$badge: Element;
|
||||
|
||||
constructor({webview, ...props}: ServerTabProps) {
|
||||
super(props);
|
||||
|
||||
this.webview = webview;
|
||||
this.$el = generateNodeFromHtml(this.templateHtml());
|
||||
this.props.$root.append(this.$el);
|
||||
this.registerListeners();
|
||||
this.$badge = this.$el.querySelector(".server-tab-badge")!;
|
||||
}
|
||||
|
||||
override async activate(): Promise<void> {
|
||||
await super.activate();
|
||||
(await this.webview).load();
|
||||
}
|
||||
|
||||
override async deactivate(): Promise<void> {
|
||||
await super.deactivate();
|
||||
(await this.webview).hide();
|
||||
}
|
||||
|
||||
override async destroy(): Promise<void> {
|
||||
await super.destroy();
|
||||
(await this.webview).$el.remove();
|
||||
}
|
||||
|
||||
templateHtml(): Html {
|
||||
return html`
|
||||
<div class="tab" data-tab-id="${this.props.tabIndex}">
|
||||
<div class="server-tooltip" style="display:none">
|
||||
${this.props.name}
|
||||
</div>
|
||||
<div class="server-tab-badge"></div>
|
||||
<div class="server-tab">
|
||||
<img class="server-icons" src="${this.props.icon}" />
|
||||
</div>
|
||||
<div class="server-tab-shortcut">${this.generateShortcutText()}</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
updateBadge(count: number): void {
|
||||
this.$badge.textContent = count > 999 ? "1K+" : count.toString();
|
||||
this.$badge.classList.toggle("active", count > 0);
|
||||
}
|
||||
|
||||
generateShortcutText(): string {
|
||||
// Only provide shortcuts for server [0..9]
|
||||
if (this.props.index >= 9) {
|
||||
return "";
|
||||
}
|
||||
|
||||
const shownIndex = this.props.index + 1;
|
||||
|
||||
// Array index == Shown index - 1
|
||||
ipcRenderer.send("switch-server-tab", shownIndex - 1);
|
||||
|
||||
return process.platform === "darwin"
|
||||
? `⌘${shownIndex}`
|
||||
: `Ctrl+${shownIndex}`;
|
||||
}
|
||||
}
|
||||
48
app/renderer/js/components/tab.js
Normal file
48
app/renderer/js/components/tab.js
Normal file
@@ -0,0 +1,48 @@
|
||||
'use strict';
|
||||
|
||||
const BaseComponent = require(__dirname + '/../components/base.js');
|
||||
|
||||
class Tab extends BaseComponent {
|
||||
constructor(props) {
|
||||
super();
|
||||
|
||||
this.props = props;
|
||||
this.webview = this.props.webview;
|
||||
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$el = this.generateNodeFromTemplate(this.template());
|
||||
this.props.$root.appendChild(this.$el);
|
||||
|
||||
this.registerListeners();
|
||||
}
|
||||
|
||||
registerListeners() {
|
||||
this.$el.addEventListener('click', this.props.onClick);
|
||||
this.$el.addEventListener('mouseover', this.props.onHover);
|
||||
this.$el.addEventListener('mouseout', this.props.onHoverOut);
|
||||
}
|
||||
|
||||
isLoading() {
|
||||
return this.webview.isLoading;
|
||||
}
|
||||
|
||||
activate() {
|
||||
this.$el.classList.add('active');
|
||||
this.webview.load();
|
||||
}
|
||||
|
||||
deactivate() {
|
||||
this.$el.classList.remove('active');
|
||||
this.webview.hide();
|
||||
}
|
||||
|
||||
destroy() {
|
||||
this.$el.parentNode.removeChild(this.$el);
|
||||
this.webview.$el.parentNode.removeChild(this.webview.$el);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = Tab;
|
||||
@@ -1,45 +0,0 @@
|
||||
import type {TabRole} from "../../../common/types.js";
|
||||
|
||||
export type TabProps = {
|
||||
role: TabRole;
|
||||
icon?: string;
|
||||
name: string;
|
||||
$root: Element;
|
||||
onClick: () => void;
|
||||
index: number;
|
||||
tabIndex: number;
|
||||
onHover?: () => void;
|
||||
onHoverOut?: () => void;
|
||||
materialIcon?: string;
|
||||
onDestroy?: () => void;
|
||||
};
|
||||
|
||||
export default abstract class Tab {
|
||||
abstract $el: Element;
|
||||
|
||||
constructor(readonly props: TabProps) {}
|
||||
|
||||
registerListeners(): void {
|
||||
this.$el.addEventListener("click", this.props.onClick);
|
||||
|
||||
if (this.props.onHover !== undefined) {
|
||||
this.$el.addEventListener("mouseover", this.props.onHover);
|
||||
}
|
||||
|
||||
if (this.props.onHoverOut !== undefined) {
|
||||
this.$el.addEventListener("mouseout", this.props.onHoverOut);
|
||||
}
|
||||
}
|
||||
|
||||
async activate(): Promise<void> {
|
||||
this.$el.classList.add("active");
|
||||
}
|
||||
|
||||
async deactivate(): Promise<void> {
|
||||
this.$el.classList.remove("active");
|
||||
}
|
||||
|
||||
async destroy(): Promise<void> {
|
||||
this.$el.remove();
|
||||
}
|
||||
}
|
||||
260
app/renderer/js/components/webview.js
Normal file
260
app/renderer/js/components/webview.js
Normal file
@@ -0,0 +1,260 @@
|
||||
'use strict';
|
||||
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
|
||||
const ConfigUtil = require(__dirname + '/../utils/config-util.js');
|
||||
const SystemUtil = require(__dirname + '/../utils/system-util.js');
|
||||
const { app, dialog } = require('electron').remote;
|
||||
|
||||
const BaseComponent = require(__dirname + '/../components/base.js');
|
||||
const handleExternalLink = require(__dirname + '/../components/handle-external-link.js');
|
||||
|
||||
const shouldSilentWebview = ConfigUtil.getConfigItem('silent');
|
||||
class WebView extends BaseComponent {
|
||||
constructor(props) {
|
||||
super();
|
||||
|
||||
this.props = props;
|
||||
|
||||
this.zoomFactor = 1.0;
|
||||
this.loading = true;
|
||||
this.badgeCount = 0;
|
||||
this.customCSS = ConfigUtil.getConfigItem('customCSS');
|
||||
this.$webviewsContainer = document.querySelector('#webviews-container').classList;
|
||||
}
|
||||
|
||||
template() {
|
||||
return `<webview
|
||||
class="disabled"
|
||||
data-tab-id="${this.props.tabIndex}"
|
||||
src="${this.props.url}"
|
||||
${this.props.nodeIntegration ? 'nodeIntegration' : ''}
|
||||
disablewebsecurity
|
||||
${this.props.preload ? 'preload="js/preload.js"' : ''}
|
||||
partition="persist:webviewsession"
|
||||
name="${this.props.name}"
|
||||
webpreferences="allowRunningInsecureContent, javascript=yes">
|
||||
</webview>`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$el = this.generateNodeFromTemplate(this.template());
|
||||
this.props.$root.appendChild(this.$el);
|
||||
|
||||
this.registerListeners();
|
||||
}
|
||||
|
||||
registerListeners() {
|
||||
this.$el.addEventListener('new-window', event => {
|
||||
handleExternalLink.call(this, event);
|
||||
});
|
||||
|
||||
if (shouldSilentWebview) {
|
||||
this.$el.addEventListener('dom-ready', () => {
|
||||
this.$el.setAudioMuted(true);
|
||||
});
|
||||
}
|
||||
|
||||
this.$el.addEventListener('page-title-updated', event => {
|
||||
const { title } = event;
|
||||
this.badgeCount = this.getBadgeCount(title);
|
||||
this.props.onTitleChange();
|
||||
});
|
||||
|
||||
this.$el.addEventListener('did-navigate-in-page', event => {
|
||||
const isSettingPage = event.url.includes('renderer/preference.html');
|
||||
if (isSettingPage) {
|
||||
return;
|
||||
}
|
||||
this.canGoBackButton();
|
||||
});
|
||||
|
||||
this.$el.addEventListener('did-navigate', () => {
|
||||
this.canGoBackButton();
|
||||
});
|
||||
|
||||
this.$el.addEventListener('page-favicon-updated', event => {
|
||||
const { favicons } = event;
|
||||
|
||||
// This returns a string of favicons URL. If there is a PM counts in unread messages then the URL would be like
|
||||
// https://chat.zulip.org/static/images/favicon/favicon-pms.png
|
||||
if (favicons[0].indexOf('favicon-pms') > 0 && process.platform === 'darwin') {
|
||||
// This api is only supported on macOS
|
||||
app.dock.setBadge('●');
|
||||
// bounce the dock
|
||||
if (ConfigUtil.getConfigItem('dockBouncing')) {
|
||||
app.dock.bounce();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.$el.addEventListener('dom-ready', () => {
|
||||
if (this.props.role === 'server') {
|
||||
this.$el.classList.add('onload');
|
||||
}
|
||||
this.loading = false;
|
||||
this.show();
|
||||
|
||||
// Refocus text boxes after reload
|
||||
// Remove when upstream issue https://github.com/electron/electron/issues/14474 is fixed
|
||||
this.$el.blur();
|
||||
this.$el.focus();
|
||||
});
|
||||
|
||||
this.$el.addEventListener('did-fail-load', event => {
|
||||
const { errorDescription } = event;
|
||||
const hasConnectivityErr = (SystemUtil.connectivityERR.indexOf(errorDescription) >= 0);
|
||||
if (hasConnectivityErr) {
|
||||
console.error('error', errorDescription);
|
||||
this.props.onNetworkError();
|
||||
}
|
||||
});
|
||||
|
||||
this.$el.addEventListener('did-start-loading', () => {
|
||||
let userAgent = SystemUtil.getUserAgent();
|
||||
if (!userAgent) {
|
||||
SystemUtil.setUserAgent(this.$el.getUserAgent());
|
||||
userAgent = SystemUtil.getUserAgent();
|
||||
}
|
||||
this.$el.setUserAgent(userAgent);
|
||||
});
|
||||
}
|
||||
|
||||
getBadgeCount(title) {
|
||||
const messageCountInTitle = (/\(([0-9]+)\)/).exec(title);
|
||||
return messageCountInTitle ? Number(messageCountInTitle[1]) : 0;
|
||||
}
|
||||
|
||||
show() {
|
||||
// Do not show WebView if another tab was selected and this tab should be in background.
|
||||
if (!this.props.isActive()) {
|
||||
return;
|
||||
}
|
||||
|
||||
// To show or hide the loading indicator in the the active tab
|
||||
if (this.loading) {
|
||||
this.$webviewsContainer.remove('loaded');
|
||||
} else {
|
||||
this.$webviewsContainer.add('loaded');
|
||||
}
|
||||
|
||||
this.$el.classList.remove('disabled');
|
||||
this.$el.classList.add('active');
|
||||
setTimeout(() => {
|
||||
if (this.props.role === 'server') {
|
||||
this.$el.classList.remove('onload');
|
||||
}
|
||||
}, 1000);
|
||||
this.focus();
|
||||
this.props.onTitleChange();
|
||||
// Injecting preload css in webview to override some css rules
|
||||
this.$el.insertCSS(fs.readFileSync(path.join(__dirname, '/../../css/preload.css'), 'utf8'));
|
||||
|
||||
// get customCSS again from config util to avoid warning user again
|
||||
this.customCSS = ConfigUtil.getConfigItem('customCSS');
|
||||
if (this.customCSS) {
|
||||
if (!fs.existsSync(this.customCSS)) {
|
||||
this.customCSS = null;
|
||||
ConfigUtil.setConfigItem('customCSS', null);
|
||||
|
||||
const errMsg = 'The custom css previously set is deleted!';
|
||||
dialog.showErrorBox('custom css file deleted!', errMsg);
|
||||
return;
|
||||
}
|
||||
|
||||
this.$el.insertCSS(fs.readFileSync(path.resolve(__dirname, this.customCSS), 'utf8'));
|
||||
}
|
||||
}
|
||||
|
||||
focus() {
|
||||
// focus Webview and it's contents when Window regain focus.
|
||||
const webContents = this.$el.getWebContents();
|
||||
// HACK: webContents.isFocused() seems to be true even without the element
|
||||
// being in focus. So, we check against `document.activeElement`.
|
||||
if (webContents && this.$el !== document.activeElement) {
|
||||
// HACK: Looks like blur needs to be called on the previously focused
|
||||
// element to transfer focus correctly, in Electron v3.0.10
|
||||
// See https://github.com/electron/electron/issues/15718
|
||||
document.activeElement.blur();
|
||||
this.$el.focus();
|
||||
webContents.focus();
|
||||
}
|
||||
}
|
||||
|
||||
hide() {
|
||||
this.$el.classList.add('disabled');
|
||||
this.$el.classList.remove('active');
|
||||
}
|
||||
|
||||
load() {
|
||||
if (this.$el) {
|
||||
this.show();
|
||||
} else {
|
||||
this.init();
|
||||
}
|
||||
}
|
||||
|
||||
zoomIn() {
|
||||
this.zoomFactor += 0.1;
|
||||
this.$el.setZoomFactor(this.zoomFactor);
|
||||
}
|
||||
|
||||
zoomOut() {
|
||||
this.zoomFactor -= 0.1;
|
||||
this.$el.setZoomFactor(this.zoomFactor);
|
||||
}
|
||||
|
||||
zoomActualSize() {
|
||||
this.zoomFactor = 1.0;
|
||||
this.$el.setZoomFactor(this.zoomFactor);
|
||||
}
|
||||
|
||||
logOut() {
|
||||
this.$el.executeJavaScript('logout()');
|
||||
}
|
||||
|
||||
showShortcut() {
|
||||
this.$el.executeJavaScript('shortcut()');
|
||||
}
|
||||
|
||||
openDevTools() {
|
||||
this.$el.openDevTools();
|
||||
}
|
||||
|
||||
back() {
|
||||
if (this.$el.canGoBack()) {
|
||||
this.$el.goBack();
|
||||
this.focus();
|
||||
}
|
||||
}
|
||||
|
||||
canGoBackButton() {
|
||||
const $backButton = document.querySelector('#actions-container #back-action');
|
||||
if (this.$el.canGoBack()) {
|
||||
$backButton.classList.remove('disable');
|
||||
} else {
|
||||
$backButton.classList.add('disable');
|
||||
}
|
||||
}
|
||||
|
||||
forward() {
|
||||
if (this.$el.canGoForward()) {
|
||||
this.$el.goForward();
|
||||
}
|
||||
}
|
||||
|
||||
reload() {
|
||||
this.hide();
|
||||
// Shows the loading indicator till the webview is reloaded
|
||||
this.$webviewsContainer.remove('loaded');
|
||||
this.loading = true;
|
||||
this.$el.reload();
|
||||
}
|
||||
|
||||
send(...param) {
|
||||
this.$el.send(...param);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = WebView;
|
||||
@@ -1,307 +0,0 @@
|
||||
import type {WebContents} from "electron/main";
|
||||
import fs from "node:fs";
|
||||
import process from "node:process";
|
||||
|
||||
import * as remote from "@electron/remote";
|
||||
import {app, dialog} from "@electron/remote";
|
||||
|
||||
import * as ConfigUtil from "../../../common/config-util.js";
|
||||
import type {Html} from "../../../common/html.js";
|
||||
import {html} from "../../../common/html.js";
|
||||
import type {RendererMessage} from "../../../common/typed-ipc.js";
|
||||
import type {TabRole} from "../../../common/types.js";
|
||||
import preloadCss from "../../css/preload.css?raw"; // eslint-disable-line n/file-extension-in-import
|
||||
import {ipcRenderer} from "../typed-ipc-renderer.js";
|
||||
import * as SystemUtil from "../utils/system-util.js";
|
||||
|
||||
import {generateNodeFromHtml} from "./base.js";
|
||||
import {contextMenu} from "./context-menu.js";
|
||||
|
||||
const shouldSilentWebview = ConfigUtil.getConfigItem("silent", false);
|
||||
|
||||
type WebViewProps = {
|
||||
$root: Element;
|
||||
rootWebContents: WebContents;
|
||||
index: number;
|
||||
tabIndex: number;
|
||||
url: string;
|
||||
role: TabRole;
|
||||
isActive: () => boolean;
|
||||
switchLoading: (loading: boolean, url: string) => void;
|
||||
onNetworkError: (index: number) => void;
|
||||
preload?: string;
|
||||
onTitleChange: () => void;
|
||||
hasPermission?: (origin: string, permission: string) => boolean;
|
||||
};
|
||||
|
||||
export default class WebView {
|
||||
static templateHtml(props: WebViewProps): Html {
|
||||
return html`
|
||||
<webview
|
||||
data-tab-id="${props.tabIndex}"
|
||||
src="${props.url}"
|
||||
${props.preload === undefined
|
||||
? html``
|
||||
: html`preload="${props.preload}"`}
|
||||
partition="persist:webviewsession"
|
||||
allowpopups
|
||||
>
|
||||
</webview>
|
||||
`;
|
||||
}
|
||||
|
||||
static async create(props: WebViewProps): Promise<WebView> {
|
||||
const $element = generateNodeFromHtml(
|
||||
WebView.templateHtml(props),
|
||||
) as HTMLElement;
|
||||
props.$root.append($element);
|
||||
|
||||
await new Promise<void>((resolve) => {
|
||||
$element.addEventListener(
|
||||
"did-attach",
|
||||
() => {
|
||||
resolve();
|
||||
},
|
||||
true,
|
||||
);
|
||||
});
|
||||
|
||||
// Work around https://github.com/electron/electron/issues/26904
|
||||
function getWebContentsIdFunction(
|
||||
this: undefined,
|
||||
selector: string,
|
||||
): number {
|
||||
return document
|
||||
.querySelector<Electron.WebviewTag>(selector)!
|
||||
.getWebContentsId();
|
||||
}
|
||||
|
||||
const selector = `webview[data-tab-id="${CSS.escape(
|
||||
`${props.tabIndex}`,
|
||||
)}"]`;
|
||||
const webContentsId: unknown =
|
||||
await props.rootWebContents.executeJavaScript(
|
||||
`(${getWebContentsIdFunction.toString()})(${JSON.stringify(selector)})`,
|
||||
);
|
||||
if (typeof webContentsId !== "number") {
|
||||
throw new TypeError("Failed to get WebContents ID");
|
||||
}
|
||||
|
||||
return new WebView(props, $element, webContentsId);
|
||||
}
|
||||
|
||||
zoomFactor: number;
|
||||
badgeCount: number;
|
||||
loading: boolean;
|
||||
customCss: string | false | null;
|
||||
$webviewsContainer: DOMTokenList;
|
||||
$el: HTMLElement;
|
||||
webContentsId: number;
|
||||
|
||||
private constructor(
|
||||
readonly props: WebViewProps,
|
||||
$element: HTMLElement,
|
||||
webContentsId: number,
|
||||
) {
|
||||
this.zoomFactor = 1;
|
||||
this.loading = true;
|
||||
this.badgeCount = 0;
|
||||
this.customCss = ConfigUtil.getConfigItem("customCSS", null);
|
||||
this.$webviewsContainer = document.querySelector(
|
||||
"#webviews-container",
|
||||
)!.classList;
|
||||
this.$el = $element;
|
||||
this.webContentsId = webContentsId;
|
||||
|
||||
this.registerListeners();
|
||||
}
|
||||
|
||||
getWebContents(): WebContents {
|
||||
return remote.webContents.fromId(this.webContentsId);
|
||||
}
|
||||
|
||||
registerListeners(): void {
|
||||
const webContents = this.getWebContents();
|
||||
|
||||
if (shouldSilentWebview) {
|
||||
webContents.setAudioMuted(true);
|
||||
}
|
||||
|
||||
webContents.on("page-title-updated", (_event, title) => {
|
||||
this.badgeCount = this.getBadgeCount(title);
|
||||
this.props.onTitleChange();
|
||||
});
|
||||
|
||||
this.$el.addEventListener("did-navigate-in-page", () => {
|
||||
this.canGoBackButton();
|
||||
});
|
||||
|
||||
this.$el.addEventListener("did-navigate", () => {
|
||||
this.canGoBackButton();
|
||||
});
|
||||
|
||||
webContents.on("page-favicon-updated", (_event, favicons) => {
|
||||
// This returns a string of favicons URL. If there is a PM counts in unread messages then the URL would be like
|
||||
// https://chat.zulip.org/static/images/favicon/favicon-pms.png
|
||||
if (
|
||||
favicons[0].indexOf("favicon-pms") > 0 &&
|
||||
process.platform === "darwin"
|
||||
) {
|
||||
// This api is only supported on macOS
|
||||
app.dock.setBadge("●");
|
||||
// Bounce the dock
|
||||
if (ConfigUtil.getConfigItem("dockBouncing", true)) {
|
||||
app.dock.bounce();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
webContents.addListener("context-menu", (event, menuParameters) => {
|
||||
contextMenu(webContents, event, menuParameters);
|
||||
});
|
||||
|
||||
this.$el.addEventListener("dom-ready", () => {
|
||||
this.loading = false;
|
||||
this.props.switchLoading(false, this.props.url);
|
||||
this.show();
|
||||
});
|
||||
|
||||
webContents.on("did-fail-load", (_event, _errorCode, errorDescription) => {
|
||||
const hasConnectivityError =
|
||||
SystemUtil.connectivityError.includes(errorDescription);
|
||||
if (hasConnectivityError) {
|
||||
console.error("error", errorDescription);
|
||||
if (!this.props.url.includes("network.html")) {
|
||||
this.props.onNetworkError(this.props.index);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
this.$el.addEventListener("did-start-loading", () => {
|
||||
this.props.switchLoading(true, this.props.url);
|
||||
});
|
||||
|
||||
this.$el.addEventListener("did-stop-loading", () => {
|
||||
this.props.switchLoading(false, this.props.url);
|
||||
});
|
||||
}
|
||||
|
||||
getBadgeCount(title: string): number {
|
||||
const messageCountInTitle = /^\((\d+)\)/.exec(title);
|
||||
return messageCountInTitle ? Number(messageCountInTitle[1]) : 0;
|
||||
}
|
||||
|
||||
showNotificationSettings(): void {
|
||||
this.send("show-notification-settings");
|
||||
}
|
||||
|
||||
show(): void {
|
||||
// Do not show WebView if another tab was selected and this tab should be in background.
|
||||
if (!this.props.isActive()) {
|
||||
return;
|
||||
}
|
||||
|
||||
// To show or hide the loading indicator in the the active tab
|
||||
this.$webviewsContainer.toggle("loaded", !this.loading);
|
||||
|
||||
this.$el.classList.add("active");
|
||||
this.focus();
|
||||
this.props.onTitleChange();
|
||||
// Injecting preload css in webview to override some css rules
|
||||
(async () => this.getWebContents().insertCSS(preloadCss))();
|
||||
|
||||
// Get customCSS again from config util to avoid warning user again
|
||||
const customCss = ConfigUtil.getConfigItem("customCSS", null);
|
||||
this.customCss = customCss;
|
||||
if (customCss) {
|
||||
if (!fs.existsSync(customCss)) {
|
||||
this.customCss = null;
|
||||
ConfigUtil.setConfigItem("customCSS", null);
|
||||
|
||||
const errorMessage = "The custom css previously set is deleted!";
|
||||
dialog.showErrorBox("custom css file deleted!", errorMessage);
|
||||
return;
|
||||
}
|
||||
|
||||
(async () =>
|
||||
this.getWebContents().insertCSS(fs.readFileSync(customCss, "utf8")))();
|
||||
}
|
||||
}
|
||||
|
||||
focus(): void {
|
||||
this.$el.focus();
|
||||
// Work around https://github.com/electron/electron/issues/31918
|
||||
this.$el.shadowRoot?.querySelector("iframe")?.focus();
|
||||
}
|
||||
|
||||
hide(): void {
|
||||
this.$el.classList.remove("active");
|
||||
}
|
||||
|
||||
load(): void {
|
||||
this.show();
|
||||
}
|
||||
|
||||
zoomIn(): void {
|
||||
this.zoomFactor += 0.1;
|
||||
this.getWebContents().setZoomFactor(this.zoomFactor);
|
||||
}
|
||||
|
||||
zoomOut(): void {
|
||||
this.zoomFactor -= 0.1;
|
||||
this.getWebContents().setZoomFactor(this.zoomFactor);
|
||||
}
|
||||
|
||||
zoomActualSize(): void {
|
||||
this.zoomFactor = 1;
|
||||
this.getWebContents().setZoomFactor(this.zoomFactor);
|
||||
}
|
||||
|
||||
logOut(): void {
|
||||
this.send("logout");
|
||||
}
|
||||
|
||||
showKeyboardShortcuts(): void {
|
||||
this.send("show-keyboard-shortcuts");
|
||||
}
|
||||
|
||||
openDevTools(): void {
|
||||
this.getWebContents().openDevTools();
|
||||
}
|
||||
|
||||
back(): void {
|
||||
if (this.getWebContents().canGoBack()) {
|
||||
this.getWebContents().goBack();
|
||||
this.focus();
|
||||
}
|
||||
}
|
||||
|
||||
canGoBackButton(): void {
|
||||
const $backButton = document.querySelector(
|
||||
"#actions-container #back-action",
|
||||
)!;
|
||||
$backButton.classList.toggle("disable", !this.getWebContents().canGoBack());
|
||||
}
|
||||
|
||||
forward(): void {
|
||||
if (this.getWebContents().canGoForward()) {
|
||||
this.getWebContents().goForward();
|
||||
}
|
||||
}
|
||||
|
||||
reload(): void {
|
||||
this.hide();
|
||||
// Shows the loading indicator till the webview is reloaded
|
||||
this.$webviewsContainer.remove("loaded");
|
||||
this.loading = true;
|
||||
this.props.switchLoading(true, this.props.url);
|
||||
this.getWebContents().reload();
|
||||
}
|
||||
|
||||
send<Channel extends keyof RendererMessage>(
|
||||
channel: Channel,
|
||||
...args: Parameters<RendererMessage[Channel]>
|
||||
): void {
|
||||
ipcRenderer.sendTo(this.webContentsId, channel, ...args);
|
||||
}
|
||||
}
|
||||
40
app/renderer/js/electron-bridge.js
Normal file
40
app/renderer/js/electron-bridge.js
Normal file
@@ -0,0 +1,40 @@
|
||||
const events = require('events');
|
||||
const { ipcRenderer } = require('electron');
|
||||
|
||||
// we have and will have some non camelcase stuff
|
||||
// while working with zulip so just turning the rule off
|
||||
// for the whole file.
|
||||
/* eslint-disable camelcase */
|
||||
class ElectronBridge extends events {
|
||||
send_event(...args) {
|
||||
this.emit(...args);
|
||||
}
|
||||
|
||||
on_event(...args) {
|
||||
this.on(...args);
|
||||
}
|
||||
}
|
||||
|
||||
const electron_bridge = new ElectronBridge();
|
||||
|
||||
electron_bridge.on('total_unread_count', (...args) => {
|
||||
ipcRenderer.send('unread-count', ...args);
|
||||
});
|
||||
|
||||
electron_bridge.on('realm_name', realmName => {
|
||||
const serverURL = location.origin;
|
||||
ipcRenderer.send('realm-name-changed', serverURL, realmName);
|
||||
});
|
||||
|
||||
electron_bridge.on('realm_icon_url', iconURL => {
|
||||
const serverURL = location.origin;
|
||||
iconURL = iconURL.includes('http') ? iconURL : `${serverURL}${iconURL}`;
|
||||
ipcRenderer.send('realm-icon-changed', serverURL, iconURL);
|
||||
});
|
||||
|
||||
// this follows node's idiomatic implementation of event
|
||||
// emitters to make event handling more simpler instead of using
|
||||
// functions zulip side will emit event using ElectronBrigde.send_event
|
||||
// which is alias of .emit and on this side we can handle the data by adding
|
||||
// a listener for the event.
|
||||
module.exports = electron_bridge;
|
||||
@@ -1,111 +0,0 @@
|
||||
import {EventEmitter} from "events"; // eslint-disable-line unicorn/prefer-node-protocol
|
||||
|
||||
import type {ClipboardDecrypter} from "./clipboard-decrypter.js";
|
||||
import {ClipboardDecrypterImpl} from "./clipboard-decrypter.js";
|
||||
import type {NotificationData} from "./notification/index.js";
|
||||
import {newNotification} from "./notification/index.js";
|
||||
import {ipcRenderer} from "./typed-ipc-renderer.js";
|
||||
|
||||
type ListenerType = (...args: any[]) => void;
|
||||
|
||||
export type ElectronBridge = {
|
||||
send_event: (eventName: string | symbol, ...args: unknown[]) => boolean;
|
||||
on_event: (eventName: string, listener: ListenerType) => void;
|
||||
new_notification: (
|
||||
title: string,
|
||||
options: NotificationOptions,
|
||||
dispatch: (type: string, eventInit: EventInit) => boolean,
|
||||
) => NotificationData;
|
||||
get_idle_on_system: () => boolean;
|
||||
get_last_active_on_system: () => number;
|
||||
get_send_notification_reply_message_supported: () => boolean;
|
||||
set_send_notification_reply_message_supported: (value: boolean) => void;
|
||||
decrypt_clipboard: (version: number) => ClipboardDecrypter;
|
||||
};
|
||||
|
||||
let notificationReplySupported = false;
|
||||
// Indicates if the user is idle or not
|
||||
let idle = false;
|
||||
// Indicates the time at which user was last active
|
||||
let lastActive = Date.now();
|
||||
|
||||
export const bridgeEvents = new EventEmitter();
|
||||
|
||||
/* eslint-disable @typescript-eslint/naming-convention */
|
||||
const electron_bridge: ElectronBridge = {
|
||||
send_event: (eventName: string | symbol, ...args: unknown[]): boolean =>
|
||||
bridgeEvents.emit(eventName, ...args),
|
||||
|
||||
on_event(eventName: string, listener: ListenerType): void {
|
||||
bridgeEvents.on(eventName, listener);
|
||||
},
|
||||
|
||||
new_notification: (
|
||||
title: string,
|
||||
options: NotificationOptions,
|
||||
dispatch: (type: string, eventInit: EventInit) => boolean,
|
||||
): NotificationData => newNotification(title, options, dispatch),
|
||||
|
||||
get_idle_on_system: (): boolean => idle,
|
||||
|
||||
get_last_active_on_system: (): number => lastActive,
|
||||
|
||||
get_send_notification_reply_message_supported: (): boolean =>
|
||||
notificationReplySupported,
|
||||
|
||||
set_send_notification_reply_message_supported(value: boolean): void {
|
||||
notificationReplySupported = value;
|
||||
},
|
||||
|
||||
decrypt_clipboard: (version: number): ClipboardDecrypter =>
|
||||
new ClipboardDecrypterImpl(version),
|
||||
};
|
||||
/* eslint-enable @typescript-eslint/naming-convention */
|
||||
|
||||
bridgeEvents.on("total_unread_count", (unreadCount: unknown) => {
|
||||
if (typeof unreadCount !== "number") {
|
||||
throw new TypeError("Expected string for unreadCount");
|
||||
}
|
||||
|
||||
ipcRenderer.send("unread-count", unreadCount);
|
||||
});
|
||||
|
||||
bridgeEvents.on("realm_name", (realmName: unknown) => {
|
||||
if (typeof realmName !== "string") {
|
||||
throw new TypeError("Expected string for realmName");
|
||||
}
|
||||
|
||||
const serverUrl = location.origin;
|
||||
ipcRenderer.send("realm-name-changed", serverUrl, realmName);
|
||||
});
|
||||
|
||||
bridgeEvents.on("realm_icon_url", (iconUrl: unknown) => {
|
||||
if (typeof iconUrl !== "string") {
|
||||
throw new TypeError("Expected string for iconUrl");
|
||||
}
|
||||
|
||||
const serverUrl = location.origin;
|
||||
ipcRenderer.send(
|
||||
"realm-icon-changed",
|
||||
serverUrl,
|
||||
iconUrl.includes("http") ? iconUrl : `${serverUrl}${iconUrl}`,
|
||||
);
|
||||
});
|
||||
|
||||
// Set user as active and update the time of last activity
|
||||
ipcRenderer.on("set-active", () => {
|
||||
idle = false;
|
||||
lastActive = Date.now();
|
||||
});
|
||||
|
||||
// Set user as idle and time of last activity is left unchanged
|
||||
ipcRenderer.on("set-idle", () => {
|
||||
idle = true;
|
||||
});
|
||||
|
||||
// This follows node's idiomatic implementation of event
|
||||
// emitters to make event handling more simpler instead of using
|
||||
// functions zulip side will emit event using ElectronBrigde.send_event
|
||||
// which is alias of .emit and on this side we can handle the data by adding
|
||||
// a listener for the event.
|
||||
export default electron_bridge;
|
||||
62
app/renderer/js/feedback.js
Normal file
62
app/renderer/js/feedback.js
Normal file
@@ -0,0 +1,62 @@
|
||||
const { app } = require('electron').remote;
|
||||
const path = require('path');
|
||||
const fs = require('fs');
|
||||
const SendFeedback = require('@electron-elements/send-feedback');
|
||||
|
||||
// make the button color match zulip app's theme
|
||||
SendFeedback.customStyles = `
|
||||
button:hover, button:focus {
|
||||
border-color: #4EBFAC;
|
||||
color: #4EBFAC;
|
||||
}
|
||||
|
||||
button:active {
|
||||
background-color: #f1f1f1;
|
||||
color: #4EBFAC;
|
||||
}
|
||||
|
||||
button {
|
||||
background-color: #4EBFAC;
|
||||
border-color: #4EBFAC;
|
||||
}
|
||||
`;
|
||||
|
||||
customElements.define('send-feedback', SendFeedback);
|
||||
const sendFeedback = document.querySelector('send-feedback');
|
||||
const feedbackHolder = sendFeedback.parentElement;
|
||||
|
||||
// customize the fields of custom elements
|
||||
sendFeedback.title = 'Report Issue';
|
||||
sendFeedback.titleLabel = 'Issue title:';
|
||||
sendFeedback.titlePlaceholder = 'Enter issue title';
|
||||
sendFeedback.textareaLabel = 'Describe the issue:';
|
||||
sendFeedback.textareaPlaceholder = 'Succinctly describe your issue and steps to reproduce it...';
|
||||
sendFeedback.buttonLabel = 'Report Issue';
|
||||
sendFeedback.loaderSuccessText = '';
|
||||
|
||||
sendFeedback.useReporter('emailReporter', {
|
||||
email: 'akash@zulipchat.com'
|
||||
});
|
||||
|
||||
feedbackHolder.addEventListener('click', e => {
|
||||
// only remove the class if the grey out faded
|
||||
// part is clicked and not the feedback element itself
|
||||
if (e.target === e.currentTarget) {
|
||||
feedbackHolder.classList.remove('show');
|
||||
}
|
||||
});
|
||||
|
||||
sendFeedback.addEventListener('feedback-submitted', () => {
|
||||
setTimeout(() => {
|
||||
feedbackHolder.classList.remove('show');
|
||||
}, 1000);
|
||||
});
|
||||
|
||||
const dataDir = app.getPath('userData');
|
||||
const logsDir = path.join(dataDir, '/Logs');
|
||||
sendFeedback.logs.push(...fs.readdirSync(logsDir).map(file => path.join(logsDir, file)));
|
||||
|
||||
module.exports = {
|
||||
feedbackHolder,
|
||||
sendFeedback
|
||||
};
|
||||
@@ -1,113 +0,0 @@
|
||||
"use strict";
|
||||
|
||||
type ElectronBridge = import("./electron-bridge.js").ElectronBridge;
|
||||
|
||||
type CompatElectronBridge = {
|
||||
readonly idle_on_system: boolean;
|
||||
readonly last_active_on_system: number;
|
||||
send_notification_reply_message_supported: boolean;
|
||||
} & ElectronBridge;
|
||||
|
||||
(() => {
|
||||
const zulipWindow = window as typeof window & {
|
||||
electron_bridge: CompatElectronBridge;
|
||||
raw_electron_bridge: ElectronBridge;
|
||||
};
|
||||
|
||||
/* eslint-disable @typescript-eslint/naming-convention */
|
||||
const electron_bridge: CompatElectronBridge = {
|
||||
...zulipWindow.raw_electron_bridge,
|
||||
|
||||
get idle_on_system(): boolean {
|
||||
return this.get_idle_on_system();
|
||||
},
|
||||
|
||||
get last_active_on_system(): number {
|
||||
return this.get_last_active_on_system();
|
||||
},
|
||||
|
||||
get send_notification_reply_message_supported(): boolean {
|
||||
return this.get_send_notification_reply_message_supported();
|
||||
},
|
||||
|
||||
set send_notification_reply_message_supported(value: boolean) {
|
||||
this.set_send_notification_reply_message_supported(value);
|
||||
},
|
||||
};
|
||||
/* eslint-enable @typescript-eslint/naming-convention */
|
||||
|
||||
zulipWindow.electron_bridge = electron_bridge;
|
||||
|
||||
function attributeListener<T extends EventTarget>(
|
||||
type: string,
|
||||
): PropertyDescriptor {
|
||||
const handlers = new WeakMap<T, (event: Event) => unknown>();
|
||||
|
||||
function listener(this: T, event: Event): void {
|
||||
if (handlers.get(this)!.call(this, event) === false) {
|
||||
event.preventDefault();
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
configurable: true,
|
||||
enumerable: true,
|
||||
get(this: T) {
|
||||
return handlers.get(this);
|
||||
},
|
||||
set(this: T, value: unknown) {
|
||||
if (typeof value === "function") {
|
||||
if (!handlers.has(this)) {
|
||||
this.addEventListener(type, listener);
|
||||
}
|
||||
|
||||
handlers.set(this, value as (event: Event) => unknown);
|
||||
} else if (handlers.has(this)) {
|
||||
this.removeEventListener(type, listener);
|
||||
handlers.delete(this);
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/naming-convention
|
||||
const NativeNotification = Notification;
|
||||
|
||||
class InjectedNotification extends EventTarget {
|
||||
static get permission(): NotificationPermission {
|
||||
return NativeNotification.permission;
|
||||
}
|
||||
|
||||
static async requestPermission(
|
||||
callback?: NotificationPermissionCallback,
|
||||
): Promise<NotificationPermission> {
|
||||
if (callback) {
|
||||
callback(await Promise.resolve(NativeNotification.permission));
|
||||
}
|
||||
|
||||
return NativeNotification.permission;
|
||||
}
|
||||
|
||||
constructor(title: string, options: NotificationOptions = {}) {
|
||||
super();
|
||||
Object.assign(
|
||||
this,
|
||||
electron_bridge.new_notification(
|
||||
title,
|
||||
options,
|
||||
(type: string, eventInit: EventInit) =>
|
||||
this.dispatchEvent(new Event(type, eventInit)),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Object.defineProperties(InjectedNotification.prototype, {
|
||||
onclick: attributeListener("click"),
|
||||
onclose: attributeListener("close"),
|
||||
onerror: attributeListener("error"),
|
||||
onshow: attributeListener("show"),
|
||||
});
|
||||
|
||||
window.Notification = InjectedNotification as unknown as typeof Notification;
|
||||
})();
|
||||
769
app/renderer/js/main.js
Normal file
769
app/renderer/js/main.js
Normal file
@@ -0,0 +1,769 @@
|
||||
'use strict';
|
||||
|
||||
const { ipcRenderer, remote, clipboard } = require('electron');
|
||||
const isDev = require('electron-is-dev');
|
||||
|
||||
const { session, app, Menu, dialog } = remote;
|
||||
const escape = require('escape-html');
|
||||
|
||||
require(__dirname + '/js/tray.js');
|
||||
const DomainUtil = require(__dirname + '/js/utils/domain-util.js');
|
||||
const WebView = require(__dirname + '/js/components/webview.js');
|
||||
const ServerTab = require(__dirname + '/js/components/server-tab.js');
|
||||
const FunctionalTab = require(__dirname + '/js/components/functional-tab.js');
|
||||
const ConfigUtil = require(__dirname + '/js/utils/config-util.js');
|
||||
const DNDUtil = require(__dirname + '/js/utils/dnd-util.js');
|
||||
const ReconnectUtil = require(__dirname + '/js/utils/reconnect-util.js');
|
||||
const Logger = require(__dirname + '/js/utils/logger-util.js');
|
||||
const CommonUtil = require(__dirname + '/js/utils/common-util.js');
|
||||
|
||||
const { feedbackHolder } = require(__dirname + '/js/feedback.js');
|
||||
|
||||
const logger = new Logger({
|
||||
file: 'errors.log',
|
||||
timestamp: true
|
||||
});
|
||||
|
||||
class ServerManagerView {
|
||||
constructor() {
|
||||
this.$addServerButton = document.getElementById('add-tab');
|
||||
this.$tabsContainer = document.getElementById('tabs-container');
|
||||
|
||||
const $actionsContainer = document.getElementById('actions-container');
|
||||
this.$reloadButton = $actionsContainer.querySelector('#reload-action');
|
||||
this.$settingsButton = $actionsContainer.querySelector('#settings-action');
|
||||
this.$webviewsContainer = document.getElementById('webviews-container');
|
||||
this.$backButton = $actionsContainer.querySelector('#back-action');
|
||||
this.$dndButton = $actionsContainer.querySelector('#dnd-action');
|
||||
|
||||
this.$addServerTooltip = document.getElementById('add-server-tooltip');
|
||||
this.$reloadTooltip = $actionsContainer.querySelector('#reload-tooltip');
|
||||
this.$settingsTooltip = $actionsContainer.querySelector('#setting-tooltip');
|
||||
this.$serverIconTooltip = document.getElementsByClassName('server-tooltip');
|
||||
this.$backTooltip = $actionsContainer.querySelector('#back-tooltip');
|
||||
this.$dndTooltip = $actionsContainer.querySelector('#dnd-tooltip');
|
||||
|
||||
this.$sidebar = document.getElementById('sidebar');
|
||||
|
||||
this.$fullscreenPopup = document.getElementById('fullscreen-popup');
|
||||
this.$fullscreenEscapeKey = process.platform === 'darwin' ? '^⌘F' : 'F11';
|
||||
this.$fullscreenPopup.innerHTML = `Press ${this.$fullscreenEscapeKey} to exit full screen`;
|
||||
|
||||
this.activeTabIndex = -1;
|
||||
this.tabs = [];
|
||||
this.functionalTabs = {};
|
||||
this.tabIndex = 0;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.loadProxy().then(() => {
|
||||
this.initSidebar();
|
||||
this.initTabs();
|
||||
this.initActions();
|
||||
this.registerIpcs();
|
||||
this.initDefaultSettings();
|
||||
});
|
||||
}
|
||||
|
||||
loadProxy() {
|
||||
return new Promise(resolve => {
|
||||
// To change proxyEnable to useManualProxy in older versions
|
||||
const proxyEnabledOld = ConfigUtil.isConfigItemExists('useProxy');
|
||||
if (proxyEnabledOld) {
|
||||
const proxyEnableOldState = ConfigUtil.getConfigItem('useProxy');
|
||||
if (proxyEnableOldState) {
|
||||
ConfigUtil.setConfigItem('useManualProxy', true);
|
||||
}
|
||||
ConfigUtil.removeConfigItem('useProxy');
|
||||
}
|
||||
|
||||
const proxyEnabled = ConfigUtil.getConfigItem('useManualProxy') || ConfigUtil.getConfigItem('useSystemProxy');
|
||||
if (proxyEnabled) {
|
||||
session.fromPartition('persist:webviewsession').setProxy({
|
||||
pacScript: ConfigUtil.getConfigItem('proxyPAC', ''),
|
||||
proxyRules: ConfigUtil.getConfigItem('proxyRules', ''),
|
||||
proxyBypassRules: ConfigUtil.getConfigItem('proxyBypass', '')
|
||||
}, resolve);
|
||||
} else {
|
||||
session.fromPartition('persist:webviewsession').setProxy({
|
||||
pacScript: '',
|
||||
proxyRules: '',
|
||||
proxyBypassRules: ''
|
||||
}, resolve);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Settings are initialized only when user clicks on General/Server/Network section settings
|
||||
// In case, user doesn't visit these section, those values set to be null automatically
|
||||
// This will make sure the default settings are correctly set to either true or false
|
||||
initDefaultSettings() {
|
||||
// Default settings which should be respected
|
||||
const settingOptions = {
|
||||
trayIcon: true,
|
||||
useManualProxy: false,
|
||||
useSystemProxy: false,
|
||||
showSidebar: true,
|
||||
badgeOption: true,
|
||||
startAtLogin: true,
|
||||
startMinimized: false,
|
||||
enableSpellchecker: true,
|
||||
showNotification: true,
|
||||
autoUpdate: true,
|
||||
betaUpdate: false,
|
||||
errorReporting: true,
|
||||
customCSS: false,
|
||||
silent: false,
|
||||
lastActiveTab: 0,
|
||||
dnd: false,
|
||||
dndPreviousSettings: {
|
||||
showNotification: true,
|
||||
silent: false
|
||||
},
|
||||
downloadsPath: `${app.getPath('downloads')}`,
|
||||
showDownloadFolder: false
|
||||
};
|
||||
|
||||
// Platform specific settings
|
||||
|
||||
if (process.platform === 'win32') {
|
||||
// Only available on Windows
|
||||
settingOptions.flashTaskbarOnMessage = true;
|
||||
settingOptions.dndPreviousSettings.flashTaskbarOnMessage = true;
|
||||
}
|
||||
|
||||
if (process.platform === 'darwin') {
|
||||
// Only available on macOS
|
||||
settingOptions.dockBouncing = true;
|
||||
}
|
||||
|
||||
if (process.platform !== 'darwin') {
|
||||
settingOptions.autoHideMenubar = false;
|
||||
}
|
||||
|
||||
for (const i in settingOptions) {
|
||||
if (ConfigUtil.getConfigItem(i) === null) {
|
||||
ConfigUtil.setConfigItem(i, settingOptions[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
initSidebar() {
|
||||
const showSidebar = ConfigUtil.getConfigItem('showSidebar', true);
|
||||
this.toggleSidebar(showSidebar);
|
||||
}
|
||||
|
||||
initTabs() {
|
||||
const servers = DomainUtil.getDomains();
|
||||
if (servers.length > 0) {
|
||||
for (let i = 0; i < servers.length; i++) {
|
||||
this.initServer(servers[i], i);
|
||||
DomainUtil.updateSavedServer(servers[i].url, i);
|
||||
this.activateTab(i);
|
||||
}
|
||||
// Open last active tab
|
||||
this.activateTab(ConfigUtil.getConfigItem('lastActiveTab'));
|
||||
// Remove focus from the settings icon at sidebar bottom
|
||||
this.$settingsButton.classList.remove('active');
|
||||
} else {
|
||||
this.openSettings('AddServer');
|
||||
}
|
||||
}
|
||||
|
||||
initServer(server, index) {
|
||||
const tabIndex = this.getTabIndex();
|
||||
this.tabs.push(new ServerTab({
|
||||
role: 'server',
|
||||
icon: server.icon,
|
||||
name: server.alias,
|
||||
$root: this.$tabsContainer,
|
||||
onClick: this.activateLastTab.bind(this, index),
|
||||
index,
|
||||
tabIndex,
|
||||
onHover: this.onHover.bind(this, index),
|
||||
onHoverOut: this.onHoverOut.bind(this, index),
|
||||
webview: new WebView({
|
||||
$root: this.$webviewsContainer,
|
||||
index,
|
||||
tabIndex,
|
||||
url: server.url,
|
||||
role: 'server',
|
||||
name: CommonUtil.decodeString(server.alias),
|
||||
isActive: () => {
|
||||
return index === this.activeTabIndex;
|
||||
},
|
||||
onNetworkError: this.openNetworkTroubleshooting.bind(this),
|
||||
onTitleChange: this.updateBadge.bind(this),
|
||||
nodeIntegration: false,
|
||||
preload: true
|
||||
})
|
||||
}));
|
||||
}
|
||||
|
||||
initActions() {
|
||||
this.initDNDButton();
|
||||
this.initServerActions();
|
||||
this.initLeftSidebarEvents();
|
||||
}
|
||||
|
||||
initServerActions() {
|
||||
const $serverImgs = document.querySelectorAll('.server-icons');
|
||||
$serverImgs.forEach(($serverImg, index) => {
|
||||
this.addContextMenu($serverImg, index);
|
||||
if ($serverImg.src.includes('img/icon.png')) {
|
||||
this.displayInitialCharLogo($serverImg, index);
|
||||
}
|
||||
$serverImg.addEventListener('error', () => {
|
||||
this.displayInitialCharLogo($serverImg, index);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
initLeftSidebarEvents() {
|
||||
this.$dndButton.addEventListener('click', () => {
|
||||
const dndUtil = DNDUtil.toggle();
|
||||
ipcRenderer.send('forward-message', 'toggle-dnd', dndUtil.dnd, dndUtil.newSettings);
|
||||
});
|
||||
this.$reloadButton.addEventListener('click', () => {
|
||||
this.tabs[this.activeTabIndex].webview.reload();
|
||||
});
|
||||
this.$addServerButton.addEventListener('click', () => {
|
||||
this.openSettings('AddServer');
|
||||
});
|
||||
this.$settingsButton.addEventListener('click', () => {
|
||||
this.openSettings('General');
|
||||
});
|
||||
this.$backButton.addEventListener('click', () => {
|
||||
this.tabs[this.activeTabIndex].webview.back();
|
||||
});
|
||||
|
||||
this.sidebarHoverEvent(this.$addServerButton, this.$addServerTooltip, true);
|
||||
this.sidebarHoverEvent(this.$settingsButton, this.$settingsTooltip);
|
||||
this.sidebarHoverEvent(this.$reloadButton, this.$reloadTooltip);
|
||||
this.sidebarHoverEvent(this.$backButton, this.$backTooltip);
|
||||
this.sidebarHoverEvent(this.$dndButton, this.$dndTooltip);
|
||||
}
|
||||
|
||||
initDNDButton() {
|
||||
const dnd = ConfigUtil.getConfigItem('dnd', false);
|
||||
this.toggleDNDButton(dnd);
|
||||
}
|
||||
|
||||
getTabIndex() {
|
||||
const currentIndex = this.tabIndex;
|
||||
this.tabIndex++;
|
||||
return currentIndex;
|
||||
}
|
||||
|
||||
displayInitialCharLogo($img, index) {
|
||||
/*
|
||||
index parameter needed because webview[data-tab-id] can increment
|
||||
beyond size of sidebar org array and throw error
|
||||
*/
|
||||
|
||||
const $altIcon = document.createElement('div');
|
||||
const $parent = $img.parentElement;
|
||||
const $container = $parent.parentElement;
|
||||
const webviewId = $container.dataset.tabId;
|
||||
const $webview = document.querySelector(`webview[data-tab-id="${webviewId}"]`);
|
||||
const realmName = $webview.getAttribute('name');
|
||||
|
||||
if (realmName === null) {
|
||||
$img.src = '/img/icon.png';
|
||||
return;
|
||||
}
|
||||
|
||||
$altIcon.textContent = realmName.charAt(0) || 'Z';
|
||||
$altIcon.classList.add('server-icon');
|
||||
$altIcon.classList.add('alt-icon');
|
||||
|
||||
$parent.removeChild($img);
|
||||
$parent.appendChild($altIcon);
|
||||
|
||||
this.addContextMenu($altIcon, index);
|
||||
}
|
||||
|
||||
sidebarHoverEvent(SidebarButton, SidebarTooltip, addServer = false) {
|
||||
SidebarButton.addEventListener('mouseover', () => {
|
||||
SidebarTooltip.removeAttribute('style');
|
||||
// To handle position of add server tooltip due to scrolling of list of organizations
|
||||
// This could not be handled using CSS, hence the top of the tooltip is made same
|
||||
// as that of its parent element.
|
||||
// This needs to handled only for the add server tooltip and not others.
|
||||
if (addServer) {
|
||||
const { top } = SidebarButton.getBoundingClientRect();
|
||||
SidebarTooltip.style.top = top + 'px';
|
||||
}
|
||||
});
|
||||
SidebarButton.addEventListener('mouseout', () => {
|
||||
SidebarTooltip.style.display = 'none';
|
||||
});
|
||||
}
|
||||
|
||||
onHover(index) {
|
||||
// this.$serverIconTooltip[index].innerHTML already has realm name, so we are just
|
||||
// removing the style.
|
||||
this.$serverIconTooltip[index].removeAttribute('style');
|
||||
// To handle position of servers' tooltip due to scrolling of list of organizations
|
||||
// This could not be handled using CSS, hence the top of the tooltip is made same
|
||||
// as that of its parent element.
|
||||
const { top } = this.$serverIconTooltip[index].parentElement.getBoundingClientRect();
|
||||
this.$serverIconTooltip[index].style.top = top + 'px';
|
||||
}
|
||||
|
||||
onHoverOut(index) {
|
||||
this.$serverIconTooltip[index].style.display = 'none';
|
||||
}
|
||||
|
||||
openFunctionalTab(tabProps) {
|
||||
if (this.functionalTabs[tabProps.name] !== undefined) {
|
||||
this.activateTab(this.functionalTabs[tabProps.name]);
|
||||
return;
|
||||
}
|
||||
|
||||
this.functionalTabs[tabProps.name] = this.tabs.length;
|
||||
|
||||
const tabIndex = this.getTabIndex();
|
||||
|
||||
this.tabs.push(new FunctionalTab({
|
||||
role: 'function',
|
||||
materialIcon: tabProps.materialIcon,
|
||||
name: tabProps.name,
|
||||
$root: this.$tabsContainer,
|
||||
index: this.functionalTabs[tabProps.name],
|
||||
tabIndex,
|
||||
onClick: this.activateTab.bind(this, this.functionalTabs[tabProps.name]),
|
||||
onDestroy: this.destroyTab.bind(this, tabProps.name, this.functionalTabs[tabProps.name]),
|
||||
webview: new WebView({
|
||||
$root: this.$webviewsContainer,
|
||||
index: this.functionalTabs[tabProps.name],
|
||||
tabIndex,
|
||||
url: tabProps.url,
|
||||
role: 'function',
|
||||
name: tabProps.name,
|
||||
isActive: () => {
|
||||
return this.functionalTabs[tabProps.name] === this.activeTabIndex;
|
||||
},
|
||||
onNetworkError: this.openNetworkTroubleshooting.bind(this),
|
||||
onTitleChange: this.updateBadge.bind(this),
|
||||
nodeIntegration: true,
|
||||
preload: false
|
||||
})
|
||||
}));
|
||||
|
||||
// To show loading indicator the first time a functional tab is opened, indicator is
|
||||
// closed when the functional tab DOM is ready, handled in webview.js
|
||||
this.$webviewsContainer.classList.remove('loaded');
|
||||
|
||||
this.activateTab(this.functionalTabs[tabProps.name]);
|
||||
}
|
||||
|
||||
openSettings(nav = 'General') {
|
||||
this.openFunctionalTab({
|
||||
name: 'Settings',
|
||||
materialIcon: 'settings',
|
||||
url: `file://${__dirname}/preference.html#${nav}`
|
||||
});
|
||||
this.$settingsButton.classList.add('active');
|
||||
this.tabs[this.functionalTabs.Settings].webview.send('switch-settings-nav', nav);
|
||||
}
|
||||
|
||||
openAbout() {
|
||||
this.openFunctionalTab({
|
||||
name: 'About',
|
||||
materialIcon: 'sentiment_very_satisfied',
|
||||
url: `file://${__dirname}/about.html`
|
||||
});
|
||||
}
|
||||
|
||||
openNetworkTroubleshooting() {
|
||||
this.openFunctionalTab({
|
||||
name: 'Network Troubleshooting',
|
||||
materialIcon: 'network_check',
|
||||
url: `file://${__dirname}/network.html`
|
||||
});
|
||||
}
|
||||
|
||||
activateLastTab(index) {
|
||||
// Open all the tabs in background, also activate the tab based on the index
|
||||
this.activateTab(index);
|
||||
// Save last active tab
|
||||
ConfigUtil.setConfigItem('lastActiveTab', index);
|
||||
}
|
||||
|
||||
// returns this.tabs in an way that does
|
||||
// not crash app when this.tabs is passed into
|
||||
// ipcRenderer. Something about webview, and props.webview
|
||||
// properties in ServerTab causes the app to crash.
|
||||
get tabsForIpc() {
|
||||
const tabs = [];
|
||||
this.tabs.forEach(tab => {
|
||||
const proto = Object.create(Object.getPrototypeOf(tab));
|
||||
const tabClone = Object.assign(proto, tab);
|
||||
|
||||
tabClone.webview = { props: {} };
|
||||
tabClone.webview.props.name = tab.webview.props.name;
|
||||
delete tabClone.props.webview;
|
||||
tabs.push(tabClone);
|
||||
});
|
||||
|
||||
return tabs;
|
||||
}
|
||||
|
||||
activateTab(index, hideOldTab = true) {
|
||||
if (!this.tabs[index]) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.activeTabIndex !== -1) {
|
||||
if (this.activeTabIndex === index) {
|
||||
return;
|
||||
} else if (hideOldTab) {
|
||||
// If old tab is functional tab Settings, remove focus from the settings icon at sidebar bottom
|
||||
if (this.tabs[this.activeTabIndex].props.role === 'function' && this.tabs[this.activeTabIndex].props.name === 'Settings') {
|
||||
this.$settingsButton.classList.remove('active');
|
||||
}
|
||||
this.tabs[this.activeTabIndex].deactivate();
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
this.tabs[index].webview.canGoBackButton();
|
||||
} catch (err) {
|
||||
}
|
||||
|
||||
this.activeTabIndex = index;
|
||||
this.tabs[index].activate();
|
||||
|
||||
ipcRenderer.send('update-menu', {
|
||||
// JSON stringify this.tabs to avoid a crash
|
||||
// util.inspect is being used to handle circular references
|
||||
tabs: this.tabsForIpc,
|
||||
activeTabIndex: this.activeTabIndex,
|
||||
// Following flag controls whether a menu item should be enabled or not
|
||||
enableMenu: this.tabs[index].props.role === 'server'
|
||||
});
|
||||
}
|
||||
|
||||
destroyTab(name, index) {
|
||||
if (this.tabs[index].webview.loading) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.tabs[index].destroy();
|
||||
|
||||
delete this.tabs[index];
|
||||
delete this.functionalTabs[name];
|
||||
|
||||
// Issue #188: If the functional tab was not focused, do not activate another tab.
|
||||
if (this.activeTabIndex === index) {
|
||||
this.activateTab(0, false);
|
||||
}
|
||||
}
|
||||
|
||||
destroyView() {
|
||||
// Show loading indicator
|
||||
this.$webviewsContainer.classList.remove('loaded');
|
||||
|
||||
// Clear global variables
|
||||
this.activeTabIndex = -1;
|
||||
this.tabs = [];
|
||||
this.functionalTabs = {};
|
||||
|
||||
// Clear DOM elements
|
||||
this.$tabsContainer.innerHTML = '';
|
||||
this.$webviewsContainer.innerHTML = '';
|
||||
}
|
||||
|
||||
reloadView() {
|
||||
// Save and remember the index of last active tab so that we can use it later
|
||||
const lastActiveTab = this.tabs[this.activeTabIndex].props.index;
|
||||
ConfigUtil.setConfigItem('lastActiveTab', lastActiveTab);
|
||||
|
||||
// Destroy the current view and re-initiate it
|
||||
this.destroyView();
|
||||
this.initTabs();
|
||||
this.initServerActions();
|
||||
}
|
||||
|
||||
// This will trigger when pressed CTRL/CMD + R [WIP]
|
||||
// It won't reload the current view properly when you add/delete a server.
|
||||
reloadCurrentView() {
|
||||
this.$reloadButton.click();
|
||||
}
|
||||
|
||||
updateBadge() {
|
||||
let messageCountAll = 0;
|
||||
for (let i = 0; i < this.tabs.length; i++) {
|
||||
if (this.tabs[i] && this.tabs[i].updateBadge) {
|
||||
const count = this.tabs[i].webview.badgeCount;
|
||||
messageCountAll += count;
|
||||
this.tabs[i].updateBadge(count);
|
||||
}
|
||||
}
|
||||
|
||||
ipcRenderer.send('update-badge', messageCountAll);
|
||||
}
|
||||
|
||||
toggleSidebar(show) {
|
||||
if (show) {
|
||||
this.$sidebar.classList.remove('sidebar-hide');
|
||||
} else {
|
||||
this.$sidebar.classList.add('sidebar-hide');
|
||||
}
|
||||
}
|
||||
|
||||
// Toggles the dnd button icon.
|
||||
toggleDNDButton(alert) {
|
||||
this.$dndTooltip.textContent = (alert ? 'Disable' : 'Enable') + ' Do Not Disturb';
|
||||
this.$dndButton.querySelector('i').textContent = alert ? 'notifications_off' : 'notifications';
|
||||
}
|
||||
|
||||
addContextMenu($serverImg, index) {
|
||||
$serverImg.addEventListener('contextmenu', e => {
|
||||
e.preventDefault();
|
||||
const template = [
|
||||
{
|
||||
label: 'Disconnect organization',
|
||||
click: () => {
|
||||
dialog.showMessageBox({
|
||||
type: 'warning',
|
||||
buttons: ['YES', 'NO'],
|
||||
defaultId: 0,
|
||||
message: 'Are you sure you want to disconnect this organization?'
|
||||
}, response => {
|
||||
if (response === 0) {
|
||||
DomainUtil.removeDomain(index);
|
||||
ipcRenderer.send('reload-full-app');
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
{
|
||||
label: 'Copy Zulip URL',
|
||||
click: () => {
|
||||
clipboard.writeText(DomainUtil.getDomain(index).url);
|
||||
}
|
||||
}
|
||||
];
|
||||
const contextMenu = Menu.buildFromTemplate(template);
|
||||
contextMenu.popup({ window: remote.getCurrentWindow() });
|
||||
});
|
||||
}
|
||||
|
||||
registerIpcs() {
|
||||
const webviewListeners = {
|
||||
'webview-reload': 'reload',
|
||||
back: 'back',
|
||||
focus: 'focus',
|
||||
forward: 'forward',
|
||||
zoomIn: 'zoomIn',
|
||||
zoomOut: 'zoomOut',
|
||||
zoomActualSize: 'zoomActualSize',
|
||||
'log-out': 'logOut',
|
||||
shortcut: 'showShortcut',
|
||||
'tab-devtools': 'openDevTools'
|
||||
};
|
||||
|
||||
for (const key in webviewListeners) {
|
||||
ipcRenderer.on(key, () => {
|
||||
const activeWebview = this.tabs[this.activeTabIndex].webview;
|
||||
if (activeWebview) {
|
||||
activeWebview[webviewListeners[key]]();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
ipcRenderer.on('open-settings', (event, settingNav) => {
|
||||
this.openSettings(settingNav);
|
||||
});
|
||||
|
||||
ipcRenderer.on('open-about', this.openAbout.bind(this));
|
||||
|
||||
ipcRenderer.on('reload-viewer', this.reloadView.bind(this, this.tabs[this.activeTabIndex].props.index));
|
||||
|
||||
ipcRenderer.on('reload-current-viewer', this.reloadCurrentView.bind(this));
|
||||
|
||||
ipcRenderer.on('hard-reload', () => {
|
||||
ipcRenderer.send('reload-full-app');
|
||||
});
|
||||
|
||||
ipcRenderer.on('clear-app-data', () => {
|
||||
ipcRenderer.send('clear-app-settings');
|
||||
});
|
||||
|
||||
ipcRenderer.on('switch-server-tab', (event, index) => {
|
||||
this.activateLastTab(index);
|
||||
});
|
||||
|
||||
ipcRenderer.on('open-org-tab', () => {
|
||||
this.openSettings('AddServer');
|
||||
});
|
||||
|
||||
ipcRenderer.on('reload-proxy', (event, showAlert) => {
|
||||
this.loadProxy().then(() => {
|
||||
if (showAlert) {
|
||||
alert('Proxy settings saved!');
|
||||
ipcRenderer.send('reload-full-app');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
ipcRenderer.on('toggle-sidebar', (event, show) => {
|
||||
// Toggle the left sidebar
|
||||
this.toggleSidebar(show);
|
||||
|
||||
// Toggle sidebar switch in the general settings
|
||||
const selector = 'webview:not([class*=disabled])';
|
||||
const webview = document.querySelector(selector);
|
||||
const webContents = webview.getWebContents();
|
||||
webContents.send('toggle-sidebar-setting', show);
|
||||
});
|
||||
|
||||
ipcRenderer.on('toggle-silent', (event, state) => {
|
||||
const webviews = document.querySelectorAll('webview');
|
||||
webviews.forEach(webview => {
|
||||
try {
|
||||
webview.setAudioMuted(state);
|
||||
} catch (err) {
|
||||
// webview is not ready yet
|
||||
webview.addEventListener('dom-ready', () => {
|
||||
webview.setAudioMuted(state);
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
ipcRenderer.on('toggle-dnd', (event, state, newSettings) => {
|
||||
this.toggleDNDButton(state);
|
||||
ipcRenderer.send('forward-message', 'toggle-silent', newSettings.silent);
|
||||
const selector = 'webview:not([class*=disabled])';
|
||||
const webview = document.querySelector(selector);
|
||||
const webContents = webview.getWebContents();
|
||||
webContents.send('toggle-dnd', state, newSettings);
|
||||
});
|
||||
|
||||
ipcRenderer.on('update-realm-name', (event, serverURL, realmName) => {
|
||||
DomainUtil.getDomains().forEach((domain, index) => {
|
||||
if (domain.url.includes(serverURL)) {
|
||||
const serverTooltipSelector = `.tab .server-tooltip`;
|
||||
const serverTooltips = document.querySelectorAll(serverTooltipSelector);
|
||||
serverTooltips[index].innerHTML = escape(realmName);
|
||||
this.tabs[index].props.name = escape(realmName);
|
||||
this.tabs[index].webview.props.name = realmName;
|
||||
|
||||
domain.alias = escape(realmName);
|
||||
DomainUtil.db.push(`/domains[${index}]`, domain, true);
|
||||
DomainUtil.reloadDB();
|
||||
// Update the realm name also on the Window menu
|
||||
ipcRenderer.send('update-menu', {
|
||||
tabs: this.tabsForIpc,
|
||||
activeTabIndex: this.activeTabIndex
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
ipcRenderer.on('update-realm-icon', (event, serverURL, iconURL) => {
|
||||
DomainUtil.getDomains().forEach((domain, index) => {
|
||||
if (domain.url.includes(serverURL)) {
|
||||
DomainUtil.saveServerIcon(iconURL).then(localIconUrl => {
|
||||
const serverImgsSelector = `.tab .server-icons`;
|
||||
const serverImgs = document.querySelectorAll(serverImgsSelector);
|
||||
serverImgs[index].src = localIconUrl;
|
||||
|
||||
domain.icon = localIconUrl;
|
||||
DomainUtil.db.push(`/domains[${index}]`, domain, true);
|
||||
DomainUtil.reloadDB();
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
ipcRenderer.on('enter-fullscreen', () => {
|
||||
this.$fullscreenPopup.classList.add('show');
|
||||
this.$fullscreenPopup.classList.remove('hidden');
|
||||
});
|
||||
|
||||
ipcRenderer.on('leave-fullscreen', () => {
|
||||
this.$fullscreenPopup.classList.remove('show');
|
||||
});
|
||||
|
||||
ipcRenderer.on('focus-webview-with-id', (event, webviewId) => {
|
||||
const webviews = document.querySelectorAll('webview');
|
||||
webviews.forEach(webview => {
|
||||
const currentId = webview.getWebContents().id;
|
||||
const tabId = webview.getAttribute('data-tab-id');
|
||||
const concurrentTab = document.querySelector(`div[data-tab-id="${tabId}"]`);
|
||||
if (currentId === webviewId) {
|
||||
concurrentTab.click();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
ipcRenderer.on('render-taskbar-icon', (event, messageCount) => {
|
||||
// Create a canvas from unread messagecounts
|
||||
function createOverlayIcon(messageCount) {
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.height = 128;
|
||||
canvas.width = 128;
|
||||
canvas.style.letterSpacing = '-5px';
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.fillStyle = '#f42020';
|
||||
ctx.beginPath();
|
||||
ctx.ellipse(64, 64, 64, 64, 0, 0, 2 * Math.PI);
|
||||
ctx.fill();
|
||||
ctx.textAlign = 'center';
|
||||
ctx.fillStyle = 'white';
|
||||
if (messageCount > 99) {
|
||||
ctx.font = '65px Helvetica';
|
||||
ctx.fillText('99+', 64, 85);
|
||||
} else if (messageCount < 10) {
|
||||
ctx.font = '90px Helvetica';
|
||||
ctx.fillText(String(Math.min(99, messageCount)), 64, 96);
|
||||
} else {
|
||||
ctx.font = '85px Helvetica';
|
||||
ctx.fillText(String(Math.min(99, messageCount)), 64, 90);
|
||||
}
|
||||
return canvas;
|
||||
}
|
||||
ipcRenderer.send('update-taskbar-icon', createOverlayIcon(messageCount).toDataURL(), String(messageCount));
|
||||
});
|
||||
|
||||
ipcRenderer.on('open-feedback-modal', () => {
|
||||
feedbackHolder.classList.add('show');
|
||||
});
|
||||
|
||||
ipcRenderer.on('copy-zulip-url', () => {
|
||||
clipboard.writeText(DomainUtil.getDomain(this.activeTabIndex).url);
|
||||
});
|
||||
|
||||
ipcRenderer.on('new-server', () => {
|
||||
this.openSettings('AddServer');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
const serverManagerView = new ServerManagerView();
|
||||
const reconnectUtil = new ReconnectUtil(serverManagerView);
|
||||
serverManagerView.init();
|
||||
window.addEventListener('online', () => {
|
||||
reconnectUtil.pollInternetAndReload();
|
||||
});
|
||||
|
||||
window.addEventListener('offline', () => {
|
||||
reconnectUtil.clearState();
|
||||
logger.log('No internet connection, you are offline.');
|
||||
});
|
||||
|
||||
// only start electron-connect (auto reload on change) when its ran
|
||||
// from `npm run dev` or `gulp dev` and not from `npm start` when
|
||||
// app is started `npm start` main process's proces.argv will have
|
||||
// `--no-electron-connect`
|
||||
const mainProcessArgv = remote.getGlobal('process').argv;
|
||||
if (isDev && !mainProcessArgv.includes('--no-electron-connect')) {
|
||||
const electronConnect = require('electron-connect');
|
||||
electronConnect.client.create();
|
||||
}
|
||||
};
|
||||
File diff suppressed because it is too large
Load Diff
100
app/renderer/js/notification/darwin-notifications.js
Normal file
100
app/renderer/js/notification/darwin-notifications.js
Normal file
@@ -0,0 +1,100 @@
|
||||
'use strict';
|
||||
|
||||
const { ipcRenderer } = require('electron');
|
||||
const url = require('url');
|
||||
const MacNotifier = require('node-mac-notifier');
|
||||
const ConfigUtil = require('../utils/config-util');
|
||||
const {
|
||||
appId, customReply, focusCurrentServer, parseReply, setupReply
|
||||
} = require('./helpers');
|
||||
|
||||
let replyHandler;
|
||||
let clickHandler;
|
||||
class DarwinNotification {
|
||||
constructor(title, opts) {
|
||||
const silent = ConfigUtil.getConfigItem('silent') || false;
|
||||
const { host, protocol } = location;
|
||||
const { icon } = opts;
|
||||
const profilePic = url.resolve(`${protocol}//${host}`, icon);
|
||||
|
||||
this.tag = opts.tag;
|
||||
const notification = new MacNotifier(title, Object.assign(opts, {
|
||||
bundleId: appId,
|
||||
canReply: true,
|
||||
silent,
|
||||
icon: profilePic
|
||||
}));
|
||||
|
||||
notification.addEventListener('click', () => {
|
||||
// focus to the server who sent the
|
||||
// notification if not focused already
|
||||
if (clickHandler) {
|
||||
clickHandler();
|
||||
}
|
||||
|
||||
focusCurrentServer();
|
||||
ipcRenderer.send('focus-app');
|
||||
});
|
||||
|
||||
notification.addEventListener('reply', this.notificationHandler);
|
||||
}
|
||||
|
||||
static requestPermission() {
|
||||
return; // eslint-disable-line no-useless-return
|
||||
}
|
||||
|
||||
// Override default Notification permission
|
||||
static get permission() {
|
||||
return ConfigUtil.getConfigItem('showNotification') ? 'granted' : 'denied';
|
||||
}
|
||||
|
||||
set onreply(handler) {
|
||||
replyHandler = handler;
|
||||
}
|
||||
|
||||
get onreply() {
|
||||
return replyHandler;
|
||||
}
|
||||
|
||||
set onclick(handler) {
|
||||
clickHandler = handler;
|
||||
}
|
||||
|
||||
get onclick() {
|
||||
return clickHandler;
|
||||
}
|
||||
|
||||
// not something that is common or
|
||||
// used by zulip server but added to be
|
||||
// future proff.
|
||||
addEventListener(event, handler) {
|
||||
if (event === 'click') {
|
||||
clickHandler = handler;
|
||||
}
|
||||
|
||||
if (event === 'reply') {
|
||||
replyHandler = handler;
|
||||
}
|
||||
}
|
||||
|
||||
notificationHandler({ response }) {
|
||||
response = parseReply(response);
|
||||
focusCurrentServer();
|
||||
setupReply(this.tag);
|
||||
|
||||
if (replyHandler) {
|
||||
replyHandler(response);
|
||||
return;
|
||||
}
|
||||
|
||||
customReply(response);
|
||||
}
|
||||
|
||||
// method specific to notification api
|
||||
// used by zulip
|
||||
close() {
|
||||
return; // eslint-disable-line no-useless-return
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = DarwinNotification;
|
||||
31
app/renderer/js/notification/default-notification.js
Normal file
31
app/renderer/js/notification/default-notification.js
Normal file
@@ -0,0 +1,31 @@
|
||||
'use strict';
|
||||
|
||||
const { ipcRenderer } = require('electron');
|
||||
const ConfigUtil = require('../utils/config-util');
|
||||
const { focusCurrentServer } = require('./helpers');
|
||||
|
||||
const NativeNotification = window.Notification;
|
||||
class BaseNotification extends NativeNotification {
|
||||
constructor(title, opts) {
|
||||
opts.silent = true;
|
||||
super(title, opts);
|
||||
|
||||
this.addEventListener('click', () => {
|
||||
// focus to the server who sent the
|
||||
// notification if not focused already
|
||||
focusCurrentServer();
|
||||
ipcRenderer.send('focus-app');
|
||||
});
|
||||
}
|
||||
|
||||
static requestPermission() {
|
||||
return; // eslint-disable-line no-useless-return
|
||||
}
|
||||
|
||||
// Override default Notification permission
|
||||
static get permission() {
|
||||
return ConfigUtil.getConfigItem('showNotification') ? 'granted' : 'denied';
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = BaseNotification;
|
||||
156
app/renderer/js/notification/helpers.js
Normal file
156
app/renderer/js/notification/helpers.js
Normal file
@@ -0,0 +1,156 @@
|
||||
const { remote } = require('electron');
|
||||
const Logger = require('../utils/logger-util.js');
|
||||
|
||||
const logger = new Logger({
|
||||
file: 'errors.log',
|
||||
timestamp: true
|
||||
});
|
||||
|
||||
// Do not change this
|
||||
const appId = 'org.zulip.zulip-electron';
|
||||
|
||||
const botsList = [];
|
||||
let botsListLoaded = false;
|
||||
|
||||
// this function load list of bots from the server
|
||||
// sync=True for a synchronous getJSON request
|
||||
// in case botsList isn't already completely loaded when required in parseRely
|
||||
function loadBots(sync = false) {
|
||||
const { $ } = window;
|
||||
botsList.length = 0;
|
||||
if (sync) {
|
||||
$.ajaxSetup({async: false});
|
||||
}
|
||||
$.getJSON('/json/users')
|
||||
.done(data => {
|
||||
const members = data.members;
|
||||
members.forEach(membersRow => {
|
||||
if (membersRow.is_bot) {
|
||||
const bot = `@${membersRow.full_name}`;
|
||||
const mention = `@**${bot.replace(/^@/, '')}**`;
|
||||
botsList.push([bot, mention]);
|
||||
}
|
||||
});
|
||||
botsListLoaded = true;
|
||||
})
|
||||
.fail(error => {
|
||||
logger.log('Load bots request failed: ', error.responseText);
|
||||
logger.log('Load bots request status: ', error.statusText);
|
||||
});
|
||||
if (sync) {
|
||||
$.ajaxSetup({async: true});
|
||||
}
|
||||
}
|
||||
|
||||
function checkElements(...elements) {
|
||||
let status = true;
|
||||
elements.forEach(element => {
|
||||
if (element === null || element === undefined) {
|
||||
status = false;
|
||||
}
|
||||
});
|
||||
return status;
|
||||
}
|
||||
|
||||
function customReply(reply) {
|
||||
// server does not support notification reply yet.
|
||||
const buttonSelector = '.messagebox #send_controls button[type=submit]';
|
||||
const messageboxSelector = '.selected_message .messagebox .messagebox-border .messagebox-content';
|
||||
const textarea = document.querySelector('#compose-textarea');
|
||||
const messagebox = document.querySelector(messageboxSelector);
|
||||
const sendButton = document.querySelector(buttonSelector);
|
||||
|
||||
// sanity check for old server versions
|
||||
const elementsExists = checkElements(textarea, messagebox, sendButton);
|
||||
if (!elementsExists) {
|
||||
return;
|
||||
}
|
||||
|
||||
textarea.value = reply;
|
||||
messagebox.click();
|
||||
sendButton.click();
|
||||
}
|
||||
|
||||
const currentWindow = remote.getCurrentWindow();
|
||||
const webContents = remote.getCurrentWebContents();
|
||||
const webContentsId = webContents.id;
|
||||
|
||||
// this function will focus the server that sent
|
||||
// the notification. Main function implemented in main.js
|
||||
function focusCurrentServer() {
|
||||
currentWindow.send('focus-webview-with-id', webContentsId);
|
||||
}
|
||||
// this function parses the reply from to notification
|
||||
// making it easier to reply from notification eg
|
||||
// @username in reply will be converted to @**username**
|
||||
// #stream in reply will be converted to #**stream**
|
||||
// bot mentions are not yet supported
|
||||
function parseReply(reply) {
|
||||
const usersDiv = document.querySelectorAll('#user_presences li');
|
||||
const streamHolder = document.querySelectorAll('#stream_filters li');
|
||||
const users = [];
|
||||
const streams = [];
|
||||
|
||||
usersDiv.forEach(userRow => {
|
||||
const anchor = userRow.querySelector('span a');
|
||||
if (anchor !== null) {
|
||||
const user = `@${anchor.textContent.trim()}`;
|
||||
const mention = `@**${user.replace(/^@/, '')}**`;
|
||||
users.push([user, mention]);
|
||||
}
|
||||
});
|
||||
|
||||
streamHolder.forEach(stream => {
|
||||
const streamAnchor = stream.querySelector('div a');
|
||||
if (streamAnchor !== null) {
|
||||
const streamName = `#${streamAnchor.textContent.trim()}`;
|
||||
const streamMention = `#**${streamName.replace(/^#/, '')}**`;
|
||||
streams.push([streamName, streamMention]);
|
||||
}
|
||||
});
|
||||
|
||||
users.forEach(([user, mention]) => {
|
||||
if (reply.includes(user)) {
|
||||
const regex = new RegExp(user, 'g');
|
||||
reply = reply.replace(regex, mention);
|
||||
}
|
||||
});
|
||||
|
||||
streams.forEach(([stream, streamMention]) => {
|
||||
const regex = new RegExp(stream, 'g');
|
||||
reply = reply.replace(regex, streamMention);
|
||||
});
|
||||
|
||||
// If botsList isn't completely loaded yet, make a synchronous getJSON request for list
|
||||
if (botsListLoaded === false) {
|
||||
loadBots(true);
|
||||
}
|
||||
|
||||
// Iterate for every bot name and replace in reply
|
||||
// @botname with @**botname**
|
||||
botsList.forEach(([bot, mention]) => {
|
||||
if (reply.includes(bot)) {
|
||||
const regex = new RegExp(bot, 'g');
|
||||
reply = reply.replace(regex, mention);
|
||||
}
|
||||
});
|
||||
|
||||
reply = reply.replace(/\\n/, '\n');
|
||||
return reply;
|
||||
}
|
||||
|
||||
function setupReply(id) {
|
||||
const { narrow } = window;
|
||||
const narrowByTopic = narrow.by_topic || narrow.by_subject;
|
||||
narrowByTopic(id, { trigger: 'notification' });
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
appId,
|
||||
checkElements,
|
||||
customReply,
|
||||
parseReply,
|
||||
setupReply,
|
||||
focusCurrentServer,
|
||||
loadBots
|
||||
};
|
||||
27
app/renderer/js/notification/index.js
Normal file
27
app/renderer/js/notification/index.js
Normal file
@@ -0,0 +1,27 @@
|
||||
'use strict';
|
||||
|
||||
const {
|
||||
remote: { app }
|
||||
} = require('electron');
|
||||
|
||||
const params = require('../utils/params-util.js');
|
||||
const DefaultNotification = require('./default-notification');
|
||||
const { appId, loadBots } = require('./helpers');
|
||||
|
||||
// From https://github.com/felixrieseberg/electron-windows-notifications#appusermodelid
|
||||
// On windows 8 we have to explicitly set the appUserModelId otherwise notification won't work.
|
||||
app.setAppUserModelId(appId);
|
||||
|
||||
window.Notification = DefaultNotification;
|
||||
|
||||
if (process.platform === 'darwin') {
|
||||
const DarwinNotification = require('./darwin-notifications');
|
||||
window.Notification = DarwinNotification;
|
||||
}
|
||||
|
||||
window.addEventListener('load', () => {
|
||||
// eslint-disable-next-line no-undef, camelcase
|
||||
if (params.isPageParams() && page_params.realm_uri) {
|
||||
loadBots();
|
||||
}
|
||||
});
|
||||
@@ -1,41 +0,0 @@
|
||||
import {ipcRenderer} from "../typed-ipc-renderer.js";
|
||||
|
||||
export type NotificationData = {
|
||||
close: () => void;
|
||||
title: string;
|
||||
dir: NotificationDirection;
|
||||
lang: string;
|
||||
body: string;
|
||||
tag: string;
|
||||
icon: string;
|
||||
data: unknown;
|
||||
};
|
||||
|
||||
export function newNotification(
|
||||
title: string,
|
||||
options: NotificationOptions,
|
||||
dispatch: (type: string, eventInit: EventInit) => boolean,
|
||||
): NotificationData {
|
||||
const notification = new Notification(title, {...options, silent: true});
|
||||
for (const type of ["click", "close", "error", "show"]) {
|
||||
notification.addEventListener(type, (ev: Event) => {
|
||||
if (type === "click") ipcRenderer.send("focus-this-webview");
|
||||
if (!dispatch(type, ev)) {
|
||||
ev.preventDefault();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
close() {
|
||||
notification.close();
|
||||
},
|
||||
title: notification.title,
|
||||
dir: notification.dir,
|
||||
lang: notification.lang,
|
||||
body: notification.body,
|
||||
tag: notification.tag,
|
||||
icon: notification.icon,
|
||||
data: notification.data,
|
||||
};
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
import {app} from "@electron/remote";
|
||||
|
||||
import {bundleUrl} from "../../../common/paths.js";
|
||||
|
||||
export class AboutView {
|
||||
static async create(): Promise<AboutView> {
|
||||
return new AboutView(
|
||||
await (await fetch(new URL("app/renderer/about.html", bundleUrl))).text(),
|
||||
);
|
||||
}
|
||||
|
||||
readonly $view: HTMLElement;
|
||||
|
||||
private constructor(templateHtml: string) {
|
||||
this.$view = document.createElement("div");
|
||||
const $shadow = this.$view.attachShadow({mode: "open"});
|
||||
$shadow.innerHTML = templateHtml;
|
||||
$shadow.querySelector("#version")!.textContent = `v${app.getVersion()}`;
|
||||
}
|
||||
|
||||
destroy() {
|
||||
// Do nothing.
|
||||
}
|
||||
}
|
||||
20
app/renderer/js/pages/network.js
Normal file
20
app/renderer/js/pages/network.js
Normal file
@@ -0,0 +1,20 @@
|
||||
'use strict';
|
||||
|
||||
const {ipcRenderer} = require('electron');
|
||||
|
||||
class NetworkTroubleshootingView {
|
||||
constructor() {
|
||||
this.$reconnectButton = document.getElementById('reconnect');
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$reconnectButton.addEventListener('click', () => {
|
||||
ipcRenderer.send('forward-message', 'reload-viewer');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
const networkTroubleshootingView = new NetworkTroubleshootingView();
|
||||
networkTroubleshootingView.init();
|
||||
};
|
||||
@@ -1,13 +0,0 @@
|
||||
import {ipcRenderer} from "../typed-ipc-renderer.js";
|
||||
|
||||
export function init(
|
||||
$reconnectButton: Element,
|
||||
$settingsButton: Element,
|
||||
): void {
|
||||
$reconnectButton.addEventListener("click", () => {
|
||||
ipcRenderer.send("forward-message", "reload-viewer");
|
||||
});
|
||||
$settingsButton.addEventListener("click", () => {
|
||||
ipcRenderer.send("forward-message", "open-settings");
|
||||
});
|
||||
}
|
||||
92
app/renderer/js/pages/preference/add-certificate.js
Normal file
92
app/renderer/js/pages/preference/add-certificate.js
Normal file
@@ -0,0 +1,92 @@
|
||||
'use-strict';
|
||||
|
||||
const { dialog } = require('electron').remote;
|
||||
const path = require('path');
|
||||
|
||||
const BaseComponent = require(__dirname + '/../../components/base.js');
|
||||
const CertificateUtil = require(__dirname + '/../../utils/certificate-util.js');
|
||||
const DomainUtil = require(__dirname + '/../../utils/domain-util.js');
|
||||
|
||||
class AddCertificate extends BaseComponent {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.props = props;
|
||||
this._certFile = '';
|
||||
}
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="settings-card certificates-card">
|
||||
<div class="certificate-input">
|
||||
<div>Organization URL</div>
|
||||
<input class="setting-input-value" autofocus placeholder="your-organization.zulipchat.com or zulip.your-organization.com"/>
|
||||
</div>
|
||||
<div class="certificate-input">
|
||||
<div>Certificate file</div>
|
||||
<button class="green" id="add-certificate-button">Upload</button>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$addCertificate = this.generateNodeFromTemplate(this.template());
|
||||
this.props.$root.appendChild(this.$addCertificate);
|
||||
this.addCertificateButton = this.$addCertificate.querySelector('#add-certificate-button');
|
||||
this.serverUrl = this.$addCertificate.querySelectorAll('input.setting-input-value')[0];
|
||||
this.initListeners();
|
||||
}
|
||||
|
||||
validateAndAdd() {
|
||||
const certificate = this._certFile;
|
||||
const serverUrl = this.serverUrl.value;
|
||||
if (certificate !== '' && serverUrl !== '') {
|
||||
const server = encodeURIComponent(DomainUtil.formatUrl(serverUrl));
|
||||
const fileName = path.basename(certificate);
|
||||
const copy = CertificateUtil.copyCertificate(server, certificate, fileName);
|
||||
if (!copy) {
|
||||
return;
|
||||
}
|
||||
CertificateUtil.setCertificate(server, fileName);
|
||||
dialog.showMessageBox({
|
||||
title: 'Success',
|
||||
message: `Certificate saved!`
|
||||
});
|
||||
this.serverUrl.value = '';
|
||||
} else {
|
||||
dialog.showErrorBox('Error', `Please, ${serverUrl === '' ?
|
||||
'Enter an Organization URL' : 'Choose certificate file'}`);
|
||||
}
|
||||
}
|
||||
|
||||
addHandler() {
|
||||
const showDialogOptions = {
|
||||
title: 'Select file',
|
||||
defaultId: 1,
|
||||
properties: ['openFile'],
|
||||
filters: [{ name: 'crt, pem', extensions: ['crt', 'pem'] }]
|
||||
};
|
||||
dialog.showOpenDialog(showDialogOptions, selectedFile => {
|
||||
if (selectedFile) {
|
||||
this._certFile = selectedFile[0] || '';
|
||||
this.validateAndAdd();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
initListeners() {
|
||||
this.addCertificateButton.addEventListener('click', () => {
|
||||
this.addHandler();
|
||||
});
|
||||
|
||||
this.serverUrl.addEventListener('keypress', event => {
|
||||
const EnterkeyCode = event.keyCode;
|
||||
|
||||
if (EnterkeyCode === 13) {
|
||||
this.addHandler();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = AddCertificate;
|
||||
63
app/renderer/js/pages/preference/badge-settings.js
Normal file
63
app/renderer/js/pages/preference/badge-settings.js
Normal file
@@ -0,0 +1,63 @@
|
||||
'use strict';
|
||||
const electron = require('electron');
|
||||
const { app } = require('electron');
|
||||
|
||||
const ConfigUtil = require(__dirname + '/../../utils/config-util.js');
|
||||
|
||||
let instance = null;
|
||||
|
||||
class BadgeSettings {
|
||||
constructor() {
|
||||
if (instance) {
|
||||
return instance;
|
||||
} else {
|
||||
instance = this;
|
||||
}
|
||||
|
||||
return instance;
|
||||
}
|
||||
|
||||
showBadgeCount(messageCount, mainWindow) {
|
||||
if (process.platform === 'darwin') {
|
||||
app.setBadgeCount(messageCount);
|
||||
}
|
||||
if (process.platform === 'win32') {
|
||||
this.updateOverlayIcon(messageCount, mainWindow);
|
||||
}
|
||||
}
|
||||
|
||||
hideBadgeCount(mainWindow) {
|
||||
if (process.platform === 'darwin') {
|
||||
app.setBadgeCount(0);
|
||||
}
|
||||
if (process.platform === 'win32') {
|
||||
mainWindow.setOverlayIcon(null, '');
|
||||
}
|
||||
}
|
||||
|
||||
updateBadge(badgeCount, mainWindow) {
|
||||
if (ConfigUtil.getConfigItem('badgeOption', true)) {
|
||||
this.showBadgeCount(badgeCount, mainWindow);
|
||||
} else {
|
||||
this.hideBadgeCount(mainWindow);
|
||||
}
|
||||
}
|
||||
|
||||
updateOverlayIcon(messageCount, mainWindow) {
|
||||
if (!mainWindow.isFocused()) {
|
||||
mainWindow.flashFrame(ConfigUtil.getConfigItem('flashTaskbarOnMessage'));
|
||||
}
|
||||
if (messageCount === 0) {
|
||||
mainWindow.setOverlayIcon(null, '');
|
||||
} else {
|
||||
mainWindow.webContents.send('render-taskbar-icon', messageCount);
|
||||
}
|
||||
}
|
||||
|
||||
updateTaskbarIcon(data, text, mainWindow) {
|
||||
const img = electron.nativeImage.createFromDataURL(data);
|
||||
mainWindow.setOverlayIcon(img, text);
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = new BadgeSettings();
|
||||
46
app/renderer/js/pages/preference/base-section.js
Normal file
46
app/renderer/js/pages/preference/base-section.js
Normal file
@@ -0,0 +1,46 @@
|
||||
'use strict';
|
||||
|
||||
const {ipcRenderer} = require('electron');
|
||||
|
||||
const BaseComponent = require(__dirname + '/../../components/base.js');
|
||||
|
||||
class BaseSection extends BaseComponent {
|
||||
generateSettingOption(props) {
|
||||
const {$element, value, clickHandler} = props;
|
||||
|
||||
$element.innerHTML = '';
|
||||
|
||||
const $optionControl = this.generateNodeFromTemplate(this.generateOptionTemplate(value));
|
||||
$element.appendChild($optionControl);
|
||||
|
||||
$optionControl.addEventListener('click', clickHandler);
|
||||
}
|
||||
|
||||
generateOptionTemplate(settingOption) {
|
||||
if (settingOption) {
|
||||
return `
|
||||
<div class="action">
|
||||
<div class="switch">
|
||||
<input class="toggle toggle-round" type="checkbox" checked>
|
||||
<label></label>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
return `
|
||||
<div class="action">
|
||||
<div class="switch">
|
||||
<input class="toggle toggle-round" type="checkbox">
|
||||
<label></label>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
reloadApp() {
|
||||
ipcRenderer.send('forward-message', 'reload-viewer');
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = BaseSection;
|
||||
@@ -1,84 +0,0 @@
|
||||
import type {Html} from "../../../../common/html.js";
|
||||
import {html} from "../../../../common/html.js";
|
||||
import {generateNodeFromHtml} from "../../components/base.js";
|
||||
import {ipcRenderer} from "../../typed-ipc-renderer.js";
|
||||
|
||||
type BaseSectionProps = {
|
||||
$element: HTMLElement;
|
||||
disabled?: boolean;
|
||||
value: boolean;
|
||||
clickHandler: () => void;
|
||||
};
|
||||
|
||||
export function generateSettingOption(props: BaseSectionProps): void {
|
||||
const {$element, disabled, value, clickHandler} = props;
|
||||
|
||||
$element.textContent = "";
|
||||
|
||||
const $optionControl = generateNodeFromHtml(
|
||||
generateOptionHtml(value, disabled),
|
||||
);
|
||||
$element.append($optionControl);
|
||||
|
||||
if (!disabled) {
|
||||
$optionControl.addEventListener("click", clickHandler);
|
||||
}
|
||||
}
|
||||
|
||||
export function generateOptionHtml(
|
||||
settingOption: boolean,
|
||||
disabled?: boolean,
|
||||
): Html {
|
||||
const labelHtml = disabled
|
||||
? // eslint-disable-next-line unicorn/template-indent
|
||||
html`<label
|
||||
class="disallowed"
|
||||
title="Setting locked by system administrator."
|
||||
></label>`
|
||||
: html`<label></label>`;
|
||||
if (settingOption) {
|
||||
return html`
|
||||
<div class="action">
|
||||
<div class="switch">
|
||||
<input class="toggle toggle-round" type="checkbox" checked disabled />
|
||||
${labelHtml}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
return html`
|
||||
<div class="action">
|
||||
<div class="switch">
|
||||
<input class="toggle toggle-round" type="checkbox" />
|
||||
${labelHtml}
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
/* A method that in future can be used to create dropdown menus using <select> <option> tags.
|
||||
it needs an object which has ``key: value`` pairs and will return a string that can be appended to HTML
|
||||
*/
|
||||
export function generateSelectHtml(
|
||||
options: Record<string, string>,
|
||||
className?: string,
|
||||
idName?: string,
|
||||
): Html {
|
||||
const optionsHtml = html``.join(
|
||||
Object.keys(options).map(
|
||||
(key) => html`
|
||||
<option name="${key}" value="${key}">${options[key]}</option>
|
||||
`,
|
||||
),
|
||||
);
|
||||
return html`
|
||||
<select class="${className}" id="${idName}">
|
||||
${optionsHtml}
|
||||
</select>
|
||||
`;
|
||||
}
|
||||
|
||||
export function reloadApp(): void {
|
||||
ipcRenderer.send("forward-message", "reload-viewer");
|
||||
}
|
||||
72
app/renderer/js/pages/preference/connected-org-section.js
Normal file
72
app/renderer/js/pages/preference/connected-org-section.js
Normal file
@@ -0,0 +1,72 @@
|
||||
'use strict';
|
||||
|
||||
const BaseSection = require(__dirname + '/base-section.js');
|
||||
const DomainUtil = require(__dirname + '/../../utils/domain-util.js');
|
||||
const ServerInfoForm = require(__dirname + '/server-info-form.js');
|
||||
const AddCertificate = require(__dirname + '/add-certificate.js');
|
||||
|
||||
class ConnectedOrgSection extends BaseSection {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.props = props;
|
||||
}
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="settings-pane" id="server-settings-pane">
|
||||
<div class="page-title">Connected organizations</div>
|
||||
<div class="title" id="existing-servers">All the connected orgnizations will appear here.</div>
|
||||
<div id="server-info-container"></div>
|
||||
<div id="new-org-button"><button class="green sea w-250">Connect to another organization</button></div>
|
||||
<div class="page-title">Add Custom Certificates</div>
|
||||
<div id="add-certificate-container"></div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.initServers();
|
||||
}
|
||||
|
||||
initServers() {
|
||||
this.props.$root.innerHTML = '';
|
||||
|
||||
const servers = DomainUtil.getDomains();
|
||||
this.props.$root.innerHTML = this.template();
|
||||
|
||||
this.$serverInfoContainer = document.getElementById('server-info-container');
|
||||
this.$existingServers = document.getElementById('existing-servers');
|
||||
this.$newOrgButton = document.getElementById('new-org-button');
|
||||
this.$addCertificateContainer = document.getElementById('add-certificate-container');
|
||||
|
||||
const noServerText = 'All the connected orgnizations will appear here';
|
||||
// Show noServerText if no servers are there otherwise hide it
|
||||
this.$existingServers.innerHTML = servers.length === 0 ? noServerText : '';
|
||||
|
||||
for (let i = 0; i < servers.length; i++) {
|
||||
new ServerInfoForm({
|
||||
$root: this.$serverInfoContainer,
|
||||
server: servers[i],
|
||||
index: i,
|
||||
onChange: this.reloadApp
|
||||
}).init();
|
||||
}
|
||||
|
||||
this.$newOrgButton.addEventListener('click', () => {
|
||||
// We don't need to import this since it's already imported in other files
|
||||
// eslint-disable-next-line no-undef
|
||||
ipcRenderer.send('forward-message', 'open-org-tab');
|
||||
});
|
||||
|
||||
this.initAddCertificate();
|
||||
}
|
||||
|
||||
initAddCertificate() {
|
||||
new AddCertificate({
|
||||
$root: this.$addCertificateContainer
|
||||
}).init();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
module.exports = ConnectedOrgSection;
|
||||
@@ -1,65 +0,0 @@
|
||||
import {html} from "../../../../common/html.js";
|
||||
import * as t from "../../../../common/translation-util.js";
|
||||
import {ipcRenderer} from "../../typed-ipc-renderer.js";
|
||||
import * as DomainUtil from "../../utils/domain-util.js";
|
||||
|
||||
import {reloadApp} from "./base-section.js";
|
||||
import {initFindAccounts} from "./find-accounts.js";
|
||||
import {initServerInfoForm} from "./server-info-form.js";
|
||||
|
||||
type ConnectedOrgSectionProps = {
|
||||
$root: Element;
|
||||
};
|
||||
|
||||
export function initConnectedOrgSection({
|
||||
$root,
|
||||
}: ConnectedOrgSectionProps): void {
|
||||
$root.textContent = "";
|
||||
|
||||
const servers = DomainUtil.getDomains();
|
||||
$root.innerHTML = html`
|
||||
<div class="settings-pane" id="server-settings-pane">
|
||||
<div class="page-title">${t.__("Connected organizations")}</div>
|
||||
<div class="title" id="existing-servers">
|
||||
${t.__("All the connected orgnizations will appear here.")}
|
||||
</div>
|
||||
<div id="server-info-container"></div>
|
||||
<div id="new-org-button">
|
||||
<button class="green sea w-250">
|
||||
${t.__("Connect to another organization")}
|
||||
</button>
|
||||
</div>
|
||||
<div class="page-title">${t.__("Find accounts by email")}</div>
|
||||
<div id="find-accounts-container"></div>
|
||||
</div>
|
||||
`.html;
|
||||
|
||||
const $serverInfoContainer = $root.querySelector("#server-info-container")!;
|
||||
const $existingServers = $root.querySelector("#existing-servers")!;
|
||||
const $newOrgButton: HTMLButtonElement =
|
||||
$root.querySelector("#new-org-button")!;
|
||||
const $findAccountsContainer = $root.querySelector(
|
||||
"#find-accounts-container",
|
||||
)!;
|
||||
|
||||
const noServerText = t.__("All the connected orgnizations will appear here");
|
||||
// Show noServerText if no servers are there otherwise hide it
|
||||
$existingServers.textContent = servers.length === 0 ? noServerText : "";
|
||||
|
||||
for (const [i, server] of servers.entries()) {
|
||||
initServerInfoForm({
|
||||
$root: $serverInfoContainer,
|
||||
server,
|
||||
index: i,
|
||||
onChange: reloadApp,
|
||||
});
|
||||
}
|
||||
|
||||
$newOrgButton.addEventListener("click", () => {
|
||||
ipcRenderer.send("forward-message", "open-org-tab");
|
||||
});
|
||||
|
||||
initFindAccounts({
|
||||
$root: $findAccountsContainer,
|
||||
});
|
||||
}
|
||||
@@ -1,66 +0,0 @@
|
||||
import {html} from "../../../../common/html.js";
|
||||
import * as LinkUtil from "../../../../common/link-util.js";
|
||||
import * as t from "../../../../common/translation-util.js";
|
||||
import {generateNodeFromHtml} from "../../components/base.js";
|
||||
|
||||
type FindAccountsProps = {
|
||||
$root: Element;
|
||||
};
|
||||
|
||||
async function findAccounts(url: string): Promise<void> {
|
||||
if (!url) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (!url.startsWith("http")) {
|
||||
url = "https://" + url;
|
||||
}
|
||||
|
||||
await LinkUtil.openBrowser(new URL("/accounts/find", url));
|
||||
}
|
||||
|
||||
export function initFindAccounts(props: FindAccountsProps): void {
|
||||
const $findAccounts = generateNodeFromHtml(html`
|
||||
<div class="settings-card certificate-card">
|
||||
<div class="certificate-input">
|
||||
<div>${t.__("Organization URL")}</div>
|
||||
<input class="setting-input-value" value="zulipchat.com" />
|
||||
</div>
|
||||
<div class="certificate-input">
|
||||
<button class="green w-150" id="find-accounts-button">
|
||||
${t.__("Find accounts")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
`);
|
||||
props.$root.append($findAccounts);
|
||||
const $findAccountsButton = $findAccounts.querySelector(
|
||||
"#find-accounts-button",
|
||||
)!;
|
||||
const $serverUrlField: HTMLInputElement = $findAccounts.querySelector(
|
||||
"input.setting-input-value",
|
||||
)!;
|
||||
|
||||
$findAccountsButton.addEventListener("click", async () => {
|
||||
await findAccounts($serverUrlField.value);
|
||||
});
|
||||
|
||||
$serverUrlField.addEventListener("click", () => {
|
||||
if ($serverUrlField.value === "zulipchat.com") {
|
||||
$serverUrlField.setSelectionRange(0, 0);
|
||||
}
|
||||
});
|
||||
|
||||
$serverUrlField.addEventListener("keypress", async (event) => {
|
||||
if (event.key === "Enter") {
|
||||
await findAccounts($serverUrlField.value);
|
||||
}
|
||||
});
|
||||
|
||||
$serverUrlField.addEventListener("input", () => {
|
||||
$serverUrlField.classList.toggle(
|
||||
"invalid-input-value",
|
||||
$serverUrlField.value === "",
|
||||
);
|
||||
});
|
||||
}
|
||||
450
app/renderer/js/pages/preference/general-section.js
Normal file
450
app/renderer/js/pages/preference/general-section.js
Normal file
@@ -0,0 +1,450 @@
|
||||
'use strict';
|
||||
const path = require('path');
|
||||
const { ipcRenderer, remote } = require('electron');
|
||||
const fs = require('fs-extra');
|
||||
|
||||
const { app, dialog } = remote;
|
||||
const currentBrowserWindow = remote.getCurrentWindow();
|
||||
const BaseSection = require(__dirname + '/base-section.js');
|
||||
const ConfigUtil = require(__dirname + '/../../utils/config-util.js');
|
||||
|
||||
class GeneralSection extends BaseSection {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.props = props;
|
||||
}
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="settings-pane">
|
||||
<div class="title">Appearance</div>
|
||||
<div id="appearance-option-settings" class="settings-card">
|
||||
<div class="setting-row" id="tray-option">
|
||||
<div class="setting-description">Show app icon in system tray</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="menubar-option" style= "display:${process.platform === 'darwin' ? 'none' : ''}">
|
||||
<div class="setting-description">Auto hide menu bar (Press Alt key to display)</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="sidebar-option">
|
||||
<div class="setting-description">Show sidebar (<span class="code">${process.platform === 'darwin' ? 'Cmd+Shift+S' : 'Ctrl+Shift+S'}</span>)</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="badge-option">
|
||||
<div class="setting-description">Show app unread badge</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="dock-bounce-option" style= "display:${process.platform === 'darwin' ? '' : 'none'}">
|
||||
<div class="setting-description">Bounce dock on new private message</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="flash-taskbar-option" style= "display:${process.platform === 'win32' ? '' : 'none'}">
|
||||
<div class="setting-description">Flash taskbar on new message</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">Desktop Notifications</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="show-notification-option">
|
||||
<div class="setting-description">Show desktop notifications</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="silent-option">
|
||||
<div class="setting-description">Mute all sounds from Zulip</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">App Updates</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="autoupdate-option">
|
||||
<div class="setting-description">Enable auto updates</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="betaupdate-option">
|
||||
<div class="setting-description">Get beta updates</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">Functionality</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="startAtLogin-option">
|
||||
<div class="setting-description">Start app at login</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="start-minimize-option">
|
||||
<div class="setting-description">Always start minimized</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="enable-spellchecker-option">
|
||||
<div class="setting-description">Enable spellchecker (requires restart)</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">Advanced</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="enable-error-reporting">
|
||||
<div class="setting-description">Enable error reporting (requires restart)</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="show-download-folder">
|
||||
<div class="setting-description">Show downloaded files in file manager</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="add-custom-css">
|
||||
<div class="setting-description">
|
||||
Add custom CSS
|
||||
</div>
|
||||
<button class="custom-css-button green">Upload</button>
|
||||
</div>
|
||||
<div class="setting-row" id="remove-custom-css">
|
||||
<div class="setting-description">
|
||||
<div class="selected-css-path" id="custom-css-path">${ConfigUtil.getConfigItem('customCSS')}</div>
|
||||
</div>
|
||||
<div class="action red" id="css-delete-action">
|
||||
<i class="material-icons">indeterminate_check_box</i>
|
||||
<span>Delete</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-row" id="download-folder">
|
||||
<div class="setting-description">
|
||||
Default download location
|
||||
</div>
|
||||
<button class="download-folder-button green">Change</button>
|
||||
</div>
|
||||
<div class="setting-row">
|
||||
<div class="setting-description">
|
||||
<div class="download-folder-path">${ConfigUtil.getConfigItem('downloadsPath', `${app.getPath('downloads')}`)}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="title">Reset Application Data</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="resetdata-option">
|
||||
<div class="setting-description">This will delete all application data including all added accounts and preferences
|
||||
</div>
|
||||
<button class="reset-data-button red w-150">Reset App Data</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.props.$root.innerHTML = this.template();
|
||||
this.updateTrayOption();
|
||||
this.updateBadgeOption();
|
||||
this.updateSilentOption();
|
||||
this.autoUpdateOption();
|
||||
this.betaUpdateOption();
|
||||
this.updateSidebarOption();
|
||||
this.updateStartAtLoginOption();
|
||||
this.updateResetDataOption();
|
||||
this.showDesktopNotification();
|
||||
this.enableSpellchecker();
|
||||
this.minimizeOnStart();
|
||||
this.addCustomCSS();
|
||||
this.showCustomCSSPath();
|
||||
this.removeCustomCSS();
|
||||
this.downloadFolder();
|
||||
this.showDownloadFolder();
|
||||
this.enableErrorReporting();
|
||||
|
||||
// Platform specific settings
|
||||
|
||||
// Flashing taskbar on Windows
|
||||
if (process.platform === 'win32') {
|
||||
this.updateFlashTaskbar();
|
||||
}
|
||||
// Dock bounce on macOS
|
||||
if (process.platform === 'darwin') {
|
||||
this.updateDockBouncing();
|
||||
}
|
||||
|
||||
// Auto hide menubar on Windows and Linux
|
||||
if (process.platform !== 'darwin') {
|
||||
this.updateMenubarOption();
|
||||
}
|
||||
}
|
||||
|
||||
updateTrayOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#tray-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('trayIcon', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('trayIcon');
|
||||
ConfigUtil.setConfigItem('trayIcon', newValue);
|
||||
ipcRenderer.send('forward-message', 'toggletray');
|
||||
this.updateTrayOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateMenubarOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#menubar-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('autoHideMenubar', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('autoHideMenubar');
|
||||
ConfigUtil.setConfigItem('autoHideMenubar', newValue);
|
||||
ipcRenderer.send('toggle-menubar', newValue);
|
||||
this.updateMenubarOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateBadgeOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#badge-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('badgeOption', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('badgeOption');
|
||||
ConfigUtil.setConfigItem('badgeOption', newValue);
|
||||
ipcRenderer.send('toggle-badge-option', newValue);
|
||||
this.updateBadgeOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateDockBouncing() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#dock-bounce-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('dockBouncing', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('dockBouncing');
|
||||
ConfigUtil.setConfigItem('dockBouncing', newValue);
|
||||
this.updateDockBouncing();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateFlashTaskbar() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#flash-taskbar-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('flashTaskbarOnMessage', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('flashTaskbarOnMessage');
|
||||
ConfigUtil.setConfigItem('flashTaskbarOnMessage', newValue);
|
||||
this.updateFlashTaskbar();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
autoUpdateOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#autoupdate-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('autoUpdate', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('autoUpdate');
|
||||
ConfigUtil.setConfigItem('autoUpdate', newValue);
|
||||
if (!newValue) {
|
||||
ConfigUtil.setConfigItem('betaUpdate', false);
|
||||
this.betaUpdateOption();
|
||||
}
|
||||
this.autoUpdateOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
betaUpdateOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#betaupdate-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('betaUpdate', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('betaUpdate');
|
||||
if (ConfigUtil.getConfigItem('autoUpdate')) {
|
||||
ConfigUtil.setConfigItem('betaUpdate', newValue);
|
||||
this.betaUpdateOption();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateSilentOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#silent-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('silent', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('silent', true);
|
||||
ConfigUtil.setConfigItem('silent', newValue);
|
||||
this.updateSilentOption();
|
||||
currentBrowserWindow.send('toggle-silent', newValue);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
showDesktopNotification() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#show-notification-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('showNotification', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('showNotification', true);
|
||||
ConfigUtil.setConfigItem('showNotification', newValue);
|
||||
this.showDesktopNotification();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateSidebarOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#sidebar-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('showSidebar', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('showSidebar');
|
||||
ConfigUtil.setConfigItem('showSidebar', newValue);
|
||||
ipcRenderer.send('forward-message', 'toggle-sidebar', newValue);
|
||||
this.updateSidebarOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateStartAtLoginOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#startAtLogin-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('startAtLogin', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('startAtLogin');
|
||||
ConfigUtil.setConfigItem('startAtLogin', newValue);
|
||||
ipcRenderer.send('toggleAutoLauncher', newValue);
|
||||
this.updateStartAtLoginOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
enableSpellchecker() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#enable-spellchecker-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('enableSpellchecker', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('enableSpellchecker');
|
||||
ConfigUtil.setConfigItem('enableSpellchecker', newValue);
|
||||
this.enableSpellchecker();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
enableErrorReporting() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#enable-error-reporting .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('errorReporting', true),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('errorReporting');
|
||||
ConfigUtil.setConfigItem('errorReporting', newValue);
|
||||
this.enableErrorReporting();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
clearAppDataDialog() {
|
||||
const clearAppDataMessage = 'By clicking proceed you will be removing all added accounts and preferences from Zulip. When the application restarts, it will be as if you are starting Zulip for the first time.';
|
||||
const getAppPath = path.join(app.getPath('appData'), app.getName());
|
||||
|
||||
dialog.showMessageBox({
|
||||
type: 'warning',
|
||||
buttons: ['YES', 'NO'],
|
||||
defaultId: 0,
|
||||
message: 'Are you sure',
|
||||
detail: clearAppDataMessage
|
||||
}, response => {
|
||||
if (response === 0) {
|
||||
fs.remove(getAppPath);
|
||||
setTimeout(() => ipcRenderer.send('forward-message', 'hard-reload'), 1000);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
customCssDialog() {
|
||||
const showDialogOptions = {
|
||||
title: 'Select file',
|
||||
defaultId: 1,
|
||||
properties: ['openFile'],
|
||||
filters: [{ name: 'CSS file', extensions: ['css'] }]
|
||||
};
|
||||
|
||||
dialog.showOpenDialog(showDialogOptions, selectedFile => {
|
||||
if (selectedFile) {
|
||||
ConfigUtil.setConfigItem('customCSS', selectedFile[0]);
|
||||
ipcRenderer.send('forward-message', 'hard-reload');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
updateResetDataOption() {
|
||||
const resetDataButton = document.querySelector('#resetdata-option .reset-data-button');
|
||||
resetDataButton.addEventListener('click', () => {
|
||||
this.clearAppDataDialog();
|
||||
});
|
||||
}
|
||||
|
||||
minimizeOnStart() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#start-minimize-option .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('startMinimized', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('startMinimized');
|
||||
ConfigUtil.setConfigItem('startMinimized', newValue);
|
||||
this.minimizeOnStart();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
addCustomCSS() {
|
||||
const customCSSButton = document.querySelector('#add-custom-css .custom-css-button');
|
||||
customCSSButton.addEventListener('click', () => {
|
||||
this.customCssDialog();
|
||||
});
|
||||
}
|
||||
|
||||
showCustomCSSPath() {
|
||||
if (!ConfigUtil.getConfigItem('customCSS')) {
|
||||
const cssPATH = document.getElementById('remove-custom-css');
|
||||
cssPATH.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
removeCustomCSS() {
|
||||
const removeCSSButton = document.getElementById('css-delete-action');
|
||||
removeCSSButton.addEventListener('click', () => {
|
||||
ConfigUtil.setConfigItem('customCSS');
|
||||
ipcRenderer.send('forward-message', 'hard-reload');
|
||||
});
|
||||
}
|
||||
|
||||
downloadFolderDialog() {
|
||||
const showDialogOptions = {
|
||||
title: 'Select Download Location',
|
||||
defaultId: 1,
|
||||
properties: ['openDirectory']
|
||||
};
|
||||
|
||||
dialog.showOpenDialog(showDialogOptions, selectedFolder => {
|
||||
if (selectedFolder) {
|
||||
ConfigUtil.setConfigItem('downloadsPath', selectedFolder[0]);
|
||||
const downloadFolderPath = document.querySelector('.download-folder-path');
|
||||
downloadFolderPath.innerText = selectedFolder[0];
|
||||
}
|
||||
});
|
||||
}
|
||||
downloadFolder() {
|
||||
const downloadFolder = document.querySelector('#download-folder .download-folder-button');
|
||||
downloadFolder.addEventListener('click', () => {
|
||||
this.downloadFolderDialog();
|
||||
});
|
||||
}
|
||||
|
||||
showDownloadFolder() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#show-download-folder .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('showDownloadFolder', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('showDownloadFolder');
|
||||
ConfigUtil.setConfigItem('showDownloadFolder', newValue);
|
||||
this.showDownloadFolder();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
module.exports = GeneralSection;
|
||||
@@ -1,691 +0,0 @@
|
||||
import type {OpenDialogOptions} from "electron/renderer";
|
||||
import fs from "node:fs";
|
||||
import path from "node:path";
|
||||
import process from "node:process";
|
||||
|
||||
import * as remote from "@electron/remote";
|
||||
import {app, dialog, session} from "@electron/remote";
|
||||
import Tagify from "@yaireo/tagify";
|
||||
import ISO6391 from "iso-639-1";
|
||||
import * as z from "zod";
|
||||
|
||||
import supportedLocales from "../../../../../public/translations/supported-locales.json";
|
||||
import * as ConfigUtil from "../../../../common/config-util.js";
|
||||
import * as EnterpriseUtil from "../../../../common/enterprise-util.js";
|
||||
import {html} from "../../../../common/html.js";
|
||||
import * as t from "../../../../common/translation-util.js";
|
||||
import {ipcRenderer} from "../../typed-ipc-renderer.js";
|
||||
|
||||
import {generateSelectHtml, generateSettingOption} from "./base-section.js";
|
||||
|
||||
const currentBrowserWindow = remote.getCurrentWindow();
|
||||
|
||||
type GeneralSectionProps = {
|
||||
$root: Element;
|
||||
};
|
||||
|
||||
export function initGeneralSection({$root}: GeneralSectionProps): void {
|
||||
$root.innerHTML = html`
|
||||
<div class="settings-pane">
|
||||
<div class="title">${t.__("Appearance")}</div>
|
||||
<div id="appearance-option-settings" class="settings-card">
|
||||
<div class="setting-row" id="tray-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Show app icon in system tray")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div
|
||||
class="setting-row"
|
||||
id="menubar-option"
|
||||
style="display:${process.platform === "darwin" ? "none" : ""}"
|
||||
>
|
||||
<div class="setting-description">
|
||||
${t.__("Auto hide menu bar (Press Alt key to display)")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="sidebar-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Show sidebar")} (<span class="code"
|
||||
>${process.platform === "darwin"
|
||||
? "Cmd+Shift+S"
|
||||
: "Ctrl+Shift+S"}</span
|
||||
>)
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="badge-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Show app unread badge")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div
|
||||
class="setting-row"
|
||||
id="dock-bounce-option"
|
||||
style="display:${process.platform === "darwin" ? "" : "none"}"
|
||||
>
|
||||
<div class="setting-description">
|
||||
${t.__("Bounce dock on new private message")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div
|
||||
class="setting-row"
|
||||
id="flash-taskbar-option"
|
||||
style="display:${process.platform === "win32" ? "" : "none"}"
|
||||
>
|
||||
<div class="setting-description">
|
||||
${t.__("Flash taskbar on new message")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">${t.__("Desktop Notifications")}</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="show-notification-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Show desktop notifications")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="silent-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Mute all sounds from Zulip")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">${t.__("App Updates")}</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="autoupdate-option">
|
||||
<div class="setting-description">${t.__("Enable auto updates")}</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="betaupdate-option">
|
||||
<div class="setting-description">${t.__("Get beta updates")}</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">${t.__("Functionality")}</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="startAtLogin-option">
|
||||
<div class="setting-description">${t.__("Start app at login")}</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="start-minimize-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Always start minimized")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="quitOnClose-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Quit when the window is closed")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="enable-spellchecker-option">
|
||||
<div class="setting-description">
|
||||
${t.__("Enable spellchecker (requires restart)")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div
|
||||
class="setting-row"
|
||||
id="spellcheck-langs"
|
||||
style="display:${process.platform === "darwin" ? "none" : ""}"
|
||||
></div>
|
||||
<div class="setting-row" id="note"></div>
|
||||
</div>
|
||||
|
||||
<div class="title">${t.__("Advanced")}</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="enable-error-reporting">
|
||||
<div class="setting-description">
|
||||
${t.__("Enable error reporting (requires restart)")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
|
||||
<div class="setting-row" id="app-language">
|
||||
<div class="setting-description">
|
||||
${t.__("App language (requires restart)")}
|
||||
</div>
|
||||
<div id="lang-div" class="lang-div"></div>
|
||||
</div>
|
||||
|
||||
<div class="setting-row" id="add-custom-css">
|
||||
<div class="setting-description">${t.__("Add custom CSS")}</div>
|
||||
<button class="custom-css-button green">${t.__("Upload")}</button>
|
||||
</div>
|
||||
<div class="setting-row" id="remove-custom-css">
|
||||
<div class="setting-description">
|
||||
<div class="selected-css-path" id="custom-css-path">
|
||||
${ConfigUtil.getConfigItem("customCSS", "")}
|
||||
</div>
|
||||
</div>
|
||||
<div class="action red" id="css-delete-action">
|
||||
<i class="material-icons">indeterminate_check_box</i>
|
||||
<span>${t.__("Delete")}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-row" id="download-folder">
|
||||
<div class="setting-description">
|
||||
${t.__("Default download location")}
|
||||
</div>
|
||||
<button class="download-folder-button green">
|
||||
${t.__("Change")}
|
||||
</button>
|
||||
</div>
|
||||
<div class="setting-row">
|
||||
<div class="setting-description">
|
||||
<div class="download-folder-path">
|
||||
${ConfigUtil.getConfigItem(
|
||||
"downloadsPath",
|
||||
app.getPath("downloads"),
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="setting-row" id="prompt-download">
|
||||
<div class="setting-description">
|
||||
${t.__("Ask where to save files before downloading")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">${t.__("Factory Reset Data")}</div>
|
||||
<div class="settings-card">
|
||||
<div class="setting-row" id="factory-reset-option">
|
||||
<div class="setting-description">
|
||||
${t.__(
|
||||
"Reset the application, thus deleting all the connected organizations and accounts.",
|
||||
)}
|
||||
</div>
|
||||
<button class="factory-reset-button red w-150">
|
||||
${t.__("Factory Reset")}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`.html;
|
||||
|
||||
updateTrayOption();
|
||||
updateBadgeOption();
|
||||
updateSilentOption();
|
||||
autoUpdateOption();
|
||||
betaUpdateOption();
|
||||
updateSidebarOption();
|
||||
updateStartAtLoginOption();
|
||||
factoryReset();
|
||||
showDesktopNotification();
|
||||
enableSpellchecker();
|
||||
minimizeOnStart();
|
||||
addCustomCss();
|
||||
showCustomCssPath();
|
||||
removeCustomCss();
|
||||
downloadFolder();
|
||||
updateQuitOnCloseOption();
|
||||
updatePromptDownloadOption();
|
||||
enableErrorReporting();
|
||||
setLocale();
|
||||
initSpellChecker();
|
||||
|
||||
// Platform specific settings
|
||||
|
||||
// Flashing taskbar on Windows
|
||||
if (process.platform === "win32") {
|
||||
updateFlashTaskbar();
|
||||
}
|
||||
|
||||
// Dock bounce on macOS
|
||||
if (process.platform === "darwin") {
|
||||
updateDockBouncing();
|
||||
}
|
||||
|
||||
// Auto hide menubar on Windows and Linux
|
||||
if (process.platform !== "darwin") {
|
||||
updateMenubarOption();
|
||||
}
|
||||
|
||||
function updateTrayOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#tray-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("trayIcon", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("trayIcon", true);
|
||||
ConfigUtil.setConfigItem("trayIcon", newValue);
|
||||
ipcRenderer.send("forward-message", "toggletray");
|
||||
updateTrayOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateMenubarOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#menubar-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("autoHideMenubar", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("autoHideMenubar", false);
|
||||
ConfigUtil.setConfigItem("autoHideMenubar", newValue);
|
||||
ipcRenderer.send("toggle-menubar", newValue);
|
||||
updateMenubarOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateBadgeOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#badge-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("badgeOption", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("badgeOption", true);
|
||||
ConfigUtil.setConfigItem("badgeOption", newValue);
|
||||
ipcRenderer.send("toggle-badge-option", newValue);
|
||||
updateBadgeOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateDockBouncing(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#dock-bounce-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("dockBouncing", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("dockBouncing", true);
|
||||
ConfigUtil.setConfigItem("dockBouncing", newValue);
|
||||
updateDockBouncing();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateFlashTaskbar(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#flash-taskbar-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("flashTaskbarOnMessage", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem(
|
||||
"flashTaskbarOnMessage",
|
||||
true,
|
||||
);
|
||||
ConfigUtil.setConfigItem("flashTaskbarOnMessage", newValue);
|
||||
updateFlashTaskbar();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function autoUpdateOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#autoupdate-option .setting-control")!,
|
||||
disabled: EnterpriseUtil.configItemExists("autoUpdate"),
|
||||
value: ConfigUtil.getConfigItem("autoUpdate", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("autoUpdate", true);
|
||||
ConfigUtil.setConfigItem("autoUpdate", newValue);
|
||||
if (!newValue) {
|
||||
ConfigUtil.setConfigItem("betaUpdate", false);
|
||||
betaUpdateOption();
|
||||
}
|
||||
|
||||
autoUpdateOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function betaUpdateOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#betaupdate-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("betaUpdate", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("betaUpdate", false);
|
||||
if (ConfigUtil.getConfigItem("autoUpdate", true)) {
|
||||
ConfigUtil.setConfigItem("betaUpdate", newValue);
|
||||
betaUpdateOption();
|
||||
}
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateSilentOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#silent-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("silent", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("silent", true);
|
||||
ConfigUtil.setConfigItem("silent", newValue);
|
||||
updateSilentOption();
|
||||
ipcRenderer.sendTo(
|
||||
currentBrowserWindow.webContents.id,
|
||||
"toggle-silent",
|
||||
newValue,
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function showDesktopNotification(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector(
|
||||
"#show-notification-option .setting-control",
|
||||
)!,
|
||||
value: ConfigUtil.getConfigItem("showNotification", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("showNotification", true);
|
||||
ConfigUtil.setConfigItem("showNotification", newValue);
|
||||
showDesktopNotification();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateSidebarOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#sidebar-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("showSidebar", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("showSidebar", true);
|
||||
ConfigUtil.setConfigItem("showSidebar", newValue);
|
||||
ipcRenderer.send("forward-message", "toggle-sidebar", newValue);
|
||||
updateSidebarOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateStartAtLoginOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#startAtLogin-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("startAtLogin", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("startAtLogin", false);
|
||||
ConfigUtil.setConfigItem("startAtLogin", newValue);
|
||||
ipcRenderer.send("toggleAutoLauncher", newValue);
|
||||
updateStartAtLoginOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function updateQuitOnCloseOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#quitOnClose-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("quitOnClose", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("quitOnClose", false);
|
||||
ConfigUtil.setConfigItem("quitOnClose", newValue);
|
||||
updateQuitOnCloseOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function enableSpellchecker(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector(
|
||||
"#enable-spellchecker-option .setting-control",
|
||||
)!,
|
||||
value: ConfigUtil.getConfigItem("enableSpellchecker", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("enableSpellchecker", true);
|
||||
ConfigUtil.setConfigItem("enableSpellchecker", newValue);
|
||||
ipcRenderer.send("configure-spell-checker");
|
||||
enableSpellchecker();
|
||||
const spellcheckerLanguageInput: HTMLElement =
|
||||
$root.querySelector("#spellcheck-langs")!;
|
||||
const spellcheckerNote: HTMLElement = $root.querySelector("#note")!;
|
||||
spellcheckerLanguageInput.style.display =
|
||||
spellcheckerLanguageInput.style.display === "none" ? "" : "none";
|
||||
spellcheckerNote.style.display =
|
||||
spellcheckerNote.style.display === "none" ? "" : "none";
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function enableErrorReporting(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector(
|
||||
"#enable-error-reporting .setting-control",
|
||||
)!,
|
||||
value: ConfigUtil.getConfigItem("errorReporting", true),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("errorReporting", true);
|
||||
ConfigUtil.setConfigItem("errorReporting", newValue);
|
||||
enableErrorReporting();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function customCssDialog(): Promise<void> {
|
||||
const showDialogOptions: OpenDialogOptions = {
|
||||
title: "Select file",
|
||||
properties: ["openFile"],
|
||||
filters: [{name: "CSS file", extensions: ["css"]}],
|
||||
};
|
||||
|
||||
const {filePaths, canceled} = await dialog.showOpenDialog(
|
||||
showDialogOptions,
|
||||
);
|
||||
if (!canceled) {
|
||||
ConfigUtil.setConfigItem("customCSS", filePaths[0]);
|
||||
ipcRenderer.send("forward-message", "hard-reload");
|
||||
}
|
||||
}
|
||||
|
||||
function setLocale(): void {
|
||||
const langDiv: HTMLSelectElement = $root.querySelector(".lang-div")!;
|
||||
const langListHtml = generateSelectHtml(supportedLocales, "lang-menu");
|
||||
langDiv.innerHTML += langListHtml.html;
|
||||
// `langMenu` is the select-option dropdown menu formed after executing the previous command
|
||||
const langMenu: HTMLSelectElement = $root.querySelector(".lang-menu")!;
|
||||
|
||||
// The next three lines set the selected language visible on the dropdown button
|
||||
let language = ConfigUtil.getConfigItem("appLanguage", "en");
|
||||
language =
|
||||
language && langMenu.options.namedItem(language) ? language : "en";
|
||||
langMenu.options.namedItem(language)!.selected = true;
|
||||
|
||||
langMenu.addEventListener("change", () => {
|
||||
ConfigUtil.setConfigItem("appLanguage", langMenu.value);
|
||||
});
|
||||
}
|
||||
|
||||
function minimizeOnStart(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#start-minimize-option .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("startMinimized", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("startMinimized", false);
|
||||
ConfigUtil.setConfigItem("startMinimized", newValue);
|
||||
minimizeOnStart();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
function addCustomCss(): void {
|
||||
const customCssButton = $root.querySelector(
|
||||
"#add-custom-css .custom-css-button",
|
||||
)!;
|
||||
customCssButton.addEventListener("click", async () => {
|
||||
await customCssDialog();
|
||||
});
|
||||
}
|
||||
|
||||
function showCustomCssPath(): void {
|
||||
if (!ConfigUtil.getConfigItem("customCSS", null)) {
|
||||
const cssPath: HTMLElement = $root.querySelector("#remove-custom-css")!;
|
||||
cssPath.style.display = "none";
|
||||
}
|
||||
}
|
||||
|
||||
function removeCustomCss(): void {
|
||||
const removeCssButton = $root.querySelector("#css-delete-action")!;
|
||||
removeCssButton.addEventListener("click", () => {
|
||||
ConfigUtil.setConfigItem("customCSS", "");
|
||||
ipcRenderer.send("forward-message", "hard-reload");
|
||||
});
|
||||
}
|
||||
|
||||
async function downloadFolderDialog(): Promise<void> {
|
||||
const showDialogOptions: OpenDialogOptions = {
|
||||
title: "Select Download Location",
|
||||
properties: ["openDirectory"],
|
||||
};
|
||||
|
||||
const {filePaths, canceled} = await dialog.showOpenDialog(
|
||||
showDialogOptions,
|
||||
);
|
||||
if (!canceled) {
|
||||
ConfigUtil.setConfigItem("downloadsPath", filePaths[0]);
|
||||
const downloadFolderPath: HTMLElement = $root.querySelector(
|
||||
".download-folder-path",
|
||||
)!;
|
||||
downloadFolderPath.textContent = filePaths[0];
|
||||
}
|
||||
}
|
||||
|
||||
function downloadFolder(): void {
|
||||
const downloadFolder = $root.querySelector(
|
||||
"#download-folder .download-folder-button",
|
||||
)!;
|
||||
downloadFolder.addEventListener("click", async () => {
|
||||
await downloadFolderDialog();
|
||||
});
|
||||
}
|
||||
|
||||
function updatePromptDownloadOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#prompt-download .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("promptDownload", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("promptDownload", false);
|
||||
ConfigUtil.setConfigItem("promptDownload", newValue);
|
||||
updatePromptDownloadOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
async function factoryResetSettings(): Promise<void> {
|
||||
const clearAppDataMessage =
|
||||
"When the application restarts, it will be as if you have just downloaded Zulip app.";
|
||||
const getAppPath = path.join(app.getPath("appData"), app.name);
|
||||
|
||||
const {response} = await dialog.showMessageBox({
|
||||
type: "warning",
|
||||
buttons: ["YES", "NO"],
|
||||
defaultId: 0,
|
||||
message: "Are you sure?",
|
||||
detail: clearAppDataMessage,
|
||||
});
|
||||
if (response === 0) {
|
||||
await fs.promises.rmdir(getAppPath, {recursive: true});
|
||||
setTimeout(() => {
|
||||
ipcRenderer.send("clear-app-settings");
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
|
||||
function factoryReset(): void {
|
||||
const factoryResetButton = $root.querySelector(
|
||||
"#factory-reset-option .factory-reset-button",
|
||||
)!;
|
||||
factoryResetButton.addEventListener("click", async () => {
|
||||
await factoryResetSettings();
|
||||
});
|
||||
}
|
||||
|
||||
function initSpellChecker(): void {
|
||||
// The elctron API is a no-op on macOS and macOS default spellchecker is used.
|
||||
if (process.platform === "darwin") {
|
||||
const note: HTMLElement = $root.querySelector("#note")!;
|
||||
note.append(t.__("On macOS, the OS spellchecker is used."));
|
||||
note.append(document.createElement("br"));
|
||||
note.append(
|
||||
t.__(
|
||||
"Change the language from System Preferences → Keyboard → Text → Spelling.",
|
||||
),
|
||||
);
|
||||
} else {
|
||||
const note: HTMLElement = $root.querySelector("#note")!;
|
||||
note.append(
|
||||
t.__("You can select a maximum of 3 languages for spellchecking."),
|
||||
);
|
||||
const spellDiv: HTMLElement = $root.querySelector("#spellcheck-langs")!;
|
||||
spellDiv.innerHTML += html`
|
||||
<div class="setting-description">${t.__("Spellchecker Languages")}</div>
|
||||
<input name="spellcheck" placeholder="Enter Languages" />
|
||||
`.html;
|
||||
|
||||
const availableLanguages = session.fromPartition(
|
||||
"persist:webviewsession",
|
||||
).availableSpellCheckerLanguages;
|
||||
let languagePairs = new Map<string, string>();
|
||||
for (const l of availableLanguages) {
|
||||
if (ISO6391.validate(l)) {
|
||||
languagePairs.set(ISO6391.getName(l), l);
|
||||
}
|
||||
}
|
||||
|
||||
// Manually set names for languages not available in ISO6391
|
||||
languagePairs.set("English (AU)", "en-AU");
|
||||
languagePairs.set("English (CA)", "en-CA");
|
||||
languagePairs.set("English (GB)", "en-GB");
|
||||
languagePairs.set("English (US)", "en-US");
|
||||
languagePairs.set("Spanish (Latin America)", "es-419");
|
||||
languagePairs.set("Spanish (Argentina)", "es-AR");
|
||||
languagePairs.set("Spanish (Mexico)", "es-MX");
|
||||
languagePairs.set("Spanish (US)", "es-US");
|
||||
languagePairs.set("Portuguese (Brazil)", "pt-BR");
|
||||
languagePairs.set("Portuguese (Portugal)", "pt-PT");
|
||||
languagePairs.set("Serbo-Croatian", "sh");
|
||||
|
||||
languagePairs = new Map(
|
||||
[...languagePairs].sort((a, b) => (a[0] < b[0] ? -1 : 1)),
|
||||
);
|
||||
|
||||
const tagField: HTMLInputElement = $root.querySelector(
|
||||
"input[name=spellcheck]",
|
||||
)!;
|
||||
const tagify = new Tagify(tagField, {
|
||||
whitelist: [...languagePairs.keys()],
|
||||
enforceWhitelist: true,
|
||||
maxTags: 3,
|
||||
dropdown: {
|
||||
enabled: 0,
|
||||
maxItems: Number.POSITIVE_INFINITY,
|
||||
closeOnSelect: false,
|
||||
highlightFirst: true,
|
||||
},
|
||||
});
|
||||
|
||||
const configuredLanguages: string[] = (
|
||||
ConfigUtil.getConfigItem("spellcheckerLanguages", null) ?? []
|
||||
).map(
|
||||
(code: string) =>
|
||||
[...languagePairs].find((pair) => pair[1] === code)![0],
|
||||
);
|
||||
tagify.addTags(configuredLanguages);
|
||||
|
||||
tagField.addEventListener("change", () => {
|
||||
if (tagField.value.length === 0) {
|
||||
ConfigUtil.setConfigItem("spellcheckerLanguages", []);
|
||||
ipcRenderer.send("configure-spell-checker");
|
||||
} else {
|
||||
const data: unknown = JSON.parse(tagField.value);
|
||||
const spellLangs: string[] = z
|
||||
.array(z.object({value: z.string()}))
|
||||
.parse(data)
|
||||
.map((elt) => languagePairs.get(elt.value)!);
|
||||
ConfigUtil.setConfigItem("spellcheckerLanguages", spellLangs);
|
||||
ipcRenderer.send("configure-spell-checker");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Do not display the spellchecker input and note if it is disabled
|
||||
if (!ConfigUtil.getConfigItem("enableSpellchecker", true)) {
|
||||
const spellcheckerLanguageInput: HTMLElement =
|
||||
$root.querySelector("#spellcheck-langs")!;
|
||||
const spellcheckerNote: HTMLElement = $root.querySelector("#note")!;
|
||||
spellcheckerLanguageInput.style.display = "none";
|
||||
spellcheckerNote.style.display = "none";
|
||||
}
|
||||
}
|
||||
}
|
||||
67
app/renderer/js/pages/preference/nav.js
Normal file
67
app/renderer/js/pages/preference/nav.js
Normal file
@@ -0,0 +1,67 @@
|
||||
'use strict';
|
||||
|
||||
const BaseComponent = require(__dirname + '/../../components/base.js');
|
||||
|
||||
class PreferenceNav extends BaseComponent {
|
||||
constructor(props) {
|
||||
super();
|
||||
|
||||
this.props = props;
|
||||
|
||||
this.navItems = ['General', 'Network', 'AddServer', 'Organizations', 'Shortcuts'];
|
||||
|
||||
this.init();
|
||||
}
|
||||
|
||||
template() {
|
||||
let navItemsTemplate = '';
|
||||
for (const navItem of this.navItems) {
|
||||
navItemsTemplate += `<div class="nav" id="nav-${navItem}">${navItem}</div>`;
|
||||
}
|
||||
|
||||
return `
|
||||
<div>
|
||||
<div id="settings-header">Settings</div>
|
||||
<div id="nav-container">${navItemsTemplate}</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.$el = this.generateNodeFromTemplate(this.template());
|
||||
this.props.$root.appendChild(this.$el);
|
||||
|
||||
this.registerListeners();
|
||||
}
|
||||
|
||||
registerListeners() {
|
||||
for (const navItem of this.navItems) {
|
||||
const $item = document.getElementById(`nav-${navItem}`);
|
||||
$item.addEventListener('click', () => {
|
||||
this.props.onItemSelected(navItem);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
select(navItemToSelect) {
|
||||
for (const navItem of this.navItems) {
|
||||
if (navItem === navItemToSelect) {
|
||||
this.activate(navItem);
|
||||
} else {
|
||||
this.deactivate(navItem);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
activate(navItem) {
|
||||
const $item = document.getElementById(`nav-${navItem}`);
|
||||
$item.classList.add('active');
|
||||
}
|
||||
|
||||
deactivate(navItem) {
|
||||
const $item = document.getElementById(`nav-${navItem}`);
|
||||
$item.classList.remove('active');
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = PreferenceNav;
|
||||
@@ -1,74 +0,0 @@
|
||||
import type {Html} from "../../../../common/html.js";
|
||||
import {html} from "../../../../common/html.js";
|
||||
import * as t from "../../../../common/translation-util.js";
|
||||
import type {NavItem} from "../../../../common/types.js";
|
||||
import {generateNodeFromHtml} from "../../components/base.js";
|
||||
|
||||
type PreferenceNavProps = {
|
||||
$root: Element;
|
||||
onItemSelected: (navItem: NavItem) => void;
|
||||
};
|
||||
|
||||
export default class PreferenceNav {
|
||||
navItems: NavItem[];
|
||||
$el: Element;
|
||||
constructor(private readonly props: PreferenceNavProps) {
|
||||
this.navItems = [
|
||||
"General",
|
||||
"Network",
|
||||
"AddServer",
|
||||
"Organizations",
|
||||
"Shortcuts",
|
||||
];
|
||||
|
||||
this.$el = generateNodeFromHtml(this.templateHtml());
|
||||
this.props.$root.append(this.$el);
|
||||
this.registerListeners();
|
||||
}
|
||||
|
||||
templateHtml(): Html {
|
||||
const navItemsHtml = html``.join(
|
||||
this.navItems.map(
|
||||
(navItem) => html`
|
||||
<div class="nav" id="nav-${navItem}">${t.__(navItem)}</div>
|
||||
`,
|
||||
),
|
||||
);
|
||||
|
||||
return html`
|
||||
<div>
|
||||
<div id="settings-header">${t.__("Settings")}</div>
|
||||
<div id="nav-container">${navItemsHtml}</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
registerListeners(): void {
|
||||
for (const navItem of this.navItems) {
|
||||
const $item = this.$el.querySelector(`#nav-${CSS.escape(navItem)}`)!;
|
||||
$item.addEventListener("click", () => {
|
||||
this.props.onItemSelected(navItem);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
select(navItemToSelect: NavItem): void {
|
||||
for (const navItem of this.navItems) {
|
||||
if (navItem === navItemToSelect) {
|
||||
this.activate(navItem);
|
||||
} else {
|
||||
this.deactivate(navItem);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
activate(navItem: NavItem): void {
|
||||
const $item = this.$el.querySelector(`#nav-${CSS.escape(navItem)}`)!;
|
||||
$item.classList.add("active");
|
||||
}
|
||||
|
||||
deactivate(navItem: NavItem): void {
|
||||
const $item = this.$el.querySelector(`#nav-${CSS.escape(navItem)}`)!;
|
||||
$item.classList.remove("active");
|
||||
}
|
||||
}
|
||||
128
app/renderer/js/pages/preference/network-section.js
Normal file
128
app/renderer/js/pages/preference/network-section.js
Normal file
@@ -0,0 +1,128 @@
|
||||
'use strict';
|
||||
|
||||
const {ipcRenderer} = require('electron');
|
||||
|
||||
const BaseSection = require(__dirname + '/base-section.js');
|
||||
const ConfigUtil = require(__dirname + '/../../utils/config-util.js');
|
||||
|
||||
class NetworkSection extends BaseSection {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.props = props;
|
||||
}
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="settings-pane">
|
||||
<div class="title">Proxy</div>
|
||||
<div id="appearance-option-settings" class="settings-card">
|
||||
<div class="setting-row" id="use-system-settings">
|
||||
<div class="setting-description">Use system proxy settings (requires restart)</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="use-manual-settings">
|
||||
<div class="setting-description">Manual proxy configuration</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="manual-proxy-block">
|
||||
<div class="setting-row" id="proxy-pac-option">
|
||||
<span class="setting-input-key">PAC script</span>
|
||||
<input class="setting-input-value" placeholder="e.g. foobar.com/pacfile.js"/>
|
||||
</div>
|
||||
<div class="setting-row" id="proxy-rules-option">
|
||||
<span class="setting-input-key">Proxy rules</span>
|
||||
<input class="setting-input-value" placeholder="e.g. http=foopy:80;ftp=foopy2"/>
|
||||
</div>
|
||||
<div class="setting-row" id="proxy-bypass-option">
|
||||
<span class="setting-input-key">Proxy bypass rules</span>
|
||||
<input class="setting-input-value" placeholder="e.g. foobar.com"/>
|
||||
</div>
|
||||
<div class="setting-row">
|
||||
<div class="action green" id="proxy-save-action">
|
||||
<span>Save</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.props.$root.innerHTML = this.template();
|
||||
this.$proxyPAC = document.querySelector('#proxy-pac-option .setting-input-value');
|
||||
this.$proxyRules = document.querySelector('#proxy-rules-option .setting-input-value');
|
||||
this.$proxyBypass = document.querySelector('#proxy-bypass-option .setting-input-value');
|
||||
this.$proxySaveAction = document.getElementById('proxy-save-action');
|
||||
this.$manualProxyBlock = this.props.$root.querySelector('.manual-proxy-block');
|
||||
this.initProxyOption();
|
||||
|
||||
this.$proxyPAC.value = ConfigUtil.getConfigItem('proxyPAC', '');
|
||||
this.$proxyRules.value = ConfigUtil.getConfigItem('proxyRules', '');
|
||||
this.$proxyBypass.value = ConfigUtil.getConfigItem('proxyBypass', '');
|
||||
|
||||
this.$proxySaveAction.addEventListener('click', () => {
|
||||
ConfigUtil.setConfigItem('proxyPAC', this.$proxyPAC.value);
|
||||
ConfigUtil.setConfigItem('proxyRules', this.$proxyRules.value);
|
||||
ConfigUtil.setConfigItem('proxyBypass', this.$proxyBypass.value);
|
||||
|
||||
ipcRenderer.send('forward-message', 'reload-proxy', true);
|
||||
});
|
||||
}
|
||||
|
||||
initProxyOption() {
|
||||
const manualProxyEnabled = ConfigUtil.getConfigItem('useManualProxy', false);
|
||||
this.toggleManualProxySettings(manualProxyEnabled);
|
||||
|
||||
this.updateProxyOption();
|
||||
}
|
||||
|
||||
toggleManualProxySettings(option) {
|
||||
if (option) {
|
||||
this.$manualProxyBlock.classList.remove('hidden');
|
||||
} else {
|
||||
this.$manualProxyBlock.classList.add('hidden');
|
||||
}
|
||||
}
|
||||
|
||||
updateProxyOption() {
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#use-system-settings .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('useSystemProxy', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('useSystemProxy');
|
||||
const manualProxyValue = ConfigUtil.getConfigItem('useManualProxy');
|
||||
if (manualProxyValue && newValue) {
|
||||
ConfigUtil.setConfigItem('useManualProxy', !manualProxyValue);
|
||||
this.toggleManualProxySettings(!manualProxyValue);
|
||||
}
|
||||
if (newValue === false) {
|
||||
// Remove proxy system proxy settings
|
||||
ConfigUtil.setConfigItem('proxyRules', '');
|
||||
ipcRenderer.send('forward-message', 'reload-proxy', false);
|
||||
}
|
||||
ConfigUtil.setConfigItem('useSystemProxy', newValue);
|
||||
this.updateProxyOption();
|
||||
}
|
||||
});
|
||||
this.generateSettingOption({
|
||||
$element: document.querySelector('#use-manual-settings .setting-control'),
|
||||
value: ConfigUtil.getConfigItem('useManualProxy', false),
|
||||
clickHandler: () => {
|
||||
const newValue = !ConfigUtil.getConfigItem('useManualProxy');
|
||||
const systemProxyValue = ConfigUtil.getConfigItem('useSystemProxy');
|
||||
this.toggleManualProxySettings(newValue);
|
||||
if (systemProxyValue && newValue) {
|
||||
ConfigUtil.setConfigItem('useSystemProxy', !systemProxyValue);
|
||||
}
|
||||
ConfigUtil.setConfigItem('proxyRules', '');
|
||||
ConfigUtil.setConfigItem('useManualProxy', newValue);
|
||||
// Reload app only when turning manual proxy off, hence !newValue
|
||||
ipcRenderer.send('forward-message', 'reload-proxy', !newValue);
|
||||
this.updateProxyOption();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = NetworkSection;
|
||||
@@ -1,136 +0,0 @@
|
||||
import * as ConfigUtil from "../../../../common/config-util.js";
|
||||
import {html} from "../../../../common/html.js";
|
||||
import * as t from "../../../../common/translation-util.js";
|
||||
import {ipcRenderer} from "../../typed-ipc-renderer.js";
|
||||
|
||||
import {generateSettingOption} from "./base-section.js";
|
||||
|
||||
type NetworkSectionProps = {
|
||||
$root: Element;
|
||||
};
|
||||
|
||||
export function initNetworkSection({$root}: NetworkSectionProps): void {
|
||||
$root.innerHTML = html`
|
||||
<div class="settings-pane">
|
||||
<div class="title">${t.__("Proxy")}</div>
|
||||
<div id="appearance-option-settings" class="settings-card">
|
||||
<div class="setting-row" id="use-system-settings">
|
||||
<div class="setting-description">
|
||||
${t.__("Use system proxy settings (requires restart)")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="setting-row" id="use-manual-settings">
|
||||
<div class="setting-description">
|
||||
${t.__("Manual proxy configuration")}
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
<div class="manual-proxy-block">
|
||||
<div class="setting-row" id="proxy-pac-option">
|
||||
<span class="setting-input-key">PAC ${t.__("script")}</span>
|
||||
<input
|
||||
class="setting-input-value"
|
||||
placeholder="e.g. foobar.com/pacfile.js"
|
||||
/>
|
||||
</div>
|
||||
<div class="setting-row" id="proxy-rules-option">
|
||||
<span class="setting-input-key">${t.__("Proxy rules")}</span>
|
||||
<input
|
||||
class="setting-input-value"
|
||||
placeholder="e.g. http=foopy:80;ftp=foopy2"
|
||||
/>
|
||||
</div>
|
||||
<div class="setting-row" id="proxy-bypass-option">
|
||||
<span class="setting-input-key">${t.__("Proxy bypass rules")}</span>
|
||||
<input class="setting-input-value" placeholder="e.g. foobar.com" />
|
||||
</div>
|
||||
<div class="setting-row">
|
||||
<div class="action green" id="proxy-save-action">
|
||||
<span>${t.__("Save")}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`.html;
|
||||
|
||||
const $proxyPac: HTMLInputElement = $root.querySelector(
|
||||
"#proxy-pac-option .setting-input-value",
|
||||
)!;
|
||||
const $proxyRules: HTMLInputElement = $root.querySelector(
|
||||
"#proxy-rules-option .setting-input-value",
|
||||
)!;
|
||||
const $proxyBypass: HTMLInputElement = $root.querySelector(
|
||||
"#proxy-bypass-option .setting-input-value",
|
||||
)!;
|
||||
const $proxySaveAction = $root.querySelector("#proxy-save-action")!;
|
||||
const $manualProxyBlock = $root.querySelector(".manual-proxy-block")!;
|
||||
|
||||
toggleManualProxySettings(ConfigUtil.getConfigItem("useManualProxy", false));
|
||||
updateProxyOption();
|
||||
|
||||
$proxyPac.value = ConfigUtil.getConfigItem("proxyPAC", "");
|
||||
$proxyRules.value = ConfigUtil.getConfigItem("proxyRules", "");
|
||||
$proxyBypass.value = ConfigUtil.getConfigItem("proxyBypass", "");
|
||||
|
||||
$proxySaveAction.addEventListener("click", () => {
|
||||
ConfigUtil.setConfigItem("proxyPAC", $proxyPac.value);
|
||||
ConfigUtil.setConfigItem("proxyRules", $proxyRules.value);
|
||||
ConfigUtil.setConfigItem("proxyBypass", $proxyBypass.value);
|
||||
|
||||
ipcRenderer.send("forward-message", "reload-proxy", true);
|
||||
});
|
||||
|
||||
function toggleManualProxySettings(option: boolean): void {
|
||||
$manualProxyBlock.classList.toggle("hidden", !option);
|
||||
}
|
||||
|
||||
function updateProxyOption(): void {
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#use-system-settings .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("useSystemProxy", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("useSystemProxy", false);
|
||||
const manualProxyValue = ConfigUtil.getConfigItem(
|
||||
"useManualProxy",
|
||||
false,
|
||||
);
|
||||
if (manualProxyValue && newValue) {
|
||||
ConfigUtil.setConfigItem("useManualProxy", !manualProxyValue);
|
||||
toggleManualProxySettings(!manualProxyValue);
|
||||
}
|
||||
|
||||
if (!newValue) {
|
||||
// Remove proxy system proxy settings
|
||||
ConfigUtil.setConfigItem("proxyRules", "");
|
||||
ipcRenderer.send("forward-message", "reload-proxy", false);
|
||||
}
|
||||
|
||||
ConfigUtil.setConfigItem("useSystemProxy", newValue);
|
||||
updateProxyOption();
|
||||
},
|
||||
});
|
||||
generateSettingOption({
|
||||
$element: $root.querySelector("#use-manual-settings .setting-control")!,
|
||||
value: ConfigUtil.getConfigItem("useManualProxy", false),
|
||||
clickHandler() {
|
||||
const newValue = !ConfigUtil.getConfigItem("useManualProxy", false);
|
||||
const systemProxyValue = ConfigUtil.getConfigItem(
|
||||
"useSystemProxy",
|
||||
false,
|
||||
);
|
||||
toggleManualProxySettings(newValue);
|
||||
if (systemProxyValue && newValue) {
|
||||
ConfigUtil.setConfigItem("useSystemProxy", !systemProxyValue);
|
||||
}
|
||||
|
||||
ConfigUtil.setConfigItem("proxyRules", "");
|
||||
ConfigUtil.setConfigItem("useManualProxy", newValue);
|
||||
// Reload app only when turning manual proxy off, hence !newValue
|
||||
ipcRenderer.send("forward-message", "reload-proxy", !newValue);
|
||||
updateProxyOption();
|
||||
},
|
||||
});
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user