diff options
author | laurawilsonri <laura_wilson@brown.edu> | 2019-03-06 10:43:54 -0500 |
---|---|---|
committer | laurawilsonri <laura_wilson@brown.edu> | 2019-03-06 10:43:54 -0500 |
commit | f93142ada6b4142b55ffaeea1d3f11b5336957a5 (patch) | |
tree | d7e7999f14324b163b01d6fbf37563fed4473bbc /src/client/views/nodes/FormattedTextBox.tsx | |
parent | 6283dcc3b7889ff431941e0bcb92591ff7a64e0e (diff) | |
parent | 9867d1f7965471d5d9be2f147b33db712b8cea79 (diff) |
Merge branch 'master' of https://github.com/browngraphicslab/Dash-Web into improveText
Diffstat (limited to 'src/client/views/nodes/FormattedTextBox.tsx')
-rw-r--r-- | src/client/views/nodes/FormattedTextBox.tsx | 47 |
1 files changed, 30 insertions, 17 deletions
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index a0f662f18..a6cee9957 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -5,15 +5,15 @@ import { keymap } from "prosemirror-keymap"; import { schema } from "../../util/RichTextSchema"; import { EditorState, Transaction, } from "prosemirror-state"; import { EditorView } from "prosemirror-view"; -import { Opt, FieldWaiting, FieldValue } from "../../../fields/Field"; +import { Opt, FieldWaiting } from "../../../fields/Field"; import "./FormattedTextBox.scss"; -import { KeyStore } from "../../../fields/KeyStore"; import React = require("react") import { RichTextField } from "../../../fields/RichTextField"; import { FieldViewProps, FieldView } from "./FieldView"; import { Plugin } from 'prosemirror-state' import { Decoration, DecorationSet } from 'prosemirror-view' import { TooltipTextMenu } from "../../util/TooltipTextMenu" +import { ContextMenu } from "../../views/ContextMenu"; @@ -45,7 +45,6 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { super(props); this._ref = React.createRef(); - this.onChange = this.onChange.bind(this); } @@ -53,16 +52,12 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { if (this._editorView) { const state = this._editorView.state.apply(tx); this._editorView.updateState(state); - const { doc, fieldKey } = this.props; - doc.SetData(fieldKey, JSON.stringify(state.toJSON()), RichTextField); + this.props.doc.SetData(this.props.fieldKey, JSON.stringify(state.toJSON()), RichTextField); } } componentDidMount() { let state: EditorState; - const { doc, fieldKey } = this.props; - - // let mySchema = new Schema({ nodes, marks }) const config = { schema, plugins: [ @@ -71,11 +66,10 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { keymap(baseKeymap), this.tooltipMenuPlugin() ] - }; - let field = doc.GetT(fieldKey, RichTextField); - if (field && field != FieldWaiting) { // bcz: don't think this works + let field = this.props.doc.GetT(this.props.fieldKey, RichTextField); + if (field && field != FieldWaiting) { state = EditorState.fromJSON(config, JSON.parse(field.Data)); } else { state = EditorState.create(config); @@ -95,9 +89,7 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { this._editorView.updateState(EditorState.fromJSON(config, JSON.parse(field))); } }) - - //if tagged to be selected when created, then select & focus - if (this.props.doc.GetNumber(KeyStore.SelectOnLoaded, 0)) { + if (this.props.selectOnLoad) { this.props.select(); this._editorView!.focus(); } @@ -118,15 +110,35 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { @action onChange(e: React.ChangeEvent<HTMLInputElement>) { - const { fieldKey, doc } = this.props; - doc.SetData(fieldKey, e.target.value, RichTextField); + this.props.doc.SetData(this.props.fieldKey, e.target.value, RichTextField); } onPointerDown = (e: React.PointerEvent): void => { - let me = this; if (e.buttons === 1 && this.props.isSelected()) { e.stopPropagation(); } } + + //REPLACE THIS WITH CAPABILITIES SPECIFIC TO THIS TYPE OF NODE + textCapability = (e: React.MouseEvent): void => { + } + + specificContextMenu = (e: React.MouseEvent): void => { + ContextMenu.Instance.addItem({ description: "Text Capability", event: this.textCapability }); + // ContextMenu.Instance.addItem({ + // description: "Submenu", + // items: [ + // { + // description: "item 1", event: + // }, + // { + // description: "item 2", event: + // } + // ] + // }) + // e.stopPropagation() + + } + onPointerWheel = (e: React.WheelEvent): void => { e.stopPropagation(); } @@ -142,6 +154,7 @@ export class FormattedTextBox extends React.Component<FieldViewProps> { render() { return (<div className="formattedTextBox-cont" onPointerDown={this.onPointerDown} + onContextMenu={this.specificContextMenu} onWheel={this.onPointerWheel} ref={this._ref} />) } |