Merge branch 'release/3.37.0'

.github/workflows/release.yml

@@ -19,7 +19,7 @@ jobs:
             platform: 'linux'
     runs-on: ${{ matrix.os }}
     env:
-      npm_config_disturl: https://atom.io/download/electron
+      npm_config_disturl: https://electronjs.org/headers
       npm_config_target: 15.4.1
       npm_config_runtime: "electron"
 

README.md

@@ -76,11 +76,19 @@ For more information on how to use the following functions, please see [characte
 
 ## Changelogs
 
-### [v3.36.1](https://github.com/purocean/yn/releases/tag/v3.36.1) 2022-09-16
-
-1. feat: support opening links containing `__allow-open-window__` inside the app
-2. fix: fix dark theme style
-3. fix: fix outline title focus problem
+### [v3.37.0](https://github.com/purocean/yn/releases/tag/v3.37.0) 2022-09-23
+
+1. feat: open the file tab to support preview mode, double-click the tab or edit the content to change to edit mode
+2. feat: add "Reveal Line in Preview" function to editor, shortcut key `Alt/Option + L`
+3. feat: add about dialog
+4. upd: always show the create file button when opening an empty repository
+5. upd: fine-tuned UI
+6. upd: add content saving prompt when closing blank page
+7. fix: fix the problem that the code may overflow when printing
+8. feat(plugin): add `TREE_NODE_DBLCLICK` Hook
+9. feat(plugin): add `ctx.lib.uuid` module
+10. feat(plugin): add `ctx.view.highlightLine` method
+11. upd(plugin): change `ctx.editor.highlightLine` method parameters
 
 [More release notes](https://github.com/purocean/yn/releases)
 

README_ZH-CN.md

@@ -76,11 +76,19 @@
 
 ## 更新日志
 
-### [v3.36.1](https://github.com/purocean/yn/releases/tag/v3.36.1) 2022-09-16
-
-1. feat: 支持在应用内部打开包含 `__allow-open-window__` 的链接
-2. fix: 修复暗色主题样式
-3. fix: 修复大纲标题聚焦问题
+### [v3.37.0](https://github.com/purocean/yn/releases/tag/v3.37.0) 2022-09-23
+
+1. feat: 打开文件标签支持预览模式，双击标签或编辑内容可变更为编辑模式
+2. feat: 编辑器增加“在预览中聚焦“功能，快捷键 `Alt/Option + L`
+3. feat: 增加关于对话框
+4. upd: 打开空仓库时候总是展示创建文件按钮
+5. upd: 微调界面 UI
+6. upd: 关闭空白页时候增加内容保存提示
+7. fix: 修复打印时代码可能溢出问题
+8. feat(plugin): 增加 `TREE_NODE_DBLCLICK` Hook
+9. feat(plugin): 增加 `ctx.lib.uuid` 模块
+10. feat(plugin): 增加 `ctx.view.highlightLine` 方法
+11. upd(plugin): 调整 `ctx.editor.highlightLine` 方法参数
 
 [更多发布说明](https://github.com/purocean/yn/releases)
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "yank.note",
-  "version": "3.36.1",
+  "version": "3.37.0",
   "description": "Yank Note: A hackable markdown note application for programmers",
   "main": "dist/main/app.js",
   "license": "AGPL-3.0",
@@ -52,6 +52,7 @@
     "socks-proxy-agent": "^6.1.1",
     "tar-stream": "^2.2.0",
     "transliteration": "^2.2.0",
+    "uuid": "^9.0.0",
     "yaml": "^2.0.1",
     "yargs": "^15.3.1"
   },
@@ -78,6 +79,7 @@
     "@types/sortablejs": "^1.10.6",
     "@types/tar-stream": "^2.2.2",
     "@types/turndown": "^5.0.0",
+    "@types/uuid": "^8.3.4",
     "@types/yargs": "^15.0.0",
     "@typescript-eslint/eslint-plugin": "^4.27.0",
     "@typescript-eslint/parser": "^4.27.0",

scripts/install.bat

@@ -1,4 +1,4 @@
-set npm_config_disturl=https://atom.io/download/electron
+set npm_config_disturl=https://electronjs.org/headers
 set npm_config_target=15.4.1
 set npm_config_runtime="electron"
 

scripts/install.sh

@@ -1,6 +1,6 @@
 #!/bin/sh
 
-export npm_config_disturl=https://atom.io/download/electron
+export npm_config_disturl=https://electronjs.org/headers
 export npm_config_target=15.4.1
 export npm_config_runtime="electron"
 

src/renderer/components/FileTabs.vue

@@ -7,6 +7,7 @@
     @remove="removeTabs"
     @switch="switchTab"
     @change-list="setTabs"
+    @dblclick-item="makeTabPermanent"
   />
 </template>
 
@@ -20,6 +21,7 @@ import { registerAction, removeAction } from '@fe/core/action'
 import { ensureCurrentFileSaved, isEncrypted, isSubOrSameFile, switchDoc, toUri } from '@fe/services/document'
 import type { AppState } from '@fe/support/store'
 import { useI18n } from '@fe/services/i18n'
+import { getSetting } from '@fe/services/setting'
 import { isElectron } from '@fe/support/env'
 import Tabs from './Tabs.vue'
 
@@ -67,7 +69,8 @@ export default defineComponent({
 
       // no this tab, add new one.
       if (!tab) {
-        setTabs(tabs.value.concat([item]))
+        // remove temporary tab and add new one.
+        setTabs(tabs.value.filter(x => !x.temporary).concat([item]))
       }
 
       current.value = item.key
@@ -135,11 +138,28 @@ export default defineComponent({
       removeFile(doc)
     }
 
+    function makeTabPermanent (item: Pick<Components.FileTabs.Item, 'key'>) {
+      const tab = tabs.value.find(x => item.key === x.key)
+
+      if (tab && tab.temporary) {
+        tab.temporary = false
+        setTabs(tabs.value)
+      }
+    }
+
+    function handleTreeNodeDblClick (payload: { node: Doc | null }) {
+      const doc = payload.node
+      if (doc) {
+        makeTabPermanent({ key: toUri(doc) })
+      }
+    }
+
     onBeforeMount(() => {
       registerHook('DOC_MOVED', handleMoved)
       registerHook('DOC_CREATED', handleDocCreated)
       registerHook('DOC_DELETED', handleDocDeleted)
       registerHook('DOC_SWITCH_FAILED', handleSwitchFailed)
+      registerHook('TREE_NODE_DBLCLICK', handleTreeNodeDblClick)
 
       registerAction({
         name: 'file-tabs.switch-left',
@@ -179,6 +199,7 @@ export default defineComponent({
       removeHook('DOC_CREATED', handleDocCreated)
       removeHook('DOC_DELETED', handleDocDeleted)
       removeHook('DOC_SWITCH_FAILED', handleSwitchFailed)
+      removeHook('TREE_NODE_DBLCLICK', handleTreeNodeDblClick)
       removeAction('file-tabs.switch-left')
       removeAction('file-tabs.switch-right')
       removeAction('file-tabs.close-current')
@@ -191,6 +212,7 @@ export default defineComponent({
         key: uri,
         label: file ? file.name : t('blank-page'),
         description: file ? `[${file.repo}] ${file.path}` : t('blank-page'),
+        temporary: getSetting('editor.enable-preview', true),
         payload: { file },
       }
 
@@ -235,6 +257,11 @@ export default defineComponent({
           mark = '…'
         }
 
+        // not saved tab should be marked as permanent
+        if (tab.temporary && status === 'loaded' && !isSaved.value) {
+          tab.temporary = false
+        }
+
         tab.label = mark + currentFile.value.name
       }
 
@@ -250,7 +277,14 @@ export default defineComponent({
       setTabs,
       refTabs,
       filterBtnTitle,
+      makeTabPermanent,
     }
   },
 })
 </script>
+
+<style lang="scss" scoped>
+::v-deep(.tabs div[data-key="yank-note://system/blank.md"] > .icon) {
+  display: none;
+}
+</style>

src/renderer/components/GroupTabs.vue

@@ -53,7 +53,7 @@ export default defineComponent({
     &.selected {
       color: var(--g-color-0);
       font-weight: 500;
-      background: var(--g-color-90);
+      background: var(--g-color-94);
     }
   }
 }

src/renderer/components/Outline.vue

@@ -27,11 +27,10 @@ import { throttle } from 'lodash-es'
 import { computed, defineComponent, nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
 import { useStore } from 'vuex'
 import { registerHook, removeHook } from '@fe/core/hook'
-import { getEditor, highlightLine } from '@fe/services/editor'
+import { highlightLine as editorHighlightLine } from '@fe/services/editor'
 import { useI18n } from '@fe/services/i18n'
-import { DOM_ATTR_NAME } from '@fe/support/args'
 import { AppState } from '@fe/support/store'
-import { getHeadings, getViewDom, Heading } from '@fe/services/view'
+import { getHeadings, Heading, highlightLine as viewHighlightLine } from '@fe/services/view'
 
 export default defineComponent({
   name: 'outline',
@@ -64,31 +63,12 @@ export default defineComponent({
       }, 1000)
 
       const line = heading.sourceLine
-      const el = getViewDom()?.querySelector<HTMLElement>(`.markdown-body [${DOM_ATTR_NAME.SOURCE_LINE_START}="${line}"]`)
       const scrollEditor = store.state.showEditor && !store.state.presentation
       const scrollPreview = !scrollEditor || !store.state.syncScroll
 
-      if (scrollEditor) {
-        getEditor().revealLineNearTop(line)
-      }
-
-      if (scrollPreview) {
-        el?.scrollIntoView()
-      }
-
       // highlight heading
-      if (el) {
-        const disposeHighlight = highlightLine(line)
-
-        el.style.backgroundColor = 'rgba(255, 183, 0, 0.6)'
-        setTimeout(() => {
-          disposeHighlight()
-          el.style.backgroundColor = ''
-          if (el.getAttribute('style') === '') {
-            el.removeAttribute('style')
-          }
-        }, 1000)
-      }
+      editorHighlightLine(line, scrollEditor, 1000)
+      viewHighlightLine(line, scrollPreview, 1000)
     }
 
     function refresh () {

src/renderer/components/Premium.vue

@@ -284,8 +284,8 @@ export default defineComponent({
   }
 
   .buy-btn {
-      width: 80%;
-      margin: 16px 0;
+    width: 80%;
+    margin: 16px 0;
   }
 }
 

src/renderer/components/Preview.vue

@@ -212,13 +212,13 @@ export default defineComponent({
       }
     }
 
-    function revealLine (startLine: number) {
+    function revealLine (startLine: number): HTMLElement | null {
       if (startLine <= 1) {
         scrollTopTo(0)
-        return
+        return null
       }
 
-      const nodes = refViewWrapper.value!.querySelectorAll<HTMLElement>(`.markdown-body [${DOM_ATTR_NAME.SOURCE_LINE_START}]`)
+      const nodes = refView.value!.querySelectorAll<HTMLElement>(`[${DOM_ATTR_NAME.SOURCE_LINE_START}]`)
       let prevEl: HTMLElement | undefined
       for (let i = 0; i < nodes.length; i++) {
         const el = nodes[i]
@@ -236,7 +236,7 @@ export default defineComponent({
         if (lineNumber < startLine) {
           if (i === nodes.length - 1) {
             refViewWrapper.value!.scrollTop = refViewWrapper.value!.scrollHeight - refViewWrapper.value!.clientHeight
-            break
+            return el
           }
 
           prevEl = el
@@ -245,7 +245,7 @@ export default defineComponent({
 
         if (lineNumber === startLine) {
           el.scrollIntoView()
-          break
+          return el
         }
 
         if (prevEl) {
@@ -255,9 +255,11 @@ export default defineComponent({
           const prevLine = parseInt(prevEl.dataset.sourceLine || '0')
           const top = Math.round((elOffset * (startLine - prevLine) + prevOffset * (lineNumber - startLine)) / (lineNumber - prevLine))
           refViewWrapper.value!.scrollTop = top
-          break
+          return prevEl
         }
       }
+
+      return null
     }
 
     function getContentHtml () {
@@ -675,7 +677,7 @@ export default defineComponent({
     }
 
     code {
-      background: var(--g-color-80);
+      background: rgba(var(--g-color-80-rgb), 0.9);
     }
 
     pre {
@@ -700,6 +702,11 @@ export default defineComponent({
         }
       }
     }
+
+    .preview-highlight {
+      background-color: rgba(255, 183, 0, 0.6) !important;
+      outline: 1px solid rgba(255, 183, 0, 0.8) !important;
+    }
   }
 }
 

src/renderer/components/QuickOpen.vue

@@ -409,7 +409,7 @@ export default defineComponent({
   line-height: 1.5em;
   font-size: 12px;
   padding: 4px 0;
-  background: var(--g-color-active-c);;
+  background: var(--g-color-active-d);;
   cursor: pointer;
   transition: all .1s ease-in-out;
   color: var(--g-color-10);
@@ -421,11 +421,11 @@ export default defineComponent({
 }
 
 .tab > div:hover {
-  background: var(--g-color-active-b);
+  background: var(--g-color-active-c);
 }
 
 .tab > div.selected {
-  background: var(--g-color-active-a);
+  background: var(--g-color-active-b);
 }
 
 .input {