Initial commit of nodejs

CNAME

@@ -1 +0,0 @@
-3dinterface.no-ip.org

HermiteTest/index.html

@@ -1,11 +0,0 @@
----
-layout: withjs
-title: Hermite Test
-extrajs: <script src="/static/js/HermiteTest/HermiteTest.js"></script>
----
-<section>
-    <pre>
-        <div id="content"></div>
-    </pre>
-</section>
-

README.md

@@ -1,2 +0,0 @@
-# 3D Interface
-A prototype for a user-friendly 3D interface allowing to browse 3D scenes / models

_config.yml

@@ -1,3 +0,0 @@
-gems:
-    - jekyll-redirect-from
-    - jemoji

app.js

@@ -0,0 +1,42 @@
+var http = require('http');
+var express = require('express');
+var pejs = require('pejs');
+var module = require('./my_modules/filterInt');
+
+var app = express();
+var views = pejs();
+
+var urls = require('./urls');
+
+app.set('view engine', 'pejs');
+
+app.use(function(req, res, next) {
+    res.locals.title = "3DUI";
+    res.locals.urls = urls;
+    next();
+});
+
+// Load controllers
+require('./lib/boot')(app, { verbose: !module.parent });
+
+app.use('/static', express.static('static'));
+
+app.use(function(err, req, res, next) {
+    if (err.status === 404) {
+        res.setHeader('Content-Type', 'text/html');
+
+        views.render('404', res.locals, function(err, result) {
+            res.send(result);
+        });
+    }
+});
+
+app.use(function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    views.render('404', res.locals, function(err, result) {
+        res.send(result);
+    });
+});
+
+app.listen(4000);

bouncing/index.md

@@ -1,11 +0,0 @@
----
-layout: withjs
-title: Bouncing cube
-extrajs: <script src="/static/js/bouncing/BouncingMain.js"></script>
----
-## Bouncing cube
-
-Click on the cube to make it jump !
-
-<div id="container"></div>
-

controllers/bouncing/index.js

@@ -0,0 +1,11 @@
+var pejs = require('pejs');
+views = pejs();
+
+module.exports.index = function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    views.render('bouncing', res.locals, function(err, result) {
+        console.log(err);
+        res.send(result);
+    });
+}

controllers/bouncing/urls.js

@@ -0,0 +1,3 @@
+module.exports = {
+    '/bouncing' : 'index'
+}

controllers/index/index.js

@@ -0,0 +1,10 @@
+var pejs = require('pejs');
+views = pejs();
+
+module.exports.index = function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    views.render('index', res.locals, function(err, result) {
+        res.send(result);
+    });
+}

controllers/index/urls.js

@@ -0,0 +1,3 @@
+module.exports = {
+    '/': 'index'
+}

controllers/multisphere/index.js

@@ -0,0 +1,10 @@
+var pejs = require('pejs');
+views = pejs();
+
+module.exports.index = function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    views.render('multisphere', res.locals, function(err, result) {
+        res.send(result);
+    });
+}

controllers/multisphere/urls.js

@@ -0,0 +1,3 @@
+module.exports = {
+    '/multisphere': 'index'
+}

controllers/prototype/index.js

@@ -0,0 +1,34 @@
+var express = require('express')
+var pejs = require('pejs');
+
+app = express();
+views = pejs();
+
+module.exports.index = function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    views.render('prototype', res.locals, function(err, result) {
+        res.send(result);
+    });
+}
+
+module.exports.arrows = function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    res.locals.extrajs = '<script src="/static/js/prototype/arrows/main.js"></script>';
+
+    views.render('prototype/prototype', res.locals, function(err, result) {
+        console.log(err);
+        res.send(result);
+    });
+}
+
+module.exports.viewports = function(req, res) {
+    res.setHeader('Content-Type', 'text/html');
+
+    res.locals.extrajs = '<script src="/static/js/prototype/viewports/main.js"></script>';
+
+    views.render('prototype/prototype', res.locals, function(err, result) {
+        res.send(result);
+    });
+}

controllers/prototype/urls.js

@@ -0,0 +1,5 @@
+module.exports = {
+    '/prototype': 'index',
+    '/prototype/arrows': 'arrows',
+    '/prototype/viewports': 'viewports'
+}

controllers/stream/index.js

