[NaCl SDK] AppEngine: URL paths /demo/<example name> works.

* /demo works now
* Also moved /static/pnacl-demo-<foo> => /static/foo
* Redirect /demo/<garbage> to /demo/
* Stripping final slash: /demo/bullet/ => /demo/bullet
* Clicking a link will correctly update your URL

BUG=none
R=sbc@chromium.org

Review URL: https://codereview.chromium.org/67473003

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@234057 0039d316-1c4b-4281-b951-d872f2087c98

25 files changed, 94 insertions, 59 deletions

diff --git a/native_client_sdk/src/gonacl_appengine/README b/native_client_sdk/src/gonacl_appengine/README
index cddd458..2343b0f8 100644
--- a/native_client_sdk/src/gonacl_appengine/README
+++ b/native_client_sdk/src/gonacl_appengine/README
@@ -6,7 +6,7 @@ This is a new App Engine Python 2.7 application for http://gonacl.com
 At this time it presents the existing functionality of redirecting
 to http://developers.google.com/native-client/
 
-Also, there are PNaCl demos added at ``/static/pnacl-demo-<name>/index.html``
+Also, there are PNaCl demos added at ``/demo/<name>``
 
 
 To Run Locally
@@ -16,7 +16,7 @@ To Run Locally
 
 2. Run ``<path/to/app/engine>/dev_appserver.py app.yaml``
 
-3. Navigate in your browser to http://localhost:8080/static/
+3. Navigate in your browser to http://localhost:8080/demo/
 
 
 To Update App Engine (HTML/JS)
@@ -60,16 +60,16 @@ To publish a new version:
    Please see the following table for the location of the revision number to
    modify.
 
-   ==========  ========================================  ===========
-   Demo        File                                      Function
-   ==========  ========================================  ===========
-   bullet      /static/pnacl-demo-bullet/main.js         pageDidLoad
-   cube        /static/pnacl-demo-cube/example.js        getDataURL
-   earth       /static/pnacl-demo-earth/example.js       getDataURL
-   life        /static/pnacl-demo-life/example.js        getDataURL
-   lua         /static/pnacl-demo-lua/lua.js
-   smoothlife  /static/pnacl-demo-smoothlife/example.js  getDataURL
-   voronoi     /static/pnacl-demo-voronoi/example.js     getDataURL
+   ==========  =============================  ===========
+   Demo        File                           Function
+   ==========  =============================  ===========
+   bullet      /static/bullet/main.js         pageDidLoad
+   cube        /static/cube/example.js        getDataURL
+   earth       /static/earth/example.js       getDataURL
+   life        /static/life/example.js        getDataURL
+   lua         /static/lua/lua.js
+   smoothlife  /static/smoothlife/example.js  getDataURL
+   voronoi     /static/voronoi/example.js     getDataURL
 
 5. Land a CL with these changes.
 
diff --git a/native_client_sdk/src/gonacl_appengine/app.yaml b/native_client_sdk/src/gonacl_appengine/app.yaml
index 4fcef78..09fe0b6 100644
--- a/native_client_sdk/src/gonacl_appengine/app.yaml
+++ b/native_client_sdk/src/gonacl_appengine/app.yaml
@@ -5,17 +5,13 @@ api_version: 1
 threadsafe: true
 
 handlers:
-- url: /static/pnacl-demo-(.*)/
-  static_files: static/pnacl-demo-\1/index.html
-  upload: static/pnacl-demo-.*/index\.html
+- url: /demo
+  static_files: static/index.html
+  upload: static/index\.html
 
