🎨 fix #7047

siyuan-note · Jan 16, 2023 · b480d49 · b480d49
1 parent ff91a58
commit b480d49
Show file tree

Hide file tree

Showing 8 changed files with 48 additions and 21 deletions.
diff --git a/app/appearance/langs/en_US.json b/app/appearance/langs/en_US.json
@@ -1,4 +1,6 @@
 {
+  "exitFocus": "Exit focus",
+  "exitReadOnly": "Exit read-only",
   "pointExchangeSize": "Point Exchange",
   "panel": "Panel",
   "copyPath": "Copy Path",

diff --git a/app/appearance/langs/es_ES.json b/app/appearance/langs/es_ES.json
@@ -1,4 +1,6 @@
 {
+  "exitFocus": "Salir del enfoque",
+  "exitReadOnly": "Salir de solo lectura",
   "pointExchangeSize": "Intercambio de puntos",
   "panel": "Panel",
   "copyPath": "Copiar ruta",

diff --git a/app/appearance/langs/fr_FR.json b/app/appearance/langs/fr_FR.json
@@ -1,4 +1,6 @@
 {
+  "exitFocus": "Quitter le focus",
+  "exitReadOnly": "Quitter en lecture seule",
   "pointExchangeSize": "Échange de points",
   "panel": "Panneau",
   "copyPath": "Copier le chemin",

diff --git a/app/appearance/langs/zh_CHT.json b/app/appearance/langs/zh_CHT.json
@@ -1,4 +1,6 @@
 {
+  "exitFocus": "退出聚焦",
+  "exitReadOnly": "退出只讀",
   "pointExchangeSize": "積分兌換",
   "panel": "面板",
   "copyPath": "複製路徑",

diff --git a/app/appearance/langs/zh_CN.json b/app/appearance/langs/zh_CN.json
@@ -1,4 +1,6 @@
 {
+  "exitFocus": "退出聚焦",
+  "exitReadOnly": "退出只读",
   "pointExchangeSize": "积分兑换",
   "panel": "面板",
   "copyPath": "复制路径",

diff --git a/app/src/dialog/processSystem.ts b/app/src/dialog/processSystem.ts
@@ -11,6 +11,7 @@ import {isMobile} from "../util/functions";
 import {confirmDialog} from "./confirmDialog";
 import {getCurrentWindow} from "@electron/remote";
 import {getWorkspaceName} from "../menus/workspace";
+import {escapeHtml} from "../util/escape";
 
 export const lockScreen = () => {
     /// #if BROWSER
@@ -281,36 +282,38 @@ export const setTitle = (title: string, protyle?: IProtyle) => {
         dragElement.setAttribute("title", versionTitle);
     } else {
         title = title || "Untitled";
+        document.title = `${title} - ${workspaceName} - ${window.siyuan.languages.siyuanNote} v${Constants.SIYUAN_VERSION}`;
+        dragElement.setAttribute("title", title);
+        title = escapeHtml(title)
         if (protyle && protyle.disabled) {
-            title = `[${window.siyuan.languages.editReadonly}] ${title}`;
+            title = `${title}<span class="fn__space"></span><button id="barExitReadOnly" class="b3-button b3-button--small b3-button--success">${window.siyuan.languages.exitReadOnly}</button>`;
         }
         if (protyle && protyle.block.showAll) {
-            title = `[${window.siyuan.languages.enter}] ${title}`;
+            title = `${title}<span class="fn__space"></span><button data-id="${protyle.model.headElement.getAttribute("data-id")}" id="barExitFocus" class="b3-button b3-button--small b3-button--info">${window.siyuan.languages.exitFocus}</button>`;
         }
-        document.title = `${title} - ${workspaceName}  - ${window.siyuan.languages.siyuanNote} v${Constants.SIYUAN_VERSION}`;
-        dragElement.textContent = title;
-        dragElement.setAttribute("title", title);
+        dragElement.innerHTML = title;
     }
 };
 
-export const updateTitle = (readonly?: boolean, zoomIn?: boolean) => {
-    const title = document.getElementById("drag").textContent;
+export const updateTitle = (readonly?: boolean, zoomIn?: boolean, zoomInId?: string) => {
+    const dragElement = document.getElementById("drag");
+    const title = dragElement.textContent;
     if (typeof readonly === "boolean") {
-        if (readonly) {
-            if (title.indexOf(window.siyuan.languages.editReadonly) === -1) {
-                setTitle(`[${window.siyuan.languages.editReadonly}] ${title}`);
-            }
-        } else {
-            setTitle(title.replace(`[${window.siyuan.languages.editReadonly}] `, ""));
+        const barExitReadOnlyElement = dragElement.querySelector("#barExitReadOnly")
+        if (readonly && !barExitReadOnlyElement) {
+            dragElement.insertAdjacentHTML("beforeend", `<span class="fn__space"></span><button id="barExitReadOnly" class="b3-button b3-button--small b3-button--success">${window.siyuan.languages.exitReadOnly}</button>`)
+        } else if (!readonly && barExitReadOnlyElement) {
+            barExitReadOnlyElement.previousElementSibling.remove();
+            barExitReadOnlyElement.remove();
         }
     }
     if (typeof zoomIn === "boolean") {
-        if (zoomIn) {
-            if (title.indexOf(window.siyuan.languages.enter) === -1) {
-                setTitle(`[${window.siyuan.languages.enter}] ${title}`);
-            }
-        } else {
-            setTitle(title.replace(`[${window.siyuan.languages.enter}] `, ""));
+        const barExitFocusElement = dragElement.querySelector("#barExitFocus")
+        if (zoomIn && !barExitFocusElement) {
+            dragElement.insertAdjacentHTML("beforeend", `<span class="fn__space"></span><button data-id="${zoomInId}" id="barExitFocus" class="b3-button b3-button--small b3-button--info">${window.siyuan.languages.exitFocus}</button>`)
+        } else if (!zoomIn && barExitFocusElement) {
+            barExitFocusElement.previousElementSibling.remove();
+            barExitFocusElement.remove();
         }
     }
 };

diff --git a/app/src/menus/protyle.ts b/app/src/menus/protyle.ts
@@ -476,7 +476,6 @@ export const zoomOut = (protyle: IProtyle, id: string, focusId?: string, isPushB
         } else {
             onGet(getResponse, protyle, id === protyle.block.rootID ? [Constants.CB_GET_FOCUS, Constants.CB_GET_HTML, Constants.CB_GET_UNUNDO] : [Constants.CB_GET_ALL, Constants.CB_GET_FOCUS, Constants.CB_GET_UNUNDO, Constants.CB_GET_HTML]);
         }
-        updateTitle(undefined, id !== protyle.block.rootID);
         // https://github.com/siyuan-note/siyuan/issues/4874
         if (focusId) {
             const focusElement = protyle.wysiwyg.element.querySelector(`[data-node-id="${focusId}"]`);
@@ -497,6 +496,7 @@ export const zoomOut = (protyle: IProtyle, id: string, focusId?: string, isPushB
         /// #if !MOBILE
         if (protyle.model) {
             updateBacklinkGraph(getAllModels(), protyle);
+            updateTitle(undefined, id !== protyle.block.rootID, protyle.model.parent.headElement.getAttribute("data-id"));
         }
         /// #endif
         if (callback) {

diff --git a/app/src/util/onGetConfig.ts b/app/src/util/onGetConfig.ts
@@ -1,5 +1,5 @@
 import {openSearch} from "../search/spread";
-import {exportLayout, JSONToLayout, resetLayout, resizeDrag, resizeTabs} from "../layout/util";
+import {exportLayout, getInstanceById, JSONToLayout, resetLayout, resizeDrag, resizeTabs} from "../layout/util";
 import {hotKey2Electron, setStorageVal, updateHotkeyTip} from "../protyle/util/compatibility";
 /// #if !BROWSER
 import {dialog, getCurrentWindow} from "@electron/remote";
@@ -28,6 +28,9 @@ import {editor} from "../config/editor";
 import {goBack, goForward} from "./backForward";
 import {replaceLocalPath} from "../editor/rename";
 import {getWorkspaceName, workspaceMenu} from "../menus/workspace";
+import {Tab} from "../layout/Tab";
+import {Editor} from "../editor";
+import {zoomOut} from "../menus/protyle";
 
 const matchKeymap = (keymap: Record<string, IKeymapItem>, key1: "general" | "editor", key2?: "general" | "insert" | "heading" | "list" | "table") => {
     if (key1 === "general") {
@@ -213,6 +216,17 @@ const initBar = () => {
                 goBack();
                 event.stopPropagation();
                 break;
+            } else if (target.id === "barExitReadOnly") {
+                editor.setMode();
+                event.stopPropagation();
+                break;
+            } else if (target.id === "barExitFocus") {
+                const editor = (getInstanceById(target.getAttribute("data-id")) as Tab)?.model;
+                if (editor instanceof Editor) {
+                    zoomOut(editor.editor.protyle, editor.editor.protyle.block.rootID);
+                }
+                event.stopPropagation();
+                break;
             } else if (target.id === "barForward") {
                 goForward();
                 event.stopPropagation();