[Docs] Hide compiled js tab in jsx-compiler.html
Fixes #1049
Cheng Lou committed
Feb 10, 2014 at 23:22 UTC
0f4cc6ee84db6578f87cd9173c2c5e0af1442943
2 files changed
+23
-15
docs/_js/jsx-compiler.js
+2
-1
@@ -21,6 +21,7 @@ React.renderComponent(
21
codeText={HELLO_COMPONENT}
22
renderCode={true}
23
transformer={transformer}
24
- />,
24
+ showCompiledJSTab={false}
25
+ />,
26
document.getElementById('jsxCompiler')
27
);
docs/_js/live_editor.js
+21
-14
@@ -85,7 +85,8 @@ var ReactPlayground = React.createClass({
85
return {
86
transformer: function(code) {
87
return JSXTransformer.transform(code).code;
88
- }
88
+ },
89
+ showCompiledJSTab: true
90
};
91
},
92
@@ -116,7 +117,7 @@ var ReactPlayground = React.createClass({
117
compiledCode = this.compileCode();
118
} catch (err) {}
119
119
- var jsContent =
120
+ var JSContent =
121
<CodeMirrorEditor
122
key="js"
123
className="playgroundStage CodeMirror-readonly"
@@ -125,7 +126,7 @@ var ReactPlayground = React.createClass({
126
readOnly={true}
127
/>;
128
128
- var jsxContent =
129
+ var JSXContent =
130
<CodeMirrorEditor
131
key="jsx"
132
onChange={this.handleCodeChange}
@@ -138,22 +139,28 @@ var ReactPlayground = React.createClass({
139
var JSTabClassName =
140
'playground-tab' + (isJS ? ' playground-tab-active' : '');
141
142
+ var JSTab =
143
+ <div
144
+ className={JSTabClassName}
145
+ onClick={this.handleCodeModeSwitch.bind(this, this.MODES.JS)}>
146
+ Compiled JS
147
+ </div>;
148
+
149
+ var JSXTab =
150
+ <div
151
+ className={JSXTabClassName}
152
+ onClick={this.handleCodeModeSwitch.bind(this, this.MODES.JSX)}>
153
+ Live JSX Editor
154
+ </div>
155
+
156
return (
157
<div className="playground">
158
<div>
144
- <div
145
- className={JSXTabClassName}
146
- onClick={this.handleCodeModeSwitch.bind(this, this.MODES.JSX)}>
147
- Live JSX Editor
148
- </div>
149
- <div
150
- className={JSTabClassName}
151
- onClick={this.handleCodeModeSwitch.bind(this, this.MODES.JS)}>
152
- Compiled JS
153
- </div>
159
+ {JSXTab}
160
+ {this.props.showCompiledJSTab && JSTab}
161
</div>
162
<div className="playgroundCode">
156
- {isJS ? jsContent : jsxContent}
163
+ {isJS ? JSContent : JSXContent}
164
</div>
165
<div className="playgroundPreview">
166
<div ref="mount" />