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

app/src/assets/scss/_protyle.scss

@@ -4,16 +4,18 @@
 @import "search";
 
 .protyle-scroll {
+  --b3-dynamicscroll-width: 200px;
   position: absolute;
   right: 0;
-  height: 100%;
-  top: 0;
+  top: 30px;
   width: 16px;
   padding: 0 8px;
+  bottom: 9px; // 下图标 hover 时，需要留出一定的空间
 
   svg {
     height: 16px;
     width: 16px;
+    display: block;
   }
 
   &__down,
@@ -23,7 +25,6 @@
     opacity: 0;
     cursor: pointer;
     color: var(--b3-border-color);
-    margin-left: -0.5px;
 
     &:hover {
       color: var(--b3-theme-on-surface);
@@ -31,11 +32,11 @@
   }
 
   &__up {
-    top: calc(50% - 114px);
+    top: calc(50% - var(--b3-dynamicscroll-width) / 2 - 20px);
   }
 
   &__down {
-    bottom: calc(50% - 135px);
+    bottom: calc(50% - var(--b3-dynamicscroll-width) / 2 - 20px);
   }
 
   &:hover {
@@ -47,13 +48,14 @@
 
   &__bar {
     position: absolute;
-    right: -89px;
-    top: 50%;
+    right: calc(11px - var(--b3-dynamicscroll-width) / 2);
+    top: calc(50% - 8px);
     transform: rotate(90deg);
     z-index: 1;
 
     .b3-slider {
-      width: 200px;
+      width: var(--b3-dynamicscroll-width);
+      display: block;
     }
   }
 }

app/src/block/Panel.ts

@@ -9,6 +9,9 @@ import {Constants} from "../constants";
 import {openNewWindowById} from "../window/openNewWindow";
 /// #endif
 import {disabledProtyle} from "../protyle/util/onGet";
+import {fetchPost} from "../util/fetch";
+import {lockFile} from "../dialog/processSystem";
+import {showMessage} from "../dialog/message";
 
 export class BlockPanel {
     public element: HTMLElement;
@@ -241,37 +244,49 @@ export class BlockPanel {
 
     private initProtyle(editorElement: HTMLElement) {
         const index = parseInt(editorElement.getAttribute("data-index"));
-        const action = [Constants.CB_GET_ALL];
-        if (this.targetElement.classList.contains("protyle-attr--refcount") ||
-            this.targetElement.classList.contains("counter")) {
-            action.push(Constants.CB_GET_BACKLINK);
-        }
-        const editor = new Protyle(editorElement, {
-            blockId: this.nodeIds[index],
-            defId: this.defIds[index] || this.defIds[0] || "",
-            action,
-            render: {
-                gutter: true,
-                breadcrumbDocName: true,
-                breadcrumbContext: true
-            },
-            typewriterMode: false,
-            after: (editor) => {
-                if (window.siyuan.config.readonly || window.siyuan.config.editor.readOnly) {
-                    disabledProtyle(editor.protyle);
-                }
-                editorElement.addEventListener("mouseleave", () => {
-                    hideElements(["gutter"], editor.protyle);
-                });
-                // 浮窗完整文档面包屑应不显示 退出聚焦
-                if (editor.protyle.breadcrumb && editor.protyle.block.id === editor.protyle.block.rootID) {
-                    const exitFocusElement = editor.protyle.breadcrumb.element.parentElement.querySelector('[data-type="exit-focus"]');
-                    exitFocusElement.classList.add("fn__none");
-                    exitFocusElement.nextElementSibling.classList.add("fn__none");
-                }
+        fetchPost("api/block/getBlockInfo", {id: this.nodeIds[index]}, (response) => {
+            if (response.code === 2) {
+                // 文件被锁定
+                lockFile(response.data);
+                return false;
             }
-        });
-        this.editors.push(editor);
+            if (response.code === 3) {
+                showMessage(response.msg);
+                return;
+            }
+            const action = [];
+            if (response.data.rootID !== this.nodeIds[index]) {
+                action.push(Constants.CB_GET_ALL);
+            }
+            if (this.targetElement.classList.contains("protyle-attr--refcount") ||
+                this.targetElement.classList.contains("counter")) {
+                action.push(Constants.CB_GET_BACKLINK);
+            }
+            const editor = new Protyle(editorElement, {
+                blockId: this.nodeIds[index],
+                defId: this.defIds[index] || this.defIds[0] || "",
+                action,
+                render: {
+                    scroll: true,
+                    gutter: true,
+                    breadcrumbDocName: true,
+                },
+                typewriterMode: false,
+                after: (editor) => {
+                    if (window.siyuan.config.readonly || window.siyuan.config.editor.readOnly) {
+                        disabledProtyle(editor.protyle);
+                    }
+                    editorElement.addEventListener("mouseleave", () => {
+                        hideElements(["gutter"], editor.protyle);
+                    });
+                    if (response.data.rootID !== this.nodeIds[index]) {
+                        editor.protyle.breadcrumb.element.parentElement.insertAdjacentHTML("beforeend", `<span class="fn__space"></span>
+<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>`)
+                    }
+                }
+            });
+            this.editors.push(editor);
+        })
     }
 
     public destroy() {

app/src/history/diff.ts

@@ -43,7 +43,6 @@ const renderCompare = (element: HTMLElement) => {
                 gutter: false,
                 breadcrumb: false,
                 breadcrumbDocName: false,
-                breadcrumbContext: false,
             },
             typewriterMode: false
         });
@@ -57,7 +56,6 @@ const renderCompare = (element: HTMLElement) => {
                 gutter: false,
                 breadcrumb: false,
                 breadcrumbDocName: false,
-                breadcrumbContext: false,
             },
             typewriterMode: false
         });

app/src/history/history.ts

@@ -342,7 +342,6 @@ export const openHistory = () => {
             gutter: false,
             breadcrumb: false,
             breadcrumbDocName: false,
-            breadcrumbContext: false,
         },
         typewriterMode: false,
     });

