draw on screen

This commit is contained in:
waltem01 2022-08-07 15:32:04 +02:00
parent 096aa780f3
commit 7aa1dc90cd

View File

@ -98,7 +98,7 @@
pixelColor[2] = parseInt((formData.get('b') as string) ?? '255'); pixelColor[2] = parseInt((formData.get('b') as string) ?? '255');
} }
function setColor(event: MouseEvent) { async function setMousePixel(event: MouseEvent) {
if (!mousePressed) return; if (!mousePressed) return;
const parent = event.target as HTMLTableCellElement; const parent = event.target as HTMLTableCellElement;
@ -106,6 +106,18 @@
const y = parseInt(parent.parentElement?.dataset.y ?? '0'); const y = parseInt(parent.parentElement?.dataset.y ?? '0');
matrix[y][x].color = colorToHex(); matrix[y][x].color = colorToHex();
const fdata = new FormData();
fdata.append('x', x.toString());
fdata.append('y', y.toString());
const response = await fetch('http://localhost:8080/pixel', {
method: 'POST',
mode: 'cors',
body: fdata
});
const mdata = (await response.json()) as MatrixResponse;
if (!mdata.success) alert("Error while processing 'pixel'!");
} }
function colorToHex(): string { function colorToHex(): string {
@ -364,7 +376,7 @@
min="0" min="0"
max="191" max="191"
step="1" step="1"
value="0" value="8"
required required
/> />
<label class="border-2 border-black border-r-0 pl-1" for="ty">Y:</label> <label class="border-2 border-black border-r-0 pl-1" for="ty">Y:</label>
@ -376,7 +388,7 @@
min="0" min="0"
max="191" max="191"
step="1" step="1"
value="0" value="9"
required required
/><label class="border-2 border-black border-r-0 pl-1" for="tin">Input:</label> /><label class="border-2 border-black border-r-0 pl-1" for="tin">Input:</label>
<input <input
@ -410,7 +422,7 @@
data-x={cell.xIndex} data-x={cell.xIndex}
class="p-0.75" class="p-0.75"
style="background-color: #{cell.color}" style="background-color: #{cell.color}"
on:mouseenter={setColor} on:mouseenter={setMousePixel}
/> />
{/each} {/each}
</tr> </tr>