forked from btclock/webui
All translations complete
This commit is contained in:
Djuri Baars
parent
1f382fc8b4
commit
4471ab9ef4
10 changed files with 219 additions and 73 deletions
|
|
@ -15,9 +15,32 @@
|
|||
"hostnamePrefix": "Hostname prefix",
|
||||
"StealFocusOnNewBlock": "Steal focus on new block",
|
||||
"useBigCharsMcap": "Use big characters for market cap",
|
||||
"otaUpdates": "OTA updates (restart required)",
|
||||
"enableMdns": "mDNS (restart required)",
|
||||
"fetchEuroPrice": "Fetch € price (restart required)"
|
||||
"otaUpdates": "OTA updates",
|
||||
"enableMdns": "mDNS",
|
||||
"fetchEuroPrice": "Fetch € price",
|
||||
"shortAmountsWarning": "Short amounts might shorten lifespan.",
|
||||
"tzOffsetHelpText": "A restart is required to apply TZ offset.",
|
||||
"screens": "Screens"
|
||||
},
|
||||
"control": {
|
||||
"systemInfo": "System info",
|
||||
"version": "Version",
|
||||
"buildTime": "Build time",
|
||||
"ledColor": "LED color",
|
||||
"turnOff": "Turn off",
|
||||
"setColor": "Set color",
|
||||
"showText": "Show text",
|
||||
"text": "Text",
|
||||
"title": "Control"
|
||||
},
|
||||
"status": {
|
||||
"title": "Status",
|
||||
"screenCycle": "Screen cycle",
|
||||
"memoryFree": "Memory free",
|
||||
"wsPriceConnection": "WS Price connection",
|
||||
"wsMempoolConnection": "WS Mempool.space connection",
|
||||
"fetchEuroNote": "If you use \"Fetch € price\" the WS Price connection will show ❌ since it uses another data source.",
|
||||
"uptime": "Uptime"
|
||||
}
|
||||
},
|
||||
"colors": {
|
||||
|
|
@ -27,5 +50,16 @@
|
|||
"time": {
|
||||
"minutes": "minutes",
|
||||
"seconds": "seconds"
|
||||
},
|
||||
"restartRequired": "restart required",
|
||||
"button": {
|
||||
"save": "Save",
|
||||
"reset": "Reset",
|
||||
"restart": "Restart",
|
||||
"forceFullRefresh": "Force full refresh"
|
||||
},
|
||||
"timer": {
|
||||
"running": "running",
|
||||
"stopped": "stopped"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,65 @@
|
|||
{
|
||||
"section": {
|
||||
"settings": {
|
||||
"title": "Configuración"
|
||||
}
|
||||
"section": {
|
||||
"settings": {
|
||||
"title": "Configuración",
|
||||
"textColor": "Color de texto",
|
||||
"backgroundColor": "Color de fondo",
|
||||
"ledBrightness": "Brillo LED",
|
||||
"screens": "Pantallas",
|
||||
"shortAmountsWarning": "Cantidades pequeñas pueden acortar la vida útil.",
|
||||
"fullRefreshEvery": "Actualización completa cada",
|
||||
"timePerScreen": "Tiempo por pantalla",
|
||||
"tzOffsetHelpText": "Es necesario reiniciar para aplicar la compensación.",
|
||||
"timezoneOffset": "Compensación de zona horaria",
|
||||
"StealFocusOnNewBlock": "Presta atención al nuevo bloque",
|
||||
"ledFlashOnBlock": "El LED parpadea con un bloque nuevo",
|
||||
"useBigCharsMcap": "Utilice caracteres grandes para la market cap",
|
||||
"fetchEuroPrice": "Obtener precio en €",
|
||||
"timeBetweenPriceUpdates": "Tiempo entre actualizaciones de precios",
|
||||
"ledPowerOnTest": "Prueba de encendido del LED",
|
||||
"enableMdns": "mDNS",
|
||||
"hostnamePrefix": "Prefijo de nombre de host",
|
||||
"mempoolnstance": "Instancia de Mempool",
|
||||
"otaUpdates": "Actualización por aire"
|
||||
},
|
||||
"control": {
|
||||
"turnOff": "Apagar",
|
||||
"setColor": "Establecer el color",
|
||||
"version": "Versión",
|
||||
"ledColor": "color del LED",
|
||||
"systemInfo": "Info del sistema",
|
||||
"showText": "Poner texto",
|
||||
"text": "Texto",
|
||||
"title": "Control",
|
||||
"buildTime": "Tiempo de construcción"
|
||||
},
|
||||
"status": {
|
||||
"memoryFree": "Memoria RAM libre",
|
||||
"wsPriceConnection": "Conexión WebSocket Precio",
|
||||
"wsMempoolConnection": "Conexión WebSocket Mempool.space",
|
||||
"screenCycle": "Rotacion de pantalla",
|
||||
"uptime": "Tiempo de funcionamiento",
|
||||
"fetchEuroNote": "Si utiliza \"Obtener precio en €\", la conexión de Precio WS mostrará ❌ ya que utiliza otra fuente de datos.",
|
||||
"title": "Estado"
|
||||
}
|
||||
},
|
||||
"button": {
|
||||
"save": "Guardar",
|
||||
"reset": "Restaurar",
|
||||
"restart": "Reiniciar",
|
||||
"forceFullRefresh": "Forzar refresco"
|
||||
},
|
||||
"colors": {
|
||||
"black": "Negro",
|
||||
"white": "Blanco"
|
||||
},
|
||||
"restartRequired": "reinicio requerido",
|
||||
"time": {
|
||||
"minutes": "minutos",
|
||||
"seconds": "segundos"
|
||||
},
|
||||
"timer": {
|
||||
"running": "funcionando",
|
||||
"stopped": "detenido"
|
||||
}
|
||||
}
|
||||
|
|
@ -8,7 +8,39 @@
|
|||
"timezoneOffset": "Tijdzone afwijking",
|
||||
"ledBrightness": "LED helderheid",
|
||||
"timePerScreen": "Tijd per scherm",
|
||||
"fullRefreshEvery": "Volledig verversen"
|
||||
"fullRefreshEvery": "Volledig verversen elke",
|
||||
"shortAmountsWarning": "Lage waardes verkorten levensduur",
|
||||
"tzOffsetHelpText": "Herstart nodig voor toepassen afwijking.",
|
||||
"enableMdns": "mDNS",
|
||||
"ledPowerOnTest": "LED test bij aanzetten",
|
||||
"StealFocusOnNewBlock": "Pak aandacht bij nieuw blok",
|
||||
"ledFlashOnBlock": "Knipper led bij nieuw blok",
|
||||
"useBigCharsMcap": "Gebruik grote tekens bij market cap",
|
||||
"fetchEuroPrice": "Toon € prijs",
|
||||
"screens": "Schermen",
|
||||
"hostnamePrefix": "Hostnaam voorvoegsel",
|
||||
"mempoolnstance": "Mempool instantie",
|
||||
"otaUpdates": "OTA updates"
|
||||
},
|
||||
"control": {
|
||||
"systemInfo": "Systeeminformatie",
|
||||
"version": "Versie",
|
||||
"buildTime": "Bouwtijd",
|
||||
"setColor": "Kleur instellen",
|
||||
"turnOff": "Uitzetten",
|
||||
"ledColor": "LED kleur",
|
||||
"showText": "Toon tekst",
|
||||
"text": "Tekst",
|
||||
"title": "Besturing"
|
||||
},
|
||||
"status": {
|
||||
"title": "Status",
|
||||
"memoryFree": "Geheugen vrij",
|
||||
"screenCycle": "Scherm cyclus",
|
||||
"wsPriceConnection": "WS Prijs verbinding",
|
||||
"wsMempoolConnection": "WS Mempool.space verbinding",
|
||||
"fetchEuroNote": "Wanneer je \"Toon € prijs\" aanzet, zal de prijsverbinding als ❌ verbroken getoond worden vanwege het gebruik van een andere bron.",
|
||||
"uptime": "Uptime"
|
||||
}
|
||||
},
|
||||
"colors": {
|
||||
|
|
@ -18,5 +50,16 @@
|
|||
"time": {
|
||||
"minutes": "minuten",
|
||||
"seconds": "seconden"
|
||||
},
|
||||
"restartRequired": "herstart nodig",
|
||||
"button": {
|
||||
"save": "Opslaan",
|
||||
"reset": "Herstel",
|
||||
"restart": "Herstart",
|
||||
"forceFullRefresh": "Forceer scherm verversen"
|
||||
},
|
||||
"timer": {
|
||||
"running": "actief",
|
||||
"stopped": "gestopt"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,6 +9,12 @@
|
|||
$form-range-track-bg: #fff;
|
||||
$color-mode-type: media-query;
|
||||
$font-family-base: "Ubuntu";
|
||||
$font-size-base: 0.9rem;
|
||||
//$font-size-sm: $font-size-base * .875 !default;
|
||||
//$form-label-font-size: $font-size-base * .575 !default;
|
||||
//$input-btn-font-size-sm: 0.4rem;
|
||||
//$form-label-font-size: 0.4rem;
|
||||
$input-font-size-sm: $font-size-base * .875;
|
||||
|
||||
// $border-radius: .675rem;
|
||||
|
||||
|
|
@ -77,6 +83,17 @@ nav {
|
|||
padding: 10px;
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
align-content: stretch;
|
||||
font-family: 'Oswald', sans-serif;
|
||||
|
||||
>div {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.digit,
|
||||
.splitText,
|
||||
|
|
@ -97,44 +114,20 @@ nav {
|
|||
}
|
||||
}
|
||||
|
||||
.btclock {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
align-content: stretch;
|
||||
font-family: 'Oswald', sans-serif;
|
||||
}
|
||||
|
||||
.btclock>div {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.fg-ffff .btclock>div {
|
||||
.darkMode .btclock>div {
|
||||
color: #fff;
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.bg-ffff .btclock>div {
|
||||
.lightMode .btclock>div {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.fg-f800 .btclock>div {
|
||||
color: #f00;
|
||||
border-color: #f00;
|
||||
}
|
||||
|
||||
.bg-f800 .btclock>div {
|
||||
background: #f00;
|
||||
}
|
||||
|
||||
.fg-0 .btclock>div {
|
||||
.lightMode .btclock>div {
|
||||
color: #000;
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
.bg-0 .btclock>div {
|
||||
.darkMode .btclock>div {
|
||||
background: #000;
|
||||
}
|
||||
|
||||
|
|
@ -180,11 +173,6 @@ nav {
|
|||
#customText {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#toggleTimerArea {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.system_info {
|
||||
padding: 0;
|
||||
|
||||
|
|
@ -192,3 +180,7 @@ nav {
|
|||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
||||
.card-title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
|
@ -12,12 +12,14 @@
|
|||
DropdownToggle
|
||||
} from 'sveltestrap';
|
||||
|
||||
import { locale, locales } from 'svelte-i18n';
|
||||
import { locale, locales, waitLocale } from 'svelte-i18n';
|
||||
import type { LayoutLoad } from './$types';
|
||||
import { browser } from '$app/environment';
|
||||
|
||||
export const setLocale = (lang: string) => () => {
|
||||
locale.set(lang);
|
||||
localStorage.setItem("locale", lang)
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<Navbar expand="md">
|
||||
|
|
|
|||
|
|
@ -7,10 +7,12 @@ import { locale, waitLocale } from 'svelte-i18n'
|
|||
import type { LayoutLoad } from './$types'
|
||||
|
||||
export const load: LayoutLoad = async () => {
|
||||
if (browser) {
|
||||
if (browser && localStorage.getItem('locale')) {
|
||||
locale.set(localStorage.getItem('locale'));
|
||||
} else if (browser) {
|
||||
locale.set(window.navigator.language)
|
||||
}
|
||||
await waitLocale()
|
||||
await waitLocale();
|
||||
}
|
||||
|
||||
export const prerender = true;
|
||||
|
|
|
|||
|
|
@ -25,6 +25,10 @@
|
|||
if (data.fgColor> 65535) {
|
||||
data.fgColor = "65535";
|
||||
}
|
||||
|
||||
if (data.bgColor> 65535) {
|
||||
data.bgColor = "65535";
|
||||
}
|
||||
settings.set(data);
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -52,37 +52,37 @@ const forceFullRefresh = () => {
|
|||
<CardBody>
|
||||
<Form>
|
||||
<Row>
|
||||
<Label md={6} for="customText" size="sm">Text</Label>
|
||||
<Label md={6} for="customText">{ $_('section.control.text') }</Label>
|
||||
<Col md="6">
|
||||
<Input type="text" id="customText" bind:value={customText} bsSize="sm" maxLength="{$settings.numScreens}"/>
|
||||
</Col>
|
||||
</Row>
|
||||
<Button color="primary" on:click={setCustomText}>Show text</Button>
|
||||
<Button color="primary" on:click={setCustomText}>{ $_('section.control.showText') }</Button>
|
||||
|
||||
</Form>
|
||||
<hr />
|
||||
<h3>LEDs</h3>
|
||||
<Form>
|
||||
<Row>
|
||||
<Label md={6} for="ledColorPicker" size="sm">LEDs color</Label>
|
||||
<Label md={6} for="ledColorPicker" size="sm">{ $_('section.control.ledColor') }</Label>
|
||||
<Col md="6">
|
||||
<Input type="color" id="ledColorPicker" bind:value="{ledColor}" />
|
||||
</Col>
|
||||
</Row>
|
||||
<Button color="secondary" id="turnOffLedsBtn" on:click={turnOffLeds}>Turn off</Button>
|
||||
<Button color="primary" on:click={setLEDcolor}>Set color</Button>
|
||||
<Button color="secondary" id="turnOffLedsBtn" on:click={turnOffLeds}>{ $_('section.control.turnOff') }</Button>
|
||||
<Button color="primary" on:click={setLEDcolor}>{ $_('section.control.setColor') }</Button>
|
||||
</Form>
|
||||
|
||||
<hr />
|
||||
<h3>System info</h3>
|
||||
<h3>{ $_('section.control.systemInfo') }</h3>
|
||||
<ul class="small system_info">
|
||||
<li>Version: {$settings.gitRev}</li>
|
||||
<li>Build time: {new Date(($settings.lastBuildTime * 1000)).toLocaleString()}</li>
|
||||
<li>{ $_('section.control.version') }: {$settings.gitRev}</li>
|
||||
<li>{ $_('section.control.buildTime') }: {new Date(($settings.lastBuildTime * 1000)).toLocaleString()}</li>
|
||||
<li>IP: {$settings.ip}</li>
|
||||
<li>Hostname: {$settings.hostname}</li>
|
||||
</ul>
|
||||
<Button color="danger" id="restartBtn" on:click="{restartClock}">Restart</Button>
|
||||
<Button color="warning" id="forceFullRefresh" on:click="{forceFullRefresh}">Force full refresh</Button>
|
||||
<Button color="danger" id="restartBtn" on:click="{restartClock}">{ $_('button.restart') }</Button>
|
||||
<Button color="warning" id="forceFullRefresh" on:click="{forceFullRefresh}">{ $_('button.forceFullRefresh') }</Button>
|
||||
</CardBody>
|
||||
</Card>
|
||||
</Col>
|
||||
|
|
|
|||
|
|
@ -107,7 +107,7 @@
|
|||
<Input type="number" min={1} step="1" bind:value={$settings.minSecPriceUpd} />
|
||||
<InputGroupText>{ $_('time.seconds') }</InputGroupText>
|
||||
</InputGroup>
|
||||
<FormText>Short amounts might shorten lifespan.</FormText>
|
||||
<FormText>{ $_('section.settings.shortAmountsWarning') }</FormText>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
|
|
@ -124,7 +124,7 @@
|
|||
/>
|
||||
<InputGroupText>{ $_('time.minutes') }</InputGroupText>
|
||||
</InputGroup>
|
||||
<FormText>A restart is required to apply TZ offset.</FormText>
|
||||
<FormText>{ $_('section.settings.tzOffsetHelpText') }</FormText>
|
||||
</Col>
|
||||
</Row>
|
||||
<Row>
|
||||
|
|
@ -181,18 +181,18 @@
|
|||
<Input id="mcapBigChar" bind:checked={$settings.mcapBigChar} type="switch" bsSize="sm" label="{ $_('section.settings.useBigCharsMcap') }" />
|
||||
</Col>
|
||||
<Col md="6">
|
||||
<Input id="otaEnabled" bind:checked={$settings.otaEnabled} type="switch" bsSize="sm" label="{ $_('section.settings.otaUpdates') }" />
|
||||
<Input id="otaEnabled" bind:checked={$settings.otaEnabled} type="switch" bsSize="sm" label="{ $_('section.settings.otaUpdates') } ({ $_('restartRequired') })" />
|
||||
</Col>
|
||||
<Col md="6">
|
||||
<Input id="mdnsEnabled" bind:checked={$settings.mdnsEnabled} type="switch" bsSize="sm" label="{ $_('section.settings.enableMdns') }" />
|
||||
<Input id="mdnsEnabled" bind:checked={$settings.mdnsEnabled} type="switch" bsSize="sm" label="{ $_('section.settings.enableMdns') } ({ $_('restartRequired') })" />
|
||||
</Col>
|
||||
<Col md="6">
|
||||
<Input id="fetchEurPrice" bind:checked={$settings.fetchEurPrice} type="switch" bsSize="sm" label="{ $_('section.settings.fetchEuroPrice') }" />
|
||||
<Input id="fetchEurPrice" bind:checked={$settings.fetchEurPrice} type="switch" bsSize="sm" label="{ $_('section.settings.fetchEuroPrice') } ({ $_('restartRequired') })" />
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Row>
|
||||
<h3>Screens</h3>
|
||||
<h3>{ $_('section.settings.screens') }</h3>
|
||||
{#if $settings.screens}
|
||||
{#each $settings.screens as s}
|
||||
<Col md="6">
|
||||
|
|
@ -201,8 +201,8 @@
|
|||
{/each}
|
||||
{/if}
|
||||
</Row>
|
||||
<Button type="reset" color="secondary">Reset</Button>
|
||||
<Button color="primary">Save</Button>
|
||||
<Button type="reset" color="secondary">{ $_('button.reset') }</Button>
|
||||
<Button color="primary">{ $_('button.save') }</Button>
|
||||
</Form>
|
||||
</CardBody>
|
||||
</Card>
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
import { Button, ButtonGroup, Card, CardBody, CardHeader, Col, Progress,CardTitle } from 'sveltestrap';
|
||||
import Rendered from './Rendered.svelte';
|
||||
|
||||
export let settings;
|
||||
|
||||
const status = writable({
|
||||
data: ["L", "O", "A", "D", "I", "N", "G"],
|
||||
|
|
@ -58,11 +59,16 @@
|
|||
}
|
||||
|
||||
let memoryFreePercent:number = 50;
|
||||
let lightMode:boolean = false;
|
||||
|
||||
status.subscribe((value) => {
|
||||
memoryFreePercent = Math.round(value.espFreeHeap / value.espHeapSize * 100);
|
||||
});
|
||||
|
||||
settings.subscribe((value) => {
|
||||
lightMode = value.bgColor > value.fgColor;
|
||||
});
|
||||
|
||||
const setScreen = (id:number) => () => {
|
||||
fetch(`${PUBLIC_BASE_URL}/api/show/screen/${id}`).catch(err => { });
|
||||
}
|
||||
|
|
@ -75,7 +81,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
export let settings;
|
||||
const isLightMode = () => {
|
||||
return $settings.bgColor > $settings.fgColor;
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<Col>
|
||||
|
|
@ -92,21 +101,23 @@
|
|||
</ButtonGroup>
|
||||
<hr>
|
||||
{#if $status.data}
|
||||
<Rendered status="{$status}"></Rendered>
|
||||
Screen cycle: <a style="cursor: pointer" on:click="{toggleTimer($status.timerRunning)}">{#if $status.timerRunning}⏵ running{:else}⏸ stopped{/if}</a>
|
||||
<section class={lightMode ? 'lightMode': ''}>
|
||||
<Rendered status="{$status}"></Rendered>
|
||||
</section>
|
||||
{ $_('section.status.screenCycle') }: <a style="cursor: pointer" on:click="{toggleTimer($status.timerRunning)}">{#if $status.timerRunning}⏵ { $_('timer.running') }{:else}⏸ { $_('timer.stopped') }{/if}</a>
|
||||
{/if}
|
||||
{/if}
|
||||
<hr>
|
||||
<Progress striped value={memoryFreePercent}>{ memoryFreePercent }%</Progress>
|
||||
<div class="d-flex justify-content-between">
|
||||
<div>Memory free </div>
|
||||
<div>{ $_('section.status.memoryFree') } </div>
|
||||
<div>{ Math.round($status.espFreeHeap / 1024) } / { Math.round($status.espHeapSize / 1024) } KiB</div>
|
||||
</div>
|
||||
<hr>
|
||||
Uptime: {toUptimeString($status.espUptime)}
|
||||
{ $_('section.status.uptime') }: {toUptimeString($status.espUptime)}
|
||||
<br>
|
||||
<p>
|
||||
WS Price connection:
|
||||
{ $_('section.status.wsPriceConnection') }:
|
||||
<span>
|
||||
{#if $status.connectionStatus && $status.connectionStatus.price}
|
||||
✅
|
||||
|
|
@ -115,7 +126,7 @@
|
|||
{/if}
|
||||
</span>
|
||||
-
|
||||
WS Mempool.space connection:
|
||||
{ $_('section.status.wsMempoolConnection') }:
|
||||
<span>
|
||||
{#if $status.connectionStatus && $status.connectionStatus.blocks}
|
||||
✅
|
||||
|
|
@ -124,7 +135,7 @@
|
|||
{/if}
|
||||
</span><br>
|
||||
{#if $settings.fetchEurPrice}
|
||||
<small>If you use "Fetch € price" the WS Price connection will show ❌ since it uses another data source.</small>
|
||||
<small>{ $_('section.status.fetchEuroNote') }</small>
|
||||
{/if}
|
||||
</p>
|
||||
</CardBody>
|
||||
|
|
|
|||
Loading…
Reference in a new issue