-- url: /static/pnacl-demo/
-  static_files: static/pnacl-demo-earth/index.html
-  upload: static/pnacl-demo-earth/index\.html
-
-- url: /static/pnacl-demo/(.*)
-  static_files: static/pnacl-demo-earth/\1
-  upload: static/pnacl-demo-earth/.*
+- url: /demo/.*
+  static_files: static/index.html
+  upload: static/index\.html
 
 - url: /static/home/(.*)
   static_files: static/home/\1
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/NaClAM.js b/native_client_sdk/src/gonacl_appengine/static/bullet/NaClAM.js
index ee59a5e..ee59a5e 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/NaClAM.js
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/NaClAM.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/NaClAMBullet.js b/native_client_sdk/src/gonacl_appengine/static/bullet/NaClAMBullet.js
index 7169f5c..7169f5c 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/NaClAMBullet.js
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/NaClAMBullet.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/box.json b/native_client_sdk/src/gonacl_appengine/static/bullet/box.json
index 85565ad..85565ad 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/box.json
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/box.json
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/index.html b/native_client_sdk/src/gonacl_appengine/static/bullet/index.html
index 0a18bb2..76b5c58 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/index.html
@@ -11,7 +11,7 @@
     <title>Bullet Physics</title>
 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-    <link href="../styles/style.css" rel="stylesheet">
+    <link href="/static/styles/style.css" rel="stylesheet">
 
 
     <script type="text/javascript" src="NaClAM.js"></script>
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/main.js b/native_client_sdk/src/gonacl_appengine/static/bullet/main.js
index 770584b..770584b 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/main.js
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/main.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/scene.js b/native_client_sdk/src/gonacl_appengine/static/bullet/scene.js
index 9325f4d..9325f4d 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/scene.js
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/scene.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/scenes.js b/native_client_sdk/src/gonacl_appengine/static/bullet/scenes.js
index 75ff039..75ff039 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/scenes.js
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/scenes.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/world.js b/native_client_sdk/src/gonacl_appengine/static/bullet/world.js
index a07465e..a07465e 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-bullet/world.js
+++ b/native_client_sdk/src/gonacl_appengine/static/bullet/world.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-cube/example.js b/native_client_sdk/src/gonacl_appengine/static/cube/example.js
index 3cca932..3cca932 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-cube/example.js
+++ b/native_client_sdk/src/gonacl_appengine/static/cube/example.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-cube/index.html b/native_client_sdk/src/gonacl_appengine/static/cube/index.html
index 11da14d..170fec8 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-cube/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/cube/index.html
@@ -9,7 +9,7 @@ found in the LICENSE file.
   <meta charset="UTF-8">
   <title>Rotating Cube</title>
   <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-  <link href="../styles/style.css" rel="stylesheet">
+  <link href="/static/styles/style.css" rel="stylesheet">
   <script type="text/javascript" src="example.js"></script>
 </head>
 <body class="demo">
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-earth/example.js b/native_client_sdk/src/gonacl_appengine/static/earth/example.js
index 7a09488..7a09488 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-earth/example.js
+++ b/native_client_sdk/src/gonacl_appengine/static/earth/example.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-earth/index.html b/native_client_sdk/src/gonacl_appengine/static/earth/index.html
index 31393ca..101603e 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-earth/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/earth/index.html
@@ -11,7 +11,7 @@
     <title>Multi-Threaded Raycasted Earth</title>
 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-    <link href="../styles/style.css" rel="stylesheet">
+    <link href="/static/styles/style.css" rel="stylesheet">
 
     <script type="text/javascript" src="example.js"></script>
 
diff --git a/native_client_sdk/src/gonacl_appengine/static/home/index.html b/native_client_sdk/src/gonacl_appengine/static/home/index.html
index 1039399..695fdb6 100644
--- a/native_client_sdk/src/gonacl_appengine/static/home/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/home/index.html
@@ -11,7 +11,7 @@
     <title>PNaCl Demos</title>
 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-    <link href="../styles/style.css" rel="stylesheet">
+    <link href="/static/styles/style.css" rel="stylesheet">
 
   </head>
 
diff --git a/native_client_sdk/src/gonacl_appengine/static/index.html b/native_client_sdk/src/gonacl_appengine/static/index.html
index b4cf9ccb..7eb141a 100644
--- a/native_client_sdk/src/gonacl_appengine/static/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/index.html
@@ -9,52 +9,92 @@
   <title>PNaCl Demos</title>
 
   <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300">
