Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-08 14:25:51 +01:00
Code Issues Packages Projects Releases Activity

client/settings/disable motion: refactor

Browse Source
This commit is contained in:
Adorian Doran
2025-08-23 00:19:26 +03:00
parent d1538508e8
commit 3e3cc8c541
4 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
apps/client/src/widgets/containers/root_container.ts
View File

@@ -1,6 +1,8 @@
import utils from "../../services/utils.js"; import { EventData } from "../../components/app_context.js";
import type BasicWidget from "../basic_widget.js";
import FlexContainer from "./flex_container.js"; import FlexContainer from "./flex_container.js";
import options from "../../services/options.js";
import type BasicWidget from "../basic_widget.js";
import utils from "../../services/utils.js";
/** /**
* The root container is the top-most widget/container, from which the entire layout derives. * The root container is the top-most widget/container, from which the entire layout derives.
@@ -20,6 +22,7 @@ export default class RootContainer extends FlexContainer<BasicWidget> {
this.id("root-widget"); this.id("root-widget");
this.css("height", "100dvh"); this.css("height", "100dvh");
this.originalViewportHeight = getViewportHeight(); this.originalViewportHeight = getViewportHeight();
} }
render(): JQuery<HTMLElement> { render(): JQuery<HTMLElement> {
@@ -27,15 +30,27 @@ export default class RootContainer extends FlexContainer<BasicWidget> {
window.visualViewport?.addEventListener("resize", () => this.#onMobileResize()); window.visualViewport?.addEventListener("resize", () => this.#onMobileResize());
} }
this.#setMotion(options.is("motionEnabled"));
return super.render(); return super.render();
} }
entitiesReloadedEvent({ loadResults }: EventData<"entitiesReloaded">) {
if (loadResults.isOptionReloaded("motionEnabled")) {
this.#setMotion(options.is("motionEnabled"));
}
}
#onMobileResize() { #onMobileResize() {
const currentViewportHeight = getViewportHeight(); const currentViewportHeight = getViewportHeight();
const isKeyboardOpened = (currentViewportHeight < this.originalViewportHeight); const isKeyboardOpened = (currentViewportHeight < this.originalViewportHeight);
this.$widget.toggleClass("virtual-keyboard-opened", isKeyboardOpened); this.$widget.toggleClass("virtual-keyboard-opened", isKeyboardOpened);
} }
#setMotion(enabled: boolean) {
document.body.classList.toggle("motion-disabled", !enabled);
jQuery.fx.off = !enabled;
}
} }
function getViewportHeight() { function getViewportHeight() {

2
apps/client/src/widgets/type_widgets/options/appearance.tsx
View File

@@ -247,7 +247,7 @@ function ElectronIntegration() {
} }
function Performance() { function Performance() {
const [ motionEnabled, setMotionEnabled ] = useTriliumOptionBool("motionEnabled", true); const [ motionEnabled, setMotionEnabled ] = useTriliumOptionBool("motionEnabled");
return <OptionsSection title={t("ui-performance.title")}> return <OptionsSection title={t("ui-performance.title")}>
<FormGroup name="motion-enabled"> <FormGroup name="motion-enabled">

9
apps/server/src/assets/views/desktop.ejs
View File

@@ -9,7 +9,7 @@
<link rel="manifest" crossorigin="use-credentials" href="manifest.webmanifest"> <link rel="manifest" crossorigin="use-credentials" href="manifest.webmanifest">
<title>Trilium Notes</title> <title>Trilium Notes</title>
</head> </head>
<body id="trilium-app" class="desktop heading-style-<%= headingStyle %> layout-<%= layoutOrientation %> platform-<%= platform %> <%= isElectron ? 'electron' : '' %> <%= hasNativeTitleBar ? 'native-titlebar' : '' %> <%= hasBackgroundEffects ? 'background-effects' : '' %> <%= motionEnabled ? '' : 'motion-disabled' %>"> <body id="trilium-app" class="desktop heading-style-<%= headingStyle %> layout-<%= layoutOrientation %> platform-<%= platform %> <%= isElectron ? 'electron' : '' %> <%= hasNativeTitleBar ? 'native-titlebar' : '' %> <%= hasBackgroundEffects ? 'background-effects' : '' %>">
<noscript><%= t("javascript-required") %></noscript> <noscript><%= t("javascript-required") %></noscript>
<script> <script>
@@ -56,12 +56,5 @@
<script src="<%= appPath %>/runtime.js" crossorigin type="module"></script> <script src="<%= appPath %>/runtime.js" crossorigin type="module"></script>
<script src="<%= appPath %>/desktop.js" crossorigin type="module"></script> <script src="<%= appPath %>/desktop.js" crossorigin type="module"></script>
<script>
// Turn off jQuery animations if motion is disabled
addEventListener("DOMContentLoaded", () => {
jQuery.fx.off = <%= motionEnabled !== true %>;
});
</script>
</body> </body>
</html> </html>

1
apps/server/src/routes/index.ts
View File

@@ -53,7 +53,6 @@ function index(req: Request, res: Response) {
isDev, isDev,
isMainWindow: view === "mobile" ? true : !req.query.extraWindow, isMainWindow: view === "mobile" ? true : !req.query.extraWindow,
isProtectedSessionAvailable: protectedSessionService.isProtectedSessionAvailable(), isProtectedSessionAvailable: protectedSessionService.isProtectedSessionAvailable(),
motionEnabled: options.motionEnabled === "true",
maxContentWidth: Math.max(640, parseInt(options.maxContentWidth)), maxContentWidth: Math.max(640, parseInt(options.maxContentWidth)),
triliumVersion: packageJson.version, triliumVersion: packageJson.version,
assetPath: assetPath, assetPath: assetPath,