@tldraw/editor
Version:
tldraw infinite canvas SDK (editor).
171 lines (170 loc) • 5.26 kB
JavaScript
;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var ScribbleManager_exports = {};
__export(ScribbleManager_exports, {
ScribbleManager: () => ScribbleManager
});
module.exports = __toCommonJS(ScribbleManager_exports);
var import_utils = require("@tldraw/utils");
var import_Vec = require("../../../primitives/Vec");
class ScribbleManager {
constructor(editor) {
this.editor = editor;
}
scribbleItems = /* @__PURE__ */ new Map();
state = "paused";
addScribble(scribble, id = (0, import_utils.uniqueId)()) {
const item = {
id,
scribble: {
id,
size: 20,
color: "accent",
opacity: 0.8,
delay: 0,
points: [],
shrink: 0.1,
taper: true,
...scribble,
state: "starting"
},
timeoutMs: 0,
delayRemaining: scribble.delay ?? 0,
prev: null,
next: null
};
this.scribbleItems.set(id, item);
return item;
}
reset() {
this.editor.updateInstanceState({ scribbles: [] });
this.scribbleItems.clear();
}
/**
* Start stopping the scribble. The scribble won't be removed until its last point is cleared.
*
* @public
*/
stop(id) {
const item = this.scribbleItems.get(id);
if (!item) throw Error(`Scribble with id ${id} not found`);
item.delayRemaining = Math.min(item.delayRemaining, 200);
item.scribble.state = "stopping";
return item;
}
/**
* Set the scribble's next point.
*
* @param id - The id of the scribble to add a point to.
* @param x - The x coordinate of the point.
* @param y - The y coordinate of the point.
* @param z - The z coordinate of the point.
* @public
*/
addPoint(id, x, y, z = 0.5) {
const item = this.scribbleItems.get(id);
if (!item) throw Error(`Scribble with id ${id} not found`);
const { prev } = item;
const point = { x, y, z };
if (!prev || import_Vec.Vec.Dist(prev, point) >= 1) {
item.next = point;
}
return item;
}
/**
* Update on each animation frame.
*
* @param elapsed - The number of milliseconds since the last tick.
* @public
*/
tick(elapsed) {
if (this.scribbleItems.size === 0) return;
this.editor.run(() => {
this.scribbleItems.forEach((item) => {
if (item.scribble.state === "starting") {
const { next: next2, prev: prev2 } = item;
if (next2 && next2 !== prev2) {
item.prev = next2;
item.scribble.points.push(next2);
}
if (item.scribble.points.length > 8) {
item.scribble.state = "active";
}
return;
}
if (item.delayRemaining > 0) {
item.delayRemaining = Math.max(0, item.delayRemaining - elapsed);
}
item.timeoutMs += elapsed;
if (item.timeoutMs >= 16) {
item.timeoutMs = 0;
}
const { delayRemaining, timeoutMs, prev, next, scribble } = item;
switch (scribble.state) {
case "active": {
if (next && next !== prev) {
item.prev = next;
scribble.points.push(next);
if (delayRemaining === 0) {
if (scribble.points.length > 8) {
scribble.points.shift();
}
}
} else {
if (timeoutMs === 0) {
if (scribble.points.length > 1) {
scribble.points.shift();
} else {
item.delayRemaining = scribble.delay;
}
}
}
break;
}
case "stopping": {
if (item.delayRemaining === 0) {
if (timeoutMs === 0) {
if (scribble.points.length === 1) {
this.scribbleItems.delete(item.id);
return;
}
if (scribble.shrink) {
scribble.size = Math.max(1, scribble.size * (1 - scribble.shrink));
}
scribble.points.shift();
}
}
break;
}
case "paused": {
break;
}
}
});
this.editor.updateInstanceState({
scribbles: Array.from(this.scribbleItems.values()).map(({ scribble }) => ({
...scribble,
points: [...scribble.points]
})).slice(-5)
// limit to three as a minor sanity check
});
});
}
}
//# sourceMappingURL=ScribbleManager.js.map