59 lines
1.7 KiB
JavaScript
59 lines
1.7 KiB
JavaScript
|
var reactTemplates = require('../src/reactTemplates');
|
||
|
var playgroundTemplate = require('./playground.rt.js');
|
||
|
var React = require('react/addons');
|
||
|
var _ = require('lodash');
|
||
|
|
||
|
|
||
|
var html = "<div>hello</div>";
|
||
|
var res = reactTemplates.convertTemplateToReact(html.trim());
|
||
|
console.log(res);
|
||
|
|
||
|
function emptyFunc() {
|
||
|
return null;
|
||
|
}
|
||
|
|
||
|
function generateTemplateFunction(html) {
|
||
|
try {
|
||
|
var code = reactTemplates.convertTemplateToReact(html.trim().replace(/\r/g,""));
|
||
|
var defineMap = {"react":React,"lodash":_};
|
||
|
var define = function (requirementsNames,content) {
|
||
|
var requirements = _.map(requirementsNames,function (reqName) {
|
||
|
return defineMap[reqName];
|
||
|
});
|
||
|
return content.apply(this,requirements);
|
||
|
};
|
||
|
var res = eval(code);
|
||
|
return res;
|
||
|
} catch (e) {
|
||
|
return emptyFunc
|
||
|
}
|
||
|
|
||
|
}
|
||
|
|
||
|
var Playground = React.createClass({
|
||
|
|
||
|
displayName: 'Playground',
|
||
|
mixins: [React.addons.LinkedStateMixin],
|
||
|
|
||
|
getInitialState: function () {
|
||
|
var currentState = {
|
||
|
templateHTML: '<div>\n hello {this.state.name}\n</div>',
|
||
|
templateProps: JSON.stringify({name:"reactTemplates"})
|
||
|
};
|
||
|
this.templateFunc = generateTemplateFunction(currentState.templateHTML);
|
||
|
console.log(this.templateFunc);
|
||
|
return currentState;
|
||
|
},
|
||
|
componentWillUpdate: function (nextProps,nextState) {
|
||
|
if (nextState.templateHTML !== this.state.templateHTML) {
|
||
|
this.templateFunc = generateTemplateFunction(nextState.templateHTML)
|
||
|
}
|
||
|
},
|
||
|
|
||
|
render: function () {
|
||
|
return playgroundTemplate.apply(this);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
React.render(Playground(),document.getElementById('playground'));
|