Initial commit of nodejs

This commit is contained in:
Thomas FORGIONE 2015-05-05 11:56:35 +02:00
parent 4cc35587ef
commit afe1d124ed
35 changed files with 336 additions and 138 deletions

1
CNAME
View File

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

View File

@ -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>

View File

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

View File

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

42
app.js Normal file
View File

@ -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);

View File

@ -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>

View File

@ -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);
});
}

View File

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

View File

@ -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);
});
}

View File

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

View File

@ -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);
});
}

View File

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

34
controllers/prototype/index.js vendored Normal file
View File

@ -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);
});
}

5
controllers/prototype/urls.js vendored Normal file
View File

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

View File

@ -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);
});
}

View File

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

View File

@ -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.

10
index/index.js Normal file
View File

@ -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);
});
});
}

37
lib/boot.js Normal file
View File

@ -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);
});
};

View File

@ -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>

6
my_modules/filterInt.js Normal file
View File

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

View File

@ -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 }}

View File

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

View File

@ -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 }}

View File

@ -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>

7
urls.js Normal file
View File

@ -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/';

View File

@ -1,10 +1,10 @@
---
layout: main
title: 404
---
<%{ 'main' }%>
<%{ 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>
<%} %>

11
views/bouncing/index.html Normal file
View File

@ -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>
<%} %>

43
views/index.html Normal file
View File

@ -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>
<%} %>

View File

@ -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 }}
<title>3DUI - {{ page.title }}</title>
<%{{ extrahead }}%>
<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="/multisphere/">Multi-sphere</a></li>
<li><a href="<%= urls.bouncing %>">Bouncing cube</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="/prototype/viewports/">Viewport</a></li>
<li><a href="<%= urls.arrows %>">Arrows</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 }}
{{ page.extrajs }}
<%{{ js }}%>
<%{{ extrajs }}%>
</body>
</html>

View File

@ -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>
<%} %>

View File

@ -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>
<%} %>

View File

@ -1,8 +1,10 @@
---
title: Prototype with old cameras
layout: withjs
extrahead: <link rel="stylesheet" href="/static/css/prototype.css" />
---
<%{ '../withjs' }%>
<%{ title %>Prototype with old cameras<%} %>
<%{ 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>
<%} %>

16
views/stream/index.html Normal file
View File

@ -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>
<%} %>

View File

@ -1,6 +1,6 @@
---
layout: main
js: <script src="/static/js/three.js"></script>
<%{ 'main.html' }%>
<%{ js %>
<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 }}
<%} %>