diff --git a/app/components/SimpleEditor/ContainerEditor.js b/app/components/SimpleEditor/ContainerEditor.js index 36ee2897acb60d9bf23c292683864c9950055466..839349470b292811ac059ca2cd7f6773b2aa13ce 100644 --- a/app/components/SimpleEditor/ContainerEditor.js +++ b/app/components/SimpleEditor/ContainerEditor.js @@ -13,19 +13,6 @@ class ContainerEditor extends SubstanceContainerEditor { el.addClass('my-custom-class') // native spellcheck el.attr('spellcheck', this.props.spellcheck === 'native') - // var doc = this.getDocument() - // var containerId = this.getContainerId() - // var containerNode = doc.get(containerId) - - // if (!containerNode) { - // console.warn('No container node found for ', containerId) - // } - // - // el.addClass('sc-container-editor container-node ' + containerId) - // .attr({ - // spellCheck: false, - // 'data-id': containerId - // }) // open for editing // TODO -- should maybe change to isEditable ? @@ -38,11 +25,6 @@ class ContainerEditor extends SubstanceContainerEditor { return el } - // _onContainerChanged (...args) { - // super._onContainerChanged(...args) - // this._owner.rerender() - // } - didMount () { super.didMount() if (this.isEmpty()) this.createText() @@ -55,7 +37,7 @@ class ContainerEditor extends SubstanceContainerEditor { // this.addTargetToLinks() // } } - // + onTextInput (event) { if (!this.props.trackChanges) return super.onTextInput(event) diff --git a/app/components/SimpleEditor/Editor.js b/app/components/SimpleEditor/Editor.js index 91139dc36e39da8d1ce15d3e98edb2b71ea89191..62b85862bce031a16581c6548dd0108d53f89335 100644 --- a/app/components/SimpleEditor/Editor.js +++ b/app/components/SimpleEditor/Editor.js @@ -43,16 +43,16 @@ class Editor extends ProseEditor { willUpdateState () {} didMount () { - const surface = this.surfaceManager.getSurface(this.props.containerId) - - this.editorSession.onUpdate('document', surface._onContainerChanged, this, { - path: [surface.getContainer(this.props.containerId), 'nodes'] - }) + this.editorSession.onRender('document', this.editorContentUpdated, this) // this.documentSession.on('didUpdate', this.documentSessionUpdated, this) // this.documentSession.on('fileUploadTrigger', this.handleUpload, this) this.extendState({ editorReady: true }) } + editorContentUpdated () { + this.emit('ui:updated') + } + handleUpload (file, callback) { const { fileUpload } = this.props diff --git a/app/components/SimpleEditor/SimpleEditor.scss b/app/components/SimpleEditor/SimpleEditor.scss index 919c0ff9be0e1e7f6e1fe302cfbd0c46036c3f96..026ef0c52e13de668b4bd32c3efb3925f37c612d 100644 --- a/app/components/SimpleEditor/SimpleEditor.scss +++ b/app/components/SimpleEditor/SimpleEditor.scss @@ -280,11 +280,9 @@ $active-blue: #4a90e2; } // end sc-content .sc-has-comments { - .se-content { - &:first-child { + div.se-content { margin: 1.5% 27% 5% 1%; transition: .3s; - } } } diff --git a/app/components/SimpleEditor/elements/note/EditNoteTool.js b/app/components/SimpleEditor/elements/note/EditNoteTool.js index 6a47779dc27c1023268e426658abd8a5097e69b0..d0bc2890b7030a374ba1aa3f1f969234385affc9 100644 --- a/app/components/SimpleEditor/elements/note/EditNoteTool.js +++ b/app/components/SimpleEditor/elements/note/EditNoteTool.js @@ -39,15 +39,31 @@ class EditNoteTool extends Tool { return el } + didMount () { + this.context.editorSession.onUpdate('', this.diabelTools, this) + } + + diabelTools () { + const selected = this.getSelection() + if (!selected.node) return + const commandStates = this.context.commandManager.commandStates + each(keys(commandStates), (key) => { + const allowed = ['comment', 'redo', 'save', 'switch-text-type', 'undo', 'note'] + if (!includes(allowed, key)) commandStates[key].disabled = true + }) + } + saveNote (event) { const selected = this.getSelection() const noteContent = this.el.find('textarea').val() const editorSession = this.context.editorSession - editorSession.transaction(function (tx, args) { const path = [selected.node.id, 'note-content'] tx.set(path, noteContent) }) + + this.el.addClass('hidden') + console.log(this.el) } getSelection () { @@ -71,10 +87,10 @@ class EditNoteTool extends Tool { if (typeof note[0] !== 'undefined' && selectionLength) { // disable commands that don't make sense on a note console.log('commandStates', commandStates) - each(keys(commandStates), (key) => { - const allowed = ['comment', 'redo', 'save', 'switch-text-type', 'undo'] - if (!includes(allowed, key)) commandStates[key].disabled = true - }) + // each(keys(commandStates), (key) => { + // const allowed = ['comment', 'redo', 'save', 'switch-text-type', 'undo'] + // if (!includes(allowed, key)) commandStates['link'].disabled = true + // }) return { node: note[0] diff --git a/app/components/SimpleEditor/elements/note/note.scss b/app/components/SimpleEditor/elements/note/note.scss index 300847a5e8975757114ef56c34738dded8672775..e00246aa22af93e3192cdbaa98098e0fca24260f 100644 --- a/app/components/SimpleEditor/elements/note/note.scss +++ b/app/components/SimpleEditor/elements/note/note.scss @@ -1,6 +1,8 @@ $gray: #eee; $red: #591818; - +.hidden { + display: none; +} .sc-prose-editor { counter-reset: note; diff --git a/app/components/SimpleEditor/panes/Comments/CommentBox.js b/app/components/SimpleEditor/panes/Comments/CommentBox.js index 89fe6f3f2ff22a5a12236d16d101f346adb6a5de..453c569bb1b8bc61d384ae118e51dcb2a9d0794e 100644 --- a/app/components/SimpleEditor/panes/Comments/CommentBox.js +++ b/app/components/SimpleEditor/panes/Comments/CommentBox.js @@ -83,11 +83,11 @@ class CommentBox extends Component { textAreaAdjust (event) { const value = this.refs.commentReply.getValue() let replyBtn = this.refs.commentReplyButton - console.log('replyBn', replyBtn) + if (value.trim().length > 0) { - replyBtn.removeAttr('disabled') + replyBtn.el.removeAttr('disabled') } else { - replyBtn.attr('disabled', 'true') + replyBtn.el.attr('disabled', 'true') } var parent = this.props.parent diff --git a/app/components/SimpleEditor/panes/Comments/CommentBoxList.js b/app/components/SimpleEditor/panes/Comments/CommentBoxList.js index e7aacbe3977ebb87567734d807c3488ed3dca038..8d2962c26bc68f375e5217fc57e31a49158c75f5 100644 --- a/app/components/SimpleEditor/panes/Comments/CommentBoxList.js +++ b/app/components/SimpleEditor/panes/Comments/CommentBoxList.js @@ -89,6 +89,7 @@ class CommentBoxList extends Component { // get position of annotation in editor const annotationEl = document.querySelector('span[data-id="' + entry.id + '"]') + if (annotationEl) annotationTop = parseInt(annotationEl.offsetTop) // get height of this comment box diff --git a/app/components/SimpleEditor/panes/Comments/CommentsProvider.js b/app/components/SimpleEditor/panes/Comments/CommentsProvider.js index e165558c9587b10cae5f2489dd3be4f17e579f28..0240fff6ef0fe72a21625951ba3d5c346a620a1d 100644 --- a/app/components/SimpleEditor/panes/Comments/CommentsProvider.js +++ b/app/components/SimpleEditor/panes/Comments/CommentsProvider.js @@ -1,5 +1,5 @@ import _ from 'lodash' -import { createAnnotation, deleteNode, TOCProvider as TocProvider } from 'substance' +import { createAnnotation, TOCProvider as TocProvider } from 'substance' class CommentsProvider extends TocProvider { // TODO -- works if I rename to doc @@ -7,10 +7,14 @@ class CommentsProvider extends TocProvider { super(document, props) this.activeEntry = null const editorSession = props.editorSession + editorSession.onUpdate('', this.updateActiveEntry, this) - const doc = editorSession.getDocument() - doc.on('document:changed', this.update, this) + editorSession.onRender('document', this.update, this) + + // TODO is this needed? + // const doc = editorSession.getDocument() + // doc.on('document:changed', this.update, this) const editor = props.controller editor.on('ui:updated', this.onUiUpdate, this) @@ -163,8 +167,9 @@ class CommentsProvider extends TocProvider { deleteCommentNode (id) { const surface = this.getSurface() - surface.transaction(function (tx, args) { - deleteNode(tx, { nodeId: id }) + surface.editorSession.transaction(function (tx, args) { + tx.delete(id) + return args }) } @@ -308,41 +313,41 @@ class CommentsProvider extends TocProvider { node.active = bool } - // TODO -- do I need to override this? - handleDocumentChange (change) { - var doc = this.getDocument() - var needsUpdate = false - var tocTypes = this.constructor.tocTypes - - for (var i = 0; i < change.ops.length; i++) { - var op = change.ops[i] - var nodeType - if (op.isCreate() || op.isDelete()) { - var nodeData = op.getValue() - nodeType = nodeData.type - if (_.includes(tocTypes, nodeType)) { - needsUpdate = true - break - } - } else { - var id = op.path[0] - var node = doc.get(id) - if (node && _.includes(tocTypes, node.type)) { - needsUpdate = true - break - } - } - } - - if (needsUpdate) { - // need a timeout here, to make sure that the updated doc has rendered - // the annotations, so that the comment box list can be aligned with them - const self = this - setTimeout(function () { - self.reComputeEntries() - }) - } - } + // // TODO -- do I need to override this? + // handleDocumentChange (change) { + // var doc = this.getDocument() + // var needsUpdate = false + // var tocTypes = this.constructor.tocTypes + // + // for (var i = 0; i < change.ops.length; i++) { + // var op = change.ops[i] + // var nodeType + // if (op.isCreate() || op.isDelete()) { + // var nodeData = op.getValue() + // nodeType = nodeData.type + // if (_.includes(tocTypes, nodeType)) { + // needsUpdate = true + // break + // } + // } else { + // var id = op.path[0] + // var node = doc.get(id) + // if (node && _.includes(tocTypes, node.type)) { + // needsUpdate = true + // break + // } + // } + // } + // + // if (needsUpdate) { + // // need a timeout here, to make sure that the updated doc has rendered + // // the annotations, so that the comment box list can be aligned with them + // const self = this + // setTimeout(function () { + // self.reComputeEntries() + // }) + // } + // } /* When a comment gets resolved the comment on the fragment gets a resolved property.