Merge pull request #19 from sbidoul/builds-page

Add rudimentary builds page
This commit is contained in:
Stéphane Bidoul 2021-11-20 12:22:59 +01:00 committed by GitHub
commit 0547a73096
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 54 additions and 5 deletions

View 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>

View file

@ -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}">=&gt; 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}">=&gt; live</a>`:""
}
</p> </p>
<div>
`; `;
} }