Tools/Notes
1
0
Fork 0
mirror of https://github.com/TriliumNext/Notes.git synced 2025-07-27 18:12:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(settings): merge zoom factor with desktop app settings

Browse Source
This commit is contained in:
Elian Doran 2024-12-09 22:51:27 +02:00
parent f1241b2ebf
commit efae109e35
No known key found for this signature in database
4 changed files with 18 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/public/app/widgets/type_widgets/content_widget.js
View File

@ -1,6 +1,5 @@
import TypeWidget from "./type_widget.js"; import TypeWidget from "./type_widget.js";
import ZoomFactorOptions from "./options/appearance/zoom_factor.js"; import ElectronIntegrationOptions from "./options/appearance/electron_integration.js";
import NativeTitleBarOptions from "./options/appearance/electron_integration.js";
import ThemeOptions from "./options/appearance/theme.js"; import ThemeOptions from "./options/appearance/theme.js";
import FontsOptions from "./options/appearance/fonts.js"; import FontsOptions from "./options/appearance/fonts.js";
import MaxContentWidthOptions from "./options/appearance/max_content_width.js"; import MaxContentWidthOptions from "./options/appearance/max_content_width.js";
@ -62,8 +61,7 @@ const CONTENT_WIDGETS = {
ThemeOptions, ThemeOptions,
FontsOptions, FontsOptions,
CodeBlockOptions, CodeBlockOptions,
ZoomFactorOptions, ElectronIntegrationOptions,
NativeTitleBarOptions,
MaxContentWidthOptions, MaxContentWidthOptions,
RibbonOptions RibbonOptions
], ],

14
src/public/app/widgets/type_widgets/options/appearance/electron_integration.js
View File

@ -6,6 +6,15 @@ const TPL = `
<div class="options-section"> <div class="options-section">
<h4>${t("electron_integration.desktop-application")}</h4> <h4>${t("electron_integration.desktop-application")}</h4>
<div class="form-group row">
<div class="col-12">
<label>${t("electron_integration.zoom-factor")}</label>
<input type="number" class="zoom-factor-select form-control options-number-input" min="0.3" max="2.0" step="0.1"/>
<p>${t("zoom_factor.description")}</p>
</div>
</div>
<hr />
<div class="side-checkbox"> <div class="side-checkbox">
<label class="form-check"> <label class="form-check">
<input type="checkbox" class="native-title-bar form-check-input" /> <input type="checkbox" class="native-title-bar form-check-input" />
@ -29,6 +38,10 @@ const TPL = `
export default class ElectronIntegrationOptions extends OptionsWidget { export default class ElectronIntegrationOptions extends OptionsWidget {
doRender() { doRender() {
this.$widget = $(TPL); this.$widget = $(TPL);
this.$zoomFactorSelect = this.$widget.find(".zoom-factor-select");
this.$zoomFactorSelect.on('change', () => { appContext.triggerCommand('setZoomFactorAndSave', {zoomFactor: this.$zoomFactorSelect.val()}); });
this.$nativeTitleBar = this.$widget.find("input.native-title-bar"); this.$nativeTitleBar = this.$widget.find("input.native-title-bar");
this.$nativeTitleBar.on("change", () => this.updateCheckboxOption("nativeTitleBarVisible", this.$nativeTitleBar)); this.$nativeTitleBar.on("change", () => this.updateCheckboxOption("nativeTitleBarVisible", this.$nativeTitleBar));
@ -48,6 +61,7 @@ export default class ElectronIntegrationOptions extends OptionsWidget {
} }
async optionsLoaded(options) { async optionsLoaded(options) {
this.$zoomFactorSelect.val(options.zoomFactor);
this.setCheckboxState(this.$nativeTitleBar, options.nativeTitleBarVisible); this.setCheckboxState(this.$nativeTitleBar, options.nativeTitleBarVisible);
this.setCheckboxState(this.$backgroundEffects, options.backgroundEffects); this.setCheckboxState(this.$backgroundEffects, options.backgroundEffects);
} }

28
src/public/app/widgets/type_widgets/options/appearance/zoom_factor.js
View File

@ -1,28 +0,0 @@
import appContext from "../../../../components/app_context.js";
import OptionsWidget from "../options_widget.js";
import utils from "../../../../services/utils.js";
import { t } from "../../../../services/i18n.js";
const TPL = `
<div class="options-section">
<h4>${t("zoom_factor.title")}</h4>
<input type="number" class="zoom-factor-select form-control options-number-input" min="0.3" max="2.0" step="0.1"/>
<p>${t("zoom_factor.description")}</p>
</div>`;
export default class ZoomFactorOptions extends OptionsWidget {
isEnabled() {
return super.isEnabled() && utils.isElectron();
}
doRender() {
this.$widget = $(TPL);
this.$zoomFactorSelect = this.$widget.find(".zoom-factor-select");
this.$zoomFactorSelect.on('change', () => { appContext.triggerCommand('setZoomFactorAndSave', {zoomFactor: this.$zoomFactorSelect.val()}); });
}
async optionsLoaded(options) {
this.$zoomFactorSelect.val(options.zoomFactor);
}
}

3
src/public/translations/en/translation.json
View File

@ -1581,6 +1581,7 @@
"native-title-bar-description": "For Windows and macOS, keeping the native title bar off makes the application look more compact. On Linux, keeping the native title bar on integrates better with the rest of the system.", "native-title-bar-description": "For Windows and macOS, keeping the native title bar off makes the application look more compact. On Linux, keeping the native title bar on integrates better with the rest of the system.",
"background-effects": "Enable background effects (Windows 11 only)", "background-effects": "Enable background effects (Windows 11 only)",
"background-effects-description": "The Mica effect adds a blurred, stylish background to app windows, creating depth and a modern look.", "background-effects-description": "The Mica effect adds a blurred, stylish background to app windows, creating depth and a modern look.",
"restart-app-button": "Restart the application to view the changes" "restart-app-button": "Restart the application to view the changes",
"zoom-factor": "Zoom factor"
} }
} }