webclient: started reworking HIDScript to Quasar

This commit is contained in:
MaMe82 2018-09-04 00:21:36 +02:00
parent 838bbc2268
commit 2a7d5375dc
9 changed files with 205 additions and 82 deletions

8
dist/www/index.html vendored
View File

@ -24,6 +24,14 @@
</script>
<link rel="stylesheet" href="codemirror/lib/codemirror.css">
<link rel="stylesheet" href="codemirror/addon/hint/show-hint.css">
<style>
.CodeMirror {
font-family: monospace;
height: 500px;
color: black;
direction: ltr;
}
</style>

View File

@ -1,58 +0,0 @@
// +build js
package main
import (
"github.com/HuckRidgeSW/hvue"
)
func InitCompHIDJob() {
hvue.NewComponent(
"hidjob",
hvue.Template(compHIDJobTemplate),
hvue.Computed("jobstate",
func(vm *hvue.VM) interface{} {
//fetch job and cast back to jobstate
job := &jsHidJobState{Object:vm.Get("job")}
switch {
case job.HasFailed && !job.HasSucceeded:
return "FAILED"
case job.HasSucceeded && !job.HasFailed:
return "SUCCEEDED"
case !(job.HasFailed || job.HasSucceeded):
return "RUNNING"
default:
return "UNKNOWN_STATE"
}
}),
hvue.PropObj("job", hvue.Required),
)
}
const (
/*
// HIDJobList
type jsHidJobState struct {
*js.Object
Id int64 `js:"id"`
VmId int64 `js:"vmId"`
HasFailed bool `js:"hasFailed"`
HasSucceeded bool `js:"hasSucceeded"`
LastMessage string `js:"lastMessage"`
TextResult string `js:"textResult"`
LastUpdateTime string `js:"lastUpdateTime"` //JSON timestamp from server
ScriptSource string `js:"textSource"`
}
*/
compHIDJobTemplate = `
<div :style="{ 'display': 'flex' }">
<div class="jobstate-entry" :class="jobstate"><span>{{ job.vmId }}: {{ job.id }}</span></div>
<div v-if="job.hasSucceeded || job.hasFailed">{{ job.textResult }}</div>
<div>{{ job.textSource }}</div>
</div>
`
)

View File

