esiur/esiur-dotnet
2
0
Fork 0
mirror of https://github.com/esiur/esiur-dotnet.git synced 2025-05-06 03:32:57 +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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Esiur.Examples.StandaloneWebServerDemo/Program.cs
View File

@ -20,7 +20,7 @@ internal class Program
// Add your object to the store
var service = await Warehouse.Put("sys/demo", new Demo());
var http = await Warehouse.Put<HTTPServer>("sys/http", new HTTPServer() { Port = 8080 });
var http = await Warehouse.Put<HTTPServer>("sys/http", new HTTPServer() { Port = 8888 });
http.MapGet("{url}", (string url, HTTPConnection sender) =>

5
Esiur.Examples.StandaloneWebServerDemo/Web/css/style.css
View File

@ -7,6 +7,9 @@
html {
font-family: def;
}
body {
overflow: hidden;
}
i-router {
height: 100vh;
@ -31,7 +34,7 @@ i-app {
color: #000000;
background: #e3e3e3;
font-size: 32px;
width: 500px;
width: calc(100% - 50px);
}
canvas {

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();