added sub-bullet types to prosemirror

4 files changed, 74 insertions, 22 deletions

diff --git a/src/client/util/ProsemirrorExampleTransfer.ts b/src/client/util/ProsemirrorExampleTransfer.ts
index 709b84765..b928532d6 100644
--- a/src/client/util/ProsemirrorExampleTransfer.ts
+++ b/src/client/util/ProsemirrorExampleTransfer.ts
@@ -1,14 +1,10 @@
-import { Schema, NodeType } from "prosemirror-model";
-import {
-    wrapIn, setBlockType, chainCommands, toggleMark, exitCode,
-    joinUp, joinDown, lift, selectParentNode, splitBlockKeepMarks, splitBlock, createParagraphNear, liftEmptyBlock
-} from "prosemirror-commands";
-import { wrapInList, splitListItem, liftListItem, sinkListItem } from "prosemirror-schema-list";
-import { undo, redo } from "prosemirror-history";
+import { chainCommands, exitCode, joinDown, joinUp, lift, selectParentNode, setBlockType, splitBlockKeepMarks, toggleMark, wrapIn } from "prosemirror-commands";
+import { redo, undo } from "prosemirror-history";
 import { undoInputRule } from "prosemirror-inputrules";
-import { Transaction, EditorState } from "prosemirror-state";
+import { Schema } from "prosemirror-model";
+import { liftListItem, splitListItem, wrapInList } from "prosemirror-schema-list";
+import { EditorState, Transaction } from "prosemirror-state";
 import { TooltipTextMenu } from "./TooltipTextMenu";
-import { Statement } from "../northstar/model/idea/idea";
 
 const mac = typeof navigator !== "undefined" ? /Mac/.test(navigator.platform) : false;
 
@@ -40,8 +36,8 @@ export default function buildKeymap<S extends Schema<any>>(schema: S, mapKeys?:
     bind("Mod-b", toggleMark(schema.marks.strong));
     bind("Mod-B", toggleMark(schema.marks.strong));
 
-    bind("Mod-i", toggleMark(schema.marks.em));
-    bind("Mod-I", toggleMark(schema.marks.em));
+    bind("Mod-e", toggleMark(schema.marks.em));
+    bind("Mod-E", toggleMark(schema.marks.em));
 
     bind("Mod-u", toggleMark(schema.marks.underline));
     bind("Mod-U", toggleMark(schema.marks.underline));
@@ -50,7 +46,7 @@ export default function buildKeymap<S extends Schema<any>>(schema: S, mapKeys?:
 
     bind("Ctrl-.", wrapInList(schema.nodes.bullet_list));
 
-    bind("Ctrl-n", wrapInList(schema.nodes.ordered_lis));
+    bind("Ctrl-n", wrapInList(schema.nodes.ordered_list));
 
     bind("Ctrl->", wrapIn(schema.nodes.blockquote));
 
@@ -91,20 +87,24 @@ export default function buildKeymap<S extends Schema<any>>(schema: S, mapKeys?:
             dispatch(tx2);
         });
     });
