5 лет назад · ef6f772532
--- a/OliveTin.proto
+++ b/OliveTin.proto
@@ -28,6 +28,17 @@ message StartActionResponse {
 
				 	int32 exitCode = 4;
			
 
				 }
			
 
				 
			
 
				+message GetLogsRequest{};
			
 
				+
			
 
				+message LogEntry {
			
 
				+	string datetime = 1;
			
 
				+	string content = 2;
			
 
				+}
			
 
				+
			
 
				+message GetLogsResponse {
			
 
				+	repeated LogEntry logs = 1;
			
 
				+}
			
 
				+
			
 
				 service OliveTinApi {
			
 
				 	rpc GetButtons(GetButtonsRequest) returns (GetButtonsResponse) {
			
 
				 		option (google.api.http) = {
			
@@ -41,4 +52,10 @@ service OliveTinApi {
 
				 		};
			
 
				 	}
			
 
				 
			
 
				+	rpc GetLogs(GetLogsRequst) returns (GetLogsResponse) {
			
 
				+		option (google.api.http) = {
			
 
				+			get: "/api/GetLogs"
			
 
				+		}
			
 
				+	}
			
 
				+
			
 
				 }
			
--- a/webui/index.html
+++ b/webui/index.html
@@ -12,9 +12,26 @@
 
				 
			
 
				 	<body>
			
 
				 		<main title = "main content">
			
 
				-			<fieldset id = "rootGroup">
			
 
				-				<legend>OliveTin Actions</legend>
			
 
				+			<fieldset id = "switcher">
			
 
				+				<button id = "showActions">Actions</button>
			
 
				+				<button id = "showLogs">Logs</button>
			
 
				 			</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>
			
 
				 		<footer title = "footer">
			
 
				 			<p><img title = "application icon" src = "OliveTinLogo.png" height = "1em" class = "logo" /> OliveTin</p>
			
--- a/webui/js/ActionButton.js
+++ b/webui/js/ActionButton.js
@@ -56,6 +56,10 @@ class ActionButton extends window.HTMLButtonElement {
 
				     this.temporaryStatusMessage = '[ ' + temporaryStatusMessage + ' ]'
			
 
				     this.updateHtml()
			
 
				     this.classList.add(cssClass)
			
 
				+
			
 
				+    setTimeout(() => {
			
 
				+      this.classList.remove(cssClass)
			
 
				+    }, 1000);
			
 
				   }
			
 
				 
			
 
				   onActionError (err) {
			
@@ -64,6 +68,10 @@ class ActionButton extends window.HTMLButtonElement {
 
				     this.isWaiting = false
			
 
				     this.updateHtml()
			
 
				     this.classList.add('actionFailed')
			
 
				+
			
 
				+    setTimeout(() => {
			
 
				+      this.classList.remove('actionFailed')
			
 
				+    }, 1000);
			
 
				   }
			
 
				 
			
 
				   constructTemplate () {
			
--- a/webui/js/marshaller.js
+++ b/webui/js/marshaller.js
@@ -20,7 +20,7 @@ export function marshalActionButtonsJsonToHtml (json) {
 
				     htmlButton.updateIterationTimestamp = currentIterationTimestamp;
			
 
				   }
			
 
				 
			
 
				-  for (const existingButton of document.querySelectorAll('button')) {
			
 
				+  for (const existingButton of document.querySelector('#contentActions').querySelectorAll('button')) {
			
 
				     if (existingButton.updateIterationTimestamp != currentIterationTimestamp) {
			
 
				       existingButton.remove();
			
 
				     }
			
--- a/webui/main.js
+++ b/webui/main.js
@@ -14,8 +14,26 @@ function showBigError (type, friendlyType, message) {
 
				   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() {
			
 
				- window.fetch(window.restBaseUrl + 'GetButtons', {
			
 
				+  window.fetch(window.restBaseUrl + 'GetButtons', {
			
 
				     cors: 'cors'
			
 
				     // No fetch options
			
 
				   }).then(res => {
			
@@ -40,6 +58,8 @@ function processWebuiSettingsJson (settings) {
 
				   }
			
 
				 }
			
 
				 
			
 
				+setupSections();
			
 
				+
			
 
				 window.fetch('webUiSettings.json').then(res => {
			
 
				   return res.json()
			
 
				 }).then(res => {
			
@@ -51,3 +71,4 @@ window.fetch('webUiSettings.json').then(res => {
 
				 }).catch(err => {
			
 
				   showBigError('fetch-webui-settings', 'getting webui settings', err)
			
 
				 })
			
 
				+
			
--- a/webui/style.css
+++ b/webui/style.css
@@ -7,16 +7,47 @@ body {
 
				   margin: 0;
			
 
				 }
			
 
				 
			
 
				-fieldset {
			
 
				+fieldset { 
			
 
				+  padding: 0;
			
 
				+}
			
 
				+
			
 
				+fieldset#rootGroup {
			
 
				   display: grid;
			
 
				   grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
			
 
				   grid-template-rows: auto auto auto auto;
			
 
				-  padding: 1em;
			
 
				   grid-gap: 1em;
			
 
				   text-align: center;
			
 
				   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 {
			
 
				   padding-top: 1em;
			
 
				 }
			
@@ -154,3 +185,7 @@ img.logo {
 
				     background-color: black;
			
 
				   }
			
 
				 }
			
 
				+
			
 
				+main {
			
 
				+	padding: 1em;
			
 
				+}