IWMBrowser/iwmlib
IWMBrowser
/
iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Added lineWidth support.

This commit is contained in:
Uwe Oestermeier 2020-02-17 16:18:55 +01:00
parent 54b685ab42
commit b068fd176f
2 changed files with 30 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
dist/iwmlib.pixi.js vendored
View File

@ -14607,7 +14607,9 @@
backgroundFill = 0xffffff,
colorAlpha = 1,
captureEvents = true,
acceptMouseEvents = true
acceptMouseEvents = true,
lineWidth = 16,
minStrokeLength = 4
} = {}) {
super();
this.activePointers = 0;
@ -14626,7 +14628,8 @@
this.undoCommandStack = [];
this.strokes = [];
this.stroke = [];
this.minStrokeLength = 4;
this.lineWidth = lineWidth;
this.minStrokeLength = minStrokeLength;
if (captureEvents) this.registerEventHandler(acceptMouseEvents);
this.drawBackground();
}
@ -14800,7 +14803,8 @@
pressure: event.pressure || null,
tiltX: this.tiltX,
tiltY: this.tiltY,
color: this.color
color: this.color,
lineWidth: this.tiltToLineWidth(this.tiltY)
};
return desc
}
@ -14824,7 +14828,7 @@
}
tiltToLineWidth(value) {
return 16 //Math.round(Math.abs(value / 10) + 1)
return this.lineWidth * Math.round(Math.abs(value / 10) + 1)
}
drawStroke(stroke) {
@ -14832,11 +14836,11 @@
let start = stroke[0];
this.beginFill(0, 0);
this.moveTo(start.x, start.y);
let lineWidth = this.tiltToLineWidth(start.tiltY);
let lineWidth = start.lineWidth;
this.lineStyle(lineWidth, start.color, this.colorAlpha);
for (let i = 1; i < stroke.length; i++) {
let info = stroke[i];
let lw = this.tiltToLineWidth(info.tiltY);
let lw = info.lineWidth;
if (lw != lineWidth) {
lineWidth = lw;
this.lineStyle(lineWidth, info.color, this.colorAlpha);
@ -14855,7 +14859,7 @@
drawStrokes() {
this.drawBackground();
this.lineStyle(1.0, 0xff0000, 1);
this.lineStyle(this.lineWidth, 0xff0000, 1);
for (let stroke of this.iterStrokes()) {
this.drawStroke(stroke);
}
@ -14883,17 +14887,17 @@
}
normalizeInfo(info) {
let { x, y, pressure, tiltX, tiltY, color } = info;
let { x, y, pressure, tiltX, tiltY, color, lineWidth } = info;
x /= this.wantedWidth;
y /= this.wantedHeight;
return { x, y, pressure, tiltX, tiltY, color }
return { x, y, pressure, tiltX, tiltY, color, lineWidth }
}
denormalizeInfo(info) {
let { x, y, pressure, tiltX, tiltY, color } = info;
let { x, y, pressure, tiltX, tiltY, color, lineWidth } = info;
x = x * this.wantedWidth;
y = y * this.wantedHeight;
return { x, y, pressure, tiltX, tiltY, color }
return { x, y, pressure, tiltX, tiltY, color, lineWidth }
}
// Convert strokes into an object that can be stored in an Indexed DB.

26
lib/pixi/stylus.js
View File

@ -80,7 +80,9 @@ export default class Stylus extends PIXI.Graphics {
backgroundFill = 0xffffff,
colorAlpha = 1,
captureEvents = true,
acceptMouseEvents = true
acceptMouseEvents = true,
lineWidth = 16,
minStrokeLength = 4
} = {}) {
super()
this.activePointers = 0
@ -99,7 +101,8 @@ export default class Stylus extends PIXI.Graphics {
this.undoCommandStack = []
this.strokes = []
this.stroke = []
this.minStrokeLength = 4
this.lineWidth = lineWidth
this.minStrokeLength = minStrokeLength
if (captureEvents) this.registerEventHandler(acceptMouseEvents)
this.drawBackground()
}
@ -273,7 +276,8 @@ export default class Stylus extends PIXI.Graphics {
pressure: event.pressure || null,
tiltX: this.tiltX,
tiltY: this.tiltY,
color: this.color
color: this.color,
lineWidth: this.tiltToLineWidth(this.tiltY)
}
return desc
}
@ -297,7 +301,7 @@ export default class Stylus extends PIXI.Graphics {
}
tiltToLineWidth(value) {
return 16 //Math.round(Math.abs(value / 10) + 1)
return this.lineWidth * Math.round(Math.abs(value / 10) + 1)
}
drawStroke(stroke) {
@ -305,11 +309,11 @@ export default class Stylus extends PIXI.Graphics {
let start = stroke[0]
this.beginFill(0, 0)
this.moveTo(start.x, start.y)
let lineWidth = this.tiltToLineWidth(start.tiltY)
let lineWidth = start.lineWidth
this.lineStyle(lineWidth, start.color, this.colorAlpha)
for (let i = 1; i < stroke.length; i++) {
let info = stroke[i]
let lw = this.tiltToLineWidth(info.tiltY)
let lw = info.lineWidth
if (lw != lineWidth) {
lineWidth = lw
this.lineStyle(lineWidth, info.color, this.colorAlpha)
@ -328,7 +332,7 @@ export default class Stylus extends PIXI.Graphics {
drawStrokes() {
this.drawBackground()
this.lineStyle(1.0, 0xff0000, 1)
this.lineStyle(this.lineWidth, 0xff0000, 1)
for (let stroke of this.iterStrokes()) {
this.drawStroke(stroke)
}
@ -356,17 +360,17 @@ export default class Stylus extends PIXI.Graphics {
}
normalizeInfo(info) {
let { x, y, pressure, tiltX, tiltY, color } = info
let { x, y, pressure, tiltX, tiltY, color, lineWidth } = info
x /= this.wantedWidth
y /= this.wantedHeight
return { x, y, pressure, tiltX, tiltY, color }
return { x, y, pressure, tiltX, tiltY, color, lineWidth }
}
denormalizeInfo(info) {
let { x, y, pressure, tiltX, tiltY, color } = info
let { x, y, pressure, tiltX, tiltY, color, lineWidth } = info
x = x * this.wantedWidth
y = y * this.wantedHeight
return { x, y, pressure, tiltX, tiltY, color }
return { x, y, pressure, tiltX, tiltY, color, lineWidth }
}
// Convert strokes into an object that can be stored in an Indexed DB.