react-templates/playground/playground-fiddle.rt.js

52 lines
2.3 KiB
JavaScript
Raw Normal View History

define([
'react/addons',
'lodash',
2014-12-09 14:31:25 +01:00
'./CodeMirrorEditor'
], function (React, _, CodeEditor) {
'use strict';
function onChange1(evt) {
this.setState({ 'templateHTML': evt.target.value });
}
function onChange2(evt) {
this.setState({ 'templateProps': evt.target.value });
}
function onSubmit3(e) {
e.preventDefault();
}
return function () {
2014-12-08 11:45:32 +01:00
return React.createElement('div', { 'className': 'playground' }, React.createElement('div', { 'className': 'fiddle-row' }, React.createElement('div', { 'className': 'code-area' }, React.createElement(CodeEditor, {
2014-12-10 13:14:22 +01:00
'ref': 'editorRT',
2014-12-08 11:45:32 +01:00
'id': 'editor-rt',
'className': 'large-text-area',
'style': { border: this.validHTML ? '1px solid black' : '2px solid red' },
'value': this.state.templateHTML,
'mode': 'html',
'onChange': onChange1.bind(this)
})), React.createElement('div', { 'className': 'code-area' }, React.createElement(CodeEditor, {
2014-12-10 13:14:22 +01:00
'ref': 'editorCode',
2014-12-08 11:45:32 +01:00
'id': 'editor-code',
'className': 'large-text-area',
'style': { border: this.validProps ? '1px solid black' : '2px solid red' },
'value': this.state.templateProps,
'mode': 'javascript',
'onChange': onChange2.bind(this)
2014-12-08 11:45:32 +01:00
}))), React.createElement('div', { 'className': 'fiddle-row' }, React.createElement('div', { 'className': 'code-area' }, React.createElement(CodeEditor, {
'id': 'editor-generated',
'className': 'large-text-area',
'style': { border: '1px solid black' },
'value': this.templateSource,
'mode': 'javascript',
'readOnly': true
2014-12-09 14:31:25 +01:00
})), React.createElement('div', {
'id': 'result-container',
'className': 'result-area'
}, React.createElement('div', {
2014-12-08 11:45:32 +01:00
'id': 'result-area',
'key': 'result-area',
2014-12-08 13:48:12 +01:00
'className': 'well'
}, React.createElement('h2', {}, 'Preview:'), React.createElement('form', {
'className': 'sample-view',
'onSubmit': onSubmit3.bind(this)
2014-12-08 13:48:12 +01:00
}, React.createElement(this.sample, { 'key': 'sample' }))))) /* <br style="clear:both"> */);
};
});