aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--src/client/util/RichTextSchema.tsx57
-rw-r--r--src/client/util/TooltipTextMenu.scss13
-rw-r--r--src/client/util/TooltipTextMenu.tsx25
-rw-r--r--src/client/views/nodes/FormattedTextBox.scss2
4 files changed, 66 insertions, 31 deletions
diff --git a/src/client/util/RichTextSchema.tsx b/src/client/util/RichTextSchema.tsx
index e1e595925..3078e0bbc 100644
--- a/src/client/util/RichTextSchema.tsx
+++ b/src/client/util/RichTextSchema.tsx
@@ -1,10 +1,11 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { Schema, NodeSpec, MarkSpec, DOMOutputSpecArray, NodeType, Slice } from "prosemirror-model";
+import { Schema, NodeSpec, MarkSpec, DOMOutputSpecArray, NodeType, Slice, Mark } from "prosemirror-model";
import { joinUp, lift, setBlockType, toggleMark, wrapIn, selectNodeForward, deleteSelection } from 'prosemirror-commands';
import { redo, undo } from 'prosemirror-history';
import { orderedList, bulletList, listItem, } from 'prosemirror-schema-list';
import { EditorState, Transaction, NodeSelection, TextSelection, Selection, } from "prosemirror-state";
import { EditorView, } from "prosemirror-view";
+import { View } from '@react-pdf/renderer';
const pDOM: DOMOutputSpecArray = ["p", 0], blockquoteDOM: DOMOutputSpecArray = ["blockquote", 0], hrDOM: DOMOutputSpecArray = ["hr"],
preDOM: DOMOutputSpecArray = ["pre", ["code", 0]], brDOM: DOMOutputSpecArray = ["br"], ulDOM: DOMOutputSpecArray = ["ul", 0];
@@ -89,7 +90,7 @@ export const nodes: { [index: string]: NodeSpec } = {
inline: true,
attrs: {
visibility: { default: false },
- oldtext: { default: undefined },
+ text: { default: undefined },
oldtextslice: { default: undefined },
oldtextlen: { default: 0 }
@@ -280,12 +281,12 @@ export const marks: { [index: string]: MarkSpec } = {
toDOM: () => ['sup']
},
- collapse: {
- parseDOM: [{ style: 'color: blue' }],
+ highlight: {
+ parseDOM: [{ style: 'background: #d9dbdd' }],
toDOM() {
return ['span', {
- style: 'color: blue'
- }]
+ style: 'background: #d9dbdd'
+ }];
}
},
@@ -479,6 +480,7 @@ export class ImageResizeView {
export class SummarizedView {
// TODO: highlight text that is summarized. to find end of region, walk along mark
_collapsed: HTMLElement;
+ _view: any;
constructor(node: any, view: any, getPos: any) {
this._collapsed = document.createElement("span");
this._collapsed.textContent = "㊉";
@@ -487,24 +489,34 @@ export class SummarizedView {
this._collapsed.style.position = "relative";
this._collapsed.style.width = "40px";
this._collapsed.style.height = "20px";
+ let self = this;
+ this._view = view;
this._collapsed.onpointerdown = function (e: any) {
console.log("star pressed!");
if (node.attrs.visibility) {
node.attrs.visibility = !node.attrs.visibility;
console.log("content is visible");
let y = getPos();
- view.dispatch(view.state.tr.setSelection(TextSelection.create(view.state.doc, y + 1, y + 1 + node.attrs.oldtextlen)));
+ let { from, to } = self.updateSummarizedText(y + 1, view.state.schema.marks.highlight);
+ let length = to - from;
+ let newSelection = TextSelection.create(view.state.doc, y + 1, y + 1 + length);
+ node.attrs.text = newSelection.content();
+ view.dispatch(view.state.tr.setSelection(newSelection));
view.dispatch(view.state.tr.deleteSelection(view.state, () => { }));
- //this._collapsed.textContent = "㊀";
+ self._collapsed.textContent = "㊉";
} else {
node.attrs.visibility = !node.attrs.visibility;
console.log("content is invisible");
let y = getPos();
- let mark = view.state.schema.mark(view.state.schema.marks.underline);
- console.log("PASTING " + node.attrs.oldtext.toString());
+ console.log(y);
+ let mark = view.state.schema.mark(view.state.schema.marks.highlight);
+ console.log("PASTING " + node.attrs.text.toString());
view.dispatch(view.state.tr.setSelection(TextSelection.create(view.state.doc, y + 1, y + 1)));
- view.dispatch(view.state.tr.replaceSelection(node.attrs.oldtext).addMark(view.state.selection.from, view.state.selection.from + node.attrs.oldtextlen, mark));
- //this._collapsed.textContent = "㊉";
+ const from = view.state.selection.from;
+ view.dispatch(view.state.tr.replaceSelection(node.attrs.text).addMark(from, from + node.attrs.oldtextlen, mark));
+ //view.dispatch(view.state.tr.setSelection(view.state.doc, from + node.attrs.oldtextlen + 1, from + node.attrs.oldtextlen + 1));
+ view.dispatch(view.state.tr.removeStoredMark(mark));
+ self._collapsed.textContent = "㊀";
}
e.preventDefault();
e.stopPropagation();
@@ -515,6 +527,25 @@ export class SummarizedView {
selectNode() {
}
+ updateSummarizedText(start?: any, mark?: any) {
+ let $start = this._view.state.doc.resolve(start);
+ let first_startPos = $start.start(), endPos = first_startPos;
+ while ($start.nodeAfter !== null) {
+ let startIndex = $start.index(), endIndex = $start.indexAfter();
+ while (startIndex > 0 && mark.isInSet($start.parent.child(startIndex - 1).marks)) startIndex--;
+ while (endIndex < $start.parent.childCount && mark.isInSet($start.parent.child(endIndex).marks)) endIndex++;
+ let startPos = $start.start(), endPos = startPos;
+ for (let i = 0; i < endIndex; i++) {
+ let size = $start.parent.child(i).nodeSize;
+ console.log($start.parent.child(i).childCount);
+ if (i < startIndex) startPos += size;
+ endPos += size;
+ }
+ $start = this._view.state.doc.resolve(start + (endPos - startPos) + 1);
+ }
+ return { from: first_startPos, to: endPos };
+ }
+
deselectNode() {
}
}
@@ -536,4 +567,4 @@ schema.nodeFromJSON = (json: any) => {
node.attrs.oldtext = Slice.fromJSON(schema, node.attrs.oldtextslice);
}
return node;
-} \ No newline at end of file
+}; \ No newline at end of file
diff --git a/src/client/util/TooltipTextMenu.scss b/src/client/util/TooltipTextMenu.scss
index 4d4eb386d..c10a61558 100644
--- a/src/client/util/TooltipTextMenu.scss
+++ b/src/client/util/TooltipTextMenu.scss
@@ -235,7 +235,7 @@
.tooltipMenu {
position: absolute;
z-index: 50;
- background: whitesmoke;
+ background: #121721;
border: 1px solid silver;
border-radius: 15px;
padding: 2px 10px;
@@ -244,8 +244,8 @@
//transform: translateX(-50%);
transform: translateY(-50%);
pointer-events: all;
- height: auto;
- width:inherit;
+ height: 100;
+ width:250;
.ProseMirror-example-setup-style hr {
padding: 2px 10px;
border: none;
@@ -306,3 +306,10 @@
font-size: 12px;
padding-right: 0px;
}
+ .summarize{
+ margin-left: 15px;
+ color: white;
+ height: 20px;
+ // background-color: white;
+ text-align: center;
+ } \ No newline at end of file
diff --git a/src/client/util/TooltipTextMenu.tsx b/src/client/util/TooltipTextMenu.tsx
index 0a61b7e7d..a19b6c1d8 100644
--- a/src/client/util/TooltipTextMenu.tsx
+++ b/src/client/util/TooltipTextMenu.tsx
@@ -189,13 +189,13 @@ export class TooltipTextMenu {
this.linkText.style.whiteSpace = "nowrap";
this.linkText.style.width = "150px";
this.linkText.style.overflow = "hidden";
- this.linkText.style.color = "black";
+ this.linkText.style.color = "white";
this.linkText.onpointerdown = (e: PointerEvent) => { e.stopPropagation(); };
let linkBtn = document.createElement("div");
linkBtn.textContent = ">>";
linkBtn.style.width = "10px";
linkBtn.style.height = "10px";
- linkBtn.style.color = "black";
+ linkBtn.style.color = "white";
linkBtn.style.cssFloat = "left";
linkBtn.onpointerdown = (e: PointerEvent) => {
let node = this.view.state.selection.$from.nodeAfter;
@@ -244,19 +244,16 @@ export class TooltipTextMenu {
this.linkEditor.appendChild(linkBtn);
this.tooltip.appendChild(this.linkEditor);
+ // SUMMARIZE BUTTON
+
let starButton = document.createElement("span");
- // starButton.style.width = '10px';
- // starButton.style.height = '10px';
- starButton.style.marginLeft = '10px';
- starButton.textContent = "Summarize";
- starButton.style.color = 'black';
- starButton.style.height = '20px';
- starButton.style.backgroundColor = 'white';
- starButton.style.textAlign = 'center';
+ starButton.className = "summarize";
+ starButton.textContent = "★";
+ starButton.title = 'Summarize';
starButton.onclick = () => {
let state = this.view.state;
this.insertStar(state, this.view.dispatch);
- }
+ };
this.tooltip.appendChild(starButton);
}
@@ -286,9 +283,9 @@ export class TooltipTextMenu {
insertStar(state: EditorState<any>, dispatch: any) {
console.log("creating star...");
- let newNode = schema.nodes.star.create({ visibility: false, oldtext: state.selection.content(), oldtextslice: state.selection.content().toJSON(), oldtextlen: state.selection.to - state.selection.from });
+ let newNode = schema.nodes.star.create({ visibility: false, text: state.selection.content(), oldtextslice: state.selection.content().toJSON(), oldtextlen: state.selection.to - state.selection.from });
if (dispatch) {
- console.log(newNode.attrs.oldtext.toString());
+ console.log(newNode.attrs.text.toString());
dispatch(state.tr.replaceSelectionWith(newNode));
}
return true;
@@ -438,7 +435,7 @@ export class TooltipTextMenu {
span.className = name + " menuicon";
span.title = title;
span.textContent = text;
- span.style.color = "black";
+ span.style.color = "white";
return span;
}
diff --git a/src/client/views/nodes/FormattedTextBox.scss b/src/client/views/nodes/FormattedTextBox.scss
index 4a29c1949..e3e40860c 100644
--- a/src/client/views/nodes/FormattedTextBox.scss
+++ b/src/client/views/nodes/FormattedTextBox.scss
@@ -1,7 +1,7 @@
@import "../globalCssVariables";
.ProseMirror {
width: 100%;
- height: auto;
+ height: 100;
min-height: 100%;
font-family: $serif;
}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-11 23:10:12 +0000