Przeglądaj źródła

impl MarkdownListUtil.newlineAndIndentContinueMarkdownList

Yuki Takei 7 lat temu
rodzic
commit
62abd657d1

+ 23 - 1
resource/js/components/PageEditor/MarkdownListUtil.js

@@ -9,12 +9,34 @@ class MarkdownListUtil {
     this.indentAndMarkRE = /^(\s*)(>[> ]*|[*+-] \[[x ]\]\s|[*+-]\s|(\d+)([.)]))(\s*)/;
     this.indentAndMarkOnlyRE = /^(\s*)(>[> ]*|[*+-] \[[x ]\]|[*+-]|(\d+)[.)])(\s*)$/;
 
+    this.newlineAndIndentContinueMarkdownList = this.newlineAndIndentContinueMarkdownList.bind(this);
     this.pasteText = this.pasteText.bind(this);
   }
 
+  /**
+   * Self Implementation with AbstractEditor interface
+   * @param {AbstractEditor} editor An instance of AbstractEditor
+   */
+  newlineAndIndentContinueMarkdownList(editor) {
+    const strFromBol = editor.getStrFromBol();
+
+    if (this.indentAndMarkOnlyRE.test(strFromBol)) {
+      // clear current line and end list
+      editor.replaceBolToCurrentPos('\n');
+    }
+    else if (this.indentAndMarkRE.test(strFromBol)) {
+      // continue list
+      const indentAndMark = strFromBol.match(this.indentAndMarkRE)[0];
+      editor.insertText(`\n${indentAndMark}`);
+    }
+    else {
+      editor.insertLinebreak();
+    }
+  }
+
   /**
    * paste text
-   * @param {any} editor An editor instance of AbstractEditor
+   * @param {AbstractEditor} editor An instance of AbstractEditor
    * @param {any} event
    * @param {string} text
    */

+ 32 - 11
resource/js/components/PageEditor/TextAreaEditor.js

@@ -1,11 +1,12 @@
 import React from 'react';
-import PropTypes from 'prop-types';
+// import PropTypes from 'prop-types';
 
 import FormControl from 'react-bootstrap/es/FormControl';
 
 import AbstractEditor from './AbstractEditor';
 
 import pasteHelper from './PasteHelper';
+import mlu from './MarkdownListUtil';
 
 import InterceptorManager from '../../../../lib/util/interceptor-manager';
 
@@ -90,32 +91,52 @@ export default class TextAreaEditor extends AbstractEditor {
     const startPos = this.textarea.selectionStart;
     const endPos = this.textarea.selectionEnd;
 
-    // create new value
-    const value = this.textarea.value;
-    const newValue = value.substring(0, startPos) + text + value.substring(endPos, value.length-1);
-    // calculate new position
-    const newPos = startPos + text.length;
-
-    this.textarea.value = newValue;
-    this.textarea.setSelectionRange(newPos, newPos);
+    this.replaceValue(text, startPos, endPos);
   }
 
   /**
    * @inheritDoc
    */
   getStrFromBol() {
+    const currentPos = this.textarea.selectionStart;
+    return this.textarea.value.substring(this.getBolPos(), currentPos);
   }
 
   /**
    * @inheritDoc
    */
   getStrToEol() {
+    const currentPos = this.textarea.selectionStart;
+    return this.textarea.value.substring(currentPos, this.getEolPos());
   }
 
   /**
    * @inheritDoc
    */
   replaceBolToCurrentPos(text) {
+    const currentPos = this.textarea.selectionStart;
+    this.replaceValue(text, this.getBolPos(), currentPos);
+  }
+
+  getBolPos() {
+    const currentPos = this.textarea.selectionStart;
+    return this.textarea.value.lastIndexOf('\n', currentPos-1) + 1;
+  }
+
+  getEolPos() {
+    const currentPos = this.textarea.selectionStart;
+    return this.textarea.value.indexOf('\n', currentPos);
+  }
+
+  replaceValue(text, startPos, endPos) {
+    // create new value
+    const value = this.textarea.value;
+    const newValue = value.substring(0, startPos) + text + value.substring(endPos, value.length-1);
+    // calculate new position
+    const newPos = startPos + text.length;
+
+    this.textarea.value = newValue;
+    this.textarea.setSelectionRange(newPos, newPos);
   }
 
   /**
@@ -129,6 +150,7 @@ export default class TextAreaEditor extends AbstractEditor {
         return;
       }
 
+      event.preventDefault();
       this.handleEnterKey();
     }
   }
@@ -146,8 +168,7 @@ export default class TextAreaEditor extends AbstractEditor {
     interceptorManager.process('preHandleEnter', context)
       .then(() => {
         if (context.handlers.length == 0) {
-          // TODO impl
-          // codemirror.commands.newlineAndIndentContinueMarkdownList(this.getCodeMirror());
+          mlu.newlineAndIndentContinueMarkdownList(this);
         }
       });
   }