@@ -0,0 +1,28 @@
+var pejs = require('pejs');
+var tools = require('../../my_modules/filterInt')
+
+views = pejs();
+
+module.exports.index = function(req, res, next) {
+
+    // Parse get argument res
+    res.locals.resolution = req.params.res;
+
+    if (res.locals.resolution === undefined) {
+        res.locals.resolution = 5;
+    } else {
+        res.locals.resolution = tools.filterInt(res.locals.resolution);
+    }
+
+    if (isNaN(res.locals.resolution) || res.locals.resolution < 1 || res.locals.resolution > 25) {
+        var error = new Error("Resolution was not set properly");
+        error.status = 404;
+        next(error);
+        return;
+    }
+
+    res.setHeader('Content-Type', 'text/html');
+    views.render('stream/index.html', res.locals, function(err, result) {
+        res.send(result);
+    });
+}

controllers/stream/urls.js

@@ -0,0 +1,3 @@
+module.exports = {
+    '/stream/:res?': 'index'
+};

index.md

@@ -1,31 +0,0 @@
----
-layout: main
-title: Index
----
-
-## Index
-  - [A bouncing cube that jumps when you click on it](/bouncing/)
-
-    Jumps and bounce when you click on it :smiley:
-
-  - [Sphere with multi-resolution](/multisphere/)
-
-    Lots of obj files loaded and displayed. When you click
-    somewhere, the current obj is hidden and the next one, with a
-    better resolution is shown.
-
-  - [A proto of the real thing](/prototype/)
-
-    You can move the camera with the arrow keys and move the angle of the camera
-    with 2, 4, 6 and 8 (the arrows of the numpad), or you can do a drag-and-drop
-    like (click on the mouse to grap the scene, and move the mouse to rotate the
-    camera). You can also select a camera by clicking on the red part of it, and
-    get back to the free camera by clicking again. You can also select a camera by
-    simply clicking on the object you want to see. The program will choose the
-    camera that you want, and move to it progressively.
-
-  - [Streaming simulation](/stream/)
-
-    A mesh of a sphere is fully loaded,
-    and displayed progressively. This test is here to prove that we can dynamically
-    add vertices and faces to a mesh.

index/index.js

@@ -0,0 +1,10 @@
+module.exports = function(app, urls) {
+    app.get(urls.index, function(req, res) {
+        res.setHeader('Content-Type', 'text/html');
+
+        views.render('index', res.locals, function(err, result) {
+            console.log(err);
+            res.send(result);
+        });
+    });
+}

lib/boot.js

@@ -0,0 +1,37 @@
+/**
+ * Module dependencies.
+ */
+
+var express = require('express');
+var fs = require('fs');
+
+module.exports = function(parent, options){
+    var verbose = options.verbose;
+    fs.readdirSync(__dirname + '/../controllers').forEach(function(name){
+
+        // index.js in controller, with function as pages (views.py for django)
+        var obj = require('./../controllers/' + name + '/index');
+
+        // urls.js, just like django urls.py
+        var urls = require('./../controllers/' + name + '/urls');
+        var name = obj.name || name;
+        var app = express();
+
+        // allow specifying the view engine
+        if (obj.engine) app.set('view engine', obj.engine);
+        app.set('views', __dirname + '/../controllers/' + name + '/views');
+
+        // generate routes based
+        // on the exported methods
+
+        verbose && console.log('\t' + name + ':');
+        for (var key in urls) {
+            app.get(key, obj[urls[key]]);
+            console.log('\t\t' + key + ' -> ' + name + '.' + urls[key]);
+        }
+        console.log();
+
+        // mount the app
+        parent.use(app);
+    });
+};

multisphere/index.md

@@ -1,12 +0,0 @@
----
-layout: withjs
-title: Multi-sphere
-extrajs: <script src="/static/js/multisphere/MultiSphere.js"></script>
----
-## Multiresolution sphere
-
-This is the first test of multi-resolution. In fact, it's not really one
-multi-resolution sphere but many spheres with different resolutions. You can
-change resolution by clicking on the canvas.
-
-<div id="container"></div>

my_modules/filterInt.js

@@ -0,0 +1,6 @@
+// Strict parseInt
+module.exports.filterInt = function(value) {
+    if(/^(\-|\+)?([0-9]+|Infinity)$/.test(value))
+        return Number(value);
+    return NaN;
+}

prototype/arrows/index.md

@@ -1,7 +0,0 @@
----
-title: Prototype with old cameras
-layout: prototype
-extrajs: <script src="/static/js/prototype/arrows/main.js"></script>
-extrahead: <link rel="stylesheet" href="/static/css/prototype.css" />
----
-{{ content }}

prototype/index.md

