48 lines
1.2 KiB
JavaScript
48 lines
1.2 KiB
JavaScript
/* global CodeMirror */
|
|
import Ember from 'ember';
|
|
|
|
const {Component} = Ember;
|
|
|
|
export default Component.extend({
|
|
classNameBindings: ['isFocused:focused'],
|
|
|
|
value: '', // make sure a value exists
|
|
isFocused: false,
|
|
|
|
// options for the editor
|
|
lineNumbers: true,
|
|
indentUnit: 4,
|
|
mode: 'htmlmixed',
|
|
theme: 'xq-light',
|
|
|
|
_editor: null, // reference to CodeMirror editor
|
|
|
|
didInsertElement() {
|
|
this._super(...arguments);
|
|
|
|
let options = this.getProperties('lineNumbers', 'indentUnit', 'mode', 'theme');
|
|
let editor = new CodeMirror(this.get('element'), options);
|
|
|
|
editor.getDoc().setValue(this.get('value'));
|
|
|
|
// events
|
|
editor.on('focus', Ember.run.bind(this, 'set', 'isFocused', true));
|
|
editor.on('blur', Ember.run.bind(this, 'set', 'isFocused', false));
|
|
editor.on('change', () => {
|
|
Ember.run(this, function () {
|
|
this.set('value', editor.getDoc().getValue());
|
|
});
|
|
});
|
|
|
|
this._editor = editor;
|
|
},
|
|
|
|
willDestroyElement() {
|
|
this._super(...arguments);
|
|
|
|
let editor = this._editor.getWrapperElement();
|
|
editor.parentNode.removeChild(editor);
|
|
this._editor = null;
|
|
}
|
|
});
|