-  <link href="styles/style.css" rel="stylesheet">
+  <link href="/static/styles/style.css" rel="stylesheet">
 </head>
 <body>
   <nav>
     <h1>PNaCl Demos</h1>
-    <ul>
-      <li id="lua">
-        <a href="pnacl-demo-lua/" target="content">Lua Editor</a>
-      </li>
-      <li id="bullet">
-        <a href="pnacl-demo-bullet/" target="content">Bullet Physics</a>
-      </li>
-      <li id="earth">
-        <a href="pnacl-demo-earth/" target="content">Raycasted Earth</a>
-      </li>
-      <li id="life">
-        <a href="pnacl-demo-life/" target="content">Game of Life</a>
-      </li>
-      <li id="voronoi">
-        <a href="pnacl-demo-voronoi/" target="content">Voronoi Simulation</a>
-      </li>
-      <li id="smoothlife">
-        <a href="pnacl-demo-smoothlife/" target="content">SmoothLife</a>
-      </li>
-      <li id="cube">
-        <a href="pnacl-demo-cube/" target="content">Rotating Cube</a>
-      </li>
-    </ul>
+    <ul></ul>
   </nav>
 
   <section>
-    <iframe src="home/index.html" frameborder="0" name="content" width="100%" height="100%"></iframe>
+    <iframe src="/static/home/index.html" frameborder="0" name="content" width="100%" height="100%"></iframe>
   </section>
 
   <script>