@@ -1,12 +0,0 @@
----
-layout: main
-title: Prototypes
----
-
-## Index
-There are two prototypes here :
-
-  - [One with arrows](arrows/)
-
-  - [One with viewports](viewports/)
-

prototype/viewports/index.md

@@ -1,7 +0,0 @@
----
-title: Prototype with old cameras
-layout: prototype
-extrajs: <script src="/static/js/prototype/viewports/main.js"></script>
-extrahead: <link rel="stylesheet" href="/static/css/prototype.css" />
----
-{{ content }}

stream/index.md

@@ -1,14 +0,0 @@
----
-title: Streaming simulator
-layout: withjs
-extrajs:  <script>params = {}; params.get= {}; params.get.res = 5;</script>
-          <script src="/static/js/stream/main.js"></script>
----
-## Streaming simulator
-
-In fact, it's not really streaming. The sphere is fully preloaded and then, a
-mesh is created and vertices and faces are dynamically added to this mesh as
-time goes by.
-
-<div style="border-width:1px; border-style: solid;" id="container"></div>
-

urls.js

@@ -0,0 +1,7 @@
+module.exports.index = "/";
+module.exports.bouncing = '/bouncing/';
+module.exports.multisphere = '/multisphere/';
+module.exports.prototype = '/prototype/';
+module.exports.arrows = '/prototype/arrows/';
+module.exports.viewports = '/prototype/viewports/';
+module.exports.stream = '/stream/';

views/404.html

@@ -1,10 +1,10 @@
----
+<%{ 'main' }%>
-layout: main
+<%{ title %>404<%} %>
-title: 404
+<%{ content %>
----
 <section>
     <h2>Error 404</h2>
     <p>
-        There is nothing there... maybe you want to go back to <a href="/">the index</a>
+        There is nothing there... maybe you want to go back to <a href="<%= urls.index %>">the index</a>
     </p>
 </section>
+<%} %>

views/bouncing/index.html

@@ -0,0 +1,11 @@
+<%{ '../withjs' }%>
+<%{ title %>Bouncing cube<%} %>
+<%{ extrajs %><script src="/static/js/bouncing/BouncingMain.js"></script><%} %>
+
+<%{ content %>
+<h2>Bouncing cube</h2>
+
+<p>Click on the cube to make it jump !</p>
+
+<div id="container"></div>
+<%} %>

views/index.html

@@ -0,0 +1,43 @@
+<%{ './main' }%>
+
+<%{ title %>Index<%} %>
+
+<%{ content %>
+<h2>Index</h2>
+    <ul>
+        <li>
+            <a href="/bouncing/">A bouncing cube that jumps when you click on it</a>
+
+            <p>Jumps and bounce when you click on it.</p>
+        </li>
+
+        <li>
+            <a href="/multisphere/">Sphere with multi-resolution</a>
+
+            <p>Lots of obj files loaded and displayed. When you click
+            somewhere, the current obj is hidden and the next one, with a
+            better resolution is shown.</p>
+        </li>
+
+        <li>
+            <a href="/prototype/">A proto of the real thing</a>
+
+            <p>You can move the camera with the arrow keys and move the angle
+            of the camera with 2, 4, 6 and 8 (the arrows of the numpad), or you
+            can do a drag-and-drop like (click on the mouse to grap the scene,
+            and move the mouse to rotate the camera). You can also select a
+            camera by clicking on the red part of it, and get back to the free
+            camera by clicking again.  You can also select a camera by simply
+            clicking on the object you want to see. The program will choose the
+            camera that you want, and move to it progressively.</p>
+        </li>
+
+        <li>
+           <a href="/stream/">Streaming simulation</a>
+
+            <p>A mesh of a sphere is fully loaded, and displayed progressively.
+            This test is here to prove that we can dynamically add vertices and
+            faces to a mesh.</p>
+        </li>
+</ul>
+<%} %>

views/main.html

@@ -7,8 +7,8 @@
         <link rel="stylesheet" href="/static/css/style.css" />
         <link rel="stylesheet" href="/static/css/syntax.css" />
         <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Ubuntu:400,700,400italic" />
-        {{ page.extrahead }}
+        <%{{ extrahead }}%>
-        <title>3DUI - {{ page.title }}</title>
+        <title><%= title %> - <%{{ title }}%></title>
     </head>
     <body>
         <nav id="nav" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
@@ -24,26 +24,26 @@
                 </div>
                 <div class="navbar-collapse collapse">
                     <ul class="nav navbar-nav">
