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

{"commit":{"subject":"Adding instructions for chrome. (No server needed! Just execute a single command line to load in Chrome).","revision":"8c37499af82e57f0487319abca2242cbad4024b8","authoredAt":"2013-06-03T02:39:08-07:00","shortRevision":"8c37499af8","authorEmail":"jordojw@gmail.com","authorName":"jordow"},"parents":["095fccb9746ba3b955636505f4195dc6aefa3a42"],"body":"","files":[{"path":"examples\/basic-jsx-external\/index.html","status":"M"}],"patch":"diff --git a\/examples\/basic-jsx-external\/index.html b\/examples\/basic-jsx-external\/index.html\nindex 4ee80c9b60..a0f07a3fdc 100644\n--- a\/examples\/basic-jsx-external\/index.html\n+++ b\/examples\/basic-jsx-external\/index.html\n@@ -4,34 +4,66 @@\n \n Basic Example with external JSX<\/title>\n <link rel=\"stylesheet\" href=\"..\/shared\/css\/base.css\" \/>\n+ <style type=\"text\/css\" media=\"screen\">\n+ .codeBox {\n+ padding: 7px;\n+ overflow:scroll;\n+ background-color: #eee;\n+ font-weight:normal;\n+ }\n+ <\/style>\n+ <script type=\"text\/javascript\" charset=\"utf-8\">\n+ window.setTimeout(function() {\n+ var chromeClientCLI = window.chromeClientCLI;\n+ var errorBox = window.errorBox;\n+ var chromeErrorFooter = window.chromeErrorFooter;\n+ var chromeInstructions = window.chromeInstructions;\n+ var isChrome = !!window.chrome;\n+ chromeClientCLI.innerText =\n+ 'open -a \"Google Chrome\" --new \\\\\\n' +\n+ ' ' + window.location.href + ' \\\\\\n' +\n+ ' --args --allow-file-access-from-files --user-data-dir=\/tmp';\n+\n+ errorBox.innerText =\n+ isChrome ? 'To run in Chrome, do one of the following:' :\n+ 'Errors loading page: Check the console.'\n+ chromeErrorFooter.innerText =\n+ isChrome ? 'If page still does not load, check console.' : '';\n+\n+ if (!isChrome) {\n+ chromeInstructions.innerText = \"\";\n+ }\n+ }, 0);\n+\n+ <\/script>\n <\/head>\n+\n <body>\n <h1>Basic Example with external JSX<\/h1>\n <div id=\"container\">\n <p>\n- If you can see this, React is not working right. This is probably because you're viewing\n- this on your file system instead of a web server. Try running\n- <pre>\n- python -m SimpleHTTPServer\n- <\/pre>\n- and going to <a href=\"http:\/\/localhost:8080\/\">http:\/\/localhost:8080\/<\/a>.\n+ <h4 id=\"errorBox\" style=\"color: #733\"><\/h4>\n+ <ol id=\"chromeInstructions\">\n+ <li>\n+ Open this page on a Mac via the terminal command:\n+ <pre id=\"chromeClientCLI\" class=\"codeBox\">\n+ <\/li>\n+ <h4><i>OR<\/i><\/h4>\n+ <li>\n+ Serve this page from a web server\n+ <pre id=\"chromeServerCLI\" class=\"codeBox\">\n+cd \/Path\/To\/This\/File\n+python -m SimpleHTTPServer\n+open -a \"Google Chrome\" <a href=\"http:\/\/localhost:8080\/\">http:\/\/localhost:8080\/<\/a>. <\/pre>\n+ <\/li>\n+ <\/ol>\n+ <h4 id=\"chromeErrorFooter\" style=\"color: #733\"><\/h4>\n <\/p>\n <\/div>\n- <h4>Example Details<\/h4>\n- <ul>\n- <li>\n- This is built with\n- <a href=\"https:\/\/github.com\/substack\/node-browserify\">browserify<\/a>.\n- <\/li>\n- <li>\n- This is written with JSX in a separate file and transformed in the browser.\n- <\/li>\n- <\/ul>\n- <p>\n- <\/p>\n <p>\n- Learn more at\n- <a href=\"http:\/\/facebook.github.io\/react\" target=\"_blank\">facebook.github.io\/react<\/a>.\n+ Example Details: This is built with\n+ <a href=\"https:\/\/github.com\/substack\/node-browserify\">browserify<\/a>.\n+ A separate JSX file is transformed in the browser.\n <\/p>\n <script src=\"..\/..\/build\/react.js\"><\/script>\n <script src=\"..\/..\/build\/JSXTransformer.js\"><\/script>\n"}</article></body></html>

dillon1000/react

Files changed