From b0fe696fda817fbacf286dbf975e71786a326a46 Mon Sep 17 00:00:00 2001
From: Alexandros Georgantas <alexgeorg86@gmail.com>
Date: Fri, 7 Apr 2017 15:48:59 +0300
Subject: [PATCH] TextPropertyEditor added
---
.../SimpleEditor/ContainerEditor.js | 6 ++-
.../elements/isolatedNote/IsolatedNote.js | 7 +--
.../isolatedNote/IsolatedNoteCommand.js | 2 +-
.../isolatedNote/IsolatedNoteComponent.js | 28 ++++++++++-
.../isolatedNote/TextPropertyEditor.js | 48 +++++++++++++++++++
5 files changed, 83 insertions(+), 8 deletions(-)
create mode 100644 app/components/SimpleEditor/elements/isolatedNote/TextPropertyEditor.js
diff --git a/app/components/SimpleEditor/ContainerEditor.js b/app/components/SimpleEditor/ContainerEditor.js
index ad3241b..671ce31 100644
--- a/app/components/SimpleEditor/ContainerEditor.js
+++ b/app/components/SimpleEditor/ContainerEditor.js
@@ -3,6 +3,7 @@ import {
ContainerEditor as SubstanceContainerEditor,
// deleteCharacter,
// deleteSelection,
+ // Surface,
keys as keyboardKeys,
uuid
} from 'substance'
@@ -10,12 +11,12 @@ import {
class ContainerEditor extends SubstanceContainerEditor {
constructor (...args) {
super(...args)
+ // this.name = 'body'
this.controlBackButton = this.controlBackButton.bind(this)
}
render ($$) {
let el = super.render($$)
-
// native spellcheck
// TODO -- there is a hasNativeSpellcheck fn
const isSpellcheckNative = (this.props.spellcheck === 'native')
@@ -87,8 +88,9 @@ class ContainerEditor extends SubstanceContainerEditor {
}
onTextInput (event) {
+ console.log('before')
if (!this.props.trackChanges) return super.onTextInput(event)
-
+ console.log('after')
this.handleTracking({
event: event,
status: 'add',
diff --git a/app/components/SimpleEditor/elements/isolatedNote/IsolatedNote.js b/app/components/SimpleEditor/elements/isolatedNote/IsolatedNote.js
index 1cfc50b..a5f7135 100644
--- a/app/components/SimpleEditor/elements/isolatedNote/IsolatedNote.js
+++ b/app/components/SimpleEditor/elements/isolatedNote/IsolatedNote.js
@@ -1,6 +1,6 @@
-import {InlineNode} from 'substance'
+import {DocumentNode} from 'substance'
-class IsolatedNote extends InlineNode {}
+class IsolatedNote extends DocumentNode {}
IsolatedNote.define({
'type': 'isolated-note',
@@ -11,7 +11,8 @@ IsolatedNote.define({
'index': {
type: 'number',
optional: true
- }
+ },
+ description: 'text'
})
export default IsolatedNote
diff --git a/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteCommand.js b/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteCommand.js
index 95d27f4..0c835b1 100644
--- a/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteCommand.js
+++ b/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteCommand.js
@@ -24,7 +24,7 @@ class IsolatedNoteCommand extends Command {
editorSession.transaction((tx) => {
let nodeData = this.createNodeData(tx, params)
console.log('nodeData', nodeData)
- tx.insertInlineNode(nodeData)
+ tx.insertBlockNode(nodeData)
})
}
diff --git a/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteComponent.js b/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteComponent.js
index b56eb59..e8daa2a 100644
--- a/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteComponent.js
+++ b/app/components/SimpleEditor/elements/isolatedNote/IsolatedNoteComponent.js
@@ -1,5 +1,29 @@
-import { IsolatedNodeComponent } from 'substance'
+import { BlockNodeComponent } from 'substance'
+import TextPropertyEditor from './TextPropertyEditor'
-class IsolatedNoteComponent extends IsolatedNodeComponent {}
+class IsolatedNoteComponent extends BlockNodeComponent {
+
+ render($$) {
+ console.log('this', this)
+ let el = $$('div').addClass('sc-entity')
+ el.append($$('paragraph'))
+ el.append($$('paragraph').append(
+ $$(TextPropertyEditor, {
+ path: [this.props.node.id, 'description'],
+ disabled: this.props.disabled,
+ tagName: 'p',
+ multiLine: true,
+
+ }).ref('nameEditor')))
+
+ // el.on('click', function (e) {
+ // console.log(this)
+ // this.el.attr('contentEditable', true)
+ // this.el.attr('hi', true)
+ // console.log(this)
+ // })
+ return el
+ }
+}
export default IsolatedNoteComponent
diff --git a/app/components/SimpleEditor/elements/isolatedNote/TextPropertyEditor.js b/app/components/SimpleEditor/elements/isolatedNote/TextPropertyEditor.js
new file mode 100644
index 0000000..9f2fad2
--- /dev/null
+++ b/app/components/SimpleEditor/elements/isolatedNote/TextPropertyEditor.js
@@ -0,0 +1,48 @@
+import { TextPropertyEditor as SubstanceTextPropertyEditor } from 'substance'
+
+/**
+ Editor for a text property (annotated string). Needs to be
+ instantiated inside a {@link ui/Controller} context.
+
+ @class
+ @component
+ @extends ui/Surface
+
+ @prop {String} name unique editor name
+ @prop {String[]} path path to a text property
+ @prop {ui/SurfaceCommand[]} commands array of command classes to be available
+
+ @example
+
+ Create a `TextPropertyEditor` for the `name` property of an author object. Allow emphasis annotations.
+
+ ```js
+ $$(TextPropertyEditor, {
+ name: 'authorNameEditor',
+ path: ['author_1', 'name'],
+ commands: [EmphasisCommand]
+ })
+ ```
+*/
+
+class TextPropertyEditor extends SubstanceTextPropertyEditor {
+ constructor(parent, props) {
+ // making props.name optional
+ props.name = props.name || props.path.join('.')
+ super(parent, props)
+
+ if (!props.path) {
+ throw new Error("Property 'path' is mandatory.")
+ }
+ }
+
+ onTextInput (event) {
+ let surface = this.context.surfaceManager.getFocusedSurface()
+ if(!surface) return
+ return surface.onTextInput(event)
+
+ }
+}
+
+
+export default TextPropertyEditor
--
GitLab