diff --git a/js/Logger.js b/js/Logger.js index 75835a0..6251023 100644 --- a/js/Logger.js +++ b/js/Logger.js @@ -11,11 +11,11 @@ BD.Private.sendData = function(url, data) { xhr.open("POST", url, true); xhr.setRequestHeader("Content-type", "application/json;charset=UTF-8"); - // xhr.onreadystatechange = function() { - // if(xhr.readyState == 4 && xhr.status == 200) { - // console.log("Done : " + xhr.responseText); - // } - // } + xhr.onreadystatechange = function() { + if(xhr.readyState == 4 && xhr.status == 200) { + console.log("Done : " + xhr.responseText); + } + } xhr.send(JSON.stringify(data)); } @@ -33,16 +33,16 @@ BD.disable = function() { BD.Private.compactCamera = function(camera) { return { - position: { - x: camera.position.x, - y: camera.position.y, - z: camera.position.z - }, - target: { - x: camera.target.x, - y: camera.target.y, - z: camera.target.z - } + position: { + x: camera.position.x, + y: camera.position.y, + z: camera.position.z + }, + target: { + x: camera.target.x, + y: camera.target.y, + z: camera.target.z + } }; } @@ -102,3 +102,15 @@ BD.Event.Hovered.prototype.send = function() { BD.Private.sendData(url, data); } + +BD.Event.Fps = function() {}; +BD.Event.Fps.prototype.send = function() { + + var url = "/fps"; + var data = { + fps: this.fps + } + + BD.Private.sendData(url, data); + +} diff --git a/js/Makefile b/js/Makefile index fd96a1c..5615e1c 100644 --- a/js/Makefile +++ b/js/Makefile @@ -6,7 +6,7 @@ else CLOSURE=./compiler.sh endif -all: List ListTest Socket Three Stats ThreeTools Bouncing Multisphere StreamingSimulator PrototypeTools PrototypeReplay PrototypeInteractive Tutorial Sponza +all: List ListTest Socket Three Stats ThreeTools Bouncing Multisphere StreamingSimulator PrototypeTools PrototypeReplay PrototypeInteractive Tutorial Socket: cp socket.io/socket.io.min.js ../static/js diff --git a/js/MousePointer.js b/js/MousePointer.js new file mode 100644 index 0000000..13ec218 --- /dev/null +++ b/js/MousePointer.js @@ -0,0 +1,44 @@ +var MousePointer = function(camera) { + this.domElement = document.createElement('canvas'); + this.domElement.style.position = 'absolute'; + this.domElement.style.cssFloat = 'top-left'; + this.ctx = this.domElement.getContext('2d'); + this.size = 10; + this.drawn = false; + camera.mousePointer = this; +} + +MousePointer.prototype.render = function() { + + if (!this.drawn) { + this.drawn = true; + + var i = container_size.width() / 2; + var imin = i - this.size; + var imax = i + this.size; + + var j = container_size.height() / 2; + var jmin = j - this.size; + var jmax = j + this.size; + + this.ctx.stokeStyle = "black"; + this.ctx.beginPath(); + this.ctx.moveTo(imin, j); + this.ctx.lineTo(imax, j); + this.ctx.moveTo(i, jmin); + this.ctx.lineTo(i, jmax); + + this.ctx.closePath(); + this.ctx.stroke(); + } + +} + +MousePointer.prototype.clear = function() { + + if (this.drawn) { + this.drawn = false; + this.domElement.width = this.domElement.width; + } + +} diff --git a/js/PointerCamera.js b/js/PointerCamera.js index 8f3dc2e..68b0c00 100644 --- a/js/PointerCamera.js +++ b/js/PointerCamera.js @@ -164,13 +164,27 @@ PointerCamera.prototype.normalMotion = function(time) { if (this.motion.decreaseTheta) {this.theta -= this.sensitivity * time / 20; this.changed = true; } if ( this.pointerLocked || this.dragging) { - this.theta += this.mouseMove.x; - this.phi -= this.mouseMove.y; + this.theta += this.mouseMove.x * time / 20; + this.phi -= this.mouseMove.y * time / 20; this.mouseMove.x = 0; this.mouseMove.y = 0; this.changed = true; + + if (this.shouldLogCameraAngles) { + + this.shouldLogCameraAngles = false; + + var self = this; + setTimeout(function() { + self.shouldLogCameraAngles = true; + }, 500); + + var event = new BD.KeyboardEvent(); + event.camera = this; + + } } // Clamp phi and theta @@ -386,8 +400,8 @@ PointerCamera.prototype.onMouseMovePointer = function(e) { this.mouseMove.x = e.movementX || e.mozMovementX || e.webkitMovementX || 0; this.mouseMove.y = e.movementY || e.mozMovementY || e.webkitMovementY || 0; - this.mouseMove.x /= -200; - this.mouseMove.y /= 200; + this.mouseMove.x *= -(this.sensitivity/5); + this.mouseMove.y *= (this.sensitivity/5); this.mouseMoved = true; } diff --git a/js/prototype/main.js b/js/prototype/main.js index 682d7b5..ad6e7ff 100644 --- a/js/prototype/main.js +++ b/js/prototype/main.js @@ -19,6 +19,8 @@ var container_size = { height: function() { return 768; } } +var stats; + // Let's be sure we avoid using global variables var onWindowResize = (function() { @@ -33,7 +35,7 @@ var objects = []; var cameras, cameraSelecter; var spheres = new Array(mesh_number); var visible = 0; -var stats; +// stats; var previewer; var camera1; var loader; @@ -43,8 +45,25 @@ var previousTime; init(); +if (initMainScene !== initPeach && initMainScene !== initSponza) + logfps(); animate(); +function logfps() { + + // Log fps + if (stats !== undefined) { + + var event = new BD.Event.Fps(); + event.fps = stats.getFps(); + event.send(); + + } + + setTimeout(logfps, 1000); + +} + function init() { // Initialize scene scene = new THREE.Scene(); diff --git a/js/three/stats.min.js b/js/three/stats.min.js index 52539f4..4840dd7 100644 --- a/js/three/stats.min.js +++ b/js/three/stats.min.js @@ -1,6 +1,4 @@ -// stats.js - http://github.com/mrdoob/stats.js -var Stats=function(){var l=Date.now(),m=l,g=0,n=Infinity,o=0,h=0,p=Infinity,q=0,r=0,s=0,f=document.createElement("div");f.id="stats";f.addEventListener("mousedown",function(b){b.preventDefault();t(++s%2)},!1);f.style.cssText="width:80px;opacity:0.9;cursor:pointer";var a=document.createElement("div");a.id="fps";a.style.cssText="padding:0 0 3px 3px;text-align:left;background-color:#002";f.appendChild(a);var i=document.createElement("div");i.id="fpsText";i.style.cssText="color:#0ff;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px"; -i.innerHTML="FPS";a.appendChild(i);var c=document.createElement("div");c.id="fpsGraph";c.style.cssText="position:relative;width:74px;height:30px;background-color:#0ff";for(a.appendChild(c);74>c.children.length;){var j=document.createElement("span");j.style.cssText="width:1px;height:30px;float:left;background-color:#113";c.appendChild(j)}var d=document.createElement("div");d.id="ms";d.style.cssText="padding:0 0 3px 3px;text-align:left;background-color:#020;display:none";f.appendChild(d);var k=document.createElement("div"); -k.id="msText";k.style.cssText="color:#0f0;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px";k.innerHTML="MS";d.appendChild(k);var e=document.createElement("div");e.id="msGraph";e.style.cssText="position:relative;width:74px;height:30px;background-color:#0f0";for(d.appendChild(e);74>e.children.length;)j=document.createElement("span"),j.style.cssText="width:1px;height:30px;float:left;background-color:#131",e.appendChild(j);var t=function(b){s=b;switch(s){case 0:a.style.display= -"block";d.style.display="none";break;case 1:a.style.display="none",d.style.display="block"}};return{REVISION:12,domElement:f,setMode:t,begin:function(){l=Date.now()},end:function(){var b=Date.now();g=b-l;n=Math.min(n,g);o=Math.max(o,g);k.textContent=g+" MS ("+n+"-"+o+")";var a=Math.min(30,30-30*(g/200));e.appendChild(e.firstChild).style.height=a+"px";r++;b>m+1E3&&(h=Math.round(1E3*r/(b-m)),p=Math.min(p,h),q=Math.max(q,h),i.textContent=h+" FPS ("+p+"-"+q+")",a=Math.min(30,30-30*(h/100)),c.appendChild(c.firstChild).style.height= -a+"px",m=b,r=0);return b},update:function(){l=this.end()}}};"object"===typeof module&&(module.exports=Stats); +'use strict';var Stats=function(){function f(a,e,b){a=document.createElement(a);a.id=e;a.style.cssText=b;return a}function l(a,e,b){var d=f("div",a,"padding:0 0 3px 3px;text-align:left;background:"+b),c=f("div",a+"Text","font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px;color:"+e);c.innerHTML=a.toUpperCase();d.appendChild(c);a=f("div",a+"Graph","width:74px;height:30px;background:"+e);d.appendChild(a);for(e=0;74>e;e++)a.appendChild(f("span","","width:1px;height:30px;float:left;opacity:0.9;background:"+ +b));return d}function m(a){for(var b=d.children,c=0;cr+1E3&&(c=Math.round(1E3*t/(a-r)),u=Math.min(u,c),v=Math.max(v,c),A.textContent=c+" FPS ("+u+"-"+v+")",p(B,c/100),r=a,t=0,void 0!==h)){var b=performance.memory.usedJSHeapSize,d=performance.memory.jsHeapSizeLimit;h=Math.round(9.54E-7*b);y=Math.min(y,h);z=Math.max(z,h);E.textContent=h+" MB ("+y+"-"+z+")";p(F,b/d)}return a},update:function(){k=this.end()}}};"object"===typeof module&&(module.exports=Stats); diff --git a/posts/fps/index.js b/posts/fps/index.js new file mode 100644 index 0000000..2c06aa1 --- /dev/null +++ b/posts/fps/index.js @@ -0,0 +1,18 @@ +var pg = require('pg'); +var secret = require('../../private'); + +module.exports.index = function(req, res) { + + pg.connect(secret.url, function(err, client, release) { + client.query( + "INSERT INTO fpscounter(exp_id, fps) VALUES($1,$2);", + [req.session.exp_id, req.body.fps], + function(err, result) { + release(); + } + ); + }); + + res.setHeader('Content-Type', 'text/html'); + res.send(""); +} diff --git a/posts/fps/urls.js b/posts/fps/urls.js new file mode 100644 index 0000000..9ddb40c --- /dev/null +++ b/posts/fps/urls.js @@ -0,0 +1,3 @@ +module.exports = { + '/fps': 'index' +} diff --git a/sql/backup.pgsql b/sql/backup.pgsql index 57dae05..02d2e9b 100644 --- a/sql/backup.pgsql +++ b/sql/backup.pgsql @@ -95,3 +95,9 @@ CREATE TABLE hovered( time TIMESTAMP DEFAULT NOW(), arrow_id INTEGER ); + +CREATE TABLE fpscounter( + id SERIAL PRIMARY KEY, + exp_id SERIAL REFERENCES experiment (id), + fps REAL +);