From c0bdf1fb637598b6ab15f397542ecc791e4e4bb7 Mon Sep 17 00:00:00 2001
From: mattuy <mattuylee@outlook.com>
Date: Thu, 7 Oct 2021 14:50:14 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E6=8B=AC=E5=8F=B7?=
 =?UTF-8?q?=E7=AC=A6=E5=8F=B7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

close #1
---
 src/util/notation.js        | 38 +++++++++++++++++++++++++++++++++++--
 src/view/HelpModal/index.js |  9 +++++++--
 src/view/Notation/index.js  | 30 ++---------------------------
 3 files changed, 45 insertions(+), 32 deletions(-)

diff --git a/src/util/notation.js b/src/util/notation.js
index e5a889e..74e7a43 100644
--- a/src/util/notation.js
+++ b/src/util/notation.js
@@ -1,4 +1,8 @@
+import { message } from "antd";
 import { toJS } from "mobx";
+import state from "../store/state";
+import { wrappedAction } from "../store/history";
+import { findParagraphAndNotation } from "./editor";
 
 const notations = {
   zero: "0",
@@ -11,8 +15,8 @@ const notations = {
   si: "7",
   extend: "─",
   separator: "│",
-  crackerOpen: "（",
-  crackerClose: ")"
+  crackerOpen: "(",
+  crackerClose: ")",
 };
 const notes = [
   notations.zero,
@@ -61,6 +65,35 @@ function cloneNotation(notation) {
   return n;
 }
 
+// 放置连音线
+const placeTie = wrappedAction((notation) => {
+  if (state.tieSourceKey) {
+    // 处理连音线
+    if (state.tieSourceKey === notation.key) {
+      state.tieSourceKey = null;
+      // NOTICE: 如果要添加其他逻辑注意这里的return
+      return;
+    }
+    const {
+      notation: sourceNotation,
+      paragraph: sourceParagraph,
+    } = findParagraphAndNotation(state.tieSourceKey);
+    if (!sourceNotation) {
+      state.tieSourceKey = null;
+      return;
+    }
+    if (!sourceParagraph.notations.includes(notation)) {
+      message.warn("只允许相同段落的音符相连！");
+    } else if (!isNote(notation)) {
+      message.warn("只允许在音符上添加连音线！");
+    } else {
+      sourceNotation.tieTo = notation.key;
+      notation.tieTo = sourceNotation.key;
+    }
+    state.tieSourceKey = null;
+  }
+});
+
 export {
   notations,
   isNote,
@@ -68,4 +101,5 @@ export {
   isSeparator,
   createNotation,
   cloneNotation,
+  placeTie,
 };
diff --git a/src/view/HelpModal/index.js b/src/view/HelpModal/index.js
index 60e0792..5490cd2 100644
--- a/src/view/HelpModal/index.js
+++ b/src/view/HelpModal/index.js
@@ -40,9 +40,14 @@ function HelpModal({ visible, onVisibleChange }) {
         <KeyboardDescItem kbd="h j k l" desc="移动焦点" />
       </ul>
       <h3>仅选中符号时</h3>
-      <h4>输入</h4>
+      <h4>输入音符</h4>
+      直接按键盘上相应的键即可输入到当前符号。支持的音符符号有：
+      <p>
+        <kbd className={Styles.kbd}>0~7</kbd>
+        <kbd className={Styles.kbd}>( )</kbd>
+      </p>
+      <h4>输入辅助元素</h4>
       <ul className={Styles.list}>
-        <KeyboardDescItem kbd="0~7, -" desc="输入音符" />
         <KeyboardDescItem kbd="|" desc="输入小节线" />
         <KeyboardDescItem kbd="." desc="输入附点" />
         <KeyboardDescItem kbd="~" desc="颤音符号" />
diff --git a/src/view/Notation/index.js b/src/view/Notation/index.js
index 83624da..6540ac3 100644
--- a/src/view/Notation/index.js
+++ b/src/view/Notation/index.js
@@ -1,12 +1,10 @@
-import { message } from "antd";
 import { observer } from "mobx-react-lite";
 import EditableContent from "../../component/EditableContent";
 import state from "../../store/state";
 import store from "../../store/global";
 import P, { calcSubTextWidth } from "../../util/placement";
-import { findParagraphAndNotation } from "../../util/editor";
 import { getNotationContextMenu } from "../../menu/notation";
-import { isNote, notations } from "../../util/notation";
+import { notations, placeTie } from "../../util/notation";
 import { wrappedAction } from "../../store/history";
 import Row from "../Row";
 import Text from "../Text";
@@ -24,31 +22,7 @@ function Notation({ offsetX, notation, paragraph }) {
   const handleClick = wrappedAction(() => {
     state.selectedNotationKey = notation.key;
     state.shouldNotationBlurAfterClick = false;
-    if (state.tieSourceKey) {
-      // 处理连音线
-      if (state.tieSourceKey === notation.key) {
-        state.tieSourceKey = null;
-        // NOTICE: 如果要添加其他逻辑注意这里的return
-        return;
-      }
-      const {
-        notation: sourceNotation,
-        paragraph: sourceParagraph,
-      } = findParagraphAndNotation(state.tieSourceKey);
-      if (!sourceNotation) {
-        state.tieSourceKey = null;
-        return;
-      }
-      if (!sourceParagraph.notations.includes(notation)) {
-        message.warn("只允许相同段落的音符相连！");
-      } else if (!isNote(notation)) {
-        message.warn("只允许在音符上添加连音线！");
-      } else {
-        sourceNotation.tieTo = notation.key;
-        notation.tieTo = sourceNotation.key;
-      }
-      state.tieSourceKey = null;
-    }
+    placeTie(notation);
   });
 
   const underlineOffset = P.underlineStepOffsetY * (notation.underline | 0);