mirror of https://github.com/rancher/ui.git
53 lines
1.3 KiB
JavaScript
53 lines
1.3 KiB
JavaScript
import Ember from 'ember';
|
|
import sanitize from 'json-sanitizer';
|
|
import C from 'ui/utils/constants';
|
|
|
|
export default Ember.Component.extend({
|
|
json: {},
|
|
isInvalid: false,
|
|
|
|
tagName: 'div',
|
|
classNames: ['jsoneditor-component'],
|
|
|
|
jsonString: function () {
|
|
return JSON.stringify(this.get('json'), undefined, 4);
|
|
}.property('json'),
|
|
|
|
onChange: function () {
|
|
try {
|
|
const json = this.parseJSON(this.jsonString)
|
|
this.set('json', json);
|
|
this.set('isInvalid', false)
|
|
} catch (err) {
|
|
this.set('isInvalid', true)
|
|
}
|
|
}.observes('jsonString'),
|
|
|
|
parseJSON: function (jsonString) {
|
|
try {
|
|
return JSON.parse(jsonString);
|
|
} catch (err) {
|
|
return JSON.parse(sanitize(jsonString));
|
|
}
|
|
},
|
|
|
|
focusOut() {
|
|
if (!this.get('isInvalid')) {
|
|
this.set('jsonString', JSON.stringify(this.get('json'), undefined, 4));
|
|
}
|
|
},
|
|
|
|
keyDown: function (event) {
|
|
const keyCode = event.which;
|
|
if (keyCode === C.KEY.TAB) {
|
|
event.preventDefault();
|
|
const el = $(this).get(0).childViews.get(0).element;
|
|
const start = el.selectionStart;
|
|
const end = el.selectionEnd;
|
|
$(el).val($(el).val().substring(0, start) + " " + $(el).val().substring(end));
|
|
el.selectionStart = start + 4;
|
|
el.selectionEnd = start + 4;
|
|
}
|
|
},
|
|
});
|