@ -23,32 +23,140 @@ func newCompHIDJobsData(vm *hvue.VM) interface{} {
func InitCompHIDJobs() {
hvue.NewComponent(
"hidjobs",
hvue.Template(compHIDJobsTemplate),
"hid-job-overview",
hvue.Template(compHIDJobOverviewTemplate),
hvue.DataFunc(newCompHIDJobsData),
hvue.Computed("events",
func(vm *hvue.VM) interface{} {
return vm.Get("$store").Get("state").Get("eventReceiver").Get("eventHidArray")
}),
hvue.Computed("jobs",
func(vm *hvue.VM) interface{} {
jobList := vm.Get("$store").Get("state").Get("hidJobList").Get("jobs")
return js.Global.Get("Object").Call("values",jobList)
}),
)
hvue.NewComponent(
"hid-job-event-overview",
hvue.Template(compHIDJobEventOverviewTemplate),
hvue.DataFunc(newCompHIDJobsData),
hvue.Computed("events",
func(vm *hvue.VM) interface{} {
return vm.Get("$store").Get("state").Get("eventReceiver").Get("eventHidArray")
}),
hvue.Method("evIdToString", func (vm *hvue.VM, evID int64) (res string) {
println("EvID",evID)
return common_web.EventType_name[evID]
}),
)
hvue.NewComponent(
"hid-job-overview-item",
hvue.Template(compHIDJobOverViewItemTemplate),
hvue.Computed("jobstate",
func(vm *hvue.VM) interface{} {
//fetch job and cast back to jobstate
job := &jsHidJobState{Object:vm.Get("job")}
switch {
case job.HasFailed && !job.HasSucceeded:
return "FAILED"
case job.HasSucceeded && !job.HasFailed:
return "SUCCEEDED"
case !(job.HasFailed || job.HasSucceeded):
return "RUNNING"
default:
return "UNKNOWN_STATE"
}
}),
hvue.Computed("jobcolor",
func(vm *hvue.VM) interface{} {
//fetch job and cast back to jobstate
job := &jsHidJobState{Object:vm.Get("job")}
switch {
case job.HasFailed && !job.HasSucceeded:
return "negative"
case job.HasSucceeded && !job.HasFailed:
return "positive"
case !(job.HasFailed || job.HasSucceeded):
return "warning"
default:
return "info"
}
}),
hvue.Computed("jobicon",
func(vm *hvue.VM) interface{} {
//fetch job and cast back to jobstate
job := &jsHidJobState{Object:vm.Get("job")}
switch {
case job.HasFailed && !job.HasSucceeded:
return "error"
case job.HasSucceeded && !job.HasFailed:
return "check_circle"
case !(job.HasFailed || job.HasSucceeded):
return "sync"
default:
return "help"
}
}),
hvue.PropObj("job", hvue.Required),
)
}
const (
/*
// HIDJobList
type jsHidJobState struct {
*js.Object
Id int64 `js:"id"`
VmId int64 `js:"vmId"`
HasFailed bool `js:"hasFailed"`
HasSucceeded bool `js:"hasSucceeded"`
LastMessage string `js:"lastMessage"`
TextResult string `js:"textResult"`
LastUpdateTime string `js:"lastUpdateTime"` //JSON timestamp from server
ScriptSource string `js:"textSource"`
}
*/
compHIDJobOverViewItemTemplate = `
<q-item highlight>
<q-item-side :icon="jobicon" :color="jobcolor" />
<q-item-main>
<q-item-tile label>Job {{ job.id }}</q-item-tile>
<q-item-tile sublabel>State {{ jobstate }} </q-item-tile>
</q-item-main>
<q-item-side right v-if="job.hasSucceeded || job.hasFailed">
<q-btn flat round dense icon="more_horiz">
<q-popover>
{{ job.textResult }}
</q-popover>
</q-btn>
</q-item-side>
</q-item>
`
//{ "evtype": 0, "vmId": 2, "jobId": 3, "hasError": false, "result": "null", "error": "", "message": "Script started", "time": "2018-07-30 04:56:42.297533 +0000 UTC m=+7625.097825001" }
compHIDJobsTemplate = `
compHIDJobOverviewTemplate = `
<q-card class="q-ma-sm" :inline="$q.platform.is.desktop">
<q-list>
<q-list-header>HID Script jobs</q-list-header>
<hid-job-overview-item v-for="job in jobs" :job="job" :key="job.id"></hid-job-overview-item>
</q-list>
</q-card>
`
//{ "evtype": 0, "vmId": 2, "jobId": 3, "hasError": false, "result": "null", "error": "", "message": "Script started", "time": "2018-07-30 04:56:42.297533 +0000 UTC m=+7625.097825001" }
compHIDJobEventOverviewTemplate = `
<q-page>
<hid-job-overview></hid-job-overview>
<div>
<div>
<hidjob v-for="job in jobs" :job="job" :key="job.id"></hidjob>
</div>
<table border="1">
<tr>
<th>Event Type</th>
@ -73,6 +181,8 @@ const (
</table>
</div>
</q-page>
`
)

View File

@ -6,7 +6,6 @@ import (
"github.com/gopherjs/gopherjs/js"
"github.com/HuckRidgeSW/hvue"
"strconv"
"google.golang.org/grpc/status"
)
type CompHIDScriptData struct {
@ -23,14 +22,35 @@ func (data *CompHIDScriptData) SendAndRun(vm *hvue.VM) {
go func() {
timeout := uint32(0)
err := UploadHIDScript(md5, sourceCode)
if err != nil { Alert("Error uploading script: " + err.Error()); return }
job,err := RunHIDScript(md5, timeout)
if err != nil {
println(status.Convert(err))
Alert("Error starting script as background job: " + err.Error())
notification := &QuasarNotification{Object: O()}
notification.Message = "Error uploading script"
notification.Detail = err.Error()
notification.Position = QUASAR_NOTIFICATION_POSITION_TOP
notification.Type = QUASAR_NOTIFICATION_TYPE_NEGATIVE
notification.Timeout = 5000
QuasarNotify(notification)
return
}
Alert("Script started as background job: " + strconv.Itoa(int(job.Id)))
job,err := RunHIDScript(md5, timeout)
if err != nil {
notification := &QuasarNotification{Object: O()}
notification.Message = "Error starting script as background job"
notification.Detail = err.Error()
notification.Position = QUASAR_NOTIFICATION_POSITION_TOP
notification.Type = QUASAR_NOTIFICATION_TYPE_NEGATIVE
notification.Timeout = 5000
QuasarNotify(notification)
return
}
notification := &QuasarNotification{Object: O()}
notification.Message = "Script started successfully"
notification.Detail = "Job ID " + strconv.Itoa(int(job.Id))
notification.Position = QUASAR_NOTIFICATION_POSITION_TOP
notification.Type = QUASAR_NOTIFICATION_TYPE_POSITIVE
notification.Timeout = 5000
QuasarNotify(notification)
}()
}
@ -62,12 +82,32 @@ func InitCompHIDScript() {
const (
compHIDScriptTemplate = `
<div>
<span>P4wnP1 HID Script</span>
<button @click="SendAndRun()">as Job</button><br>
<code-editor v-model="scriptContent"></code-editor>
<hidjobs></hidjobs>
</div>
<q-page class="row item-start">
<q-card class="q-ma-sm" :inline="$q.platform.is.desktop">
<q-card-title>
HIDScript editor
</q-card-title>
<q-card-separator />
<q-card-actions>
<q-btn color="primary" @click="SendAndRun()">run</q-btn>
</q-card-actions>
<q-card-separator />
<q-card-main>
<code-editor v-model="scriptContent"></code-editor>
</q-card-main>
</q-card>
<hid-job-overview></hid-job-overview>
<q-page>
`
)

View File

@ -1,3 +1,5 @@
// +build js
package main
import (

View File

@ -1,3 +1,5 @@
// +build js
package main
import (

View File

@ -726,8 +726,25 @@ func (data *jsEventReceiver) handleHidEvent(hEv *jsHidEvent ) {
data.JobList.UpdateEntry(hEv.JobId, hEv.VMId, hEv.HasError, false, "Script started", "", hEv.EvLogTime,hEv.Message)
case common_web.HidEventType_JOB_FAILED:
data.JobList.UpdateEntry(hEv.JobId, hEv.VMId, hEv.HasError, false, hEv.Message, hEv.Error, hEv.EvLogTime,"")
notification := &QuasarNotification{Object: O()}
notification.Message = "HIDScript job " + strconv.Itoa(int(hEv.JobId)) + " failed"
notification.Detail = hEv.Error
notification.Position = QUASAR_NOTIFICATION_POSITION_TOP
notification.Type = QUASAR_NOTIFICATION_TYPE_NEGATIVE
notification.Timeout = 5000
QuasarNotify(notification)
case common_web.HidEventType_JOB_SUCCEEDED:
data.JobList.UpdateEntry(hEv.JobId, hEv.VMId, hEv.HasError, true, hEv.Message, hEv.Result, hEv.EvLogTime,"")
notification := &QuasarNotification{Object: O()}
notification.Message = "HIDScript job " + strconv.Itoa(int(hEv.JobId)) + " succeeded"
notification.Detail = hEv.Result
notification.Position = QUASAR_NOTIFICATION_POSITION_TOP
notification.Type = QUASAR_NOTIFICATION_TYPE_POSITIVE
notification.Timeout = 5000
QuasarNotify(notification)
case common_web.HidEventType_JOB_CANCELLED:
data.JobList.UpdateEntry(hEv.JobId, hEv.VMId, true, false, hEv.Message, hEv.Message, hEv.EvLogTime,"")
default:

View File

@ -59,13 +59,13 @@ func main() {
VueRouterRoute("/usb","", "<usb-settings></usb-settings>"),
VueRouterRoute("/","", "<usb-settings></usb-settings>"),
VueRouterRoute("/hid","", "<hid-script></hid-script>"),
VueRouterRoute("/hidjobs","", "<hidjobs></hidjobs>"),
VueRouterRoute("/hidjobs","", "<hid-job-event-overview></hid-job-event-overview>"),
VueRouterRoute("/logger","", "<logger :max-entries='7'></logger>"),
VueRouterRoute("/network","", "<network></network>"),
VueRouterRoute("/wifi","", "<wifi></wifi>"),
)
InitCompHIDJob()
InitCompHIDJobs()
InitCompModal()
InitCompEthernetAddresses2()

View File

@ -1,3 +1,5 @@
// +build js
package main
import "github.com/gopherjs/gopherjs/js"