diff --git a/app/components/SimpleEditor/Editor.js b/app/components/SimpleEditor/Editor.js index ffc49736e248d0c565824657a7bd49d1fcafdc34..cfbc452fa1d7d55ba819eace4b1e177318aae84d 100644 --- a/app/components/SimpleEditor/Editor.js +++ b/app/components/SimpleEditor/Editor.js @@ -111,7 +111,7 @@ class Editor extends ProseEditor { $$(ContextMenu), sideNav ) - .attr('id', 'content-panel') + .attr('id', 'content-panel-' + this.props.containerId) .ref('contentPanel') const contentPanelWithSplitPane = $$(SplitPane, { sizeA: '95%', splitType: 'vertical' }) diff --git a/app/components/SimpleEditor/elements/comment/CommentBubble.js b/app/components/SimpleEditor/elements/comment/CommentBubble.js index 6e13585cc8609aa761104ffce2545835b779e377..e668fa6a9262abad3770236bd9bae1c52c472710 100644 --- a/app/components/SimpleEditor/elements/comment/CommentBubble.js +++ b/app/components/SimpleEditor/elements/comment/CommentBubble.js @@ -54,22 +54,14 @@ class CommentBubble extends Tool { // without this check, the editor will break on first load const surface = this.getSurface() if (!surface) return + const containerId = this.context.editor.props.containerId + const contentPanel = '#content-panel-' + containerId setTimeout(() => { // read comment below - let documentElement = document.querySelector('.se-content') - let overlayContainer = document.querySelector('.sc-overlay') + let documentElement = document.querySelector(contentPanel + ' .se-content') + let overlayContainer = document.querySelector(contentPanel + ' .sc-overlay') let fix = 15 - const minEditorContentPanelChildren = document.getElementById('notes-editor-content-panel').children - const temp = minEditorContentPanelChildren[0].children - documentElement = temp[0] - const children = temp[0].children - - if (parseInt(overlayContainer.offsetLeft) === 0 || - overlayContainer.style.left !== 0 && parseInt(children[1].offsetLeft) !== 0) { - overlayContainer = children[1] - } - const documentElementWidth = documentElement.offsetWidth / 1.85 const overlayContainerLeft = overlayContainer.offsetLeft const left = documentElementWidth - overlayContainerLeft - fix diff --git a/app/components/SimpleEditor/notesEditor/NotesEditor.js b/app/components/SimpleEditor/notesEditor/NotesEditor.js index 3d3fcdaf7be4ef1785d84ce9a52170415d5a7377..bfcf53d10ba984ef6d0004d2145470e9e513b77b 100644 --- a/app/components/SimpleEditor/notesEditor/NotesEditor.js +++ b/app/components/SimpleEditor/notesEditor/NotesEditor.js @@ -45,7 +45,7 @@ class NotesEditor extends ProseEditor { scrollbarPosition: 'right' }) .append(editorWithComments, $$(Overlay)) - .attr('id', 'notes-editor-content-panel') + .attr('id', 'content-panel-' + this.props.containerId) .ref('notesEditorContentPanel') el.append($$(SplitPane, { sizeA: '100%', splitType: 'horizontal' }) diff --git a/app/components/SimpleEditor/panes/Notes/Notes.js b/app/components/SimpleEditor/panes/Notes/Notes.js index aff0e09eaff06c4e1ada815a79efaf28ae4235d8..e404563d9ca6a54e86e9ebdadcc7b5663d9dbbe3 100644 --- a/app/components/SimpleEditor/panes/Notes/Notes.js +++ b/app/components/SimpleEditor/panes/Notes/Notes.js @@ -133,8 +133,9 @@ class Notes extends Component { // TODO -- should be cleaner resize (e) { + const {containerId} = this.props this.notesPaneHeight = (this.el.el.offsetHeight + this.el.el.offsetTop - e.clientY) - const scrollPane = document.getElementById('notes-editor-content-panel').children + const scrollPane = document.getElementById('content-panel-' + containerId).children scrollPane[0].style.minHeight = this.notesPaneHeight - 40 + 'px' this.el.el.style.height = this.notesPaneHeight + 'px' @@ -151,7 +152,8 @@ class Notes extends Component { // compute what of main pane? // and what is the main pane? the notes pane? computeMainPane () { - const mainPane = document.getElementById('content-panel') + const {containerId} = this.context.editor.props + const mainPane = document.getElementById('content-panel-' + containerId) mainPane.style.height = this.el.el.offsetTop - 175 + 'px' }