-    var links = document.querySelectorAll('li a');
-    for (var l = 0; l < links.length; l++) {
-      links[l].addEventListener('click', onLinkClick, false);
+    var examples = [
+      {name: 'bullet', text: 'Bullet Physics'},
+      {name: 'earth', text: 'Raycasted Earth'},
+      {name: 'lua', text: 'Lua Interpreter'},
+      {name: 'life', text: 'Game of Life'},
+      {name: 'voronoi', text: 'Voronoi Simulation'},
+      {name: 'smoothlife', text: 'SmoothLife'},
+      {name: 'cube', text: 'Rotating Cube'},
+    ];
+
+    var exampleUrls = {};  // Created below.
+
+    var listEl = document.querySelector('nav ul');
+    for (var i = 0; i < examples.length; ++i) {
+      var example = examples[i];
+
+      // Populate exampleUrls
+      var url = '/static/' + example.name + '/index.html';
+      exampleUrls[example.name] = url;
+
+      // Create li
+      var listItemEl = document.createElement('li');
+      var anchorEl = document.createElement('a');
+      listItemEl.setAttribute('id', example.name);
+      anchorEl.setAttribute('href', url);
+      anchorEl.setAttribute('target', 'content');
+      anchorEl.textContent = example.text;
+
+      // Listen for clicks and update the nav
+      anchorEl.addEventListener('click', onLinkClick.bind(example), false);
+
+      listItemEl.appendChild(anchorEl);
+      listEl.appendChild(listItemEl);
+    }
+
+    function updateUrl(exampleName) {
+      window.history.replaceState(null, '', '/demo/' + exampleName);
     }
 
     function onLinkClick(evt) {
+      var links = document.querySelectorAll('li a');
       for (var l = 0; l < links.length; l++) {
         links[l].classList.remove('active');
       }
       evt.target.classList.add('active');
+
+      // The id is the same as the name.
+      updateUrl(this.name);
+    }
+
+    var anchorEl = document.createElement('a');
+    anchorEl.href = location.href;
+    var pathname = anchorEl.pathname;
+
+    // Load the correct page, based on the location.
+    var matches = pathname.match(/demo(?:\/(.*))?$/);
+    var iframeUrl = null;
+    if (matches) {
+      var matchedExample = matches[1];
+      // Strip trailing slash, if any.
+      if (matchedExample && matchedExample.slice(-1) === '/') {
+        matchedExample = matchedExample.slice(0, -1);
+      }
+
+      iframeUrl = exampleUrls[matchedExample];
+      if (iframeUrl) {
+        document.querySelector('iframe').src = iframeUrl;
+        updateUrl(matchedExample);
+      } else {
+        updateUrl('');
+      }
     }
+
   </script>
 </body>
 </html>
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-life/example.js b/native_client_sdk/src/gonacl_appengine/static/life/example.js
index 8d2c948..3ab2432 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-life/example.js
+++ b/native_client_sdk/src/gonacl_appengine/static/life/example.js
@@ -118,7 +118,6 @@ function moduleDidLoad() {
   bar.style.width = 100;
   naclModule = $('nacl_module');
   hideStatus();
-  setThreadCount();
 }
 
 /**
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-life/index.html b/native_client_sdk/src/gonacl_appengine/static/life/index.html
index d2c2903..d53b0c1 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-life/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/life/index.html
@@ -11,7 +11,7 @@
     <title>The Game of Life</title>
 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-    <link href="../styles/style.css" rel="stylesheet">
+    <link href="/static/styles/style.css" rel="stylesheet">
 
     <script type="text/javascript" src="example.js"></script>
 
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-lua/index.html b/native_client_sdk/src/gonacl_appengine/static/lua/index.html
index 3647283..cb78bf9 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-lua/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/lua/index.html
@@ -11,7 +11,7 @@
     <title>LUA Terminal</title>
 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-    <link href="../styles/style.css" rel="stylesheet">
+    <link href="/static/styles/style.css" rel="stylesheet">
 
     <script type="text/javascript" src="http://commondatastorage.googleapis.com/gonacl/demos/publish/233080/lua/hterm.concat.js"></script>
     <script type="text/javascript" src="naclterm.js"></script>
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-lua/lua.js b/native_client_sdk/src/gonacl_appengine/static/lua/lua.js
index 3493065..3493065 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-lua/lua.js
+++ b/native_client_sdk/src/gonacl_appengine/static/lua/lua.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-lua/naclterm.js b/native_client_sdk/src/gonacl_appengine/static/lua/naclterm.js
index 85cf0ce..85cf0ce 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-lua/naclterm.js
+++ b/native_client_sdk/src/gonacl_appengine/static/lua/naclterm.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-smoothlife/example.js b/native_client_sdk/src/gonacl_appengine/static/smoothlife/example.js
index 5f2d0e4..5f2d0e4 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-smoothlife/example.js
+++ b/native_client_sdk/src/gonacl_appengine/static/smoothlife/example.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-smoothlife/index.html b/native_client_sdk/src/gonacl_appengine/static/smoothlife/index.html
index cabb19c..f9ddd44 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-smoothlife/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/smoothlife/index.html
@@ -9,7 +9,7 @@ found in the LICENSE file.
   <meta charset="UTF-8">
   <title>SmoothLife</title>
   <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-  <link href="../styles/style.css" rel="stylesheet">
+  <link href="/static/styles/style.css" rel="stylesheet">
   <script type="text/javascript" src="example.js"></script>
 </head>
 <body class="demo">
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-voronoi/example.js b/native_client_sdk/src/gonacl_appengine/static/voronoi/example.js
index 574d751..574d751 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-voronoi/example.js
+++ b/native_client_sdk/src/gonacl_appengine/static/voronoi/example.js
diff --git a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-voronoi/index.html b/native_client_sdk/src/gonacl_appengine/static/voronoi/index.html
index 38a8901..010a21f 100644
--- a/native_client_sdk/src/gonacl_appengine/static/pnacl-demo-voronoi/index.html
+++ b/native_client_sdk/src/gonacl_appengine/static/voronoi/index.html
@@ -11,7 +11,7 @@
     <title>Voronoi</title>
 
     <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,700">
-    <link href="../styles/style.css" rel="stylesheet">
+    <link href="/static/styles/style.css" rel="stylesheet">
 
     <script type="text/javascript" src="example.js"></script>