ChK/appRobotControlScara
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

CSS anpassen

Browse Source
This commit is contained in:
chk
2026-03-10 08:45:00 +01:00
parent d6743f7669
commit 20e2790552
4 changed files with 25 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
pythonExample/example.py
View File

@@ -2,7 +2,7 @@ import websocket
import json import json
ws = websocket.WebSocket() ws = websocket.WebSocket()
ws.connect("wss://server:3000") ws.connect("wss://localhost:3000")
ws.send(json.dumps({ ws.send(json.dumps({
"type":"jog", "type":"jog",

2
server/config/config.js
View File

@@ -6,6 +6,6 @@ module.exports = {
}, },
server: { server: {
port: Number(process.env.PORT) || 3000 port: Number(process.env.PORT) || 10000
} }
}; };

1
server/server.js
View File

@@ -37,6 +37,7 @@ wss.on("connection", (ws) => {
try { try {
const data = JSON.parse(msg); const data = JSON.parse(msg);
console.log("Message from WSS: " + msg);
if (data.type === "jog") { if (data.type === "jog") {
fluid.jog(data.axis, data.value); fluid.jog(data.axis, data.value);
} }

36
web/index.html
View File

@@ -5,7 +5,7 @@
<title>SCARA Robot Control</title> <title>SCARA Robot Control</title>
<style> <style>
body { body {
background: #202020; background: #234;
color: #e0e0e0; color: #e0e0e0;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
text-align: center; text-align: center;
@@ -14,12 +14,16 @@
h1 { h1 {
margin-top: 20px; margin-top: 20px;
} }
h2{
margin-top: 40px;
}
#posBox { #posBox {
margin: 20px auto; margin: 20px auto;
width: 406px; width: 406px;
padding: 15px; padding: 15px;
background: #333; background: #356;
border-radius: 10px; border-radius: 10px;
font-size: 20px; font-size: 20px;
} }
@@ -33,12 +37,12 @@
} }
button { button {
background: #444; background: #478;
border: none; border: none;
padding: 15px; padding: 15px;
font-size: 18px; font-size: 18px;
color: white; color: white;
border-radius: 8px; border-radius: 5px;
cursor: pointer; cursor: pointer;
} }
@@ -46,6 +50,10 @@
background: #666; background: #666;
} }
.noMouseHover:hover{
background: #478;
}
.gcodeRow { .gcodeRow {
display: inline-flex; display: inline-flex;
@@ -55,20 +63,20 @@
} }
.controlInput { .controlInput {
height: 48px; /* gleiche Höhe wie Button */ height: 48px;
font-size: 18px; font-size: 18px;
padding: 0 10px; /* vertikal 0, dadurch exakte Höhe */ padding: 0 10px;
box-sizing: border-box; box-sizing: border-box;
border-radius: 8px; border-radius: 8px;
border: 1px solid #555; border: 1px solid #555;
background: #fff; background: #fff;
color: #000; color: #000;
min-width: 260px; /* optional: Breite ähnlich wie vorher */ min-width: 260px;
} }
.controlButton { .controlButton {
height: 48px; /* gleiche Höhe wie Input */ height: 48px;
padding: 0 18px; /* vertikal 0, zentriert via flex */ padding: 0 18px;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -91,18 +99,17 @@
<div class="btnGrid"> <div class="btnGrid">
<button onclick="jog('X', -10)">X -10</button> <button onclick="jog('X', -10)">X -10</button>
<button onclick="jog('X', -1)">X -1</button> <button onclick="jog('X', -1)">X -1</button>
<button></button> <button class="noMouseHover"></button>
<button onclick="jog('X', 1)">X +1</button> <button onclick="jog('X', 1)">X +1</button>
<button onclick="jog('X', 10)">X +10</button> <button onclick="jog('X', 10)">X +10</button>
<button onclick="jog('Z', -10)">Z -10</button> <button onclick="jog('Z', -10)">Z -10</button>
<button onclick="jog('Z', -1)">Z -1</button> <button onclick="jog('Z', -1)">Z -1</button>
<button></button> <button class="noMouseHover"></button>
<button onclick="jog('Z', 1)">Z +1</button> <button onclick="jog('Z', 1)">Z +1</button>
<button onclick="jog('Z', 10)">Z +10</button> <button onclick="jog('Z', 10)">Z +10</button>
</div> </div>
<h2>G‑Code Eingabe</h2> <h2>G‑Code Eingabe</h2>
<div class="gcodeRow"> <div class="gcodeRow">
<input id="gcodeInput" class="controlInput" type="text" <input id="gcodeInput" class="controlInput" type="text"
@@ -121,6 +128,7 @@
let ws; let ws;
function connectWS() { function connectWS() {
console.log("Try to connect to " + "wss://" + window.location.hostname + ":" + window.location.port);
ws = new WebSocket("wss://" + window.location.hostname + ":" + window.location.port); ws = new WebSocket("wss://" + window.location.hostname + ":" + window.location.port);
ws.onopen = () => { ws.onopen = () => {
@@ -202,12 +210,12 @@
function sendGcodeFeld() { function sendGcodeFeld() {
const el = document.getElementById("gcodeInput"); // ← neu const el = document.getElementById("gcodeInput");
const cmd = el.value.trim(); const cmd = el.value.trim();
sendGcode("G90"); sendGcode("G90");
sendGcode(cmd); sendGcode(cmd);
el.value = ""; // ← neu el.value = "";
el.focus(); el.focus();
} }