Update to add Splork
This commit is contained in:
parent
b5d9849c9a
commit
e129f3cd57
@ -7,6 +7,7 @@ function replaceTemplate() {
|
||||
return src(['./public/js/**/*.js'])
|
||||
.pipe(replace(/TEASENSE_URI/g, process.env.TEASENSE_URI))
|
||||
.pipe(replace(/RAINFALL_URI/g, process.env.RAINFALL_URI))
|
||||
.pipe(replace(/SPLORK_URI/g, process.env.SPLORK_URI))
|
||||
.pipe(dest('./public/js'));
|
||||
};
|
||||
|
||||
|
8
public/splork.html
Normal file
8
public/splork.html
Normal file
@ -0,0 +1,8 @@
|
||||
<html>
|
||||
<head>
|
||||
<script type="module" src="./js/Splork.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<lavender-splork></lavender-splork>
|
||||
</body>
|
||||
</html>
|
55
src/Splork.ts
Normal file
55
src/Splork.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import { LitElement, html, css } from 'lit';
|
||||
import { customElement } from 'lit/decorators.js';
|
||||
|
||||
@customElement('lavender-splork')
|
||||
export class Splork extends LitElement {
|
||||
value = 0.0;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.pullValueFromBackend();
|
||||
}
|
||||
|
||||
async pullValueFromBackend() {
|
||||
const response = await fetch('SPLORK_URI');
|
||||
const data = await response.json();
|
||||
const result = data.message;
|
||||
|
||||
this.setValue(result);
|
||||
}
|
||||
|
||||
setValue(newValue: number) {
|
||||
this.value = newValue;
|
||||
this.requestUpdate();
|
||||
}
|
||||
|
||||
static override styles = [
|
||||
css`
|
||||
.gauge-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
align-content: space-between;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gauge-label {
|
||||
font-weight: bold;
|
||||
}
|
||||
`
|
||||
]
|
||||
override render() {
|
||||
return html`
|
||||
<div class="gauge-body">
|
||||
<div class="gauge-label">Splork MOTD</div>
|
||||
<div>${this.value}</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
declare global {
|
||||
interface HTMLElementTagNameMap {
|
||||
'lavender-splork': Splork;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user