ejones / sharedb-codemirror Goto Github PK

import React, {Component} from 'react';

import otText from 'ot-text'
import shareDB from 'sharedb/lib/client'
import shareDBCodeMirror from 'sharedb-codemirror'
import CodeMirror from 'codemirror'
require('codemirror/theme/eclipse.css');
require('codemirror/mode/clike/clike');

shareDB.types.map['json0'].registerSubtype(otText.type);


class CollaberateView extends Component
{
    constructor(props){
        super(props);
        this._refs={}
    }

    componentDidMount(){

        this.editor = CodeMirror.fromTextArea(this._refs.textArea,{mode:"text/x-c++src",lineNumbers:"true",theme:"eclipse"});

        this.shareConnection = new shareDB.Connection(new WebSocket("ws://localhost:8080/share/e83b2e2695c940008195cc6375b815cf"));

        this.doc = this.shareConnection.get('example', 'textarea');
         
        try{
            shareDBCodeMirror.attachDocToCodeMirror(this.doc, this.editor, {
                key: 'content',
                verbose: true
             });
        }catch(err){
            console.log("attach doc error:"+err);
        }
        console.log("finish")
    }

    render(){
        return (
            <div className="container">
                <textarea ref={e => this._refs.textArea=e}>  </textarea>
            </div>
        )
    }
}
export default CollaberateView;