-    bind("Tab", (state: EditorState<S>, dispatch: (tx: Transaction<S>) => void) => {
+
+    let bulletFunc = (state: EditorState<S>, dispatch: (tx: Transaction<S>) => void) => {
+        var ref = state.selection;
+        var range = ref.$from.blockRange(ref.$to);
         var marks = state.storedMarks || (state.selection.$to.parentOffset && state.selection.$from.marks());
-        if (!sinkListItem(schema.nodes.list_item)(state, (tx2: Transaction) => {
+        let depth = range && range.depth ? range.depth : 0;
+        let nodeType = depth == 2 ? schema.nodes.cap_alphabet_list : depth == 4 ? schema.nodes.roman_list : depth == 6 ? schema.nodes.alphabet_list : schema.nodes.ordered_list;
+
+        if (!wrapInList(nodeType)(state, (tx2: Transaction) => {
             marks && tx2.ensureMarks(marks);
             marks && tx2.setStoredMarks(marks);
             dispatch(tx2);
         })) {
-            wrapInList(schema.nodes.bullet_list)(state, (tx2: Transaction) => {
-                marks && tx2.ensureMarks(marks);
-                marks && tx2.setStoredMarks(marks);
-                dispatch(tx2);
-            });
+            console.log("bullet fail");
         }
-    });
+    }
+    bind("Tab", (state: EditorState<S>, dispatch: (tx: Transaction<S>) => void) => bulletFunc(state, dispatch));
+
     bind("Enter", (state: EditorState<S>, dispatch: (tx: Transaction<S>) => void) => {
         var marks = state.storedMarks || (state.selection.$to.parentOffset && state.selection.$from.marks());
         if (!splitListItem(schema.nodes.list_item)(state, (tx3: Transaction) => {
diff --git a/src/client/util/RichTextRules.ts b/src/client/util/RichTextRules.ts
index 3b8396510..89933650b 100644
--- a/src/client/util/RichTextRules.ts
+++ b/src/client/util/RichTextRules.ts
@@ -26,6 +26,14 @@ export const inpRules = {
             match => ({ order: +match[1] }),
             (match, node) => node.childCount + node.attrs.order === +match[1]
         ),
+        // 1. ordered list
+        wrappingInputRule(
+            /^([a-z]+)\.\s$/,
+            schema.nodes.alphabet_list,
+            match => ({ order: +match[1] }),
+            (match, node) => node.childCount + node.attrs.order === +match[1]
+        ),
+
 
         // * bullet list
         wrappingInputRule(/^\s*([-+*])\s$/, schema.nodes.bullet_list),
diff --git a/src/client/util/RichTextSchema.tsx b/src/client/util/RichTextSchema.tsx
index 9fdda4845..a8ce4731c 100644
--- a/src/client/util/RichTextSchema.tsx
+++ b/src/client/util/RichTextSchema.tsx
@@ -173,7 +173,46 @@ export const nodes: { [index: string]: NodeSpec } = {
     ordered_list: {
         ...orderedList,
         content: 'list_item+',
-        group: 'block'
+        group: 'block',
+        attrs: {
+            bulletStyle: { default: "decimal" },
+        },
+        toDOM(node: Node<any>) {
+            return ['ol', { style: `list-style: ${node.attrs.bulletStyle}` }, 0]
+        }
+    },
+    alphabet_list: {
+        ...orderedList,
+        content: 'list_item+',
+        group: 'block',
+        attrs: {
+            bulletStyle: { default: "lower-alpha" },
+        },
+        toDOM(node: Node<any>) {
+            return ['ol', { style: `list-style: ${node.attrs.bulletStyle}` }, 0]
+        }
+    },
+    cap_alphabet_list: {
+        ...orderedList,
+        content: 'list_item+',
+        group: 'block',
+        attrs: {
+            bulletStyle: { default: "upper-alpha" },
+        },
+        toDOM(node: Node<any>) {
+            return ['ol', { style: `list-style: ${node.attrs.bulletStyle}` }, 0]
+        }
+    },
+    roman_list: {
+        ...orderedList,
+        content: 'list_item+',
+        group: 'block',
+        attrs: {
+            bulletStyle: { default: "lower-roman" },
+        },
+        toDOM(node: Node<any>) {
+            return ['ol', { style: `list-style: ${node.attrs.bulletStyle}` }, 0]
+        }
     },
     //this doesn't currently work for some reason
     bullet_list: {
@@ -181,7 +220,9 @@ export const nodes: { [index: string]: NodeSpec } = {
         content: 'list_item+',
         group: 'block',
         // parseDOM: [{ tag: "ul" }, { style: 'list-style-type=disc' }],
-        // toDOM() { return ulDOM }
+        // toDOM() { return ['ol', {
+        //     style: 'list-type: hebrew'
+        // }] }
     },
 
     //bullet_list: {
diff --git a/src/client/util/TooltipTextMenu.tsx b/src/client/util/TooltipTextMenu.tsx
index 4672dd246..7a0c6f8c5 100644
--- a/src/client/util/TooltipTextMenu.tsx
+++ b/src/client/util/TooltipTextMenu.tsx
@@ -172,6 +172,9 @@ export class TooltipTextMenu {
         this.listTypeToIcon = new Map();
         this.listTypeToIcon.set(schema.nodes.bullet_list, ":");
         this.listTypeToIcon.set(schema.nodes.ordered_list, "1)");
+        this.listTypeToIcon.set(schema.nodes.alphabet_list, "a)");
+        this.listTypeToIcon.set(schema.nodes.cap_alphabet_list, "A)");
+        this.listTypeToIcon.set(schema.nodes.roman_list, "i.");
         // this.listTypeToIcon.set(schema.nodes.bullet_list, "⬜");
         this.listTypes = Array.from(this.listTypeToIcon.keys());