Skip to content
Snippets Groups Projects
Commit 602f1ceb authored by Yannis Barlas's avatar Yannis Barlas
Browse files

Merge branch 'substance-upgrade-beta6' into 'staging'

Substance upgrade beta6

See merge request !21
parents 384f621f 79f2c41b
No related branches found
No related tags found
No related merge requests found
Showing
with 249 additions and 258 deletions
......@@ -4,35 +4,22 @@ import {
// deleteCharacter,
// deleteSelection,
keys as keyboardKeys,
Surface,
uuid
} from 'substance'
class ContainerEditor extends SubstanceContainerEditor {
render ($$) {
// TODO -- call with super
var el = Surface.prototype.render.call(this, $$)
var doc = this.getDocument()
var containerId = this.getContainerId()
var containerNode = doc.get(containerId)
if (!containerNode) {
console.warn('No container node found for ', containerId)
}
constructor (...args) {
super(...args)
this.controlBackButton = this.controlBackButton.bind(this)
}
el.addClass('sc-container-editor container-node ' + containerId)
.attr({
spellCheck: false,
'data-id': containerId
})
render ($$) {
let el = super.render($$)
// if it IS empty, handle in didMount
if (!this.isEmpty()) {
containerNode.getNodes().forEach(function (node) {
el.append(this._renderNode($$, node).ref(node.id))
}.bind(this))
}
// native spellcheck
// TODO -- there is a hasNativeSpellcheck fn
const isSpellcheckNative = (this.props.spellcheck === 'native')
el.attr('spellcheck', isSpellcheckNative)
// open for editing
// TODO -- should maybe change to isEditable ?
......@@ -49,14 +36,51 @@ class ContainerEditor extends SubstanceContainerEditor {
super.didMount()
if (this.isEmpty()) this.createText()
this.focus()
if (this.isReadOnlyMode()) {
const documentSession = this.getDocumentSession()
documentSession.on('didUpdate', this.disableToolbar, this)
// TODO -- why this and not this.focus ?
this.el.focus()
if (this.isReadOnlyMode()) {
this.editorSession.onUpdate('', this.disableToolbar, this)
this.addTargetToLinks()
}
this.props.history.listenBefore((location, callback) => {
const commandStates = this.getCommandStates()
if (commandStates['save'].disabled === false) {
const editor = this.getEditor()
editor.send('changesNotSaved')
editor.emit('send:route', location.pathname)
return callback(false)
}
return callback()
})
window.history.pushState(null, null, document.URL)
window.addEventListener('popstate', this.controlBackButton)
}
// TODO -- review // messes up browser history
controlBackButton () {
const commandStates = this.getCommandStates()
const url = '/books/' + this.props.book.id + '/book-builder'
window.removeEventListener('popstate', this.controlBackButton)
if (commandStates['save'].disabled === false) {
const editor = this.getEditor()
window.history.pushState(null, null, document.URL)
editor.send('changesNotSaved')
editor.emit('send:route', url)
} else {
this.props.history.push(url)
}
}
onTextInput (event) {
......@@ -159,7 +183,7 @@ class ContainerEditor extends SubstanceContainerEditor {
createText () {
var newSel
this.transaction(function (tx) {
this.editorSession.transaction(function (tx) {
var container = tx.get(this.props.containerId)
var textType = tx.getSchema().getDefaultTextType()
......@@ -173,6 +197,9 @@ class ContainerEditor extends SubstanceContainerEditor {
newSel = tx.createSelection({
type: 'property',
// TODO -- both id's ??
containerId: 'body',
surfaceId: 'body',
path: [ node.id, 'content' ],
startOffset: 0,
endOffset: 0
......@@ -180,7 +207,7 @@ class ContainerEditor extends SubstanceContainerEditor {
}.bind(this))
this.rerender()
this.setSelection(newSel)
this.editorSession.setSelection(newSel)
}
// only runs if editor is in read-only mode
......@@ -209,6 +236,10 @@ class ContainerEditor extends SubstanceContainerEditor {
link.attr('target', '_blank')
)
}
getEditor () {
return this.context.editor
}
}
export default ContainerEditor
......@@ -2,20 +2,18 @@ import { includes, some } from 'lodash'
import {
ProseEditor,
ProseEditorOverlayTools,
ScrollPane,
SplitPane,
TOCProvider
TOCProvider,
Toolbar
} from 'substance'
import Comments from './panes/Comments/CommentBoxList'
import CommentsProvider from './panes/Comments/CommentsProvider'
import ContainerEditor from './ContainerEditor'
// import Overlay from './Overlay'
import Notes from './panes/Notes/Notes'
import NotesProvider from './panes/Notes/NotesProvider'
import TableOfContents from './panes/TableOfContents/TableOfContents'
import TrackChangesProvider from './elements/track_change/TrackChangesProvider'
import ModalWarning from './elements/modal_warning/ModalWarning'
class Editor extends ProseEditor {
constructor (parent, props) {
......@@ -24,38 +22,38 @@ class Editor extends ProseEditor {
this.handleActions({
'showComments': function () { this.toggleCommentsArea(true) },
'hideComments': function () { this.toggleCommentsArea(false) },
'trackChangesUpdate': function () { this.updateTrackChange() }
// TODO -- clean them up like changesNotSaved
'trackChangesUpdate': function () { this.updateTrackChange() },
'trackChangesViewToggle': function () { this.trackChangesViewToggle() },
// 'changesNotSaved': function () { this.changesNotSaved() }
'changesNotSaved': this.changesNotSaved
})
}
updateTrackChange () {
this.extendProps({
trackChanges: !this.props.trackChanges
changesNotSaved () {
this.extendState({ changesNotSaved: true })
}
trackChangesViewToggle () {
this.extendState({
trackChangesView: !this.state.trackChangesView
})
}
updateTrackChange () {
// TODO -- clean up this.props and this.refs
this.extendProps({ trackChanges: !this.props.trackChanges })
this.props.updateTrackChangesStatus(!this.props.trackChanges)
this.extendState({ trackChanges: !this.props.trackChanges })
this.refs.toolbar.extendProps({trackChanges: this.props.trackChanges})
}
willUpdateState () {}
didMount () {
this.documentSession.on('didUpdate', this.documentSessionUpdated, this)
this.documentSession.on('fileUploadTrigger', this.handleUpload, this)
this.extendState({ editorReady: true })
}
handleUpload (file, callback) {
const { fileUpload } = this.props
// TODO -- then / catch
fileUpload(file).then((res, err) => {
if (err != null) callback(null, err)
return callback(res.file, null)
})
}
render ($$) {
const { trackChangesView } = this.state
const canToggleTrackChanges = this.canToggleTrackChanges()
......@@ -63,17 +61,26 @@ class Editor extends ProseEditor {
const el = $$('div').addClass('sc-prose-editor')
// left side: editor and toolbar
var toolbar = this._renderToolbar($$)
var editor = this._renderEditor($$)
let toolbar = this._renderToolbar($$)
let editor = this._renderEditor($$)
let SplitPane = this.componentRegistry.get('split-pane')
let ScrollPane = this.componentRegistry.get('scroll-pane')
let Overlay = this.componentRegistry.get('overlay')
var footerNotes = $$(Notes)
var props = {
// TODO -- unnecessary // posssibly breaks book builder dnd
let ContextMenu = this.componentRegistry.get('context-menu') // new what does it do?
let Dropzones = this.componentRegistry.get('dropzones') // new what does it do?
const footerNotes = $$(Notes)
const props = {
book: this.props.book,
fragment: this.props.fragment,
history: this.props.history
}
var toc = $$(TableOfContents, props)
const toc = $$(TableOfContents, props)
var editorWithFooter = $$('div')
.append(
......@@ -98,10 +105,14 @@ class Editor extends ProseEditor {
)
var contentPanel = $$(ScrollPane, {
scrollbarPosition: 'right',
overlay: ProseEditorOverlayTools
name: 'contentPanel',
// contextMenu: 'custom',
scrollbarPosition: 'right'
})
.append(editorWithComments)
.append(editorWithComments,
$$(Overlay),
$$(ContextMenu),
$$(Dropzones))
.attr('id', 'content-panel')
.ref('contentPanel')
......@@ -123,13 +134,45 @@ class Editor extends ProseEditor {
el.addClass('track-changes-mode')
}
const modal = $$(ModalWarning, {
width: 'medium',
textAlign: 'center'
})
if (this.state.changesNotSaved) {
return el.append(modal)
}
return el
}
// TODO -- use this to insert read-only mode alert
// TODO -- leverage ProseEditor's this._renderToolbar maybe?
_renderToolbar ($$) {
const toolbar = super._renderToolbar($$)
return toolbar
let viewMode = this.props.disabled ? $$('span')
.addClass('view-mode')
.append('Editor is in Read-Only mode')
: ''
let commandStates = this.commandManager.getCommandStates()
return $$('div')
.addClass('se-toolbar-wrapper')
.append(
$$(Toolbar, {
commandStates: commandStates,
trackChanges: this.props.trackChanges,
trackChangesView: this.state.trackChangesView,
toolGroups: [
'annotations',
'default',
'document',
'text',
'track-change-enable',
'track-change-toggle-view'
]
}).ref('toolbar')
)
.append(viewMode)
}
_renderEditor ($$) {
......@@ -137,19 +180,22 @@ class Editor extends ProseEditor {
const editing = this.props.disabled ? 'selection' : 'full'
return $$(ContainerEditor, {
editing: editing,
documentSession: this.documentSession,
editorSession: this.editorSession,
commands: configurator.getSurfaceCommandNames(),
containerId: 'body',
spellcheck: 'native',
textTypes: configurator.getTextTypes(),
trackChanges: this.props.trackChanges,
updateTrackChangesStatus: this.props.updateTrackChangesStatus
updateTrackChangesStatus: this.props.updateTrackChangesStatus,
history: this.props.history,
book: this.props.book
}).ref('body')
}
getInitialState () {
return {
changesNotSaved: false,
editorReady: false,
trackChanges: this.props.trackChanges,
trackChangesView: true
}
}
......@@ -189,16 +235,16 @@ class Editor extends ProseEditor {
containerId: 'body'
})
// // notes provider
// notes provider
const notesProvider = new NotesProvider(doc)
// // comments provider
// comments provider
const commentsProvider = new CommentsProvider(doc, {
commandManager: this.commandManager,
comments: this.props.fragment.comments,
containerId: this.props.containerId,
controller: this,
documentSession: this.documentSession,
editorSession: this.editorSession,
fragment: this.props.fragment,
surfaceManager: this.surfaceManager,
toggleCommentsArea: this.toggleCommentsArea,
......@@ -211,7 +257,7 @@ class Editor extends ProseEditor {
commandManager: this.commandManager,
containerId: this.props.containerId,
controller: this,
documentSession: this.documentSession,
editorSession: this.editorSession,
surfaceManager: this.surfaceManager,
user: this.props.user
})
......
// import { get } from 'lodash'
import React from 'react'
import ReactDOM from 'react-dom'
import { Alert } from 'react-bootstrap'
import {
ProseEditorConfigurator as Configurator,
DocumentSession
EditorSession
} from 'substance'
import config from './config'
......@@ -24,11 +23,6 @@ export default class SimpleEditor extends React.Component {
this._releaseLock = this._releaseLock.bind(this)
this._acquireLock = this._acquireLock.bind(this)
// TODO -- delete, along with Alert
this.state = {
canEdit: false
}
}
// TODO -- is this necessary?
......@@ -50,15 +44,18 @@ export default class SimpleEditor extends React.Component {
const importer = configurator.createImporter('html')
const doc = importer.importDocument(source)
const documentSession = new DocumentSession(doc)
const editorSession = new EditorSession(doc, {
configurator: configurator
})
documentSession.setSaveHandler({
saveDocument: this.save
editorSession.setSaveHandler({
saveDocument: this.save,
uploadFile: this.props.fileUpload
})
return {
configurator: configurator,
documentSession: documentSession
editorSession: editorSession
}
}
......@@ -71,11 +68,10 @@ export default class SimpleEditor extends React.Component {
save (source, changes, callback) {
const { onSave } = this.props
const config = this.state.config
const exporter = new SimpleExporter(config)
const convertedSource = exporter.exportDocument(source)
onSave(convertedSource, callback)
return onSave(convertedSource)
}
// NOTE -- Theoretically, we shouldn't lock when the editor is in read only
......@@ -139,8 +135,8 @@ export default class SimpleEditor extends React.Component {
componentDidMount () {
const el = ReactDOM.findDOMNode(this)
const { book, fileUpload, fragment, history, onSave, update, user } = this.props
const { configurator, documentSession } = this.createSession()
const { book, fragment, history, onSave, update, user } = this.props
const { configurator, editorSession } = this.createSession()
if (!fragment) return
......@@ -161,8 +157,7 @@ export default class SimpleEditor extends React.Component {
configurator,
containerId,
disabled,
documentSession,
fileUpload,
editorSession,
fragment,
history,
onSave,
......@@ -207,19 +202,8 @@ export default class SimpleEditor extends React.Component {
// TODO -- do I even need a render here?
render () {
// TODO -- DELETE THIS !!!!!
let viewMode = !this.state.canEdit
? (
<Alert bsStyle='warning' className='view-mode'>
<span>Editor is in Read-Only Mode</span>
</Alert>
)
: null
return (
<div className='editor-wrapper'>
{viewMode}
</div>
<div className='editor-wrapper' />
)
}
}
......
......@@ -27,23 +27,19 @@ $active-blue: #4a90e2;
height: 90vh;
position: relative;
// move to a new file toolbar.scss ??
.view-mode {
height: 44px;
position: fixed;
font-size: 14px;
position: absolute;
right: 0;
text-align: center;
top: 10px;
width: 20%;
z-index: 9999;
span {
font-size: 14px;
position: relative;
top: 10px;
}
}
.track-changes-mode {
.se-content:first-child {
div.se-content {
line-height: 38px;
}
......@@ -54,6 +50,9 @@ $active-blue: #4a90e2;
.sc-comment-pane-list li .comment-list .single-comment-row {
padding: 3px 12px;
}
.sc-overlay .se-active-tools .sc-overlay-bubble .sc-comment-icon {
top: 0;
}
}
}
......@@ -64,12 +63,15 @@ $active-blue: #4a90e2;
right: 0;
top: 0;
.sc-toolbar {
.se-toolbar-wrapper .sc-toolbar {
background-color: $primary;
border: 1px solid $border;
border-right: 0;
float: left;
max-width: 1920px;
padding-left: 0;
vertical-align: middle;
width: 100%;
@-moz-document url-prefix() {
.sc-tool-group > .sc-switch-text-type {
margin: 0;
......@@ -113,12 +115,12 @@ $active-blue: #4a90e2;
} // end dropdown
.sm-target-track-change-enable {
border-right: 1px solid $border;
button {
background-color: $inactive-grey;
border-radius: 0;
color: $white;
line-height: 0;
// cursor: pointer;
padding: 0 19px;
position: relative;
......@@ -149,6 +151,7 @@ $active-blue: #4a90e2;
cursor: pointer;
padding: 0 19px;
position: relative;
line-height: 0;
}
button::after {
......@@ -168,14 +171,14 @@ $active-blue: #4a90e2;
border-left: 1px solid $border;
}
.sm-target-track-change-enable,
.sm-target-track-change-toggle-view {
.sm-target-track-change-enable {
padding: 0 9px;
}
.sm-target-document,
.sm-target-annotations,
.sm-target-insert {
.sm-target-insert,
.sm-target-default {
border-right: 1px solid $border;
padding: 0px 9px;
......@@ -204,7 +207,7 @@ $active-blue: #4a90e2;
padding: 0;
&:after {
bottom: 17px;
bottom: 8px;
color: $black;
content: 'x';
font-size: 8px;
......@@ -223,10 +226,16 @@ $active-blue: #4a90e2;
}
.se-content {
div.se-content {
color: $transparent-black;
font-family: 'Fira Sans';
word-wrap: break-word;
background-color: $white;
box-shadow: 0 0 8px $dark-gray;
margin: 1.5% 14% 7%;
min-height: 100vh;
padding: 3% 4% 1%;
transition: .3s;
::selection {
background: $light-gray;
......@@ -240,15 +249,6 @@ $active-blue: #4a90e2;
background: none;
}
&:first-child {
background-color: $white;
box-shadow: 0 0 8px $dark-gray;
margin: 1.5% 14% 7%;
min-height: 100vh;
padding: 3% 4% 1%;
transition: .3s;
}
.sc-split-pane {
position: relative;
}
......@@ -257,26 +257,35 @@ $active-blue: #4a90e2;
outline: none;
}
.sc-prose-editor-overlay-tools {
.sc-overlay {
.se-active-tools {
background: transparent;
border: 0;
border-radius: 0;
padding: 0;
}
}
.sc-prose-editor-overlay-tools::before {
.sc-overlay.sm-theme-dark::before {
border-style: none;
border-width: 0;
}
}
.sc-list-ul {
list-style-type: disc;
padding-left: 19px;
}
.sc-list-ol {
list-style-type: decimal;
padding-left: 19px;
}
} // end sc-content
.sc-has-comments {
.se-content {
&:first-child {
div.se-content {
margin: 1.5% 27% 5% 1%;
transition: .3s;
}
}
}
......
......@@ -34,11 +34,11 @@ class SimpleExporter extends HTMLExporter {
throw new Error('Illegal arguments: container is mandatory.')
}
var doc = container.getDocument()
var doc = container.editorSession.getDocument()
this.state.doc = doc
var elements = []
container.data.nodes.body.nodes.forEach(function (id) {
container.editorSession.document.data.nodes.body.nodes.forEach(function (id) {
var node = doc.get(id)
var nodeEl = this.convertNode(node)
elements.push(nodeEl)
......
......@@ -27,6 +27,8 @@ class SimpleImporter extends HTMLImporter {
this.convertContainer(bodyEls, 'body')
}
// TODO -- check substance's implementation of overlapping annotations
// override substance's internal function to allow for overlapping
// annotations, without adhering to an expand / fuse mode
_createInlineNodes () {
......
......@@ -73,14 +73,13 @@ export class SimpleEditorWrapper extends React.Component {
const { fragment } = this.props
fragment.source = source
this.update(fragment)
return callback()
return this.update(fragment)
}
update (newChapter) {
const { book } = this.props
const { updateFragment } = this.props.actions
updateFragment(book, newChapter)
return updateFragment(book, newChapter)
}
}
......
......@@ -4,30 +4,27 @@ import {
CodePackage,
EmphasisPackage,
HeadingPackage,
// LinkPackage,
ParagraphPackage,
PersistencePackage,
ProseArticle,
LinkPackage,
StrongPackage,
SubscriptPackage,
SuperscriptPackage
SuperscriptPackage,
SwitchTextTypePackage,
SpellCheckPackage,
CodeblockPackage
} from 'substance'
// My Elements
import CodeblockPackage from './elements/codeblock/CodeblockPackage'
import CommentPackage from './elements/comment/CommentPackage'
import ExtractPackage from './elements/extract/ExtractPackage'
import NotePackage from './elements/note/NotePackage'
import SourceNotePackage from './elements/source_note/SourceNotePackage'
import ImagePackage from './elements/images/ImagePackage'
import ListPackage from './elements/list/ListPackage'
import TrackChangePackage from './elements/track_change/TrackChangePackage'
// var DialoguePackage = require('./elements/dialogue/DialoguePackage')
// var NumberedListPackage = require('./elements/numbered_list/NumberedListPackage')
// var NoStyleListPackage = require('./elements/no_style_list/NoStyleListPackage')
let config = {
name: 'simple-editor',
configure: (config, options) => {
......@@ -40,7 +37,7 @@ let config = {
config.import(BasePackage, {
noBaseStyles: options.noBaseStyles
})
config.import(SwitchTextTypePackage)
config.import(ParagraphPackage)
config.import(HeadingPackage)
config.import(BlockquotePackage)
......@@ -49,23 +46,18 @@ let config = {
config.import(SubscriptPackage)
config.import(SuperscriptPackage)
config.import(CodePackage)
// config.import(LinkPackage)
config.import(PersistencePackage)
config.import(CodeblockPackage)
config.import(LinkPackage)
// config.import(DialoguePackage)
config.import(SpellCheckPackage)
config.import(ListPackage)
config.import(CodeblockPackage)
config.import(ExtractPackage)
config.import(NotePackage)
config.import(SourceNotePackage)
config.import(CommentPackage)
config.import(ImagePackage)
config.import(CommentPackage)
config.import(TrackChangePackage)
// config.import(DialoguePackage)
// config.import(NoStyleListPackage)
// config.import(NumberedListPackage)
}
}
......
import { TextBlock } from 'substance'
class Codeblock extends TextBlock {}
Codeblock.type = 'codeblock'
export default Codeblock
import { TextBlockComponent } from 'substance'
class CodeblockComponent extends TextBlockComponent {
render ($$) {
let el = super.render.call(this, $$)
return el.addClass('sc-codeblock')
}
}
export default CodeblockComponent
export default {
type: 'codeblock',
tagName: 'pre',
import: function (el, node, converter) {
let codeEl = el.find('code')
if (codeEl) {
node.content = converter.annotatedText(codeEl, [node.id, 'content'], { preserveWhitespace: true })
}
},
export: function (node, el, converter) {
let $$ = converter.$$
el.append(
$$('code').append(
converter.annotatedText([node.id, 'content'])
)
)
}
}
import Codeblock from './Codeblock'
import CodeblockComponent from './CodeblockComponent'
import CodeblockHTMLConverter from './CodeblockHTMLConverter'
export default {
name: 'codeblock',
configure: function (config) {
config.addNode(Codeblock)
config.addComponent('codeblock', CodeblockComponent)
config.addConverter('html', CodeblockHTMLConverter)
config.addTextType({
name: 'codeblock',
data: {type: 'codeblock'}
})
config.addLabel('codeblock', {
en: 'Codeblock',
de: 'Codeblock'
})
}
// Codeblock: Codeblock,
// CodeblockComponent: CodeblockComponent,
// CodeblockHTMLConverter: CodeblockHTMLConverter
}
.sc-codeblock {
font-family: var(--font-family-code);
font-size: 15px;
}
// Toolbar styles
// .sc-switch-text-type .se-option.sm-codeblock {
// font-family: var(--font-family-code);
// font-size: 15px;
// }
import {
createAnnotation,
DefaultDOMElement,
FontAwesomeIcon as Icon,
Tool
......@@ -29,6 +28,7 @@ class CommentBubble extends Tool {
// calculated relative to the overlay container, which gets positioned
// wrong on resize (substance bug -- TODO)
didMount () {
this.context.editorSession.onUpdate('', this.position, this)
this.position()
DefaultDOMElement.getBrowserWindow().on('resize', this.didUpdate, this)
}
......@@ -52,7 +52,7 @@ class CommentBubble extends Tool {
if (!surface) return
const documentElement = document.querySelector('.se-content')
const overlayContainer = document.querySelector('.sc-overlay-container')
const overlayContainer = document.querySelector('.sc-overlay')
setTimeout(() => { // read comment below
const documentElementWidth = documentElement.offsetWidth
......@@ -62,7 +62,9 @@ class CommentBubble extends Tool {
// unhide it first, as the bubble has no height otherwise
this.el.removeClass('sc-overlay-bubble-hidden')
const hints = surface.getBoundingRectangleForSelection()
let wsel = window.getSelection()
let wrange = wsel.getRangeAt(0)
const hints = wrange.getBoundingClientRect()
const selectionHeight = hints.height
const bubbleHeight = this.el.getHeight()
const cheat = 3
......@@ -89,8 +91,8 @@ class CommentBubble extends Tool {
return commandStates.comment
}
getDocumentSession () {
return this.context.documentSession
getEditorSession () {
return this.context.editorSession
}
getMode () {
......@@ -103,8 +105,8 @@ class CommentBubble extends Tool {
}
getSelection () {
const documentSession = this.getDocumentSession()
return documentSession.getSelection()
const editorSession = this.getEditorSession()
return editorSession.getSelection()
}
// TODO -- get from provider
......@@ -137,12 +139,15 @@ class CommentBubble extends Tool {
const newNode = {
selection: selection,
node: { type: 'comment' }
type: 'comment',
path: selection.path,
start: selection.start,
end: selection.end
}
surface.transaction((tx, args) => {
const annotation = createAnnotation(tx, newNode)
provider.focusTextArea(annotation.node.id)
surface.editorSession.transaction((tx, args) => {
const annotation = tx.create(newNode)
provider.focusTextArea(annotation.id)
})
}
}
......
......@@ -29,7 +29,8 @@ class CommentComponent extends AnnotationComponent {
return el
}
shouldRerender (newProps) {
// TODO -- this was shouldRerender, but that stopped working. why?
shouldRedraw (newProps) {
if (this.hasNodeChanged()) {
this.active = this.props.node.active
this.rerender()
......@@ -46,7 +47,7 @@ class CommentComponent extends AnnotationComponent {
didMount () {
const provider = this.getProvider()
provider.on('comments:updated', this.shouldRerender, this)
provider.on('comments:updated', this.shouldRedraw, this)
}
getProvider () {
......
......@@ -7,7 +7,10 @@ import ResolvedCommentPackage from './ResolvedCommentPackage'
export default {
name: 'comment',
configure: function (config) {
configure: function (config, {
disableCollapsedCursor, // TODO -- should delete?
toolGroup
}) {
config.import(ResolvedCommentPackage)
config.addNode(Comment)
......@@ -15,10 +18,13 @@ export default {
config.addComponent(Comment.type, CommentComponent)
config.addConverter('html', CommentHTMLConverter)
config.addCommand(Comment.type, CommentCommand, { nodeType: Comment.type })
config.addCommand(Comment.type, CommentCommand, {
disableCollapsedCursor, // TODO -- same as above
nodeType: Comment.type
})
config.addTool('comment', CommentBubble, {
target: 'overlay',
triggerOnCursorMove: true
toolGroup: 'overlay'
})
config.addIcon('comment', { 'fontawesome': 'fa-comment' })
......
......@@ -17,7 +17,7 @@ $white: #fff;
background-color: $light-green;
}
.sc-prose-editor-overlay-tools {
.sc-overlay {
.se-active-tools {
.sc-overlay-bubble {
background: $white;
......
@import './codeblock/codeblock';
@import './comment/comment';
// @import './dialogue/dialogue';
@import './extract/extract';
......@@ -11,3 +10,5 @@
@import './track_change/trackChange';
@import './images/image';
@import './modal_warning/modalWarning';
@import './list/customLists';
.sc-extract {
.sc-prose-editor .se-content .sc-extract {
font-family: 'Fira Sans';
font-style: italic;
font-weight: 300;
......
import { DocumentNode } from 'substance'
class Image extends DocumentNode {}
Image.define({
type: 'image',
src: { type: 'string', default: 'http://' }
})
export default Image
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment