From d68dba13bd2672a028ced57c0f9c0d1379369635 Mon Sep 17 00:00:00 2001
From: jamesread <contact@jwread.com>
Date: Sun, 17 Oct 2021 20:58:02 +0100
Subject: [PATCH] Started work on argument form

---
 OliveTin.proto              | 15 +++++++++++++++
 internal/config/config.go   | 13 +++++++++++++
 internal/grpcapi/grpcApi.go |  8 ++++++++
 webui/js/ActionButton.js    | 14 +++++++++++++-
 webui/js/ArgumentForm.js    | 19 +++++++++++++++++++
 webui/style.css             | 10 ++++++++++
 6 files changed, 78 insertions(+), 1 deletion(-)
 create mode 100644 webui/js/ArgumentForm.js

diff --git a/OliveTin.proto b/OliveTin.proto
index 4c59617..f348b45 100644
--- a/OliveTin.proto
+++ b/OliveTin.proto
@@ -9,6 +9,21 @@ message ActionButton {
 	string title = 2;
 	string icon = 3;
 	bool canExec = 4;
+
+	repeated ActionArgument arguments = 5;
+}
+
+message ActionArgument {
+	string variable = 1;
+	string label = 2; 
+	string type = 3;
+
+	repeated ActionArgumentValue values = 4;
+}
+
+message ActionArgumentValue {
+	string value = 1;
+	string label = 2;
 }
 
 message GetButtonsResponse {
diff --git a/internal/config/config.go b/internal/config/config.go
index 12e5afe..12efe2f 100644
--- a/internal/config/config.go
+++ b/internal/config/config.go
@@ -11,6 +11,19 @@ type ActionButton struct {
 	CSS         map[string]string `mapstructure:"omitempty"`
 	Timeout     int
 	Permissions []PermissionsEntry
+	Arguments	[]ActionArgument
+}
+
+type ActionArgument struct {
+	Variable	string
+	Label		string
+	Type		string
+	Values 		[]ActionArgumentValue
+}
+
+type ActionArgumentValue struct {
+	Value		string
+	Label		string
 }
 
 // Entity represents a "thing" that can have multiple actions associated with it.
diff --git a/internal/grpcapi/grpcApi.go b/internal/grpcapi/grpcApi.go
index 22b5096..fa03211 100644
--- a/internal/grpcapi/grpcApi.go
+++ b/internal/grpcapi/grpcApi.go
@@ -61,6 +61,14 @@ func (api *oliveTinAPI) GetButtons(ctx ctx.Context, req *pb.GetButtonsRequest) (
 			CanExec: acl.IsAllowedExec(cfg, user, &action),
 		}
 
+		for _, cfgArg := range action.Arguments {
+			pbArg := pb.ActionArgument {
+				Label: cfgArg.Label,
+			}
+
+			btn.Arguments = append(btn.Arguments, &pbArg)
+		}
+
 		res.Actions = append(res.Actions, &btn)
 	}
 
diff --git a/webui/js/ActionButton.js b/webui/js/ActionButton.js
index b94002e..503b02e 100644
--- a/webui/js/ActionButton.js
+++ b/webui/js/ActionButton.js
@@ -1,4 +1,5 @@
 import { marshalLogsJsonToHtml } from './marshaller.js';
+import "./ArgumentForm.js"
 
 class ActionButton extends window.HTMLButtonElement {
   constructFromJson (json) {
@@ -11,7 +12,18 @@ class ActionButton extends window.HTMLButtonElement {
 
     this.updateFromJson(json)
 
-    this.onclick = () => { this.startAction() }
+    this.onclick = () => { 
+      if (json.arguments.length > 0) {
+        let frm = document.createElement('form', { is: 'argument-form' })
+        window.frm = frm
+        console.log(frm)
+        frm.setup(json, this.startAction)
+
+        document.body.appendChild(frm)
+      } else {
+        this.startAction() 
+      }
+    }
 
     this.constructTemplate()
     
diff --git a/webui/js/ArgumentForm.js b/webui/js/ArgumentForm.js
new file mode 100644
index 0000000..f47af1b
--- /dev/null
+++ b/webui/js/ArgumentForm.js
@@ -0,0 +1,19 @@
+
+class ArgumentForm extends window.HTMLFormElement {
+  setup(json, callback) {
+    this.setAttribute('class', 'actionArguments')
+    this.title = document.createElement("h1")
+    this.title.innerHTML = "Action Arguments"
+
+    this.appendChild(this.title);
+
+    let a = document.createElement("span")
+    a.innerText = "Hi"
+    frm.appendChild(a)
+
+
+    console.log(json)
+  }
+}
+
+window.customElements.define('argument-form', ArgumentForm, { extends: 'form' })
diff --git a/webui/style.css b/webui/style.css
index d9e3e8d..3f15482 100644
--- a/webui/style.css
+++ b/webui/style.css
@@ -247,3 +247,13 @@ details[open] {
 	margin-top: 1em;
 	display: block;
 }
+
+form.actionArguments {
+	border-radius: 1em;
+	position: absolute;
+	top: 1em;
+	left: 1em;
+	right: 1em;
+	padding: 1em;
+	background-color: #fff;
+}