-                        <li><a href="/bouncing/">Bouncing cube</a></li>
+                        <li><a href="<%= urls.bouncing %>">Bouncing cube</a></li>
-                        <li><a href="/multisphere/">Multi-sphere</a></li>
+                        <li><a href="<%= urls.multisphere %>">Multi-sphere</a></li>
                         <li class="dropdown">
                             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Prototypes <span class="caret"></span></a>
                             <ul class="dropdown-menu" role="menu">
-                                <li><a href="/prototype/arrows/">Arrows</a></li>
+                                <li><a href="<%= urls.arrows %>">Arrows</a></li>
-                                <li><a href="/prototype/viewports/">Viewport</a></li>
+                                <li><a href="<%= urls.viewports %>">Viewports</a></li>
                             </ul>
                         </li>
-                        <li><a href="/stream/">Streaming simulator</a></li>
+                        <li><a href="<%= urls.stream %>">Streaming simulator</a></li>
                     </ul>
                 </div><!--/.nav-collapse -->
             </div>
         </nav>
         <section class="container" id="main-section">
-            {{ content }}
+            <%{{ content }}%>
         </section>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
         <script src="/static/bootstrap/js/bootstrap.min.js"></script>
-        {{ page.js }}
+        <%{{ js }}%>
-        {{ page.extrajs }}
+        <%{{ extrajs }}%>
     </body>
 </html>

views/multisphere/index.html

@@ -0,0 +1,13 @@
+<%{ '../withjs' }%>
+<%{ title %>Multi-sphere<%} %>
+<%{ extrajs %><script src="/static/js/multisphere/MultiSphere.js"></script><%} %>
+
+<%{ content %>
+<h2>Multiresolution sphere</h2>
+
+<p>This is the first test of multi-resolution. In fact, it's not really one
+multi-resolution sphere but many spheres with different resolutions. You can
+change resolution by clicking on the canvas.</p>
+
+<div id="container"></div>
+<%} %>

views/prototype/index.html

@@ -0,0 +1,14 @@
+<%{ '../main' }%>
+<%{ title %>Prototypes<%} %>
+<%{ content %>
+
+<h2>Index</h2>
+There are two prototypes here :
+
+    <ul>
+        <li><a href="arrows/">One with arrows</a></li>
+
+        <li><a href="viewports/">One with viewports</a></li>
+  </ul>
+<%} %>
+

views/prototype/prototype.html

@@ -1,8 +1,10 @@
----
+<%{ '../withjs' }%>
-title: Prototype with old cameras
+
-layout: withjs
+<%{ title %>Prototype with old cameras<%} %>
-extrahead: <link rel="stylesheet" href="/static/css/prototype.css" />
+<%{ extrajs %><%- extrajs %><%} %>
----
+<%{ extrahead %><link rel="stylesheet" href="/static/css/prototype.css" /><%} %>
+
+<%{ content %>
 <div id="main-div">
 <!--<div style="display: none;">-->
 <h2>3D Interface</h2>
@@ -43,3 +45,4 @@ button.
 <!-- </div> -->
 
 <div id="container" style="padding: 0px; margin: 0px;" tabindex="1"></div>
+<%} %>

views/stream/index.html

@@ -0,0 +1,16 @@
+<%{ '../withjs' }%>
+<%{ title %>Streaming simulator<%} %>
+<%{ extrajs %>
+<script>params = {}; params.get= {}; params.get.res = <%= resolution %>;</script>
+<script src="/static/js/stream/main.js"></script>
+<%} %>
+
+<%{ content %>
+<h2>Streaming simulator</h2>
+
+<p>In fact, it's not really streaming. The sphere is fully preloaded and then, a
+mesh is created and vertices and faces are dynamically added to this mesh as
+time goes by.</p>
+
+<div style="border-width:1px; border-style: solid;" id="container"></div>
+<%} %>

views/withjs.html

@@ -1,6 +1,6 @@
----
+<%{ 'main.html' }%>
-layout: main
+<%{ js %>
-js: <script src="/static/js/three.js"></script>
+    <script src="/static/js/three.js"></script>
     <script src="/static/js/Tools.js"></script>
     <script src="/static/js/three/stats.min.js"></script>
     <script src="/static/js/three/DDSLoader.js"></script>
@@ -19,7 +19,4 @@ js: <script src="/static/js/three.js"></script>
     <script src="/static/js/CameraContainer.js"></script>
     <script src="/static/js/Hermite.js"></script>
     <script>static_path="/static/"</script>
----
+<%} %>
-{{ content }}
-
-