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

[client] Finish refacotring the brush indicator with weird ellipse stuff :P

This commit is contained in:
Starbeamrainbowlabs 2017-10-29 11:29:40 +00:00
parent 1498626823
commit 11c201e882
6 changed files with 17 additions and 21 deletions

View file

@ -103,10 +103,10 @@ class BoardWindow extends EventEmitter
this.interface.seekColour("forwards");
}).bind(this));
this.keyboard.on("keyup-up", (function(event) {
this.interface.updateBrushWidth(this.interface.currentBrushWidth + 2, true);
this.interface.updateBrushWidth(this.interface.brushIndicator.width + 2, true);
}).bind(this));
this.keyboard.on("keyup-down", (function(event) {
this.interface.updateBrushWidth(this.interface.currentBrushWidth - 2, true);
this.interface.updateBrushWidth(this.interface.brushIndicator.width - 2, true);
}).bind(this));
this.keyboard.on("keyup-c", (function(event) {
this.chunkCache.showRenderedChunks = !this.chunkCache.showRenderedChunks;

View file

@ -7,6 +7,8 @@ class BrushIndicator
this.canvas = canvas;
this.context = canvas.getContext("2d");
this.canvas.height = this.canvas.width = 48;
this.width = 10;
this.colour = "red";
}
@ -19,11 +21,10 @@ class BrushIndicator
);
this.context.beginPath();
this.context.arc(
this.context.ellipse(
this.canvas.width / 2, this.canvas.height / 2,
this.width / 2,
0, Math.PI * 2,
false
this.width / 3, this.width / 3,
0, 0, Math.PI * 2, false
);
this.context.fillStyle = this.colour;
this.context.fill();

View file

@ -2,6 +2,8 @@
window.EventEmitter = require("event-emitter-es6");
import BrushIndicator from './BrushIndicator.js';
class Interface extends EventEmitter
{
constructor(inBoardWindow, inSidebar, inDebugDisplay)

View file

@ -74,22 +74,15 @@ hr
.brush-settings
{
display: flex; flex-direction: column;
display: flex; flex-direction: row;
min-height: 5em;
}
.brush-preview-display
.brush-indicator { flex: 0; }
.brush-width-controls
{
flex: 1;
}
.brush-indicator
{
position: relative;
top: 50%; left: 50%; transform: translate(-50%, -50%);
margin: 1em 0 0 0;
border-radius: 50%;
flex: 3;
margin-top: 2em;
}
.tool-selector

View file

@ -70,7 +70,7 @@ class Pencil
}).bind(this))
// Look up the initial line with in the interface
this.currentLineWidth = inInterface.currentBrushWidth;
this.currentLineWidth = inInterface.brushIndicator.width;
// Listen for future updates fromt he interface
inInterface.on("brushwidthchange", (function(event) {
this.currentLineWidth = event.newWidth;

@ -1 +1 @@
Subproject commit 62f67e924c652d84956ed2bbf87588fd5ae963a9
Subproject commit 1e7878c76032ab87bbf2829c8be2f43ff85f5660