From e72031ea0e538e34bfc03831300b4f40885e66c2 Mon Sep 17 00:00:00 2001
From: xiaozzzi <42293085+xiaozzzi@users.noreply.github.com>
Date: Tue, 16 Jan 2024 23:05:17 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=BC=96=E8=BE=91=E6=97=B6=E6=B0=B8?=
 =?UTF-8?q?=E8=BF=9C=E7=BD=AE=E5=BA=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/article/ArticleIndex.vue        | 43 +++++++++++++------
 .../src/views/article/scripts/markedjs.ts     |  6 +--
 2 files changed, 34 insertions(+), 15 deletions(-)

diff --git a/blossom-editor/src/renderer/src/views/article/ArticleIndex.vue b/blossom-editor/src/renderer/src/views/article/ArticleIndex.vue
index 87f2cba..730abb1 100644
--- a/blossom-editor/src/renderer/src/views/article/ArticleIndex.vue
+++ b/blossom-editor/src/renderer/src/views/article/ArticleIndex.vue
@@ -581,15 +581,7 @@ const initEditor = (_doc?: string) => {
       EditorRef.value
     )
   )
-  // 创建元素
-  let editorHeightHolder = document.createElement('div')
-  editorHeightHolder.style.height = '65vh'
-  editorHeightHolder.addEventListener('click', () => {
-    let length = cmw.getDocLength()
-    cmw.editor.focus()
-    cmw.insert(length, length, '', length, length)
-  })
-  EditorRef.value.appendChild(editorHeightHolder)
+  appendEditorHolder()
 }
 /**
  * 将 markdown 原文设置到编辑器中, 并且会重置编辑器状态
@@ -611,6 +603,19 @@ const setNewState = (md: string): void => {
   parse()
 }
 
+const appendEditorHolder = () => {
+  // 创建元素
+  let editorHeightHolder = document.createElement('div')
+  editorHeightHolder.style.height = '65vh'
+  editorHeightHolder.style.position = 'relative'
+  editorHeightHolder.addEventListener('click', () => {
+    let length = cmw.getDocLength()
+    cmw.editor.focus()
+    cmw.insert(length, length, '', length, length)
+  })
+  EditorRef.value.appendChild(editorHeightHolder)
+}
+
 //#endregion
 
 //#region ----------------------------------------< marked/preview >-------------------------------
@@ -640,7 +645,7 @@ const renderer = {
     articleImg.value.push({ targetId: '0', targetName: text, targetUrl: href as string, type: 10 })
     return renderImage(href, _title, text)
   },
-  link(href: string | null, title: string | null, text: string): string {
+  link(href: string, title: string | null | undefined, text: string): string {
     let { link, ref } = renderLink(href, title, text, ArticleTreeDocsRef.value.getDocTreeData())
     articleLink.value.push(ref)
     return link
@@ -656,7 +661,6 @@ const tokenizer = {
   }
 }
 
-//@ts-ignore
 marked.use({ tokenizer: tokenizer, renderer: renderer })
 
 /**
@@ -671,7 +675,22 @@ const parse = () => {
     articleHtml.value = content
     renderInterval.value = Date.now() - begin
     articleParseing = false
-    nextTick(() => parseToc())
+    nextTick(() => {
+      parseToc()
+
+      let previewHeightHolder = document.createElement('div')
+      previewHeightHolder.style.height = '60vh'
+      PreviewRef.value.appendChild(previewHeightHolder)
+
+      const clientHeight = EditorRef.value.clientHeight
+      const scrollTop = EditorRef.value.scrollTop
+      const scrollHeight = EditorRef.value.scrollHeight
+      let a = clientHeight + scrollTop
+      if (a >= scrollHeight - 150) {
+        EditorRef.value.scrollTop = 99999999
+        PreviewRef.value.scrollTop = 99999999
+      }
+    })
   })
 }
 
diff --git a/blossom-editor/src/renderer/src/views/article/scripts/markedjs.ts b/blossom-editor/src/renderer/src/views/article/scripts/markedjs.ts
index 4bdcb41..0d46707 100644
--- a/blossom-editor/src/renderer/src/views/article/scripts/markedjs.ts
+++ b/blossom-editor/src/renderer/src/views/article/scripts/markedjs.ts
@@ -311,7 +311,7 @@ export const renderCode = (code: string, language: string | undefined, _isEscape
           if (tag.startsWith('h')) {
             height = tags[i].substring(1)
             if (!height.endsWith('%')) {
-              width += 'px'
+              height += 'px'
             }
           }
         }
@@ -325,7 +325,7 @@ export const renderCode = (code: string, language: string | undefined, _isEscape
     }
 
     return `<iframe width="${width}" height="${height}" style="margin: 10px 0"
-      scrolling="no" border="0" frameborder="no" framespacing="0"
+      scrolling="no" border="0" frameborder="no" framespacing="0" loading="lazy" 
       src="https://player.bilibili.com/player.html?bvid=${bvid}&page=1&autoplay=0" ></iframe>`
   }
   const id = 'pre-' + Date.now() + '-' + randomInt(1, 1000000)
@@ -398,7 +398,7 @@ export const renderImage = (href: string | null, title: string | null, text: str
  *  ref: 双链内容
  * }
  */
-export const renderLink = (href: string | null, title: string | null, text: string, docTrees: DocTree[]) => {
+export const renderLink = (href: string, title: string | null | undefined, text: string, docTrees: DocTree[]) => {
   let link: string
   let ref: ArticleReference = { targetId: '0', targetName: text, targetUrl: href as string, type: 21 }
   if (isBlank(title)) {