mirror of
https://github.com/sbrl/Nibriboard.git
synced 2018-01-10 21:33:49 +00:00
[client] Start adding line simplification support, but we're going to have to update the msbuild config I think.
This commit is contained in:
parent
b135dee0c2
commit
d0b0b7c775
3 changed files with 38 additions and 5 deletions
|
@ -5,6 +5,7 @@ import Vector from './Utilities/Vector';
|
||||||
import Mouse from './Utilities/Mouse';
|
import Mouse from './Utilities/Mouse';
|
||||||
|
|
||||||
var cuid = require("cuid");
|
var cuid = require("cuid");
|
||||||
|
var simplify_line = require("visvalingam-simplifier").simplify_line;
|
||||||
|
|
||||||
class Pencil
|
class Pencil
|
||||||
{
|
{
|
||||||
|
@ -40,6 +41,9 @@ class Pencil
|
||||||
this.currentLineId = cuid();
|
this.currentLineId = cuid();
|
||||||
/** Holds the (unsimplified) line segments before the pencil is lifted. */
|
/** Holds the (unsimplified) line segments before the pencil is lifted. */
|
||||||
this.currentLineSegments = [];
|
this.currentLineSegments = [];
|
||||||
|
/** Holds the (simplified) line segment befoer the pencil is lifted. */
|
||||||
|
this.currentSimplifiedLineSegments = [];
|
||||||
|
|
||||||
// The segments of the (unsimplified) line that haven't yet been sent
|
// The segments of the (unsimplified) line that haven't yet been sent
|
||||||
// to the server.
|
// to the server.
|
||||||
this.unsentSegments = [];
|
this.unsentSegments = [];
|
||||||
|
@ -120,6 +124,8 @@ class Pencil
|
||||||
this.unsentSegments.push(nextPoint);
|
this.unsentSegments.push(nextPoint);
|
||||||
this.currentLineSegments.push(nextPoint);
|
this.currentLineSegments.push(nextPoint);
|
||||||
|
|
||||||
|
this.recalculateSimplifiedLine();
|
||||||
|
|
||||||
var timeSinceLastPush = new Date() - this.lastServerPush;
|
var timeSinceLastPush = new Date() - this.lastServerPush;
|
||||||
if(timeSinceLastPush > this.pushDelay)
|
if(timeSinceLastPush > this.pushDelay)
|
||||||
this.sendUnsent();
|
this.sendUnsent();
|
||||||
|
@ -144,6 +150,7 @@ class Pencil
|
||||||
|
|
||||||
// Reset the current line segments
|
// Reset the current line segments
|
||||||
this.currentLineSegments = [];
|
this.currentLineSegments = [];
|
||||||
|
this.currentSimplifiedLineSegments = [];
|
||||||
// Regenerate the line id
|
// Regenerate the line id
|
||||||
this.currentLineId = cuid();
|
this.currentLineId = cuid();
|
||||||
}
|
}
|
||||||
|
@ -169,21 +176,29 @@ class Pencil
|
||||||
this.lastServerPush = +new Date();
|
this.lastServerPush = +new Date();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Recalculates the simplified line points array.
|
||||||
|
*/
|
||||||
|
recalculateSimplifiedLine()
|
||||||
|
{
|
||||||
|
this.currentSimplifiedLineSegments = simplify_line(this.currentLineSegments);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Renders the line that is currently being drawn to the screen.
|
* Renders the line that is currently being drawn to the screen.
|
||||||
* @param {HTMLCanvasElement} canvas The canvas to draw to.
|
* @param {HTMLCanvasElement} canvas The canvas to draw to.
|
||||||
* @param {CanvasRenderingContext2D} context The rendering context to use to draw to the canvas.
|
* @param {CanvasRenderingContext2D} context The rendering context to use to draw to the canvas.
|
||||||
*/
|
*/
|
||||||
render(canvas, context) {
|
render(canvas, context) {
|
||||||
if(this.currentLineSegments.length == 0)
|
if(this.currentSimplifiedLineSegments.length == 0)
|
||||||
return;
|
return;
|
||||||
|
|
||||||
context.save();
|
context.save();
|
||||||
|
|
||||||
context.beginPath();
|
context.beginPath();
|
||||||
context.moveTo(this.currentLineSegments[0].x, this.currentLineSegments[0].y);
|
context.moveTo(this.currentSimplifiedLineSegments[0].x, this.currentSimplifiedLineSegments[0].y);
|
||||||
for(let i = 1; i < this.currentLineSegments.length; i++) {
|
for(let i = 1; i < this.currentSimplifiedLineSegments.length; i++) {
|
||||||
context.lineTo(this.currentLineSegments[i].x, this.currentLineSegments[i].y);
|
context.lineTo(this.currentSimplifiedLineSegments[i].x, this.currentSimplifiedLineSegments[i].y);
|
||||||
}
|
}
|
||||||
|
|
||||||
context.lineWidth = this.currentLineWidth;
|
context.lineWidth = this.currentLineWidth;
|
||||||
|
|
17
Nibriboard/ClientFiles/package-lock.json
generated
17
Nibriboard/ClientFiles/package-lock.json
generated
|
@ -83,6 +83,11 @@
|
||||||
"resolved": "https://registry.npmjs.org/dprop/-/dprop-1.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/dprop/-/dprop-1.0.0.tgz",
|
||||||
"integrity": "sha1-X0WmCmD6OsHQ9otrQ1gx8v9mVGg="
|
"integrity": "sha1-X0WmCmD6OsHQ9otrQ1gx8v9mVGg="
|
||||||
},
|
},
|
||||||
|
"es6-event-emitter": {
|
||||||
|
"version": "1.10.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/es6-event-emitter/-/es6-event-emitter-1.10.2.tgz",
|
||||||
|
"integrity": "sha1-j3a4tlj4HnJcIFDPGQleBUinSyk="
|
||||||
|
},
|
||||||
"esprima": {
|
"esprima": {
|
||||||
"version": "3.1.3",
|
"version": "3.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/esprima/-/esprima-3.1.3.tgz",
|
||||||
|
@ -146,6 +151,9 @@
|
||||||
"resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
|
"resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
|
||||||
"integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
|
"integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
|
||||||
},
|
},
|
||||||
|
"keycodes": {
|
||||||
|
"version": "github:sbrl/keycodes#2effbae493dc5aa4028fd8d04738c54345f60ffc"
|
||||||
|
},
|
||||||
"mouse-event-offset": {
|
"mouse-event-offset": {
|
||||||
"version": "3.0.2",
|
"version": "3.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/mouse-event-offset/-/mouse-event-offset-3.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/mouse-event-offset/-/mouse-event-offset-3.0.2.tgz",
|
||||||
|
@ -355,6 +363,15 @@
|
||||||
"integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
|
"integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"visvalingam-simplifier": {
|
||||||
|
"version": "0.1.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/visvalingam-simplifier/-/visvalingam-simplifier-0.1.3.tgz",
|
||||||
|
"integrity": "sha512-OB9e+m6RB+W7Gjdp3AoOP7QNuc1tgCMvaHaM4RXAsLuFCd6uPTSTWOb9hlMmIZxzC3ic0YyeV1cmnyfEX+s8UA==",
|
||||||
|
"requires": {
|
||||||
|
"es6-event-emitter": "1.10.2",
|
||||||
|
"keycodes": "github:sbrl/keycodes#2effbae493dc5aa4028fd8d04738c54345f60ffc"
|
||||||
|
}
|
||||||
|
},
|
||||||
"xtend": {
|
"xtend": {
|
||||||
"version": "4.0.1",
|
"version": "4.0.1",
|
||||||
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.1.tgz",
|
||||||
|
|
|
@ -10,8 +10,9 @@
|
||||||
"event-emitter-es6": "^1.1.5",
|
"event-emitter-es6": "^1.1.5",
|
||||||
"favicon-notification": "^0.1.4",
|
"favicon-notification": "^0.1.4",
|
||||||
"fps-indicator": "^1.0.2",
|
"fps-indicator": "^1.0.2",
|
||||||
|
"keycode": "^2.1.8",
|
||||||
"pan-zoom": "^2.0.0",
|
"pan-zoom": "^2.0.0",
|
||||||
"keycode": "^2.1.8"
|
"visvalingam-simplifier": "^0.1.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"acorn": "^4.0.11",
|
"acorn": "^4.0.11",
|
||||||
|
|
Loading…
Reference in a new issue