jeffemmett
/
folk-canvas
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

spreadsheet projection thing

This commit is contained in:
“chrisshank” 2024-12-12 19:42:02 -08:00
parent d2feab9e04
commit 6e937ca630
2 changed files with 24 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/folk-space-projector.ts
View File

@ -15,8 +15,8 @@ export class FolkSpaceProjector extends FolkBaseSet {
css` css`
folk-spreadsheet { folk-spreadsheet {
position: absolute; position: absolute;
bottom: 5px; bottom: 15px;
right: 5px; right: 15px;
pointer-events: auto; pointer-events: auto;
box-shadow: 0px 3px 5px 0px rgba(173, 168, 168, 0.6); box-shadow: 0px 3px 5px 0px rgba(173, 168, 168, 0.6);
} }
@ -50,10 +50,10 @@ export class FolkSpaceProjector extends FolkBaseSet {
#lock = false; #lock = false;
#onPropagate = (event: Event) => { #onPropagate = (event: Event) => {
if (this.#lock) return;
const cell = event.target as FolkSpreadSheetCell; const cell = event.target as FolkSpreadSheetCell;
if (this.#lock && cell.dependencies.length === 0) return;
const shape = this.sourceElements const shape = this.sourceElements
.values() .values()
.drop(cell.row - 1) .drop(cell.row - 1)
@ -147,17 +147,17 @@ export class FolkSpaceProjector extends FolkBaseSet {
if (rect instanceof DOMRectTransform) { if (rect instanceof DOMRectTransform) {
const { x, y } = rect.toParentSpace(rect.topLeft); const { x, y } = rect.toParentSpace(rect.topLeft);
this.#spreadsheet.getCell('A', row)!.expression = Math.round(x); updateCell(this.#spreadsheet.getCell('A', row)!, x);
this.#spreadsheet.getCell('B', row)!.expression = Math.round(y); updateCell(this.#spreadsheet.getCell('B', row)!, y);
this.#spreadsheet.getCell('C', row)!.expression = Math.round(rect.width); updateCell(this.#spreadsheet.getCell('C', row)!, rect.width);
this.#spreadsheet.getCell('D', row)!.expression = Math.round(rect.height); updateCell(this.#spreadsheet.getCell('D', row)!, rect.height);
this.#spreadsheet.getCell('E', row)!.expression = Math.round((rect.rotation * 180) / Math.PI); updateCell(this.#spreadsheet.getCell('E', row)!, (rect.rotation * 180) / Math.PI);
} else { } else {
this.#spreadsheet.getCell('A', row)!.expression = Math.round(rect.x); updateCell(this.#spreadsheet.getCell('A', row)!, rect.x);
this.#spreadsheet.getCell('B', row)!.expression = Math.round(rect.y); updateCell(this.#spreadsheet.getCell('B', row)!, rect.y);
this.#spreadsheet.getCell('C', row)!.expression = Math.round(rect.width); updateCell(this.#spreadsheet.getCell('C', row)!, rect.width);
this.#spreadsheet.getCell('D', row)!.expression = Math.round(rect.height); updateCell(this.#spreadsheet.getCell('D', row)!, rect.height);
this.#spreadsheet.getCell('E', row)!.expression = 0; updateCell(this.#spreadsheet.getCell('E', row)!, 0);
} }
row += 1; row += 1;
} }
@ -167,3 +167,9 @@ export class FolkSpaceProjector extends FolkBaseSet {
}); });
} }
} }
function updateCell(cell: FolkSpreadSheetCell, expression: number) {
if (cell.dependencies.length) return;
cell.expression = Math.round(expression);
}

5
src/folk-spreadsheet.ts
View File

@ -450,11 +450,14 @@ export class FolkSpreadSheetCell extends HTMLElement {
#function = new Function(); #function = new Function();
get expression() { get expression(): string {
return this.#expression; return this.#expression;
} }
set expression(expression: any) { set expression(expression: any) {
expression = String(expression).trim(); expression = String(expression).trim();
if (expression === this.#expression) return;
this.#expression = expression; this.#expression = expression;
this.#dependencies.forEach((dep) => dep.removeEventListener('propagate', this)); this.#dependencies.forEach((dep) => dep.removeEventListener('propagate', this));