highperfocused/P4wnP1_aloa
1
0
Fork 0
mirror of https://github.com/RoganDawes/P4wnP1_aloa.git synced 2025-03-27 01:51:45 +01:00
Code Issues Packages Projects Releases Wiki Activity

Webclient: Quasar design for USB settings

Browse Source
This commit is contained in:
MaMe82 2018-08-25 00:35:03 +02:00
parent 39f0a933fc
commit 4f17688a51
4 changed files with 154 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
dist/www/index.html vendored
View File

@ -13,8 +13,10 @@
<link rel="icon" href="favicon.png" type="image/x-icon">
<link href="lib/umd/quasar.mat.min.css" rel="stylesheet" type="text/css">
<!--
<link rel="stylesheet" type="text/css" href="p4wnp1.css">
<link rel="stylesheet" href="/fontawesome-free-5.2.0-web/css/solid.min.css">
-->
<script>
window.FontAwesomeConfig = {
searchPseudoElements: true
@ -32,10 +34,7 @@
<div id="app">
<q-layout view="lHh Lpr fff">
<q-layout-header>
<q-toolbar
:glossy="$q.theme === 'mat'"
:inverted="$q.theme === 'ios'"
>
<q-toolbar>
<q-toolbar-title>
P4wnP1 web-frontend
<div slot="subtitle">by MaMe82</div>
@ -54,7 +53,8 @@
</q-layout-header>
<q-page-container>
<router-view></router-view>
<q-page padding>
<router-view></router-view>
<modal v-if="!$store.state.isConnected">
<h3 slot="header">No connection to server</h3>

7
dist/www/p4wnp1.css vendored
View File

@ -6,11 +6,11 @@ body {
font-family: "Open Sans", sans-serif;
font-size: 1em;
line-height: 1.6;
background: linear-gradient(45deg, #9e9e9e, #c4c4c4 66%, #9e9e9e);
/* background: linear-gradient(45deg, #9e9e9e, #c4c4c4 66%, #9e9e9e); */
}
/*
input {
/*border-radius: 99999px;*/
background-color: #707070;
background: linear-gradient(to top, #9e9e9e, #f4f4f4);
height: 30px;
@ -21,6 +21,7 @@ input {
font-weight: 600;
}
*/
button {
border-radius: 99999px;
@ -440,4 +441,4 @@ button {
font-weight: 800;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
text-decoration: none;
}
}

171
web_client/hvueCompUSBSettings.go
View File

@ -38,7 +38,10 @@ func InitCompUSBSettings() {
func(vm *hvue.VM) interface{} {
return vm.Get("$store").Get("state").Get("currentGadgetSettings")
}),
hvue.Computed("deploying",
func(vm *hvue.VM) interface{} {
return vm.Get("$store").Get("state").Get("deployingGadgetSettings")
}),
)
}
@ -60,37 +63,142 @@ func newCompUSBSettingsData(vm *hvue.VM) interface{} {
const (
compUSBSettingsTemplate = `
<q-page class="row justify gutter-sm">
<div>
<q-btn :loading="deploying" color="primary" @click="ApplyGadgetSettings" label="deploy"></q-btn>
<q-btn color="secondary" @click="UpdateFromDeployedGadgetSettings" label="reset"></q-btn>
<br><br>
<q-list link>
<q-list-header>Generic Gadget Settings</q-list-header>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Enabled"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>Enabled</q-item-tile>
<q-item-tile sublabel>Enable/Disable USB gadget (if enabled, at least one function has to be turned on)</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-main>
<q-item-tile label>Vendor ID</q-item-tile>
<q-item-tile sublabel>Example: 0x1d6b</q-item-tile>
<q-item-tile>
<q-input v-model="currentGadgetSettings.Vid" inverted></q-input>
</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-main>
<q-item-tile label>Product ID</q-item-tile>
<q-item-tile sublabel>Example: 0x1337</q-item-tile>
<q-item-tile>
<q-input v-model="currentGadgetSettings.Pid" inverted></q-input>
</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-main>
<q-item-tile label>Manufacturer Name</q-item-tile>
<q-item-tile sublabel></q-item-tile>
<q-item-tile>
<q-input v-model="currentGadgetSettings.Manufacturer" inverted></q-input>
</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-main>
<q-item-tile label>Product Name</q-item-tile>
<q-item-tile sublabel></q-item-tile>
<q-item-tile>
<q-input v-model="currentGadgetSettings.Product" inverted></q-input>
</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-main>
<q-item-tile label>Serial Number</q-item-tile>
<q-item-tile sublabel></q-item-tile>
<q-item-tile>
<q-input v-model="currentGadgetSettings.Serial" inverted></q-input>
</q-item-tile>
</q-item-main>
</q-item>
<q-item-separator />
<q-list-header>Gadget functions</q-list-header>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_CDC_ECM"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>CDC ECM</q-item-tile>
<q-item-tile sublabel>Ethernet over USB for Linux, Unix and OSX</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_RNDIS"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>RNDIS</q-item-tile>
<q-item-tile sublabel>Ethernet over USB for Windows (and some Linux kernels)</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_HID_KEYBOARD"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>Keyboard</q-item-tile>
<q-item-tile sublabel>HID Keyboard functionality (needed for HID Script)</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_HID_MOUSE"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>Mouse</q-item-tile>
<q-item-tile sublabel>HID Mouse functionality (needed for HID Script)</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_HID_RAW"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>Custom HID device</q-item-tile>
<q-item-tile sublabel>Raw HID device function, used for covert channel</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_Serial"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>Serial Interface</q-item-tile>
<q-item-tile sublabel>Provides a serial port over USB</q-item-tile>
</q-item-main>
</q-item>
<q-item tag="label">
<q-item-side>
<q-toggle v-model="currentGadgetSettings.Use_UMS"></q-toggle>
</q-item-side>
<q-item-main>
<q-item-tile label>Mass Storage</q-item-tile>
<q-item-tile sublabel>Emulates USB flash drive or CD-ROM</q-item-tile>
</q-item-main>
</q-item>
<q-list>
</div>
<!--
<table cellspacing="1">
<tr>
<td>USB gadget settings</td>
<td><button @click="ApplyGadgetSettings" :disabled="deployPending">Apply</button>
<button @click="UpdateFromDeployedGadgetSettings">Deployed</button></td>
</tr>
<tr>
<td>Gadget enabled</td>
<td><toggle-switch v-model="currentGadgetSettings.Enabled"></toggle-switch></td>
</tr>
<tr>
<td>Vendor ID</td>
<td><input v-model="currentGadgetSettings.Vid"/></td>
</tr>
<tr>
<td>Product ID</td>
<td><input v-model="currentGadgetSettings.Pid"/></td>
</tr>
<tr>
<td>Manufacturer Name</td>
<td><input v-model="currentGadgetSettings.Manufacturer"/></td>
</tr>
<tr>
<td>Product Name</td>
<td><input v-model="currentGadgetSettings.Product"/></td>
</tr>
<tr>
<td>Serial number</td>
<td><input v-model="currentGadgetSettings.Serial"/></td>
</tr>
<tr>
<td>CDC ECM</td>
<td>
@ -134,6 +242,7 @@ const (
<td><toggle-switch v-model="currentGadgetSettings.Use_UMS"></toggle-switch></td>
</tr>
</table>
</div>
-->
</q-page>
`
)

5
web_client/mvuexGlobalState.go
View File

@ -51,6 +51,7 @@ type GlobalState struct {
Title string `js:"title"`
CurrentHIDScriptSource string `js:"currentHIDScriptSource"`
CurrentGadgetSettings *jsGadgetSettings `js:"currentGadgetSettings"`
CurrentlyDeployingGadgetSettings bool `js:"deployingGadgetSettings"`
EventReceiver *jsEventReceiver `js:"eventReceiver"`
HidJobList *jsHidJobStateList `js:"hidJobList"`
IsModalEnabled bool `js:"isModalEnabled"`
@ -69,6 +70,7 @@ func createGlobalStateStruct() GlobalState {
state.Title = "P4wnP1 by MaMe82"
state.CurrentHIDScriptSource = initHIDScript
state.CurrentGadgetSettings = NewUSBGadgetSettings()
state.CurrentlyDeployingGadgetSettings = false
//UpdateGadgetSettingsFromDeployed(state.CurrentGadgetSettings)
state.HidJobList = NewHIDJobStateList()
state.EventReceiver = NewEventReceiver(maxLogEntries, state.HidJobList)
@ -129,6 +131,8 @@ func actionUpdateRunningHidJobs(store *mvuex.Store, context *mvuex.ActionContext
func actionDeployCurrentGadgetSettings(store *mvuex.Store, context *mvuex.ActionContext, state *GlobalState) {
go func() {
// ToDo: Indicate deployment process via global state
state.CurrentlyDeployingGadgetSettings = true
defer func() {state.CurrentlyDeployingGadgetSettings = false}()
//get current GadgetSettings
curGS := state.CurrentGadgetSettings.toGS()
@ -136,6 +140,7 @@ func actionDeployCurrentGadgetSettings(store *mvuex.Store, context *mvuex.Action
//try to set them via gRPC (the server holds an internal state, setting != deploying)
err := RpcClient.RpcSetRemoteGadgetSettings(curGS, time.Second)
if err != nil {
//ToDo: use global store to return something, or allow actions to return promises (latter is too much JavaScript)
Alert(err.Error())
return