Created checker interface
This commit is contained in:
parent
4dfd241064
commit
25d6d3a89a
|
@ -834,7 +834,7 @@ DBReq.ExpIdChecker = function(id, finishAction) {
|
||||||
DBReq.ExpIdChecker.prototype.execute = function() {
|
DBReq.ExpIdChecker.prototype.execute = function() {
|
||||||
var self = this;
|
var self = this;
|
||||||
this.client.query(
|
this.client.query(
|
||||||
"SELECT scene_id FROM experiment WHERE id = $1;",
|
"SELECT scene_id FROM experiment, CoinCombination WHERE CoinCombination.id = Experiment.coin_combination_id AND Experiment.id = $1;",
|
||||||
[self.id],
|
[self.id],
|
||||||
function(err, result) {
|
function(err, result) {
|
||||||
if (result === undefined || result.rows.length === 0) {
|
if (result === undefined || result.rows.length === 0) {
|
||||||
|
@ -888,8 +888,9 @@ DBReq.ExpGetter.prototype.execute = function() {
|
||||||
"users.worker_id as username, " +
|
"users.worker_id as username, " +
|
||||||
"scene.name as scenename, " +
|
"scene.name as scenename, " +
|
||||||
"users.id as user_id " +
|
"users.id as user_id " +
|
||||||
"FROM experiment, users, scene " +
|
"FROM experiment, users, scene, CoinCombination " +
|
||||||
"WHERE experiment.user_id = users.id and scene.id = experiment.scene_id " +
|
"WHERE experiment.user_id = users.id and scene.id = CoinCombination.scene_id AND " +
|
||||||
|
" Experiment.coin_combination_id = CoinCombination.id " +
|
||||||
"ORDER BY experiment.id;",
|
"ORDER BY experiment.id;",
|
||||||
[],
|
[],
|
||||||
function(err, result) {
|
function(err, result) {
|
||||||
|
|
|
@ -239,6 +239,32 @@ module.exports.viewer = function(req, res, next) {
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
module.exports.checker = function(req, res, next) {
|
||||||
|
|
||||||
|
var scene = req.params.scene;
|
||||||
|
|
||||||
|
switch (scene) {
|
||||||
|
|
||||||
|
case 'peach': res.locals.scene = "L3D.initPeach"; break;
|
||||||
|
case 'coolcoolmountain': res.locals.scene = "L3D.initMountain"; break;
|
||||||
|
case 'whomp': res.locals.scene = "L3D.initWhomp"; break;
|
||||||
|
case 'bobomb': res.locals.scene = "L3D.initBobomb"; break;
|
||||||
|
default:
|
||||||
|
// 404
|
||||||
|
var err = new Error('Incorrect scene');
|
||||||
|
err.status = 404;
|
||||||
|
next(err);
|
||||||
|
break;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
res.setHeader('Content-Type', 'text/html');
|
||||||
|
res.render('prototype_checker.jade', res.locals, function(err, result) {
|
||||||
|
res.send(result);
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
module.exports.userstudy = function(req, res) {
|
module.exports.userstudy = function(req, res) {
|
||||||
res.setHeader('Content-Type', 'text/html');
|
res.setHeader('Content-Type', 'text/html');
|
||||||
|
|
||||||
|
|
|
@ -8,5 +8,6 @@ module.exports = {
|
||||||
'/prototype/sponza': 'sponza',
|
'/prototype/sponza': 'sponza',
|
||||||
'/prototype/coin-creator/:scene': 'clicker',
|
'/prototype/coin-creator/:scene': 'clicker',
|
||||||
'/prototype/coin-viewer/:scene': 'viewer',
|
'/prototype/coin-viewer/:scene': 'viewer',
|
||||||
|
'/prototype/coin-checker/:scene': 'checker',
|
||||||
'/user-study': 'userstudy'
|
'/user-study': 'userstudy'
|
||||||
};
|
};
|
||||||
|
|
|
@ -0,0 +1,15 @@
|
||||||
|
extends ./prototype
|
||||||
|
|
||||||
|
block title
|
||||||
|
title #{title} - Prototype
|
||||||
|
|
||||||
|
block mainjs
|
||||||
|
script initMainScene = #{scene};
|
||||||
|
script Recommendation = L3D.ArrowRecommendation;
|
||||||
|
|
||||||
|
script(src="/static/js/coinchecker.min.js")
|
||||||
|
|
||||||
|
block extrabutton
|
||||||
|
//-button#save.btn.btn-primary.navbar-btn(style={'margin-right': '10px', 'margin-bottom':'10px'}, onclick="saveCoins();") Save coins
|
||||||
|
button#coins-remaining.btn.btn-primary.navbar-btn(style={'margin-right':'10px', 'margin-bottom':'10px'}) Lol coins remaining
|
||||||
|
|
|
@ -6,7 +6,7 @@ else
|
||||||
CLOSURE=../utils/simple-compiler/compiler.sh
|
CLOSURE=../utils/simple-compiler/compiler.sh
|
||||||
endif
|
endif
|
||||||
|
|
||||||
all: L3D L3DP Socket Three Stats Bouncing Multisphere StreamingSimulator PrototypeReplay PrototypeInteractive Tutorial TestList CoinCreator CoinViewer StarRating
|
all: L3D L3DP Socket Three Stats Bouncing Multisphere StreamingSimulator PrototypeReplay PrototypeInteractive Tutorial TestList CoinCreator CoinViewer CoinChecker StarRating
|
||||||
|
|
||||||
StarRating:
|
StarRating:
|
||||||
cp star-rating.min.js ../static/js/
|
cp star-rating.min.js ../static/js/
|
||||||
|
@ -99,6 +99,11 @@ CoinViewer:
|
||||||
--js l3d/apps/prototype/coin-viewer/main.js \
|
--js l3d/apps/prototype/coin-viewer/main.js \
|
||||||
--js_output_file ../static/js/coinviewer.min.js
|
--js_output_file ../static/js/coinviewer.min.js
|
||||||
|
|
||||||
|
CoinChecker:
|
||||||
|
$(CLOSURE) $(OPT) \
|
||||||
|
--js l3d/apps/prototype/coin-checker/main.js \
|
||||||
|
--js_output_file ../static/js/coinchecker.min.js
|
||||||
|
|
||||||
PrototypeReplay:
|
PrototypeReplay:
|
||||||
$(CLOSURE) $(OPT) \
|
$(CLOSURE) $(OPT) \
|
||||||
--js l3d/apps/prototype/ButtonManager.js \
|
--js l3d/apps/prototype/ButtonManager.js \
|
||||||
|
|
|
@ -0,0 +1,278 @@
|
||||||
|
// Let's be sure we avoid using global variables
|
||||||
|
var onWindowResize = (function() {
|
||||||
|
|
||||||
|
// Disable scrolling
|
||||||
|
window.onscroll = function () { window.scrollTo(0, 0); };
|
||||||
|
document.addEventListener('contextmenu', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
});
|
||||||
|
window.onload = main;
|
||||||
|
|
||||||
|
var stats;
|
||||||
|
var renderer, scene, container;
|
||||||
|
var clickableObjects = [];
|
||||||
|
var recommendations, objectClicker;
|
||||||
|
var previewer;
|
||||||
|
var camera1;
|
||||||
|
var coins = [];
|
||||||
|
var previousTime;
|
||||||
|
var pointer;
|
||||||
|
var startCanvas;
|
||||||
|
var name;
|
||||||
|
|
||||||
|
function sceneName() {
|
||||||
|
switch (initMainScene) {
|
||||||
|
case L3D.initPeach:
|
||||||
|
return 'L3D.initPeach';
|
||||||
|
case L3D.initWhomp:
|
||||||
|
return 'L3D.initWhomp';
|
||||||
|
case L3D.initBobomb:
|
||||||
|
return 'L3D.initBobomb';
|
||||||
|
case L3D.initMountain:
|
||||||
|
return 'L3D.initMountain';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
saveCoins = function() {
|
||||||
|
|
||||||
|
var tmp = 0;
|
||||||
|
for (var i = 0; i < coins.length; i++) {
|
||||||
|
if (coins[i].mesh.visible)
|
||||||
|
tmp++;
|
||||||
|
}
|
||||||
|
|
||||||
|
document.getElementById('coins-remaining').innerHTML = tmp + ' coins remaining';
|
||||||
|
|
||||||
|
// L3D.DB.Private.sendData('/posts/coin-info', result, true);
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
function main() {
|
||||||
|
|
||||||
|
// Main container that holds everything
|
||||||
|
container = document.getElementById('container');
|
||||||
|
|
||||||
|
// Initialization
|
||||||
|
initThreeElements();
|
||||||
|
initCanvases();
|
||||||
|
initModels();
|
||||||
|
initListeners();
|
||||||
|
|
||||||
|
appendTo(container)(stats, startCanvas, pointer, previewer, renderer);
|
||||||
|
|
||||||
|
// Set the good size of cameras
|
||||||
|
onWindowResize();
|
||||||
|
|
||||||
|
// Some config
|
||||||
|
L3D.DB.disable();
|
||||||
|
|
||||||
|
Coin.update();
|
||||||
|
startCanvas.render(L3D.StartCanvas.Black);
|
||||||
|
|
||||||
|
// Bind previewer to renderer (for fixed option)
|
||||||
|
function bind() {
|
||||||
|
if (document.pointerLockElement || document.mozPointerLockElement || document.webkitPointerLockElement) {
|
||||||
|
// Lock event
|
||||||
|
previewer.fixed = true;
|
||||||
|
} else {
|
||||||
|
// Unlock event
|
||||||
|
previewer.fixed = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
document.addEventListener('pointerlockchange', bind);
|
||||||
|
document.addEventListener('mozpointerlockchange', bind);
|
||||||
|
document.addEventListener('webkitpointerlockchange', bind);
|
||||||
|
|
||||||
|
// Start rendering
|
||||||
|
setInterval(render, 20);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function initThreeElements() {
|
||||||
|
|
||||||
|
// Initialize scene
|
||||||
|
scene = new THREE.Scene();
|
||||||
|
renderer = new THREE.WebGLRenderer({alpha:true, antialias:true});
|
||||||
|
renderer.setClearColor(0x87ceeb);
|
||||||
|
|
||||||
|
// Initialize pointer camera
|
||||||
|
camera1 = new L3D.PointerCamera(
|
||||||
|
50,
|
||||||
|
container_size.width() / container_size.height(),
|
||||||
|
0.01, 100000, renderer, container
|
||||||
|
);
|
||||||
|
|
||||||
|
camera1.collisions = false;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function initCanvases() {
|
||||||
|
|
||||||
|
// Initialize previewer
|
||||||
|
previewer = new L3D.Previewer(renderer, scene);
|
||||||
|
previewer.domElement.style.position ="absolute";
|
||||||
|
previewer.domElement.style.cssFloat = 'top-left';
|
||||||
|
|
||||||
|
// Initialize stats counter
|
||||||
|
stats = new Stats();
|
||||||
|
stats.setMode(0);
|
||||||
|
stats.domElement.style.position = 'absolute';
|
||||||
|
stats.domElement.style.cssFloat = "top-left";
|
||||||
|
|
||||||
|
// Initialize pointer for pointer lock
|
||||||
|
pointer = new L3D.MousePointer(camera1);
|
||||||
|
|
||||||
|
// Init start canvas
|
||||||
|
startCanvas = new L3D.StartCanvas(camera1);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function initModels() {
|
||||||
|
|
||||||
|
var i = 0;
|
||||||
|
|
||||||
|
// Init recommendations
|
||||||
|
recommendations = initMainScene(camera1, scene, coins, clickableObjects, []);
|
||||||
|
|
||||||
|
for (i = 0; i < coins.length; i++) {
|
||||||
|
coins[i].rotating = true;
|
||||||
|
clickableObjects.push(coins[i]);
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(saveCoins, 1000);
|
||||||
|
|
||||||
|
// Erase recommendations
|
||||||
|
for (i =0; i < recommendations.length; i++)
|
||||||
|
recommendations[i].traverse(function(obj) {obj.visible = false;});
|
||||||
|
recommendations = [];
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function initListeners() {
|
||||||
|
|
||||||
|
// Add listeners
|
||||||
|
window.addEventListener('resize', onWindowResize, false);
|
||||||
|
|
||||||
|
// HTML Bootstrap buttons
|
||||||
|
buttonManager = new ButtonManager(camera1, recommendations, previewer);
|
||||||
|
|
||||||
|
// Object clicker for hover and clicking recommendations
|
||||||
|
objectClicker = new L3D.ObjectClicker(
|
||||||
|
renderer,
|
||||||
|
camera1,
|
||||||
|
clickableObjects,
|
||||||
|
objectClickerOnHover(camera1, previewer, recommendations, container), // Create onHover function
|
||||||
|
|
||||||
|
// onclick
|
||||||
|
function(c, x, y, event) {
|
||||||
|
|
||||||
|
// if (event.button !== 2) {
|
||||||
|
|
||||||
|
// if (c !== undefined && c.object instanceof Coin)
|
||||||
|
// glob = c.object;
|
||||||
|
// else
|
||||||
|
// glob = null;
|
||||||
|
|
||||||
|
// return;
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (c !== undefined) {
|
||||||
|
|
||||||
|
if (c.object instanceof Coin) {
|
||||||
|
|
||||||
|
c.object.mesh.visible = false;
|
||||||
|
c.object.raycastable = false;
|
||||||
|
|
||||||
|
} else {
|
||||||
|
|
||||||
|
// var newPosition = c.point.clone();
|
||||||
|
// var direction = L3D.Tools.diff(newPosition, camera1.position);
|
||||||
|
// direction.normalize();
|
||||||
|
// direction.multiplyScalar(0.2);
|
||||||
|
// newPosition.sub(direction);
|
||||||
|
// var coin = new Coin(newPosition.x, newPosition.y, newPosition.z, function() {});
|
||||||
|
// coin.addToScene(scene);
|
||||||
|
// coins.push(coin);
|
||||||
|
// clickableObjects.push(coin);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
saveCoins();
|
||||||
|
},
|
||||||
|
container
|
||||||
|
);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function render() {
|
||||||
|
|
||||||
|
// Stats for render
|
||||||
|
stats.begin();
|
||||||
|
|
||||||
|
objectClicker.update();
|
||||||
|
|
||||||
|
// Update recommendations (set raycastable if shown)
|
||||||
|
recommendations.map(function(reco) {
|
||||||
|
if (reco instanceof Recommendation) {
|
||||||
|
reco.traverse(function(elt) {
|
||||||
|
elt.visible = elt.raycastable = buttonManager.showArrows;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Update coins
|
||||||
|
coins.forEach(function(coin) { coin.update(); });
|
||||||
|
|
||||||
|
// Update main camera
|
||||||
|
var currentTime = Date.now() - previousTime;
|
||||||
|
camera1.update(isNaN(currentTime) ? 20 : currentTime);
|
||||||
|
previousTime = Date.now();
|
||||||
|
|
||||||
|
// Update the recommendations
|
||||||
|
recommendations.map(function(reco) { reco.update(camera1);});
|
||||||
|
|
||||||
|
// Set current position of camera
|
||||||
|
camera1.look();
|
||||||
|
|
||||||
|
var left = 0, bottom = 0, width = container_size.width(), height = container_size.height();
|
||||||
|
renderer.setScissor(left, bottom, width, height);
|
||||||
|
renderer.enableScissorTest(true);
|
||||||
|
renderer.setViewport(left, bottom, width, height);
|
||||||
|
renderer.render(scene, camera1);
|
||||||
|
|
||||||
|
// Remove borders of preview
|
||||||
|
previewer.clear();
|
||||||
|
|
||||||
|
// Hide arrows in recommendation
|
||||||
|
recommendations.map(function(reco) { if (reco instanceof Recommendation) hide(reco); });
|
||||||
|
|
||||||
|
// Update transparent elements
|
||||||
|
THREEx.Transparency.update(camera1);
|
||||||
|
|
||||||
|
// Render preview
|
||||||
|
previewer.render(container_size.width(), container_size.height());
|
||||||
|
|
||||||
|
// Finish stats
|
||||||
|
stats.end();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function onWindowResize() {
|
||||||
|
|
||||||
|
resizeElements(renderer, container, previewer, pointer, startCanvas);
|
||||||
|
|
||||||
|
recommendations.forEach(function(reco) {
|
||||||
|
resetCameraAspect(reco.camera, container_size.width(), container_size.height());
|
||||||
|
});
|
||||||
|
|
||||||
|
render();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// onWindowResize will be the only global function
|
||||||
|
return onWindowResize;
|
||||||
|
|
||||||
|
})();
|
Loading…
Reference in New Issue