2017-04-29 12:43:50 +00:00
|
|
|
"use strict";
|
|
|
|
|
2017-12-08 17:54:20 +00:00
|
|
|
import Vector from './Utilities/Vector.js';
|
|
|
|
|
2017-12-15 15:45:49 +00:00
|
|
|
import ChunkReference from './ChunkReference.js';
|
|
|
|
|
2017-04-29 12:43:50 +00:00
|
|
|
class CursorSyncer
|
|
|
|
{
|
2017-12-08 17:54:20 +00:00
|
|
|
constructor(inBoardWindow, syncFrequency)
|
2017-04-29 12:43:50 +00:00
|
|
|
{
|
2017-12-08 17:54:20 +00:00
|
|
|
this.boardWindow = inBoardWindow
|
2017-04-29 12:43:50 +00:00
|
|
|
// The ripple link we should send the cursor updates down
|
2017-12-08 17:54:20 +00:00
|
|
|
this.rippleLink = this.boardWindow.rippleLink;
|
2017-07-29 19:41:41 +00:00
|
|
|
// The target frequency in fps at we should send cursor updates.
|
2017-04-29 12:43:50 +00:00
|
|
|
this.cursorUpdateFrequency = syncFrequency;
|
|
|
|
|
|
|
|
// Register ourselves to start sending cursor updates once the ripple
|
|
|
|
// link connects
|
|
|
|
this.rippleLink.on("connect", this.setup.bind(this));
|
2017-07-29 17:49:56 +00:00
|
|
|
|
2017-12-08 17:54:20 +00:00
|
|
|
/** The current cursor position in screen-space. @type {Vector} */
|
|
|
|
this.cursorPosition = new Vector(0, 0);
|
|
|
|
/** The current cursor position in plane-space. @type {Vector} */
|
|
|
|
this.absCursorPosition = new Vector(0, 0);
|
2017-04-29 12:43:50 +00:00
|
|
|
}
|
|
|
|
|
2017-12-15 15:45:49 +00:00
|
|
|
get chunkRefUnderCursor()
|
|
|
|
{
|
|
|
|
return new ChunkReference(
|
|
|
|
this.boardWindow.currentPlaneName,
|
2017-12-15 20:30:19 +00:00
|
|
|
Math.floor(this.absCursorPosition.x / this.boardWindow.gridSize),
|
|
|
|
Math.floor(this.absCursorPosition.y / this.boardWindow.gridSize)
|
2017-12-15 15:45:49 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
2017-04-29 12:43:50 +00:00
|
|
|
setup()
|
|
|
|
{
|
|
|
|
// The last time we sent a cursor update to the server.
|
|
|
|
this.lastCursorUpdate = 0;
|
|
|
|
|
|
|
|
document.addEventListener("mousemove", (function(event) {
|
2017-12-08 17:54:20 +00:00
|
|
|
this.cursorPosition.x = event.clientX;
|
|
|
|
this.cursorPosition.y = event.clientY;
|
|
|
|
|
2017-12-15 15:45:49 +00:00
|
|
|
this.absCursorPosition.x = this.boardWindow.viewport.x + this.cursorPosition.x * 1/this.boardWindow.viewport.zoomLevel;
|
|
|
|
this.absCursorPosition.y = this.boardWindow.viewport.y + this.cursorPosition.y * 1/this.boardWindow.viewport.zoomLevel;
|
2017-04-29 12:43:50 +00:00
|
|
|
|
|
|
|
setTimeout((function() {
|
|
|
|
// Throttle the cursor updates we send to the server - a high
|
|
|
|
// update frequency here will just consume bandwidth and is only
|
|
|
|
// noticable if you have a good connection
|
|
|
|
if(+new Date() - this.lastCursorUpdate < (1 / this.cursorUpdateFrequency) * 1000)
|
|
|
|
return false;
|
|
|
|
|
|
|
|
// Update the server on the mouse's position
|
|
|
|
this.sendCursorUpdate();
|
|
|
|
|
|
|
|
this.lastCursorUpdate = +new Date();
|
|
|
|
}).bind(this), 1 / this.cursorUpdateFrequency);
|
|
|
|
|
|
|
|
}).bind(this));
|
|
|
|
|
|
|
|
this.sendCursorUpdate();
|
|
|
|
}
|
|
|
|
|
|
|
|
sendCursorUpdate()
|
|
|
|
{
|
|
|
|
// Update the server on the mouse's position
|
|
|
|
this.rippleLink.send({
|
|
|
|
"Event": "CursorPosition",
|
2017-12-08 17:54:20 +00:00
|
|
|
"AbsCursorPosition": {
|
|
|
|
X: Math.floor(this.absCursorPosition.x),
|
|
|
|
Y: Math.floor(this.absCursorPosition.y)
|
|
|
|
}
|
2017-04-29 12:43:50 +00:00
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export default CursorSyncer;
|