Isolated note init

app/components/SimpleEditor/config.js

@@ -24,6 +24,7 @@ import ListPackage from './elements/list/ListPackage'
 import NotePackage from './elements/note/NotePackage'
 import SourceNotePackage from './elements/source_note/SourceNotePackage'
 import TrackChangePackage from './elements/track_change/TrackChangePackage'
+import IsolatedNotePackage from './elements/isolatedNote/IsolatedNotePackage'
 
 const config = {
   name: 'simple-editor',
@@ -58,6 +59,7 @@ const config = {
     config.import(SourceNotePackage)
     config.import(SpellCheckPackage)
     config.import(TrackChangePackage)
+    config.import(IsolatedNotePackage)
   }
 }
 

app/components/SimpleEditor/elements/isolatedNote/IsolatedNote.js

+import {InlineNode} from 'substance'
+
+class IsolatedNote extends InlineNode {}
+
+IsolatedNote.define({
+  'type': 'isolated-note',
+  'note-content': {
+    type: 'string',
+    optional: true
+  },
+  'index': {
+    type: 'number',
+    optional: true
+  }
+})
+
+export default IsolatedNote

app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteCommand.js

+import { Command } from 'substance'
+
+class IsolatedNoteCommand extends Command {
+  constructor () {
+    super({ name: 'insert-isolated-note' })
+  }
+
+  getCommandState (params) {
+    let sel = params.selection
+    let newState = {
+      disabled: !sel.isPropertySelection(),
+      active: false
+    }
+    return newState
+  }
+
+  /**
+    Insert new inline node at the current selection
+  */
+  execute (params) {
+    let state = this.getCommandState(params)
+    if (state.disabled) return
+    let editorSession = this._getEditorSession(params)
+    editorSession.transaction((tx) => {
+      let nodeData = this.createNodeData(tx, params)
+      console.log('nodeData', nodeData)
+      tx.insertInlineNode(nodeData)
+    })
+  }
+
+  createNodeData(tx) { // eslint-disable-line
+    return {
+      'type': 'isolated-note',
+      'content': 'isolated note',
+      'index': 1
+    }
+  }
+}
+
+export default IsolatedNoteCommand

app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteComponent.js

+import { IsolatedNodeComponent } from 'substance'
+
+class IsolatedNoteComponent extends IsolatedNodeComponent {}
+
+export default IsolatedNoteComponent

app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteHTMLConverter.js

+export default {
+  type: 'isolated-note',
+  tagName: 'isolated-note',
+
+  import: function (element, node, converter) {
+    console.log('import', node)
+    node['note-content'] = element.attr('note-content')
+  },
+
+  export: function (node, element, converter) {
+    console.log('export', node)
+    var noteContent = node['note-content']
+    element.setAttribute('note-content', noteContent)
+  }
+}

app/components/SimpleEditor/elements/isolatedNote/IsolatedNotePackage.js

+import IsolatedNote from './IsolatedNote'
+import IsolatedNoteComponent from './IsolatedNoteComponent'
+import IsolatedNoteHTMLConverter from './IsolatedNoteHTMLConverter'
+import IsolatedNoteCommand from './IsolatedNoteCommand'
+import IsolatedNoteTool from './IsolatedNoteTool'
+// import {InsertInlineNodeCommand} from 'substance'
+
+
+export default {
+  name: 'isolated-note',
+  configure: function (config) {
+    config.addNode(IsolatedNote)
+    config.addComponent(IsolatedNote.type, IsolatedNoteComponent)
+    config.addConverter('html', IsolatedNoteHTMLConverter)
+    config.addCommand('insert-isolated-note', IsolatedNoteCommand, {nodeType: IsolatedNote.type})
+    config.addTool('insert-isolated-note', IsolatedNoteTool, { toolGroup: 'annotations' })
+    config.addIcon('insert-isolated-note', { 'fontawesome': 'fa-close' })
+  },
+
+  IsolatedNote: IsolatedNote,
+  IsolatedNoteComponent: IsolatedNoteComponent,
+  IsolatedNoteHTMLConverter: IsolatedNoteHTMLConverter,
+  IsolatedNoteCommand: IsolatedNoteCommand,
+  IsolatedNoteTool: IsolatedNoteTool
+}

app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteTool.js

+import { Tool } from 'substance'
+
+class IsolatedNoteTool extends Tool {
+  getClassNames () {
+    return 'sc-insert-isolated-note-tool'
+  }
+  renderButton ($$) {
+    let button = super.renderButton($$)
+    return [ button ]
+  }
+  onClick () {
+    this.executeCommand({
+      context: this.context
+    })
+  }
+}
+export default IsolatedNoteTool