aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/util/ParagraphNodeSpec.ts2
-rw-r--r--src/client/util/RichTextRules.ts53
-rw-r--r--src/client/util/RichTextSchema.tsx26
-rw-r--r--src/client/views/GlobalKeyHandler.ts2
-rw-r--r--src/client/views/MainView.tsx14
-rw-r--r--src/client/views/nodes/FormattedTextBox.scss58
-rw-r--r--src/client/views/nodes/FormattedTextBox.tsx70
7 files changed, 136 insertions, 89 deletions
diff --git a/src/client/util/ParagraphNodeSpec.ts b/src/client/util/ParagraphNodeSpec.ts
index 3a993e1ff..593aec498 100644
--- a/src/client/util/ParagraphNodeSpec.ts
+++ b/src/client/util/ParagraphNodeSpec.ts
@@ -115,7 +115,7 @@ function toDOM(node: Node): DOMOutputSpec {
attrs.id = id;
}
- return ['p', attrs, 0];
+ return ['p', { ...attrs, ...{ style: `text-indent: ${indent}; padding-left: ${indent < 0 ? -indent : undefined};` } }, 0];
}
export const toParagraphDOM = toDOM;
diff --git a/src/client/util/RichTextRules.ts b/src/client/util/RichTextRules.ts
index cd4bfdc63..4e60976d5 100644
--- a/src/client/util/RichTextRules.ts
+++ b/src/client/util/RichTextRules.ts
@@ -73,18 +73,23 @@ export const inpRules = {
return state.tr.deleteRange(start, end).addStoredMark(schema.marks.pFontSize.create({ fontSize: size }));
}),
new InputRule(
- new RegExp(/%[a-z]*\s$/),
+ new RegExp(/%[a-z]+$/),
(state, match, start, end) => {
- const color = match[0].substring(1, match[0].length - 1);
+ const color = match[0].substring(1, match[0].length);
let marks = TooltipTextMenuManager.Instance._brushMap.get(color);
if (marks) {
let tr = state.tr.deleteRange(start, end);
return marks ? Array.from(marks).reduce((tr, m) => tr.addStoredMark(m), tr) : tr;
}
- if (color) {
+ let isValidColor = (strColor: string) => {
+ var s = new Option().style;
+ s.color = strColor;
+ return s.color == strColor.toLowerCase(); // 'false' if color wasn't assigned
+ }
+ if (isValidColor(color)) {
return state.tr.deleteRange(start, end).addStoredMark(schema.marks.pFontColor.create({ color: color }));
}
- return state.tr.deleteRange(start, end);
+ return null;
}),
new InputRule(
new RegExp(/%%$/),
@@ -96,29 +101,61 @@ export const inpRules = {
new InputRule(
new RegExp(/t$/),
(state, match, start, end) => {
- if (state.selection.to === state.selection.from) return null;
+ if (state.selection.to === state.selection.from && !(state as any).EnteringStyle) return null;
const node = (state.doc.resolve(start) as any).nodeAfter;
+ if (node?.marks.findIndex((m: any) => m.type === schema.marks.user_tag) !== -1) return state.tr.removeMark(start, end, schema.marks.user_tag);
return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "todo", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr;
}),
new InputRule(
new RegExp(/i$/),
(state, match, start, end) => {
- if (state.selection.to === state.selection.from) return null;
+ if (state.selection.to === state.selection.from && !(state as any).EnteringStyle) return null;
const node = (state.doc.resolve(start) as any).nodeAfter;
+ if (node?.marks.findIndex((m: any) => m.type === schema.marks.user_tag) !== -1) return state.tr.removeMark(start, end, schema.marks.user_tag);
return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "ignore", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr;
}),
new InputRule(
- new RegExp(/!$/),
+ new RegExp(/d$/),
(state, match, start, end) => {
if (state.selection.to === state.selection.from) return null;
+ const pos = (state.doc.resolve(start) as any);
+ let depth = pos.path.length / 3 - 1;
+ for (; depth >= 0; depth--) {
+ if (pos.node(depth).type === schema.nodes.paragraph) {
+ const replaced = state.tr.setNodeMarkup(pos.pos - pos.parentOffset - 1, pos.node(depth).type, { ...pos.node(depth).attrs, indent: 25 });
+ return replaced.setSelection(new TextSelection(replaced.doc.resolve(end - 2)));
+ }
+ }
+ return null;
+ }),
+ new InputRule(
+ new RegExp(/h$/),
+ (state, match, start, end) => {
+ if (state.selection.to === state.selection.from) return null;
+ const pos = (state.doc.resolve(start) as any);
+ let depth = pos.path.length / 3 - 1;
+ for (; depth >= 0; depth--) {
+ if (pos.node(depth).type === schema.nodes.paragraph) {
+ const replaced = state.tr.setNodeMarkup(pos.pos - pos.parentOffset - 1, pos.node(depth).type, { ...pos.node(depth).attrs, indent: -25 });
+ return replaced.setSelection(new TextSelection(replaced.doc.resolve(end - 2)));
+ }
+ }
+ return null;
+ }),
+ new InputRule(
+ new RegExp(/!$/),
+ (state, match, start, end) => {
+ if (state.selection.to === state.selection.from && !(state as any).EnteringStyle) return null;
const node = (state.doc.resolve(start) as any).nodeAfter;
+ if (node?.marks.findIndex((m: any) => m.type === schema.marks.user_tag) !== -1) return state.tr.removeMark(start, end, schema.marks.user_tag);
return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "important", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr;
}),
new InputRule(
new RegExp(/x$/),
(state, match, start, end) => {
- if (state.selection.to === state.selection.from) return null;
+ if (state.selection.to === state.selection.from && !(state as any).EnteringStyle) return null;
const node = (state.doc.resolve(start) as any).nodeAfter;
+ if (node?.marks.findIndex((m: any) => m.type === schema.marks.user_tag) !== -1) return state.tr.removeMark(start, end, schema.marks.user_tag);
return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "disagree", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr;
}),
new InputRule(
diff --git a/src/client/util/RichTextSchema.tsx b/src/client/util/RichTextSchema.tsx
index 462ee85e7..7cb8448ca 100644
--- a/src/client/util/RichTextSchema.tsx
+++ b/src/client/util/RichTextSchema.tsx
@@ -18,9 +18,8 @@ import { Transform } from "./Transform";
import React = require("react");
import { BoolCast, NumCast } from "../../new_fields/Types";
import { FormattedTextBox } from "../views/nodes/FormattedTextBox";
-import { any } from "bluebird";
-const pDOM: DOMOutputSpecArray = ["p", 0], blockquoteDOM: DOMOutputSpecArray = ["blockquote", 0], hrDOM: DOMOutputSpecArray = ["hr"],
+const blockquoteDOM: DOMOutputSpecArray = ["blockquote", 0], hrDOM: DOMOutputSpecArray = ["hr"],
preDOM: DOMOutputSpecArray = ["pre", ["code", 0]], brDOM: DOMOutputSpecArray = ["br"], ulDOM: DOMOutputSpecArray = ["ul", 0];
// :: Object
@@ -31,7 +30,6 @@ export const nodes: { [index: string]: NodeSpec } = {
content: "block+"
},
-
footnote: {
group: "inline",
content: "inline*",
@@ -46,15 +44,6 @@ export const nodes: { [index: string]: NodeSpec } = {
parseDOM: [{ tag: "footnote" }]
},
- // // :: NodeSpec A plain paragraph textblock. Represented in the DOM
- // // as a `<p>` element.
- // paragraph: {
- // content: "inline*",
- // group: "block",
- // parseDOM: [{ tag: "p" }],
- // toDOM() { return pDOM; }
- // },
-
paragraph: ParagraphNodeSpec,
// :: NodeSpec A blockquote (`<blockquote>`) wrapping one or more blocks.
@@ -249,16 +238,13 @@ export const nodes: { [index: string]: NodeSpec } = {
bulletStyle: { default: 0 },
mapStyle: { default: "decimal" },
setFontSize: { default: undefined },
- setFontFamily: { default: undefined },
+ setFontFamily: { default: "inherit" },
inheritedFontSize: { default: undefined },
visibility: { default: true }
},
toDOM(node: Node<any>) {
- const bs = node.attrs.bulletStyle;
if (node.attrs.mapStyle === "bullet") return ['ul', 0];
- const decMap = bs ? "decimal" + bs : "";
- const multiMap = bs === 1 ? "decimal1" : bs === 2 ? "upper-alpha" : bs === 3 ? "lower-roman" : bs === 4 ? "lower-alpha" : "";
- const map = node.attrs.mapStyle === "decimal" ? decMap : multiMap;
+ const map = node.attrs.bulletStyle ? node.attrs.mapStyle + node.attrs.bulletStyle : "";
const fsize = node.attrs.setFontSize ? node.attrs.setFontSize : node.attrs.inheritedFontSize;
const ffam = node.attrs.setFontFamily;
return node.attrs.visibility ? ['ol', { class: `${map}-ol`, style: `list-style: none; font-size: ${fsize}; font-family: ${ffam}` }, 0] :
@@ -285,10 +271,7 @@ export const nodes: { [index: string]: NodeSpec } = {
...listItem,
content: 'paragraph block*',
toDOM(node: any) {
- const bs = node.attrs.bulletStyle;
- const decMap = bs ? "decimal" + bs : "";
- const multiMap = bs === 1 ? "decimal1" : bs === 2 ? "upper-alpha" : bs === 3 ? "lower-roman" : bs === 4 ? "lower-alpha" : "";
- const map = node.attrs.mapStyle === "decimal" ? decMap : node.attrs.mapStyle === "multi" ? multiMap : "";
+ const map = node.attrs.bulletStyle ? node.attrs.mapStyle + node.attrs.bulletStyle : "";
return node.attrs.visibility ? ["li", { class: `${map}` }, 0] : ["li", { class: `${map}` }, "..."];
//return ["li", { class: `${map}` }, 0];
}
@@ -514,6 +497,7 @@ export const marks: { [index: string]: MarkSpec } = {
tag: { default: "" }
},
group: "inline",
+ inclusive: false,
toDOM(node: any) {
const uid = node.attrs.userid.replace(".", "").replace("@", "");
return node.attrs.opened ?
diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts
index edc7df12a..bce33531d 100644
--- a/src/client/views/GlobalKeyHandler.ts
+++ b/src/client/views/GlobalKeyHandler.ts
@@ -108,7 +108,7 @@ export default class KeyManager {
let preventDefault = false;
switch (keyname) {
- case " ":
+ case "~":
DictationManager.Controls.listen({ useOverlay: true, tryExecute: true });
stopPropagation = true;
preventDefault = true;
diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx
index bcdc3a453..01cd7957c 100644
--- a/src/client/views/MainView.tsx
+++ b/src/client/views/MainView.tsx
@@ -315,11 +315,11 @@ export class MainView extends React.Component {
@action
pointerOverDragger = () => {
- if (this.flyoutWidth === 0) {
- this.flyoutWidth = 250;
- this.sidebarButtonsDoc.columnWidth = this.flyoutWidth / 3 - 30;
- this._flyoutTranslate = false;
- }
+ // if (this.flyoutWidth === 0) {
+ // this.flyoutWidth = 250;
+ // this.sidebarButtonsDoc.columnWidth = this.flyoutWidth / 3 - 30;
+ // this._flyoutTranslate = false;
+ // }
}
@action
@@ -338,7 +338,7 @@ export class MainView extends React.Component {
@action
onPointerUp = (e: PointerEvent) => {
if (Math.abs(e.clientX - this._flyoutSizeOnDown) < 4) {
- this.flyoutWidth = this.flyoutWidth < 5 ? 250 : 0;
+ this.flyoutWidth = this.flyoutWidth < 15 ? 250 : 0;
this.flyoutWidth && (this.sidebarButtonsDoc.columnWidth = this.flyoutWidth / 3 - 30);
}
document.removeEventListener("pointermove", this.onPointerMove);
@@ -429,7 +429,7 @@ export class MainView extends React.Component {
style={{ backgroundColor: `${StrCast(sidebar.backgroundColor, "lightGray")}` }} >
<span title="library View Dragger" style={{
width: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "100%" : "3vw",
- height: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "100%" : "100vh",
+ //height: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "100%" : "100vh",
position: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "absolute" : "fixed",
top: (this.flyoutWidth !== 0 && this._flyoutTranslate) ? "" : "0"
}} />
diff --git a/src/client/views/nodes/FormattedTextBox.scss b/src/client/views/nodes/FormattedTextBox.scss
index baf758c0e..ed320bdcd 100644
--- a/src/client/views/nodes/FormattedTextBox.scss
+++ b/src/client/views/nodes/FormattedTextBox.scss
@@ -225,33 +225,43 @@ footnote::after {
.ProseMirror {
touch-action: none;
+ span {
+ font-family: inherit;
+ }
+ ol, ul {
+ counter-reset: deci1 0 multi1 0;
+ padding-left: 1em;
+ font-family: inherit;
+ }
ol {
- counter-reset: deci1 0;
- padding-left: 0px;
+ margin-left: 1em;
+ font-family: inherit;
}
- .decimal1-ol { counter-reset: deci1; p { display: inline }; ul, ol { padding-left: 30px; } }
- .decimal2-ol { counter-reset: deci2; p { display: inline }; font-size: smaller; ul, ol { padding-left: 30px; } }
- .decimal3-ol { counter-reset: deci3; p { display: inline }; font-size: smaller; ul, ol { padding-left: 30px; } }
- .decimal4-ol { counter-reset: deci4; p { display: inline }; font-size: smaller; ul, ol { padding-left: 30px; } }
- .decimal5-ol { counter-reset: deci5; p { display: inline }; font-size: smaller; ul, ol { padding-left: 30px; } }
- .decimal6-ol { counter-reset: deci6; p { display: inline }; font-size: smaller; ul, ol { padding-left: 30px; } }
- .decimal7-ol { counter-reset: deci7; p { display: inline }; font-size: smaller; ul, ol { padding-left: 30px; } }
-
- .upper-alpha-ol { counter-reset: ualph; p { display: inline}; font-size: smaller; }
- .lower-roman-ol { counter-reset: lroman; p { display: inline}; font-size: smaller; }
- .lower-alpha-ol { counter-reset: lalpha; p { display: inline}; font-size: smaller; }
-
- .decimal1:before { counter-increment: deci1; display: inline-block; content: counter(deci1) ". "; }
- .decimal2:before { counter-increment: deci2; display: inline-block; content: counter(deci1) "."counter(deci2) ". "; }
- .decimal3:before { counter-increment: deci3; display: inline-block; content: counter(deci1) "."counter(deci2) "."counter(deci3) ". "; }
- .decimal4:before { counter-increment: deci4; display: inline-block; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) ". "; }
- .decimal5:before { counter-increment: deci5; display: inline-block; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) "."counter(deci5) ". "; }
- .decimal6:before { counter-increment: deci5; display: inline-block; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) "."counter(deci5) "."counter(deci6) ". "; }
- .decimal7:before { counter-increment: deci5; display: inline-block; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) "."counter(deci5) "."counter(deci6) "."counter(deci7) ". "; }
+ .decimal1-ol { counter-reset: deci1; p {display: inline; font-family: inherit} margin-left: 0; }
+ .decimal2-ol { counter-reset: deci2; p {display: inline; font-family: inherit} font-size: smaller; padding-left: 1em;}
+ .decimal3-ol { counter-reset: deci3; p {display: inline; font-family: inherit} font-size: smaller; padding-left: 2em;}
+ .decimal4-ol { counter-reset: deci4; p {display: inline; font-family: inherit} font-size: smaller; padding-left: 3em;}
+ .decimal5-ol { counter-reset: deci5; p {display: inline; font-family: inherit} font-size: smaller; }
+ .decimal6-ol { counter-reset: deci6; p {display: inline; font-family: inherit} font-size: smaller; }
+ .decimal7-ol { counter-reset: deci7; p {display: inline; font-family: inherit} font-size: smaller; }
+
+ .multi1-ol { counter-reset: multi1; p {display: inline; font-family: inherit} margin-left: 0; padding-left: 1.2em }
+ .multi2-ol { counter-reset: multi2; p {display: inline; font-family: inherit} font-size: smaller; padding-left: 1.4em;}
+ .multi3-ol { counter-reset: multi3; p {display: inline; font-family: inherit} font-size: smaller; padding-left: 2em;}
+ .multi4-ol { counter-reset: multi4; p {display: inline; font-family: inherit} font-size: smaller; padding-left: 3.4em;}
+
+ .decimal1:before { transition: 0.5s;counter-increment: deci1; display: inline-block; margin-left: -1em; width: 1em; content: counter(deci1) ". "; }
+ .decimal2:before { transition: 0.5s;counter-increment: deci2; display: inline-block; margin-left: -2.1em; width: 2.1em; content: counter(deci1) "."counter(deci2) ". "; }
+ .decimal3:before { transition: 0.5s;counter-increment: deci3; display: inline-block; margin-left: -2.85em;width: 2.85em; content: counter(deci1) "."counter(deci2) "."counter(deci3) ". "; }
+ .decimal4:before { transition: 0.5s;counter-increment: deci4; display: inline-block; margin-left: -3.85em;width: 3.85em; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) ". "; }
+ .decimal5:before { transition: 0.5s;counter-increment: deci5; display: inline-block; margin-left: -2em; width: 5em; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) "."counter(deci5) ". "; }
+ .decimal6:before { transition: 0.5s;counter-increment: deci6; display: inline-block; margin-left: -2em; width: 6em; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) "."counter(deci5) "."counter(deci6) ". "; }
+ .decimal7:before { transition: 0.5s;counter-increment: deci7; display: inline-block; margin-left: -2em; width: 7em; content: counter(deci1) "."counter(deci2) "."counter(deci3) "."counter(deci4) "."counter(deci5) "."counter(deci6) "."counter(deci7) ". "; }
- .upper-alpha:before { counter-increment: ualph; display: inline-block; content: counter(deci1) "."counter(ualph, upper-alpha) ". "; }
- .lower-roman:before { counter-increment: lroman; display: inline-block; content: counter(deci1) "."counter(ualph, upper-alpha) "."counter(lroman, lower-roman) ". "; }
- .lower-alpha:before { counter-increment: lalpha; display: inline-block; content: counter(deci1) "."counter(ualph, upper-alpha) "."counter(lroman, lower-roman) "."counter(lalpha, lower-alpha) ". "; }
+ .multi1:before { transition: 0.5s;counter-increment: multi1; display: inline-block; margin-left: -1em; width: 1.2em; content: counter(multi1, upper-alpha) ". "; }
+ .multi2:before { transition: 0.5s;counter-increment: multi2; display: inline-block; margin-left: -2em; width: 2em; content: counter(multi1, upper-alpha) "."counter(multi2, decimal) ". "; }
+ .multi3:before { transition: 0.5s;counter-increment: multi3; display: inline-block; margin-left: -2.85em; width:2.85em; content: counter(multi1, upper-alpha) "."counter(multi2, decimal) "."counter(multi3, lower-alpha) ". "; }
+ .multi4:before { transition: 0.5s;counter-increment: multi4; display: inline-block; margin-left: -4.2em; width: 4.2em; content: counter(multi1, upper-alpha) "."counter(multi2, decimal) "."counter(multi3, lower-alpha) "."counter(multi4, lower-roman) ". "; }
} \ No newline at end of file
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index 8dadbb668..3197ce79f 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -351,7 +351,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps &
addStyleSheetRule(FormattedTextBox._userStyleSheet, "userTag-" + "disagree", { "text-decoration": "line-through" });
}
if (FormattedTextBox._highlights.indexOf("Ignore Items") !== -1) {
- addStyleSheetRule(FormattedTextBox._userStyleSheet, "userTag-" + "ignore", { "font-size": "0" });
+ addStyleSheetRule(FormattedTextBox._userStyleSheet, "userTag-" + "ignore", { "font-size": "1" });
}
if (FormattedTextBox._highlights.indexOf("By Recent Minute") !== -1) {
addStyleSheetRule(FormattedTextBox._userStyleSheet, "userMark-" + Doc.CurrentUserEmail.replace(".", "").replace("@", ""), { opacity: "0.1" });
@@ -962,37 +962,42 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps &
// }
// }
- this.hitBulletTargets(e.clientX, e.clientY, e.nativeEvent.offsetX, e.shiftKey);
+ this.hitBulletTargets(e.clientX, e.clientY, e.shiftKey, false)
if (this._recording) setTimeout(() => { this.stopDictation(true); setTimeout(() => this.recordDictation(), 500); }, 500);
}
// this hackiness handles clicking on the list item bullets to do expand/collapse. the bullets are ::before pseudo elements so there's no real way to hit test against them.
- hitBulletTargets(x: number, y: number, offsetX: number, select: boolean, highlightOnly = false) {
+ hitBulletTargets(x: number, y: number, select: boolean, highlightOnly: boolean) {
clearStyleSheetRules(FormattedTextBox._bulletStyleSheet);
- if (this.props.isSelected(true) && offsetX < 40) {
- const pos = this._editorView!.posAtCoords({ left: x, top: y });
- if (pos && pos.pos > 0) {
- const node = this._editorView!.state.doc.nodeAt(pos.pos);
- const node2 = node?.type === schema.nodes.paragraph ? this._editorView!.state.doc.nodeAt(pos.pos - 1) : undefined;
- if ((node === this._nodeClicked || highlightOnly) && (node2?.type === schema.nodes.ordered_list || node2?.type === schema.nodes.list_item)) {
- const hit = this._editorView!.domAtPos(pos.pos).node as any; // let beforeEle = document.querySelector("." + hit.className) as Element;
- const before = hit ? window.getComputedStyle(hit, ':before') : undefined;
- const beforeWidth = before ? Number(before.getPropertyValue('width').replace("px", "")) : undefined;
- if (beforeWidth && offsetX < beforeWidth * .9) {
- const ol = this._editorView!.state.doc.nodeAt(pos.pos - 2) ? this._editorView!.state.doc.nodeAt(pos.pos - 2) : undefined;
- if (ol?.type === schema.nodes.ordered_list && select) {
- if (!highlightOnly) {
- this._editorView!.dispatch(this._editorView!.state.tr.setSelection(new NodeSelection(this._editorView!.state.doc.resolve(pos.pos - 2))));
- }
- addStyleSheetRule(FormattedTextBox._bulletStyleSheet, hit.className + ":before", { background: "lightgray" });
- } else {
- if (highlightOnly) {
- addStyleSheetRule(FormattedTextBox._bulletStyleSheet, hit.className + ":before", { background: "lightgray" });
- } else {
- this._editorView!.dispatch(this._editorView!.state.tr.setNodeMarkup(pos.pos - 1, node2.type, { ...node2.attrs, visibility: !node2.attrs.visibility }));
- }
- }
+ const pos = this._editorView!.posAtCoords({ left: x, top: y });
+ if (pos && this.props.isSelected(true)) {
+ // let beforeEle = document.querySelector("." + hit.className) as Element; // const before = hit ? window.getComputedStyle(hit, ':before') : undefined;
+ //const node = this._editorView!.state.doc.nodeAt(pos.pos);
+ let $pos = this._editorView!.state.doc.resolve(pos.pos);
+ let list_node = $pos.node().type === schema.nodes.list_item ? $pos.node() : undefined;
+ if ($pos.node().type === schema.nodes.ordered_list) {
+ for (let off = 1; off < 100; off++) {
+ const pos = this._editorView!.posAtCoords({ left: x + off, top: y });
+ const node = pos && this._editorView!.state.doc.nodeAt(pos.pos);
+ if (node?.type === schema.nodes.list_item) {
+ list_node = node;
+ break;
+ }
+ }
+ }
+ if (list_node && this._editorView!.state.doc.nodeAt(pos.inside)!.attrs.bulletStyle === list_node.attrs.bulletStyle) {
+ if (select) {
+ let $olist_pos = this._editorView!.state.doc.resolve($pos.pos - $pos.parentOffset - 1);
+ if (!highlightOnly) {
+ this._editorView!.dispatch(this._editorView!.state.tr.setSelection(new NodeSelection($olist_pos)));
+ }
+ addStyleSheetRule(FormattedTextBox._bulletStyleSheet, list_node.attrs.mapStyle + list_node.attrs.bulletStyle + ":hover:before", { background: "lightgray" });
+ } else if (Math.abs(pos.pos - pos.inside) < 2) {
+ if (!highlightOnly) {
+ this._editorView!.dispatch(this._editorView!.state.tr.setNodeMarkup(pos.inside, list_node.type, { ...list_node.attrs, visibility: !list_node.attrs.visibility }));
+ this._editorView!.dispatch(this._editorView!.state.tr.setSelection(TextSelection.create(this._editorView!.state.doc, pos.inside)));
}
+ addStyleSheetRule(FormattedTextBox._bulletStyleSheet, list_node.attrs.mapStyle + list_node.attrs.bulletStyle + ":hover:before", { background: "lightgray" });
}
}
}
@@ -1040,7 +1045,18 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps &
}
this.doLinkOnDeselect();
}
+
onKeyPress = (e: React.KeyboardEvent) => {
+ if (!this._editorView!.state.selection.empty && e.key === "%") {
+ (this._editorView!.state as any).EnteringStyle = true;
+ e.preventDefault();
+ e.stopPropagation();
+ return;
+ }
+
+ if (this._editorView!.state.selection.empty || !(this._editorView!.state as any).EnteringStyle) {
+ (this._editorView!.state as any).EnteringStyle = false;
+ }
if (e.key === "Escape") {
SelectionManager.DeselectAll();
}
@@ -1102,7 +1118,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps &
onKeyDown={this.onKeyPress}
onFocus={this.onFocused}
onClick={this.onClick}
- onPointerMove={e => this.hitBulletTargets(e.clientX, e.clientY, e.nativeEvent.offsetX, e.shiftKey, true)}
+ onPointerMove={e => this.hitBulletTargets(e.clientX, e.clientY, e.shiftKey, true)}
onBlur={this.onBlur}
onPointerUp={this.onPointerUp}
onPointerDown={this.onPointerDown}