Updates
This commit is contained in:
parent
030b44c084
commit
44ea9cae00
43
package-lock.json
generated
43
package-lock.json
generated
@ -9,7 +9,8 @@
|
|||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"date-fns": "^2.30.0",
|
"date-fns": "^3.0.0",
|
||||||
|
"date-fns-tz": "^3.1.3",
|
||||||
"dotenv": "^16.1.4",
|
"dotenv": "^16.1.4",
|
||||||
"lit": "^2.7.5",
|
"lit": "^2.7.5",
|
||||||
"typescript": "^5.1.3"
|
"typescript": "^5.1.3"
|
||||||
@ -280,22 +281,6 @@
|
|||||||
"node": ">=6.0.0"
|
"node": ">=6.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/@babel/runtime": {
|
|
||||||
"version": "7.23.8",
|
|
||||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.8.tgz",
|
|
||||||
"integrity": "sha512-Y7KbAP984rn1VGMbGqKmBLio9V7y5Je9GvU4rQPCPinCyNfUcToxIXl06d59URp/F3LwinvODxab5N/G6qggkw==",
|
|
||||||
"dependencies": {
|
|
||||||
"regenerator-runtime": "^0.14.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=6.9.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/@babel/runtime/node_modules/regenerator-runtime": {
|
|
||||||
"version": "0.14.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
|
|
||||||
"integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
|
|
||||||
},
|
|
||||||
"node_modules/@babel/template": {
|
"node_modules/@babel/template": {
|
||||||
"version": "7.22.15",
|
"version": "7.22.15",
|
||||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz",
|
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz",
|
||||||
@ -1813,18 +1798,20 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/date-fns": {
|
"node_modules/date-fns": {
|
||||||
"version": "2.30.0",
|
"version": "3.6.0",
|
||||||
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.30.0.tgz",
|
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-3.6.0.tgz",
|
||||||
"integrity": "sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==",
|
"integrity": "sha512-fRHTG8g/Gif+kSh50gaGEdToemgfj74aRX3swtiouboip5JDLAyDE9F11nHMIcvOaXeOC6D7SpNhi7uFyB7Uww==",
|
||||||
"dependencies": {
|
|
||||||
"@babel/runtime": "^7.21.0"
|
|
||||||
},
|
|
||||||
"engines": {
|
|
||||||
"node": ">=0.11"
|
|
||||||
},
|
|
||||||
"funding": {
|
"funding": {
|
||||||
"type": "opencollective",
|
"type": "github",
|
||||||
"url": "https://opencollective.com/date-fns"
|
"url": "https://github.com/sponsors/kossnocorp"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/date-fns-tz": {
|
||||||
|
"version": "3.1.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/date-fns-tz/-/date-fns-tz-3.1.3.tgz",
|
||||||
|
"integrity": "sha512-ZfbMu+nbzW0mEzC8VZrLiSWvUIaI3aRHeq33mTe7Y38UctKukgqPR4nTDwcwS4d64Gf8GghnVsroBuMY3eiTeA==",
|
||||||
|
"peerDependencies": {
|
||||||
|
"date-fns": "^3.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/debug": {
|
"node_modules/debug": {
|
||||||
|
@ -1,19 +1,20 @@
|
|||||||
{
|
{
|
||||||
"name": "lavender",
|
"name": "mosaic-widgets",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "npm run build && npm run deploy",
|
"start": "npm run build && npm run deploy",
|
||||||
"build": "npx tsc && cp -R public dist && npx gulp && npx rollup -c",
|
"build": "npx tsc && cp -R public dist && npx gulp && npx rollup -c",
|
||||||
"deploy": "rm -rf ~/www/html/lavender-widgets && cp -R build ~/www/html/lavender-widgets",
|
"deploy": "rm -rf ~/www/html/mosaic-widgets && cp -R build ~/www/html/mosaic-widgets",
|
||||||
"clean": "rm -rf build && rm -rf dist",
|
"clean": "rm -rf build && rm -rf dist",
|
||||||
"test": "echo \"Error: no test specified\" && exit 1"
|
"test": "echo \"Error: no test specified\" && exit 1"
|
||||||
},
|
},
|
||||||
"author": "",
|
"author": "",
|
||||||
"license": "ISC",
|
"license": "ISC",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"date-fns": "^2.30.0",
|
"date-fns": "^3.0.0",
|
||||||
|
"date-fns-tz": "^3.1.3",
|
||||||
"dotenv": "^16.1.4",
|
"dotenv": "^16.1.4",
|
||||||
"lit": "^2.7.5",
|
"lit": "^2.7.5",
|
||||||
"typescript": "^5.1.3"
|
"typescript": "^5.1.3"
|
||||||
|
@ -5,6 +5,6 @@
|
|||||||
<script type="module" src="./js/Affirmations.js"></script>
|
<script type="module" src="./js/Affirmations.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<lavender-affirmations></lavender-affirmations>
|
<mosaic-affirmations></mosaic-affirmations>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
@ -4,6 +4,6 @@
|
|||||||
<script type="module" src="./js/Rainfall.js"></script>
|
<script type="module" src="./js/Rainfall.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<lavender-rainfall></lavender-rainfall>
|
<mosaic-rainfall></mosaic-rainfall>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
@ -5,6 +5,6 @@
|
|||||||
<script type="module" src="./js/RSS.js"></script>
|
<script type="module" src="./js/RSS.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<lavender-rss></lavender-rss>
|
<mosaic-rss></mosaic-rss>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
@ -7,6 +7,6 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h2 style="text-align: center">Splork MOTD (<a href="https://codeberg.org/caranmegil/splork" alt="Source Code" target="_blank"><i class="fa-brands fa-square-git"></i></a>)</h2>
|
<h2 style="text-align: center">Splork MOTD (<a href="https://codeberg.org/caranmegil/splork" alt="Source Code" target="_blank"><i class="fa-brands fa-square-git"></i></a>)</h2>
|
||||||
<lavender-splork></lavender-splork>
|
<mosaic-splork></mosaic-splork>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
10
public/time.html
Normal file
10
public/time.html
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta http-equiv="refresh" content="120">
|
||||||
|
<script type="module" src="./js/Time.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<mosaic-time></mosaic-time>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -5,6 +5,6 @@
|
|||||||
<script type="module" src="./js/Weather.js"></script>
|
<script type="module" src="./js/Weather.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<lavender-weather></lavender-weather>
|
<mosaic-weather></mosaic-weather>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { LitElement, css, html } from 'lit';
|
import { LitElement, css, html } from 'lit';
|
||||||
import { customElement } from 'lit/decorators.js';
|
import { customElement } from 'lit/decorators.js';
|
||||||
|
|
||||||
@customElement('lavender-affirmations')
|
@customElement('mosaic-affirmations')
|
||||||
export class Affirmations extends LitElement {
|
export class Affirmations extends LitElement {
|
||||||
replaceShe = ["her", "she", "her", "herself", "she is"];
|
replaceShe = ["her", "she", "her", "herself", "she is"];
|
||||||
replaceThey = ["them", "they", "their", "themself", "they are"];
|
replaceThey = ["them", "they", "their", "themself", "they are"];
|
||||||
@ -95,6 +95,6 @@ export class Affirmations extends LitElement {
|
|||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface HTMLElementTagNameMap {
|
interface HTMLElementTagNameMap {
|
||||||
'lavender-affirmations': Affirmations;
|
'mosaic-affirmations': Affirmations;
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -6,7 +6,7 @@ type RSSItem = {
|
|||||||
link: string | null;
|
link: string | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
@customElement('lavender-rss')
|
@customElement('mosaic-rss')
|
||||||
export class RSS extends LitElement {
|
export class RSS extends LitElement {
|
||||||
rssItems: RSSItem[] = [];
|
rssItems: RSSItem[] = [];
|
||||||
rssTitle = '';
|
rssTitle = '';
|
||||||
@ -116,6 +116,6 @@ export class RSS extends LitElement {
|
|||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface HTMLElementTagNameMap {
|
interface HTMLElementTagNameMap {
|
||||||
'lavender-rss': RSS;
|
'mosaic-rss': RSS;
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -1,7 +1,7 @@
|
|||||||
import { LitElement, html, css } from 'lit';
|
import { LitElement, html, css } from 'lit';
|
||||||
import { customElement } from 'lit/decorators.js';
|
import { customElement } from 'lit/decorators.js';
|
||||||
|
|
||||||
@customElement('lavender-rainfall')
|
@customElement('mosaic-rainfall')
|
||||||
export class Rainfall extends LitElement {
|
export class Rainfall extends LitElement {
|
||||||
value = 0.0;
|
value = 0.0;
|
||||||
|
|
||||||
@ -13,11 +13,7 @@ export class Rainfall extends LitElement {
|
|||||||
async pullValueFromBackend() {
|
async pullValueFromBackend() {
|
||||||
const response = await fetch('RAINFALL_URI');
|
const response = await fetch('RAINFALL_URI');
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
const result = data
|
this.setValue(data.total_moisture);
|
||||||
.map((datum: any) => datum.value)
|
|
||||||
.reduce((accum: number, datum: number) => accum + datum, 0);
|
|
||||||
|
|
||||||
this.setValue(result);
|
|
||||||
|
|
||||||
setTimeout(() => this.pullValueFromBackend(), 1000);
|
setTimeout(() => this.pullValueFromBackend(), 1000);
|
||||||
}
|
}
|
||||||
@ -46,7 +42,7 @@ export class Rainfall extends LitElement {
|
|||||||
return html`
|
return html`
|
||||||
<div class="gauge-body">
|
<div class="gauge-body">
|
||||||
<div class="gauge-label">Rainfall (inches and mm water)</div>
|
<div class="gauge-label">Rainfall (inches and mm water)</div>
|
||||||
<div>${this.value / 25.4} / ${this.value}</div>
|
<div>${Math.round((this.value / 25.4) * 100)/100} / ${Math.round(this.value*100)/100}</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
@ -54,6 +50,6 @@ export class Rainfall extends LitElement {
|
|||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface HTMLElementTagNameMap {
|
interface HTMLElementTagNameMap {
|
||||||
'lavender-rainfall': Rainfall;
|
'mosaic-rainfall': Rainfall;
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -1,7 +1,7 @@
|
|||||||
import { LitElement, html, css } from 'lit';
|
import { LitElement, html, css } from 'lit';
|
||||||
import { customElement } from 'lit/decorators.js';
|
import { customElement } from 'lit/decorators.js';
|
||||||
|
|
||||||
@customElement('lavender-splork')
|
@customElement('mosaic-splork')
|
||||||
export class Splork extends LitElement {
|
export class Splork extends LitElement {
|
||||||
value = 0.0;
|
value = 0.0;
|
||||||
|
|
||||||
@ -49,6 +49,6 @@ export class Splork extends LitElement {
|
|||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface HTMLElementTagNameMap {
|
interface HTMLElementTagNameMap {
|
||||||
'lavender-splork': Splork;
|
'mosaic-splork': Splork;
|
||||||
}
|
}
|
||||||
}
|
}
|
64
src/Time.ts
Normal file
64
src/Time.ts
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
import { LitElement, css, html } from 'lit';
|
||||||
|
import { customElement } from 'lit/decorators.js';
|
||||||
|
import { format } from 'date-fns-tz';
|
||||||
|
|
||||||
|
@customElement('mosaic-time')
|
||||||
|
export class Time extends LitElement {
|
||||||
|
time = '';
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
this.reloadTime();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
async reloadTime() {
|
||||||
|
const date = new Date();
|
||||||
|
const hours = date.getUTCHours();
|
||||||
|
const minutes = date.getUTCMinutes();
|
||||||
|
const seconds = date.getUTCSeconds();
|
||||||
|
|
||||||
|
let beats = (hours * 3600 + 60 * minutes + seconds) / 86.4;
|
||||||
|
|
||||||
|
beats = Math.round(beats * 1000) / 1000;
|
||||||
|
|
||||||
|
this.setData(`${format(date, 'yyyy-MM-dd', {timeZone: 'UTC'})}@${beats.toFixed(4)}`);
|
||||||
|
|
||||||
|
setTimeout(() => this.reloadTime(), 10);
|
||||||
|
}
|
||||||
|
|
||||||
|
setData(time: string) {
|
||||||
|
this.time = time;
|
||||||
|
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">Universal Decimal Time</div>
|
||||||
|
<div>⧖${this.time}</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
interface HTMLElementTagNameMap {
|
||||||
|
'mosaic-time': Time;
|
||||||
|
}
|
||||||
|
}
|
@ -1,7 +1,7 @@
|
|||||||
import { LitElement, css, html } from 'lit';
|
import { LitElement, css, html } from 'lit';
|
||||||
import { customElement } from 'lit/decorators.js';
|
import { customElement } from 'lit/decorators.js';
|
||||||
|
|
||||||
@customElement('lavender-weather')
|
@customElement('mosaic-weather')
|
||||||
export class Weather extends LitElement {
|
export class Weather extends LitElement {
|
||||||
temp = 0.0;
|
temp = 0.0;
|
||||||
|
|
||||||
@ -47,7 +47,7 @@ export class Weather extends LitElement {
|
|||||||
<div class="gauge-label">Temperature (in C)</div>
|
<div class="gauge-label">Temperature (in C)</div>
|
||||||
<div>${this.temp}</div>
|
<div>${this.temp}</div>
|
||||||
<div class="gauge-label">Temperature (in F)</div>
|
<div class="gauge-label">Temperature (in F)</div>
|
||||||
<div>${(this.temp*9)/5 + 32}</div>
|
<div>${Math.round((this.temp*9)/5 + 32)}</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
}
|
}
|
||||||
@ -55,6 +55,6 @@ export class Weather extends LitElement {
|
|||||||
|
|
||||||
declare global {
|
declare global {
|
||||||
interface HTMLElementTagNameMap {
|
interface HTMLElementTagNameMap {
|
||||||
'lavender-weather': Weather;
|
'mosaic-weather': Weather;
|
||||||
}
|
}
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user