🎨 fix https://github.com/siyuan-note/siyuan/issues/7047

2023-01-16 22:36:01 +08:00 · 2023-01-16 22:36:01 +08:00 · e78c8032e6
commit e78c8032e6
parent ad5e5f17b1
10 changed files with 22 additions and 53 deletions
--- a/app/appearance/langs/en_US.json
+++ b/app/appearance/langs/en_US.json
@ -1,6 +1,5 @@
 {
  "exitFocus": "Exit focus",
-  "exitReadOnly": "Exit read-only",
  "pointExchangeSize": "Point Exchange",
  "panel": "Panel",
  "copyPath": "Copy Path",
--- a/app/appearance/langs/es_ES.json
+++ b/app/appearance/langs/es_ES.json
@ -1,6 +1,5 @@
 {
  "exitFocus": "Salir del enfoque",
-  "exitReadOnly": "Salir de solo lectura",
  "pointExchangeSize": "Intercambio de puntos",
  "panel": "Panel",
  "copyPath": "Copiar ruta",
--- a/app/appearance/langs/fr_FR.json
+++ b/app/appearance/langs/fr_FR.json
@ -1,6 +1,5 @@
 {
  "exitFocus": "Quitter le focus",
-  "exitReadOnly": "Quitter en lecture seule",
  "pointExchangeSize": "Échange de points",
  "panel": "Panneau",
  "copyPath": "Copier le chemin",
--- a/app/appearance/langs/zh_CHT.json
+++ b/app/appearance/langs/zh_CHT.json
@ -1,6 +1,5 @@
 {
  "exitFocus": "退出聚焦",
-  "exitReadOnly": "退出只讀",
  "pointExchangeSize": "積分兌換",
  "panel": "面板",
  "copyPath": "複製路徑",
--- a/app/appearance/langs/zh_CN.json
+++ b/app/appearance/langs/zh_CN.json
@ -1,6 +1,5 @@
 {
  "exitFocus": "退出聚焦",
-  "exitReadOnly": "退出只读",
  "pointExchangeSize": "积分兑换",
  "panel": "面板",
  "copyPath": "复制路径",
--- a/app/src/config/editor.ts
+++ b/app/src/config/editor.ts
@ -6,7 +6,6 @@ import {setPadding} from "../protyle/ui/initUI";
 import {reloadProtyle} from "../protyle/util/reload";
 import {disabledProtyle, enableProtyle} from "../protyle/util/onGet";
 import {updateHotkeyTip} from "../protyle/util/compatibility";
-import {updateTitle} from "../dialog/processSystem";

 export const editor = {
    element: undefined as Element,
@ -17,13 +16,14 @@ export const editor = {
        }
        window.siyuan.config.editor.readOnly = readOnly;
        if (readOnly) {
+            target.classList.add("toolbar__item--active")
            target.setAttribute("aria-label", `${window.siyuan.languages.use} ${window.siyuan.languages.editMode} ${updateHotkeyTip(window.siyuan.config.keymap.general.editMode.custom)}`);
            target.querySelector("use").setAttribute("xlink:href", "#iconPreview");
        } else {
+            target.classList.remove("toolbar__item--active")
            target.setAttribute("aria-label", `${window.siyuan.languages.use} ${window.siyuan.languages.editReadonly} ${updateHotkeyTip(window.siyuan.config.keymap.general.editMode.custom)}`);
            target.querySelector("use").setAttribute("xlink:href", "#iconEdit");
        }
-        updateTitle(readOnly);
        fetchPost("/api/setting/setEditor", window.siyuan.config.editor, () => {
            const allModels = getAllModels();
            allModels.editor.forEach(editor => {
--- a/app/src/dialog/processSystem.ts
+++ b/app/src/dialog/processSystem.ts
@ -289,36 +289,7 @@ export const setTitle = (title: string, protyle?: IProtyle) => {
            return;
        }
        dragElement.setAttribute("title", title);
-        title = escapeHtml(title);
-        if (protyle && protyle.disabled) {
-            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 = `${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>`;
-        }
-        dragElement.innerHTML = title;
-    }
-};
-
-export const updateTitle = (readonly?: boolean, zoomIn?: boolean, zoomInId?: string) => {
-    const dragElement = document.getElementById("drag");
-    if (typeof readonly === "boolean") {
-        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") {
-        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();
-        }
+        dragElement.innerHTML = escapeHtml(title);
    }
 };

--- a/app/src/menus/protyle.ts
+++ b/app/src/menus/protyle.ts
@ -46,7 +46,6 @@ import {exportAsset} from "./util";
 import {removeLink} from "../protyle/toolbar/Link";
 import {alignImgCenter, alignImgLeft} from "../protyle/wysiwyg/commonHotkey";
 import {getEnableHTML} from "../protyle/wysiwyg/removeEmbed";
-import {updateTitle} from "../dialog/processSystem";
 import {renameTag} from "../util/noRelyPCFunction";

 export const refMenu = (protyle: IProtyle, element: HTMLElement) => {
@ -466,6 +465,15 @@ export const zoomOut = (protyle: IProtyle, id: string, focusId?: string, isPushB
        if (isPushBack) {
            pushBack();
        }
+    } else {
+        const exitFocusElement =  protyle.breadcrumb.element.parentElement.querySelector('[data-type="exit-focus"]')
+        if (id === protyle.block.rootID) {
+            exitFocusElement.classList.add("fn__none")
+            exitFocusElement.nextElementSibling.classList.add("fn__none")
+        } else {
+            exitFocusElement.classList.remove("fn__none")
+            exitFocusElement.nextElementSibling.classList.remove("fn__none")
+        }
    }
    fetchPost("/api/filetree/getDoc", {
        id,
@ -496,7 +504,6 @@ 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) {
--- a/app/src/protyle/breadcrumb/index.ts
+++ b/app/src/protyle/breadcrumb/index.ts
@ -35,12 +35,15 @@ export class Breadcrumb {
    constructor(protyle: IProtyle) {
        const element = document.createElement("div");
        element.className = "protyle-breadcrumb";
+        const isFocus = protyle.options.action.includes(Constants.CB_GET_ALL)
        let html = `<div class="protyle-breadcrumb__bar"></div>
 <span class="protyle-breadcrumb__space"></span>
-<button class="b3-tooltips b3-tooltips__w block__icon fn__flex-center" style="opacity: 1;" data-menu="true" aria-label="${window.siyuan.languages.more}"><svg><use xlink:href="#iconMore"></use></svg></button>`;
+<button class="block__icon block__icon--show ft__smaller fn__flex-center${isFocus ? "" : " fn__none"}" style="line-height: 14px" data-type="exit-focus">${window.siyuan.languages.exitFocus}</button>
+<span class="fn__space${isFocus ? "" : " fn__none"}"></span>
+<button class="b3-tooltips b3-tooltips__w block__icon block__icon--show fn__flex-center" data-menu="true" aria-label="${window.siyuan.languages.more}"><svg><use xlink:href="#iconMore"></use></svg></button>`;
        if (protyle.options.render.breadcrumbContext) {
            html += `<span class="fn__space"></span>
-<div class="b3-tooltips b3-tooltips__w block__icon fn__flex-center" style="opacity: 1;" data-type="context" aria-label="${window.siyuan.languages.context}"><svg><use xlink:href="#iconAlignCenter"></use></svg></div>`;
+<div class="b3-tooltips b3-tooltips__w block__icon block__icon--show fn__flex-center" data-type="context" aria-label="${window.siyuan.languages.context}"><svg><use xlink:href="#iconAlignCenter"></use></svg></div>`;
        }
        element.innerHTML = html;
        this.element = element.firstElementChild as HTMLElement;
@ -65,6 +68,10 @@ export class Breadcrumb {
                    });
                    event.preventDefault();
                    break;
+                } else if (target.getAttribute("data-type") === "exit-focus") {
+                    zoomOut(protyle, protyle.block.rootID);
+                    event.preventDefault();
+                    break
                } else if (target.getAttribute("data-type") === "context") {
                    if (target.classList.contains("block__icon--active")) {
                        fetchPost("/api/filetree/getDoc", {
--- a/app/src/util/onGetConfig.ts
+++ b/app/src/util/onGetConfig.ts
@ -203,7 +203,7 @@ const initBar = () => {
 <div id="barSearch" class="toolbar__item b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.globalSearch} ${updateHotkeyTip(window.siyuan.config.keymap.general.globalSearch.custom)}">
    <svg><use xlink:href="#iconSearch"></use></svg>
 </div>
-<div id="barReadonly" class="toolbar__item b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.use} ${window.siyuan.config.editor.readOnly ? window.siyuan.languages.editMode : window.siyuan.languages.editReadonly} ${updateHotkeyTip(window.siyuan.config.keymap.general.editMode.custom)}">
+<div id="barReadonly" class="toolbar__item b3-tooltips b3-tooltips__sw${window.siyuan.config.editor.readOnly ? " toolbar__item--active" : ""}" aria-label="${window.siyuan.languages.use} ${window.siyuan.config.editor.readOnly ? window.siyuan.languages.editMode : window.siyuan.languages.editReadonly} ${updateHotkeyTip(window.siyuan.config.keymap.general.editMode.custom)}">
    <svg><use xlink:href="#icon${window.siyuan.config.editor.readOnly ? "Preview" : "Edit"}"></use></svg>
 </div>
 <div id="barMode" class="toolbar__item b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.appearanceMode}">
@ -217,17 +217,6 @@ 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();