fix collab examples

This commit is contained in:
Hans Pagel
2020-11-30 14:30:24 +01:00
parent 66c88e7669
commit aa9420688b
2 changed files with 11 additions and 29 deletions

View File

@@ -18,30 +18,21 @@ export default {
data() { data() {
return { return {
documentName: 'tiptap-collaboration-extension',
ydoc: null,
provider: null,
type: null,
editor: null, editor: null,
} }
}, },
mounted() { mounted() {
this.ydoc = new Y.Doc() const ydoc = new Y.Doc()
this.provider = new WebrtcProvider(this.documentName, this.ydoc) const provider = new WebrtcProvider('tiptap-collaboration-extension', ydoc)
this.type = this.ydoc.getXmlFragment('prosemirror')
this.editor = new Editor({ this.editor = new Editor({
// TODO: This is added by every new user.
// content: `
// <p>Example Text</p>
// `,
extensions: [ extensions: [
Document, Document,
Paragraph, Paragraph,
Text, Text,
Collaboration.configure({ Collaboration.configure({
type: this.type, provider,
}), }),
], ],
}) })
@@ -49,7 +40,6 @@ export default {
beforeDestroy() { beforeDestroy() {
this.editor.destroy() this.editor.destroy()
this.provider.destroy()
}, },
} }
</script> </script>

View File

@@ -19,35 +19,28 @@ export default {
data() { data() {
return { return {
documentName: 'tiptap-collaboration-cursor-extension',
ydoc: null,
provider: null,
type: null,
editor: null, editor: null,
} }
}, },
mounted() { mounted() {
this.ydoc = new Y.Doc() const ydoc = new Y.Doc()
this.provider = new WebrtcProvider(this.documentName, this.ydoc) const provider = new WebrtcProvider('tiptap-collaboration-cursor-extension', ydoc)
this.type = this.ydoc.getXmlFragment('prosemirror')
this.editor = new Editor({ this.editor = new Editor({
// TODO: This is added by every new user.
// content: `
// <p>Example Text</p>
// `,
extensions: [ extensions: [
Document, Document,
Paragraph, Paragraph,
Text, Text,
Collaboration.configure({ Collaboration.configure({
type: this.type, provider,
}), }),
CollaborationCursor.configure({ CollaborationCursor.configure({
provider: this.provider, provider,
name: 'Cyndi Lauper', user: {
color: '#f783ac', name: 'Cyndi Lauper',
color: '#f783ac',
},
}), }),
], ],
}) })
@@ -55,7 +48,6 @@ export default {
beforeDestroy() { beforeDestroy() {
this.editor.destroy() this.editor.destroy()
this.provider.destroy()
}, },
} }
</script> </script>