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

rename

This commit is contained in:
Orion Reed 2024-12-01 05:49:11 -05:00
parent c4a61f8dd8
commit 62454dcd8a
2 changed files with 9 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
demo/distance.html
View File

@ -20,7 +20,7 @@
position: absolute;
}
cell-renderer canvas {
distance-field canvas {
position: absolute;
top: 0;
left: 0;
@ -31,7 +31,7 @@
</style>
</head>
<body>
<cell-renderer resolution="800" image-smoothing="true">
<distance-field>
<fc-geometry x="100" y="100" width="50" height="50"></fc-geometry>
<fc-geometry x="100" y="200" width="50" height="50"></fc-geometry>
<fc-geometry x="100" y="300" width="50" height="50"></fc-geometry>
@ -39,14 +39,14 @@
<fc-geometry x="400" y="250" width="60" height="90"></fc-geometry>
<fc-geometry x="200" y="400" width="100" height="100"></fc-geometry>
<fc-geometry x="500" y="100" width="30" height="70"></fc-geometry>
</cell-renderer>
</distance-field>
<script type="module">
import { FolkGeometry } from '../src/canvas/fc-geometry.ts';
import { CellRenderer } from '../src/distanceField/cellRenderer.ts';
import { DistanceField } from '../src/distanceField/distance-field.ts';
FolkGeometry.define();
CellRenderer.define();
DistanceField.define();
</script>
</body>
</html>

10
src/distanceField/cellRenderer.ts → src/distanceField/distance-field.ts
View File

@ -2,16 +2,14 @@ import type { FolkGeometry } from '../canvas/fc-geometry.ts';
import type { Vector2 } from '../utils/Vector2.ts';
import { Fields } from './fields.ts';
export class CellRenderer extends HTMLElement {
static tagName = 'cell-renderer';
export class DistanceField extends HTMLElement {
static tagName = 'distance-field';
static define() {
customElements.define(this.tagName, this);
}
static observedAttributes = ['resolution', 'image-smoothing'];
private canvas: HTMLCanvasElement;
private canvas!: HTMLCanvasElement;
private ctx: CanvasRenderingContext2D;
private offscreenCtx: CanvasRenderingContext2D;
private fields: Fields;
@ -24,7 +22,7 @@ export class CellRenderer extends HTMLElement {
constructor() {
super();
this.resolution = 2000; // default resolution
this.resolution = 800; // default resolution
this.imageSmoothing = true;
this.fields = new Fields(this.resolution);