use selectable state to enable comments when doc is locked

app/components/SimpleEditor/ContainerEditor.js

@@ -30,20 +30,11 @@ class ContainerEditor extends SubstanceContainerEditor {
       }.bind(this))
     }
 
+    // open for editing
     if (!this.props.disabled) {
       el.addClass('sm-enabled')
       el.setAttribute('contenteditable', true)
     }
-    if (this.props.canNotEdit) {
-      el.addEventListener('keydown', function (e) {
-        e.preventDefault()
-        if (e.keyCode === 13 || e.keyCode === 32) {
-          const documentSession = this.context.documentSession
-          documentSession.undo()
-        }
-      })
-      el.addEventListener('contextmenu', event => event.preventDefault())
-    }
 
     return el
   }

app/components/SimpleEditor/Editor.js

 import {
   ProseEditor,
-  // ProseEditorOverlayTools,
   ScrollPane,
   SplitPane,
   TOCProvider
@@ -94,9 +93,11 @@ class Editor extends ProseEditor {
   }
 
   _renderEditor ($$) {
-    var configurator = this.props.configurator
+    const configurator = this.props.configurator
+    const editing = this.props.disabled ? 'selection' : 'full'
+
     return $$(ContainerEditor, {
-      canNotEdit: this.props.disabled,
+      editing: editing,
       documentSession: this.documentSession,
       commands: configurator.getSurfaceCommandNames(),
       containerId: 'body',
@@ -133,7 +134,7 @@ class Editor extends ProseEditor {
   getChildContext () {
     var doc = this.doc
     // TODO -- check whether this is correct
-    var oldContext = Object.assign({}, super.getChildContext(), { Editor })
+    var oldContext = super.getChildContext()
 
     // toc provider
     var tocProvider = new TOCProvider(doc, {

app/components/SimpleEditor/Overlay.js

@@ -2,39 +2,45 @@ import { ProseEditorOverlayTools } from 'substance'
 import { each, includes, keys } from 'lodash'
 
 class Overlay extends ProseEditorOverlayTools {
-  render ($$) {
+  getActiveTools () {
     const surface = this.getSurface()
+    if (!surface) return []
 
-    if (surface && surface.props.canNotEdit) {
-      const commandStates = this.context.commandManager.getCommandStates()
-      each(keys(commandStates), (key) => {
+    const activeTools = super.getActiveTools()
+
+    if (!surface.isEditable() && surface.isSelectable()) {
+      const commandStates = this.getCommandStates()
+
+      each(keys(commandStates), key => {
         const allowed = ['comment', 'save']
         if (!includes(allowed, key)) commandStates[key].disabled = true
       })
+
+      console.log('filter it', activeTools)
     }
 
-    let el = $$('div').addClass(this.getClassNames())
-    let activeTools = this.getActiveTools()
+    return activeTools
+  }
 
-    if (activeTools.length > 0) {
-      let toolsEl = $$('div').addClass('se-active-tools')
-      activeTools.forEach(tool => {
-        toolsEl.append(
-          $$(tool.Class, tool.toolProps).ref(tool.toolProps.name)
-        )
-      })
-      el.append(toolsEl)
-    }
-    return el
+  getCommandStates () {
+    const commandManager = this.context.commandManager
+    return commandManager.getCommandStates()
+  }
+
+  getContainerId () {
+    const editor = this.getEditor()
+    return editor.props.containerId
+  }
+
+  getEditor () {
+    return this.context.controller
   }
 
   getSurface () {
+    const containerId = this.getContainerId()
     const surfaceManager = this.context.surfaceManager
-    return surfaceManager.getSurface('body')
-  }
 
-  getClassNames () {
-    return 'sc-prose-editor-overlay-tools'
+    return surfaceManager.getSurface(containerId)
   }
 }