app/src/protyle/scroll/event.ts

@@ -32,11 +32,6 @@ export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => {
             hideElements(["gutter"], protyle);
         }
 
-        const panelContextElement = protyle.breadcrumb?.element.parentElement.querySelector('[data-type="context"]');
-        if (panelContextElement && !panelContextElement.classList.contains("ft__primary")) {
-            // 悬浮窗需展开上下文后才能进行滚动 https://github.com/siyuan-note/siyuan/issues/2311
-            return;
-        }
         if (protyle.scroll && !protyle.scroll.element.classList.contains("fn__none")) {
             clearTimeout(getIndexTimeout);
             getIndexTimeout = window.setTimeout(() => {

app/src/protyle/scroll/index.ts

@@ -19,13 +19,13 @@ export class Scroll {
         if (!isMobile()) {
             this.parentElement.style.right = "10px";
         }
-        this.parentElement.innerHTML = `<div class="b3-tooltips b3-tooltips__nw protyle-scroll__up" aria-label="${updateHotkeyTip("⌘Home")}">
+        this.parentElement.innerHTML = `<div class="b3-tooltips b3-tooltips__w protyle-scroll__up" aria-label="${updateHotkeyTip("⌘Home")}">
     <svg><use xlink:href="#iconUp"></use></svg>
 </div>
 <div class="fn__none protyle-scroll__bar b3-tooltips b3-tooltips__s" aria-label="Blocks 1/1">
     <input class="b3-slider" type="range" max="1" min="1" step="1" value="1" />
 </div>
-<div class="b3-tooltips b3-tooltips__sw protyle-scroll__down" aria-label="${updateHotkeyTip("⌘End")}">
+<div class="b3-tooltips b3-tooltips__w protyle-scroll__down" aria-label="${updateHotkeyTip("⌘End")}">
     <svg><use xlink:href="#iconDown"></use></svg>
 </div>`;
 

app/src/protyle/util/Options.ts

@@ -15,7 +15,6 @@ export class Options {
             scroll: false,
             breadcrumb: true,
             breadcrumbDocName: false,
-            breadcrumbContext: false
         },
         action: [],
         after: undefined,

app/src/protyle/util/onGet.ts

@@ -16,6 +16,7 @@ import {hasClosestByAttribute, hasClosestByClassName} from "./hasClosest";
 import {preventScroll} from "../scroll/preventScroll";
 import {restoreScroll} from "../scroll/saveScroll";
 import {removeLoading} from "../ui/initUI";
+import {isMobile} from "../../util/functions";
 
 export const onGet = (data: IWebSocketData, protyle: IProtyle, action: string[] = [], scrollAttr?: IScrollAttr, renderTitle = false) => {
     protyle.wysiwyg.element.removeAttribute("data-top");
@@ -283,8 +284,13 @@ const setHTML = (options: {
         protyle.options.defId = undefined;
     }
     // https://ld246.com/article/1653639418266
-    if (protyle.element.classList.contains("block__edit") && (protyle.element.nextElementSibling || protyle.element.previousElementSibling)) {
-        protyle.element.style.minHeight = Math.min(30 + protyle.wysiwyg.element.clientHeight, window.innerHeight / 3) + "px";
+    if (protyle.element.classList.contains("block__edit")) {
+        if (protyle.element.nextElementSibling || protyle.element.previousElementSibling) {
+            protyle.element.style.minHeight = Math.min(30 + protyle.wysiwyg.element.clientHeight, window.innerHeight / 3) + "px";
+        }
+        // 49 = 16（上图标）+16（下图标）+8（padding）+9（底部距离）
+        // @ts-ignore
+        protyle.scroll.element.parentElement.setAttribute("style", `--b3-dynamicscroll-width:${protyle.contentElement.clientHeight - 49}px;${isMobile() ? "" : "right:10px"}`);
     }
     // 屏幕太高的页签 https://github.com/siyuan-note/siyuan/issues/5018
     if (!protyle.scroll.element.classList.contains("fn__none") &&

app/src/types/index.d.ts

@@ -435,7 +435,7 @@ declare interface IConfig {
         autoLaunch: boolean
     }
     localIPs: string[]
-    readonly: boolean
+    readonly: boolean   // 全局只读
     uiLayout: Record<string, any>
     langs: { label: string, name: string }[]
     appearance: IAppearance

app/src/types/protyle.d.ts

@@ -378,7 +378,6 @@ interface IOptions {
         scroll?: boolean
         breadcrumb?: boolean
         breadcrumbDocName?: boolean
-        breadcrumbContext?: boolean
     }
     /** 内部调试时使用 */
     _lutePath?: string;

app/src/window/openNewWindow.ts

@@ -5,6 +5,8 @@ import {ipcRenderer} from "electron";
 import {Constants} from "../constants";
 import {Tab} from "../layout/Tab";
 import {fetchPost} from "../util/fetch";
+import {lockFile} from "../dialog/processSystem";
+import {showMessage} from "../dialog/message";
 
 export const openNewWindow = (tab: Tab) => {
     const json = {};
@@ -17,6 +19,15 @@ export const openNewWindow = (tab: Tab) => {
 
 export const openNewWindowById = (id: string) => {
     fetchPost("api/block/getBlockInfo", {id}, (response) => {
+        if (response.code === 2) {
+            // 文件被锁定
+            lockFile(response.data);
+            return false;
+        }
+        if (response.code === 3) {
+            showMessage(response.msg);
+            return;
+        }
         const json: any = {
             title: response.data.rootTitle,
             docIcon: response.data.rootIcon,