44 lines
1.2 KiB
JavaScript
44 lines
1.2 KiB
JavaScript
import { h, Component } from 'preact';
|
|
import PropTypes from 'prop-types';
|
|
|
|
export default class CodeEditor extends Component {
|
|
componentDidMount() {
|
|
import('codemirror').then(CodeMirror => {
|
|
const editor = document.getElementById('codeeditor');
|
|
const myCodeMirror = CodeMirror(editor, {
|
|
mode: 'javascript',
|
|
theme: 'material',
|
|
autofocus: true,
|
|
});
|
|
myCodeMirror.setSize('100%', '100%');
|
|
// Initial trigger:
|
|
const channel = window.pusher.channel(
|
|
`presence-channel-${this.props.activeChannelId}`,
|
|
);
|
|
channel.trigger('client-livecode', {
|
|
context: 'initializing-live-code-channel',
|
|
channel: `presence-channel-${this.props.activeChannelId}`,
|
|
});
|
|
// Coding trigger:
|
|
myCodeMirror.on('keyup', cm => {
|
|
channel.trigger('client-livecode', {
|
|
keyPressed: true,
|
|
value: cm.getValue(),
|
|
cursorPos: cm.getCursor(),
|
|
});
|
|
});
|
|
});
|
|
}
|
|
|
|
shouldComponentUpdate() {
|
|
return false;
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div id="codeeditor" className="chatcodeeditor">
|
|
<div className="chatcodeeditor__header">Experimental (WIP)</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|