Color of gun sight change when hovering element

This commit is contained in:
Thomas FORGIONE 2015-06-22 14:39:41 +02:00
parent 0ba03cdece
commit ecee155751
4 changed files with 68 additions and 30 deletions

View File

@ -11,11 +11,11 @@ BD.Private.sendData = function(url, data) {
xhr.open("POST", url, true); xhr.open("POST", url, true);
xhr.setRequestHeader("Content-type", "application/json;charset=UTF-8"); xhr.setRequestHeader("Content-type", "application/json;charset=UTF-8");
xhr.onreadystatechange = function() { // xhr.onreadystatechange = function() {
if(xhr.readyState == 4 && xhr.status == 200) { // if(xhr.readyState == 4 && xhr.status == 200) {
console.log("Done : " + xhr.responseText); // console.log("Done : " + xhr.responseText);
} // }
} // }
xhr.send(JSON.stringify(data)); xhr.send(JSON.stringify(data));
} }

View File

@ -1,4 +1,5 @@
var MousePointer = function(camera) { var MousePointer = function(camera) {
this.domElement = document.createElement('canvas'); this.domElement = document.createElement('canvas');
this.domElement.style.position = 'absolute'; this.domElement.style.position = 'absolute';
this.domElement.style.cssFloat = 'top-left'; this.domElement.style.cssFloat = 'top-left';
@ -6,39 +7,76 @@ var MousePointer = function(camera) {
this.size = 10; this.size = 10;
this.drawn = false; this.drawn = false;
camera.mousePointer = this; camera.mousePointer = this;
this.style = MousePointer.NONE;
} }
MousePointer.prototype.render = function() { MousePointer.NONE = 0;
MousePointer.BLACK = 1;
MousePointer.RED = 2;
if (!this.drawn) { MousePointer.toColor = function(style) {
this.drawn = true;
var i = container_size.width() / 2; switch (style) {
var imin = i - this.size;
var imax = i + this.size;
var j = container_size.height() / 2; case MousePointer.NONE:
var jmin = j - this.size; return null;
var jmax = j + this.size; case MousePointer.BLACK:
return '#000000';
case MousePointer.RED:
return '#ff0000';
this.ctx.stokeStyle = "black"; }
this.ctx.beginPath();
this.ctx.moveTo(imin, j); }
this.ctx.lineTo(imax, j);
this.ctx.moveTo(i, jmin); MousePointer.prototype.render = function(style) {
this.ctx.lineTo(i, jmax);
if (this.style !== style) {
if (style === MousePointer.NONE) {
// Clear canvas
this.domElement.width = this.domElement.width;
this.style = MousePointer.NONE;
} else {
this.domElement.width = this.domElement.width;
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.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.lineWidth = 5;
this.ctx.strokeStyle = '#ffffff';
this.ctx.stroke();
this.ctx.lineWidth = 2;
this.ctx.strokeStyle = MousePointer.toColor(style);
this.ctx.stroke();
this.style = style;
}
this.ctx.closePath();
this.ctx.stroke();
} }
} }
MousePointer.prototype.clear = function() { MousePointer.prototype.clear = function() {
if (this.drawn) { this.render(MousePointer.NONE);
this.drawn = false;
this.domElement.width = this.domElement.width;
}
} }

View File

@ -276,10 +276,6 @@ ProgressiveLoader.prototype.initIOCallbacks = function() {
this.socket.on('disconnect', function() { this.socket.on('disconnect', function() {
console.log('Finished !'); console.log('Finished !');
self.currentMesh.geometry.computeBoundingSphere();
if (self.currentMesh.geometry.attributes.normal === undefined) {
self.currentMesh.geometry.computeVertexNormals();
}
self.finished = true; self.finished = true;
}); });
} }

View File

@ -105,6 +105,10 @@ CameraSelecter.prototype.update = function(event, y) {
} }
document.getElementById('container').style.cursor = hovered ? "pointer" : "auto"; document.getElementById('container').style.cursor = hovered ? "pointer" : "auto";
if (this.cameras.mainCamera().pointerLocked)
this.cameras.mainCamera().mousePointer.render(hovered ? MousePointer.RED : MousePointer.BLACK);
} }
CameraSelecter.prototype.click = function(event) { CameraSelecter.prototype.click = function(event) {