bobwen-dev
/
react-templates
mirror of https://github.com/bobwen-dev/react-templates
1
0
Fork 0
Code Issues Releases Wiki Activity

Added rt-require example to show amd and commonjs support

This commit is contained in:
amitk 2014-12-30 21:19:49 +02:00
parent 8ef5be16bf
commit d87b86b960
5 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
playground/dist/home.min.js vendored
View File

File diff suppressed because one or more lines are too long

10
playground/examples.js
View File

@ -5,8 +5,9 @@ define(['lodash', 'react', './examples.rt',
'text!./samples/rt-if.code', 'text!./samples/rt-if.rt',
'text!./samples/rt-props.code', 'text!./samples/rt-props.rt',
'text!./samples/rt-repeat.code', 'text!./samples/rt-repeat.rt',
'text!./samples/weather.code', 'text!./samples/weather.rt'
], function (_, React, examplesTemplate, helloCode, helloRT, todoCode, todoRT, rtIfCode, rtIfRT, rtPropsCode, rtPropsRT, rtRepeatCode, rtRepeatRT, weatherCode, weatherRT) {
'text!./samples/weather.code', 'text!./samples/weather.rt',
'text!./samples/rt-require.rt'
], function (_, React, examplesTemplate, helloCode, helloRT, todoCode, todoRT, rtIfCode, rtIfRT, rtPropsCode, rtPropsRT, rtRepeatCode, rtRepeatRT, weatherCode, weatherRT, rtRequireRT) {
var samples = {
hello: [helloCode, helloRT],
todo: [todoCode, todoRT],
@ -26,9 +27,10 @@ define(['lodash', 'react', './examples.rt',
displayName: 'Examples',
mixins: [React.addons.LinkedStateMixin],
getInitialState: function () {
var codeAmd = window.reactTemplates.convertTemplateToReact(helloRT, {modules: 'amd', name: 'template'});
var codeCJS = window.reactTemplates.convertTemplateToReact(helloRT, {modules: 'commonjs', name: 'template'});
var codeAmd = window.reactTemplates.convertTemplateToReact(rtRequireRT, {modules: 'amd', name: 'template'});
var codeCJS = window.reactTemplates.convertTemplateToReact(rtRequireRT, {modules: 'commonjs', name: 'template'});
return {
rtRequire: {value: rtRequireRT},
amd: {value: codeAmd},
cjs: {value: codeCJS},
samples: samples

11
playground/examples.rt
View File

@ -44,17 +44,24 @@
</p>
<playground id="weatherExample" rt-props="this.state.samples.weather" direction="horizontal"></playground>
</div>
<div id="rt-require" class="example">
<h3>rt-require</h3>
<p>
This example shows how to load other react components and libraries into a react-template and use them in the template
</p>
<viewer rt-props="this.state.rtRequire" mode="javascript" />
</div>
<div id="amd" class="example">
<h3>AMD</h3>
<p>
This example shows the hello sample output with AMD support.
This example shows the rt-require sample output with AMD support
</p>
<viewer rt-props="this.state.amd" mode="javascript" />
</div>
<div id="commonjs" class="example">
<h3>CommonJS</h3>
<p>
This example shows the hello sample output with CommonJS support.
This example shows the rt-require sample output with CommonJS support
</p>
<viewer rt-props="this.state.cjs" mode="javascript" />
</div>

7
playground/examples.rt.js
View File

@ -25,11 +25,14 @@ define([
'id': 'weatherExample',
'direction': 'horizontal'
}, this.state.samples.weather))), React.createElement('div', {
'id': 'rt-require',
'className': 'example'
}, React.createElement('h3', {}, 'rt-require'), React.createElement('p', {}, '\n This example shows how to load other react components and libraries into a react-template and use them in the template\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.rtRequire))), React.createElement('div', {
'id': 'amd',
'className': 'example'
}, React.createElement('h3', {}, 'AMD'), React.createElement('p', {}, '\n This example shows the hello sample output with AMD support.\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.amd))), React.createElement('div', {
}, React.createElement('h3', {}, 'AMD'), React.createElement('p', {}, '\n This example shows the rt-require sample output with AMD support\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.amd))), React.createElement('div', {
'id': 'commonjs',
'className': 'example'
}, React.createElement('h3', {}, 'CommonJS'), React.createElement('p', {}, '\n This example shows the hello sample output with CommonJS support.\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.cjs))));
}, React.createElement('h3', {}, 'CommonJS'), React.createElement('p', {}, '\n This example shows the rt-require sample output with CommonJS support\n '), React.createElement(viewer, _.merge({}, { 'mode': 'javascript' }, this.state.cjs))));
};
});

5
playground/samples/rt-require.rt Normal file
View File

@ -0,0 +1,5 @@
<rt-require dependency="comps/myComp" as="myComp"/>
<rt-require dependency="utils/utils" as="utils"/>
<div>
<myComp customProp="{utils.doSomething()}">myComp is just a regular tag</myComp>
</div>