From e56b51eddcc680ec006339cebb2b87ea4478c337 Mon Sep 17 00:00:00 2001
From: Jake Read <jake.read@cba.mit.edu>
Date: Sun, 9 Sep 2018 14:32:57 -0400
Subject: [PATCH] add state ui style
---
README.md | 15 +++++++--------
client/divtools.js | 22 +++++++++++++++++-----
client/style.css | 11 +++++++++++
3 files changed, 35 insertions(+), 13 deletions(-)
diff --git a/README.md b/README.md
index a8936dd..ec5449d 100644
--- a/README.md
+++ b/README.md
@@ -1,13 +1,12 @@
# Automatakit API
-## what it do
-
-- state variables good,
-- should only change in UI on server ack (so need to write our own ui classes)
- - doesn't even change on ack at the moment
- - let's get to the pnt when we can see a g0 come thru the mode state
-
-- for attaching inputs / outsput to / from with ui and loading etc / have to hold onto inputs / outputs and connections differently? i.e. can send from ui -> server to conn. id to id. but can't read out of server rep. which ids con. to which ids
+## oy
+
+- state variables good
+- final steps before writing gcode consumption program
+ - clear obj | rep | memory | ui structure
+ - event connections at top level ? so that can pass to ui
+ - ui svg's for links, how to draw, when to draw ?
## remember
diff --git a/client/divtools.js b/client/divtools.js
index de2dedd..8593b3a 100644
--- a/client/divtools.js
+++ b/client/divtools.js
@@ -1,9 +1,8 @@
function writeStateRep(container, rep, key){
var variable = rep.state[key]
if(typeof variable == 'string'){
- console.log('STR')
- var div = document.createElement('div')
- div.appendChild(document.createTextNode(key))
+ var li = document.createElement('li')
+ li.appendChild(document.createTextNode(key))
var input = document.createElement('input')
input.type = 'text'
input.size = 24
@@ -12,11 +11,24 @@ function writeStateRep(container, rep, key){
rep.state[key] = input.value
putState(rep)
})
- div.appendChild(input)
- container.appendChild(div)
+ li.appendChild(input)
+ container.appendChild(li)
return input
} else if (typeof variable == 'number'){
console.log('NUM')
+ var li = document.createElement('li')
+ li.appendChild(document.createTextNode(key))
+ var input = document.createElement('input')
+ input.type = 'text'
+ input.size = 24
+ input.value = variable.toString()
+ input.addEventListener('change', function(){
+ rep.state[key] = parseFloat(input.value)
+ putState(rep)
+ })
+ li.appendChild(input)
+ container.appendChild(li)
+ return input
} else {
console.log("unui'd type:", typeof variable)
}
diff --git a/client/style.css b/client/style.css
index 35074a9..b919c3f 100644
--- a/client/style.css
+++ b/client/style.css
@@ -31,6 +31,17 @@ body {
.state {
padding: 0 83px 0 83px;
+ color: #eee;
+}
+
+.state input {
+ background-color: #1a1a1a;
+ color: #fcd17b;
+ font-size: 12px;
+ width: 75%;
+ float: right;
+ border: 1px solid black;
+ border-radius: 2px;
}
.dg.a {
--
GitLab