esiur/esiur-dotnet
2
0
Fork 0
mirror of https://github.com/esiur/esiur-dotnet.git synced 2025-06-26 21:13:13 +00:00
Code Issues Projects Releases Wiki Activity

touch

Browse Source
This commit is contained in:
Ahmed Zamil
2024-06-13 19:25:59 +03:00
parent 10fd719902
commit 41bd0591e3
3 changed files with 34 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
Esiur.Examples.StandaloneWebServerDemo/Web/js/app.js
View File

@ -49,13 +49,22 @@ async function init() {
colorId = document.querySelector('input[name="color"]:checked').value;
}, false);
canvas.addEventListener("touchstart", (e) => {
drawing = true;
colorId = document.querySelector('input[name="color"]:checked').value;
});
canvas.addEventListener("mouseup", function (e) {
drawing = false;
}, false);
canvas.addEventListener("mousemove", function (e) {
//console.log(e);
canvas.addEventListener("touchend", function (e) {
drawing = false;
}, false);
canvas.addEventListener("mousemove", function (e) {
var rect = canvas.getBoundingClientRect();
let x = e.clientX - rect.left;
@ -68,10 +77,27 @@ async function init() {
ctx.arc(x, y, 4, 0, 2 * Math.PI);
ctx.fill();
demo.Draw(x / 4, y / 4, colorId);
//ctx.fillRect(x, y, 10, 10);
}
});
canvas.addEventListener("touchmove", function (e) {
var rect = canvas.getBoundingClientRect();
let x = e.touches[0].clientX - rect.left;
let y = e.touches[0].clientY - rect.top;
if (drawing) {
ctx.fillStyle = colors[colorId];
ctx.beginPath();
ctx.arc(x, y, 4, 0, 2 * Math.PI);
ctx.fill();
demo.Draw(x / 4, y / 4, colorId);
}
});
demo.on("Drawn", (pt) => {
ctx.fillStyle = colors[pt.Color];
ctx.beginPath();