From 1b68092ca3e058cf6d697be4d694bac9e2db2901 Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Sun, 18 Jun 2023 23:02:04 +0800
Subject: [PATCH] :iphone: preview outline

---
 app/src/mobile/dock/MobileOutline.ts | 18 +++++++++++++++---
 app/src/protyle/preview/index.ts     | 10 +++++++---
 2 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/app/src/mobile/dock/MobileOutline.ts b/app/src/mobile/dock/MobileOutline.ts
index a7fd55933..f1d30332a 100644
--- a/app/src/mobile/dock/MobileOutline.ts
+++ b/app/src/mobile/dock/MobileOutline.ts
@@ -4,6 +4,7 @@ import {openMobileFileById} from "../editor";
 import {Constants} from "../../constants";
 import {getEventName} from "../../protyle/util/compatibility";
 import {App} from "../../index";
+import {closePanel} from "../util/closePanel";
 
 export class MobileOutline {
     private tree: Tree;
@@ -28,9 +29,14 @@ export class MobileOutline {
             data: null,
             click: (element: HTMLElement) => {
                 const id = element.getAttribute("data-node-id");
-                fetchPost("/api/block/checkBlockFold", {id}, (foldResponse) => {
-                    openMobileFileById(app, id, foldResponse.data ? [Constants.CB_GET_FOCUS, Constants.CB_GET_ALL, Constants.CB_GET_HTML] : [Constants.CB_GET_FOCUS, Constants.CB_GET_SETID, Constants.CB_GET_CONTEXT, Constants.CB_GET_HTML]);
-                });
+                if (!window.siyuan.mobile.editor.protyle.preview.element.classList.contains("fn__none")) {
+                    closePanel();
+                    document.getElementById(id)?.scrollIntoView();
+                } else {
+                    fetchPost("/api/block/checkBlockFold", {id}, (foldResponse) => {
+                        openMobileFileById(app, id, foldResponse.data ? [Constants.CB_GET_FOCUS, Constants.CB_GET_ALL, Constants.CB_GET_HTML] : [Constants.CB_GET_FOCUS, Constants.CB_GET_SETID, Constants.CB_GET_CONTEXT, Constants.CB_GET_HTML]);
+                    });
+                }
             }
         });
         this.element.firstElementChild.querySelector('[data-type="collapse"]').addEventListener(getEventName(), () => {
@@ -49,6 +55,12 @@ export class MobileOutline {
     }
 
     public update() {
+        if (!window.siyuan.mobile.editor.protyle.preview.element.classList.contains("fn__none")) {
+            window.siyuan.mobile.editor.protyle.preview.render(window.siyuan.mobile.editor.protyle, (outlineData) => {
+                this.tree.updateData(outlineData);
+            });
+            return;
+        }
         fetchPost("/api/outline/getDocOutline", {
             id: window.siyuan.mobile.editor.protyle.block.rootID,
         }, response => {
diff --git a/app/src/protyle/preview/index.ts b/app/src/protyle/preview/index.ts
index 9ebec9344..f4b7a2611 100644
--- a/app/src/protyle/preview/index.ts
+++ b/app/src/protyle/preview/index.ts
@@ -150,7 +150,7 @@ export class Preview {
         this.previewElement = previewElement;
     }
 
-    public render(protyle: IProtyle) {
+    public render(protyle: IProtyle, cb?: (outlineData: IBlockTree[]) => void) {
         if (this.element.style.display === "none") {
             return;
         }
@@ -159,14 +159,18 @@ export class Preview {
             fetchPost("/api/export/preview", {
                 id: protyle.block.parentID || protyle.options.blockId,
             }, response => {
-                const oldScrollTop =  protyle.preview.previewElement.scrollTop;
+                const oldScrollTop = protyle.preview.previewElement.scrollTop;
                 protyle.preview.previewElement.innerHTML = response.data.html;
                 processRender(protyle.preview.previewElement);
                 highlightRender(protyle.preview.previewElement);
                 avRender(protyle.preview.previewElement);
                 speechRender(protyle.preview.previewElement, protyle.options.lang);
                 protyle.preview.previewElement.scrollTop = oldScrollTop;
-                /// #if !MOBILE
+                /// #if MOBILE
+                if (cb) {
+                    cb(response.data.outline);
+                }
+                /// #else
                 response.data = response.data.outline;
                 getAllModels().outline.forEach(item => {
                     if (item.type === "pin" || (item.type === "local" && item.blockId === protyle.block.rootID)) {