Rebase to main

This commit is contained in:
jamesread 2021-07-16 14:28:26 +01:00
parent ef5e71fa94
commit ef6f772532
6 changed files with 104 additions and 6 deletions

View File

@ -28,6 +28,17 @@ message StartActionResponse {
int32 exitCode = 4; int32 exitCode = 4;
} }
message GetLogsRequest{};
message LogEntry {
string datetime = 1;
string content = 2;
}
message GetLogsResponse {
repeated LogEntry logs = 1;
}
service OliveTinApi { service OliveTinApi {
rpc GetButtons(GetButtonsRequest) returns (GetButtonsResponse) { rpc GetButtons(GetButtonsRequest) returns (GetButtonsResponse) {
option (google.api.http) = { option (google.api.http) = {
@ -41,4 +52,10 @@ service OliveTinApi {
}; };
} }
rpc GetLogs(GetLogsRequst) returns (GetLogsResponse) {
option (google.api.http) = {
get: "/api/GetLogs"
}
}
} }

View File

@ -12,9 +12,26 @@
<body> <body>
<main title = "main content"> <main title = "main content">
<fieldset id = "rootGroup"> <fieldset id = "switcher">
<legend>OliveTin Actions</legend> <button id = "showActions">Actions</button>
<button id = "showLogs">Logs</button>
</fieldset> </fieldset>
<section id = "contentLogs" title = "Logs" hidden>
<table>
<tr>
<td>12 seconds ago</td> <td>blat blat <button>Logs</button></td>
</tr>
<tr>
<td>4 seconds ago</td> <td>blat blat foo foo <button>Logs</button></td>
</tr>
</table>
</section>
<section id = "contentActions" title = "Actions" hidden >
<fieldset id = "rootGroup">
</fieldset>
</section>
</main> </main>
<footer title = "footer"> <footer title = "footer">
<p><img title = "application icon" src = "OliveTinLogo.png" height = "1em" class = "logo" /> OliveTin</p> <p><img title = "application icon" src = "OliveTinLogo.png" height = "1em" class = "logo" /> OliveTin</p>

View File

@ -56,6 +56,10 @@ class ActionButton extends window.HTMLButtonElement {
this.temporaryStatusMessage = '[ ' + temporaryStatusMessage + ' ]' this.temporaryStatusMessage = '[ ' + temporaryStatusMessage + ' ]'
this.updateHtml() this.updateHtml()
this.classList.add(cssClass) this.classList.add(cssClass)
setTimeout(() => {
this.classList.remove(cssClass)
}, 1000);
} }
onActionError (err) { onActionError (err) {
@ -64,6 +68,10 @@ class ActionButton extends window.HTMLButtonElement {
this.isWaiting = false this.isWaiting = false
this.updateHtml() this.updateHtml()
this.classList.add('actionFailed') this.classList.add('actionFailed')
setTimeout(() => {
this.classList.remove('actionFailed')
}, 1000);
} }
constructTemplate () { constructTemplate () {

View File

@ -20,7 +20,7 @@ export function marshalActionButtonsJsonToHtml (json) {
htmlButton.updateIterationTimestamp = currentIterationTimestamp; htmlButton.updateIterationTimestamp = currentIterationTimestamp;
} }
for (const existingButton of document.querySelectorAll('button')) { for (const existingButton of document.querySelector('#contentActions').querySelectorAll('button')) {
if (existingButton.updateIterationTimestamp != currentIterationTimestamp) { if (existingButton.updateIterationTimestamp != currentIterationTimestamp) {
existingButton.remove(); existingButton.remove();
} }

View File

@ -14,8 +14,26 @@ function showBigError (type, friendlyType, message) {
document.getElementById('rootGroup').appendChild(domErr) document.getElementById('rootGroup').appendChild(domErr)
} }
function showSection (name) {
for (let otherName of ["Actions", "Logs"]) {
document.getElementById('show' + otherName).classList.remove('activeSection');
document.getElementById('content' + otherName).hidden = true;
}
document.getElementById('show' + name).classList.add('activeSection')
document.getElementById('content' + name).hidden = false;
}
function setupSections() {
document.getElementById('showActions').onclick = () => { showSection('Actions') };
document.getElementById('showLogs').onclick = () => { showSection('Logs') }
showSection('Actions');
}
function fetchGetButtons() { function fetchGetButtons() {
window.fetch(window.restBaseUrl + 'GetButtons', { window.fetch(window.restBaseUrl + 'GetButtons', {
cors: 'cors' cors: 'cors'
// No fetch options // No fetch options
}).then(res => { }).then(res => {
@ -40,6 +58,8 @@ function processWebuiSettingsJson (settings) {
} }
} }
setupSections();
window.fetch('webUiSettings.json').then(res => { window.fetch('webUiSettings.json').then(res => {
return res.json() return res.json()
}).then(res => { }).then(res => {
@ -51,3 +71,4 @@ window.fetch('webUiSettings.json').then(res => {
}).catch(err => { }).catch(err => {
showBigError('fetch-webui-settings', 'getting webui settings', err) showBigError('fetch-webui-settings', 'getting webui settings', err)
}) })

View File

@ -7,16 +7,47 @@ body {
margin: 0; margin: 0;
} }
fieldset { fieldset {
padding: 0;
}
fieldset#rootGroup {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
grid-template-rows: auto auto auto auto; grid-template-rows: auto auto auto auto;
padding: 1em;
grid-gap: 1em; grid-gap: 1em;
text-align: center; text-align: center;
border: 0; border: 0;
} }
fieldset#switcher {
border: 0;
text-align: right;
margin-bottom: 1em;
}
fieldset#switcher button:first-child{
border-radius: 1em 0em 0em 1em;
}
fieldset#switcher button:last-child{
border-radius: 0 1em 1em 0;
}
table {
background-color: white;
border-collapse: collapse;
}
td {
border: 1px solid #efefef;
}
button.activeSection {
font-weight: bold;
}
legend { legend {
padding-top: 1em; padding-top: 1em;
} }
@ -154,3 +185,7 @@ img.logo {
background-color: black; background-color: black;
} }
} }
main {
padding: 1em;
}