1
0
Fork 0
mirror of https://github.com/sbrl/Nibriboard.git synced 2018-01-10 21:33:49 +00:00

Implement more of the pencil

This commit is contained in:
Starbeamrainbowlabs 2017-04-14 20:22:01 +01:00
parent be15bf85cb
commit 89b576260f
3 changed files with 93 additions and 3 deletions

View file

@ -0,0 +1,30 @@
{
"ecmaVersion": "7",
"libs": [
"browser"
],
"loadEagerly": [
"*.js",
"Utilities/*.js"
],
"dontLoad": [
"node_module/**",
"NibriClient.js"
],
"plugins": {
"doc_comment": true,
"node_resolve": {},
"modules": {
"dontLoad": "",
"load": "",
"modules": ""
},
"es_modules": {},
"requirejs": {
"baseURL": "",
"paths": "",
"override": ""
},
"commonjs": {}
}
}

View file

@ -212,7 +212,10 @@ class BoardWindow extends EventEmitter
* dragging and zooming of the whiteboard. * dragging and zooming of the whiteboard.
*/ */
handleCanvasMovement(event) { handleCanvasMovement(event) {
this.viewportState = event; // Store the viewport information for later // Store the viewport information for later
this.viewportState = event;
// Re-emit the movement information for interested parties
this.emit("movement", event);
} }
handleHandshakeResponse(message) { handleHandshakeResponse(message) {

View file

@ -1,6 +1,9 @@
"use strict"; "use strict";
import Mouse from './Mouse'; import Mouse from './Utilities/Mouse';
import Vector from './Utilities/Vector';
var cuid = require("cuid");
class Pencil class Pencil
{ {
@ -9,8 +12,15 @@ class Pencil
* @param {RippleLink} inRippleLink The connection to the nibri server. * @param {RippleLink} inRippleLink The connection to the nibri server.
* @return {Pencil} A new Pencil class instance. * @return {Pencil} A new Pencil class instance.
*/ */
constructor(inRippleLink) constructor(inRippleLink, inBoardWindow)
{ {
// The time, in milliseconds, between pushes of the line to the server.
this.pushDelay = 200;
/**
* The ripple link connection to the server.
* @type {RippleLink}
*/
this.rippleLink = inRippleLink; this.rippleLink = inRippleLink;
/** /**
* The mouse information. * The mouse information.
@ -18,12 +28,59 @@ class Pencil
*/ */
this.mouse = new Mouse(); this.mouse = new Mouse();
// The id of the current line-in-progress.
this.currentLineId = cuid();
// Holds the (unsimplified) line segments before the pencil is lifted.
this.currentLineSegments = [];
// The segments of the (unsimplified) line that haven't yet been sent
// to the server.
this.unsentSegments = [];
// The time of the last push of the line to the server.
this.lastServerPush = 0;
document.addEventListener("mouseDown", this.handleMouseDown.bind(this));
document.addEventListener("mouseMove", this.handleMouseMove.bind(this)); document.addEventListener("mouseMove", this.handleMouseMove.bind(this));
document.addEventListener("mouseUp", this.handleMouseUp.bind(this));
}
handleMouseDown(event) {
} }
handleMouseMove(event) { handleMouseMove(event) {
var nextPoint = new Vector(event.clientX, event.clientY);
this.unsentSegments.push(nextPoint);
this.currentLineSegments.push(nextPoint);
if(new Date() - this.lastServerPush > this.pushDelay)
sendUnsent();
}
handleMouseUp(event) {
sendUnsent();
// Reset the currently line segments
this.currentLineSegments = [];
// Regenerate the line id
this.currentLineId = cuid();
}
/**
* Send the unsent segments of the line to the server and reset the line
* unsent segments buffer.
*/
sendUnsent() {
// It's time for another push of the line to the server
this.rippleLink.send({
Event: "LinePart",
Points: this.unsentSegments,
LineId: this.currentLineId
});
// Reset the unsent segments buffer
this.unsentSegments = [];
}
render(canvas, context) {
} }
} }