Files
react/examples/basic-jsx-external/index.html
2013-06-03 02:43:48 -07:00

73 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-type' content='text/html; charset=utf-8'>
<title>Basic Example with external JSX</title>
<link rel="stylesheet" href="../shared/css/base.css" />
<style type="text/css" media="screen">
.codeBox {
padding: 7px;
overflow:scroll;
background-color: #eee;
font-weight:normal;
}
</style>
<script type="text/javascript" charset="utf-8">
window.setTimeout(function() {
var chromeClientCLI = window.chromeClientCLI;
var errorBox = window.errorBox;
var chromeErrorFooter = window.chromeErrorFooter;
var chromeInstructions = window.chromeInstructions;
var isChrome = !!window.chrome;
chromeClientCLI.innerText =
'open -a "Google Chrome" --new \\\n' +
' ' + window.location.href + ' \\\n' +
' --args --allow-file-access-from-files --user-data-dir=/tmp';
errorBox.innerText =
isChrome ? 'To run in Chrome, do one of the following:' :
'Errors loading page: Check the console.'
chromeErrorFooter.innerText =
isChrome ? 'If page still does not load, check console.' : '';
if (!isChrome) {
chromeInstructions.innerText = "";
}
}, 0);
</script>
</head>
<body>
<h1>Basic Example with external JSX</h1>
<div id="container">
<p>
<h4 id="errorBox" style="color: #733"></h4>
<ol id="chromeInstructions">
<li>
Open this page on a Mac via the terminal command:
<pre id="chromeClientCLI" class="codeBox">
</li>
<h4><i>OR</i></h4>
<li>
Serve this page from a web server
<pre id="chromeServerCLI" class="codeBox">
cd /Path/To/This/File
python -m SimpleHTTPServer
open -a "Google Chrome" <a href="http://localhost:8080/">http://localhost:8080/</a>. </pre>
</li>
</ol>
<h4 id="chromeErrorFooter" style="color: #733"></h4>
</p>
</div>
<p>
Example Details: This is built with
<a href="https://github.com/substack/node-browserify">browserify</a>.
A separate JSX file is transformed in the browser.
</p>
<script src="../../build/react.js"></script>
<script src="../../build/JSXTransformer.js"></script>
<script type="text/jsx" src="example.js"></script>
</body>
</html>