Add rudimentary builds page
This commit is contained in:
parent
cc701d5930
commit
59deefcd5a
2 changed files with 54 additions and 5 deletions
48
src/runboat/webui/builds.html
Normal file
48
src/runboat/webui/builds.html
Normal file
|
|
@ -0,0 +1,48 @@
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Runboat builds</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="builds"></div>
|
||||||
|
<script type="module">
|
||||||
|
import {RunboatBuildElement} from './runboat-build-element.js'
|
||||||
|
customElements.define('runboat-build', RunboatBuildElement);
|
||||||
|
|
||||||
|
const repo = new URLSearchParams(window.location.search).get("repo");
|
||||||
|
const target_branch = new URLSearchParams(window.location.search).get("target_branch");
|
||||||
|
var url = `/api/v1/build-events?repo=${repo}`
|
||||||
|
if (target_branch) {
|
||||||
|
url += `&target_branch=${target_branch}`
|
||||||
|
}
|
||||||
|
// TODO: evtSource error handling
|
||||||
|
const evtSource = new EventSource(url);
|
||||||
|
evtSource.onmessage = function(event) {
|
||||||
|
var oEvent = JSON.parse(event.data);
|
||||||
|
if (oEvent.event == "upd") {
|
||||||
|
var buildElement = document.getElementById(oEvent.build.name);
|
||||||
|
if (buildElement) {
|
||||||
|
buildElement.build = oEvent.build;
|
||||||
|
} else {
|
||||||
|
var rowId = `branch-${oEvent.build.target_branch}`;
|
||||||
|
if (oEvent.build.pr) {
|
||||||
|
rowId += `-pr-${oEvent.build.pr}`
|
||||||
|
}
|
||||||
|
var rowElement = document.getElementById(rowId);
|
||||||
|
if (!rowElement) {
|
||||||
|
rowElement = document.createElement("div");
|
||||||
|
rowElement.id = rowId;
|
||||||
|
document.getElementById("builds").appendChild(rowElement);
|
||||||
|
}
|
||||||
|
buildElement = document.createElement("runboat-build");
|
||||||
|
buildElement.id = oEvent.build.name;
|
||||||
|
rowElement.appendChild(buildElement);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
const buildElement = document.getElementById(oEvent.build.name);
|
||||||
|
buildElement.remove();
|
||||||
|
}
|
||||||
|
buildElement.build = oEvent.event == "upd" ? oEvent.build : {};
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -14,11 +14,8 @@ class RunboatBuildElement extends LitElement {
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
return html`
|
return html`
|
||||||
<p>Build: ${this.build.name}
|
<div>
|
||||||
${this.build.status == "started"?
|
<p>Build: ${this.build.name}</p>
|
||||||
html`<a href="${this.build.deploy_link}">=> live</a>`:""
|
|
||||||
}
|
|
||||||
</p>
|
|
||||||
<p>
|
<p>
|
||||||
Repo: ${this.build.repo}
|
Repo: ${this.build.repo}
|
||||||
${this.build.pr?
|
${this.build.pr?
|
||||||
|
|
@ -39,7 +36,11 @@ class RunboatBuildElement extends LitElement {
|
||||||
<p>
|
<p>
|
||||||
<button @click="${this.stopHandler}" ?disabled="${this.build.status != "started"}">stop</button>
|
<button @click="${this.stopHandler}" ?disabled="${this.build.status != "started"}">stop</button>
|
||||||
<button @click="${this.startHandler}" ?disabled="${this.build.status != "stopped"}">start</button>
|
<button @click="${this.startHandler}" ?disabled="${this.build.status != "stopped"}">start</button>
|
||||||
|
${this.build.status == "started"?
|
||||||
|
html`<a href="${this.build.deploy_link}">=> live</a>`:""
|
||||||
|
}
|
||||||
</p>
|
</p>
|
||||||
|
<div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue