Add new webUI through submodule
This commit is contained in:
Djuri Baars
parent
70fc46a74a
commit
8d94cb4090
22 changed files with 167 additions and 4286 deletions
3
.github/workflows/workflow.yml
vendored
3
.github/workflows/workflow.yml
vendored
|
|
@ -13,6 +13,8 @@ jobs:
|
|||
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
with:
|
||||
submodules: recursive
|
||||
- uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: lts/*
|
||||
|
|
@ -23,6 +25,7 @@ jobs:
|
|||
path: |
|
||||
~/.cache/pip
|
||||
~/.platformio/.cache
|
||||
~/data/node_modules
|
||||
key: ${{ runner.os }}-pio
|
||||
- uses: actions/setup-python@v4
|
||||
with:
|
||||
|
|
|
|||
3
.gitmodules
vendored
Normal file
3
.gitmodules
vendored
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
[submodule "data"]
|
||||
path = data
|
||||
url = https://github.com/btclock/webui.git
|
||||
1
data
Submodule
1
data
Submodule
|
|
@ -0,0 +1 @@
|
|||
Subproject commit e14e85425eb7a5fdc1d5aab6f4ae091f93ab45a7
|
||||
|
|
@ -1 +0,0 @@
|
|||
nodeLinker: node-modules
|
||||
|
|
@ -1,59 +0,0 @@
|
|||
import esbuild from "esbuild";
|
||||
import { sassPlugin } from "esbuild-sass-plugin";
|
||||
import htmlPlugin from '@chialab/esbuild-plugin-html';
|
||||
import handlebarsPlugin from "esbuild-plugin-handlebars";
|
||||
import { clean } from 'esbuild-plugin-clean';
|
||||
import { copy } from 'esbuild-plugin-copy';
|
||||
|
||||
import postcss from "postcss";
|
||||
import autoprefixer from "autoprefixer";
|
||||
|
||||
const hbsOptions = {
|
||||
additionalHelpers: { splitText: "helpers.js" },
|
||||
additionalPartials: {},
|
||||
precompileOptions: {}
|
||||
}
|
||||
|
||||
esbuild
|
||||
.build({
|
||||
entryPoints: ["src/css/style.scss", "src/js/script.ts", "src/index.html", "src/js/helpers.js"],
|
||||
outdir: "build",
|
||||
bundle: true,
|
||||
loader: {
|
||||
".png": "dataurl",
|
||||
".woff": "dataurl",
|
||||
".woff2": "dataurl",
|
||||
".eot": "dataurl",
|
||||
".ttf": "dataurl",
|
||||
".svg": "dataurl",
|
||||
},
|
||||
plugins: [
|
||||
clean({
|
||||
patterns: ['./build/*']
|
||||
}),
|
||||
htmlPlugin(),
|
||||
sassPlugin({
|
||||
async transform(source) {
|
||||
const { css } = await postcss([autoprefixer]).process(
|
||||
source
|
||||
, { from: undefined });
|
||||
return css;
|
||||
},
|
||||
}),
|
||||
handlebarsPlugin(hbsOptions),
|
||||
copy({
|
||||
// this is equal to process.cwd(), which means we use cwd path as base path to resolve `to` path
|
||||
// if not specified, this plugin uses ESBuild.build outdir/outfile options as base path.
|
||||
resolveFrom: 'cwd',
|
||||
assets: {
|
||||
from: ['./src/api.*'],
|
||||
to: ['./build'],
|
||||
},
|
||||
})
|
||||
],
|
||||
minify: true,
|
||||
metafile: false,
|
||||
sourcemap: false
|
||||
})
|
||||
.then(() => console.log("⚡ Build complete! ⚡"))
|
||||
.catch(() => process.exit(1));
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
{
|
||||
"name": "data",
|
||||
"packageManager": "yarn@3.2.1",
|
||||
"scripts": {
|
||||
"build": "node esbuild.mjs"
|
||||
},
|
||||
"dependencies": {
|
||||
"esbuild": "0.19.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@chialab/esbuild-plugin-html": "^0.17.2",
|
||||
"@craftamap/esbuild-plugin-html": "^0.5.0",
|
||||
"@esbuilder/html": "^0.0.6",
|
||||
"autoprefixer": "^10.4.16",
|
||||
"bootstrap": "^5.3.2",
|
||||
"esbuild-plugin-clean": "^1.0.1",
|
||||
"esbuild-plugin-copy": "^2.1.1",
|
||||
"esbuild-plugin-handlebars": "^1.0.2",
|
||||
"esbuild-sass-plugin": "^2.16.0",
|
||||
"handlebars": "^4.7.7",
|
||||
"postcss": "^8.4.31",
|
||||
"typescript": "^5.1.6"
|
||||
}
|
||||
}
|
||||
|
|
@ -1,31 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta
|
||||
name="description"
|
||||
content="SwaggerUI"
|
||||
/>
|
||||
<title>BTClock API</title>
|
||||
<link rel="stylesheet" href="https://unpkg.com/swagger-ui-dist@4.5.0/swagger-ui.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="swagger-ui"></div>
|
||||
<script src="https://unpkg.com/swagger-ui-dist@4.5.0/swagger-ui-bundle.js" crossorigin></script>
|
||||
<script src="https://unpkg.com/swagger-ui-dist@4.5.0/swagger-ui-standalone-preset.js" crossorigin></script>
|
||||
<script>
|
||||
window.onload = () => {
|
||||
window.ui = SwaggerUIBundle({
|
||||
url: 'api.json',
|
||||
dom_id: '#swagger-ui',
|
||||
presets: [
|
||||
SwaggerUIBundle.presets.apis,
|
||||
SwaggerUIStandalonePreset
|
||||
],
|
||||
layout: "StandaloneLayout",
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,345 +0,0 @@
|
|||
{
|
||||
"openapi": "3.0.3",
|
||||
"info": {
|
||||
"title": "BTClock API",
|
||||
"version": "3.0",
|
||||
"description": "BTClock V3 API"
|
||||
},
|
||||
"servers": [
|
||||
{
|
||||
"url": "/api/"
|
||||
}
|
||||
],
|
||||
"paths": {
|
||||
"/status": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"system"
|
||||
],
|
||||
"summary": "Get current status",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/system_status": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"system"
|
||||
],
|
||||
"summary": "Get system status",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/settings": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"system"
|
||||
],
|
||||
"summary": "Get current settings",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
},
|
||||
"post": {
|
||||
"tags": [
|
||||
"system"
|
||||
],
|
||||
"summary": "Save current settings",
|
||||
"requestBody": {
|
||||
"content": {
|
||||
"application/json": {
|
||||
"schema": {
|
||||
"$ref": "#/components/schemas/Settings"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/action/pause": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"timer"
|
||||
],
|
||||
"summary": "Pause screen rotation",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/action/timer_restart": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"timer"
|
||||
],
|
||||
"summary": "Restart screen rotation",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/show/screen/{id}": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"screens"
|
||||
],
|
||||
"summary": "Set screen to show",
|
||||
"parameters": [
|
||||
{
|
||||
"in": "path",
|
||||
"name": "id",
|
||||
"schema": {
|
||||
"type": "integer",
|
||||
"default": 1
|
||||
},
|
||||
"required": true,
|
||||
"description": "ID of screen to show"
|
||||
}
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/show/text/{text}": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"screens"
|
||||
],
|
||||
"summary": "Set text to show",
|
||||
"parameters": [
|
||||
{
|
||||
"in": "path",
|
||||
"name": "text",
|
||||
"schema": {
|
||||
"type": "string",
|
||||
"default": "text"
|
||||
},
|
||||
"required": true,
|
||||
"description": "Text to show"
|
||||
}
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/show/custom": {
|
||||
"post": {
|
||||
"tags": [
|
||||
"screens"
|
||||
],
|
||||
"summary": "Set text to show (advanced)",
|
||||
"requestBody": {
|
||||
"content": {
|
||||
"application/json": {
|
||||
"schema": {
|
||||
"$ref": "#/components/schemas/CustomText"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/full_refresh": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"system"
|
||||
],
|
||||
"summary": "Force full refresh of all displays",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/lights/{color}": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"lights"
|
||||
],
|
||||
"summary": "Turn on LEDs with specific color",
|
||||
"parameters": [
|
||||
{
|
||||
"in": "path",
|
||||
"name": "color",
|
||||
"schema": {
|
||||
"type": "string",
|
||||
"default": "FFCC00"
|
||||
},
|
||||
"required": true,
|
||||
"description": "Color in RGB hex"
|
||||
}
|
||||
],
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/lights/off": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"lights"
|
||||
],
|
||||
"summary": "Turn LEDs off",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"/restart": {
|
||||
"get": {
|
||||
"tags": [
|
||||
"system"
|
||||
],
|
||||
"summary": "Restart BTClock",
|
||||
"responses": {
|
||||
"200": {
|
||||
"description": "successful operation"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"components": {
|
||||
"schemas": {
|
||||
"Settings": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"fetchEurPrice": {
|
||||
"type": "boolean",
|
||||
"description": "Fetch EUR price instead of USD"
|
||||
},
|
||||
"fgColor": {
|
||||
"type": "string",
|
||||
"default": 16777215,
|
||||
"description": "ePaper foreground (text) color"
|
||||
},
|
||||
"bgColor": {
|
||||
"type": "string",
|
||||
"default": 0,
|
||||
"description": "ePaper background color"
|
||||
},
|
||||
"ledTestOnPower": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "Do LED test on power-on"
|
||||
},
|
||||
"ledFlashOnUpd": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"description": "Flash LEDs on new block"
|
||||
},
|
||||
"mdnsEnabled": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "Enable mDNS"
|
||||
},
|
||||
"otaEnabled": {
|
||||
"type": "boolean",
|
||||
"default": true,
|
||||
"description": "Enable over-the-air updates"
|
||||
},
|
||||
"stealFocusOnBlock": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"description": "Steal focus on new block"
|
||||
},
|
||||
"mcapBigChar": {
|
||||
"type": "boolean",
|
||||
"default": false,
|
||||
"description": "Use big characters for market cap screen"
|
||||
},
|
||||
"mempoolInstance": {
|
||||
"type": "string",
|
||||
"default": "mempool.space",
|
||||
"description": "Mempool.space instance to connect to"
|
||||
},
|
||||
"ledBrightness": {
|
||||
"type": "integer",
|
||||
"default": 128,
|
||||
"description": "Brightness of LEDs"
|
||||
},
|
||||
"fullRefreshMin": {
|
||||
"type": "integer",
|
||||
"default": 60,
|
||||
"description": "Full refresh time of ePaper displays in minutes"
|
||||
},
|
||||
"screen[0]": {
|
||||
"type": "boolean"
|
||||
},
|
||||
"screen[1]": {
|
||||
"type": "boolean"
|
||||
},
|
||||
"screen[2]": {
|
||||
"type": "boolean"
|
||||
},
|
||||
"screen[3]": {
|
||||
"type": "boolean"
|
||||
},
|
||||
"screen[4]": {
|
||||
"type": "boolean"
|
||||
},
|
||||
"screen[5]": {
|
||||
"type": "boolean"
|
||||
},
|
||||
"tzOffset": {
|
||||
"type": "integer",
|
||||
"default": 60,
|
||||
"description": "Timezone offset in minutes"
|
||||
},
|
||||
"minSecPriceUpd": {
|
||||
"type": "integer",
|
||||
"default": 30,
|
||||
"description": "Minimum time between price updates in seconds"
|
||||
},
|
||||
"timePerScreen": {
|
||||
"type": "integer",
|
||||
"default": 30,
|
||||
"description": "Time between screens when rotating in minutes"
|
||||
}
|
||||
}
|
||||
},
|
||||
"CustomText": {
|
||||
"type": "array",
|
||||
"items": {
|
||||
"type": "string"
|
||||
},
|
||||
"minItems": 7,
|
||||
"maxItems": 7
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
|
|
@ -1,201 +0,0 @@
|
|||
// @import "../node_modules/bootstrap/scss/bootstrap";
|
||||
|
||||
@import "../node_modules/bootstrap/scss/functions";
|
||||
@import "../node_modules/bootstrap/scss/variables";
|
||||
@import "../node_modules/bootstrap/scss/variables-dark";
|
||||
|
||||
$form-range-track-bg: #fff;
|
||||
$color-mode-type: media-query;
|
||||
// $border-radius: .675rem;
|
||||
|
||||
@import "../node_modules/bootstrap/scss/mixins";
|
||||
@import "../node_modules/bootstrap/scss/maps";
|
||||
@import "../node_modules/bootstrap/scss/utilities";
|
||||
|
||||
@import "../node_modules/bootstrap/scss/root";
|
||||
@import "../node_modules/bootstrap/scss/reboot";
|
||||
@import "../node_modules/bootstrap/scss/type";
|
||||
@import "../node_modules/bootstrap/scss/containers";
|
||||
@import "../node_modules/bootstrap/scss/grid";
|
||||
@import "../node_modules/bootstrap/scss/forms";
|
||||
@import "../node_modules/bootstrap/scss/buttons";
|
||||
@import "../node_modules/bootstrap/scss/button-group";
|
||||
|
||||
@import "../node_modules/bootstrap/scss/navbar";
|
||||
@import "../node_modules/bootstrap/scss/nav";
|
||||
@import "../node_modules/bootstrap/scss/card";
|
||||
@import "../node_modules/bootstrap/scss/progress";
|
||||
|
||||
@import "../node_modules/bootstrap/scss/helpers";
|
||||
@import "../node_modules/bootstrap/scss/utilities/api";
|
||||
|
||||
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
/* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
||||
font-family: 'Oswald';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url('oswald.woff2') format('woff2'),
|
||||
/* Chrome 36+, Opera 23+, Firefox 39+ */
|
||||
url('oswald.woff') format('woff');
|
||||
/* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(xl) {
|
||||
html {
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
button.btn,
|
||||
input[type="button"].btn,
|
||||
input[type="submit"].btn,
|
||||
input[type="reset"].btn {
|
||||
@include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-border-radius-sm);
|
||||
}
|
||||
}
|
||||
|
||||
@include media-breakpoint-down(lg) {
|
||||
html {
|
||||
font-size: 75%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
nav {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.splitText div:first-child::after {
|
||||
display: block;
|
||||
content: '';
|
||||
margin-top: 0px;
|
||||
border-bottom: 2px solid;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
#btcclock-wrapper {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
div#output .btclock {
|
||||
border: 1px solid darkgray;
|
||||
background: #000;
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
|
||||
.digit,
|
||||
.splitText,
|
||||
.mediumText {
|
||||
border: 2px solid gold;
|
||||
border-radius: 8px;
|
||||
|
||||
@include media-breakpoint-up(sm) {
|
||||
min-width: 10px;
|
||||
}
|
||||
|
||||
@include media-breakpoint-up(xxl) {
|
||||
min-width: 70px;
|
||||
}
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.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 {
|
||||
color: #fff;
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.bg-ffff .btclock>div {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.fg-f800 .btclock>div {
|
||||
color: #f00;
|
||||
border-color: #f00;
|
||||
}
|
||||
|
||||
.bg-f800 .btclock>div {
|
||||
background: #f00;
|
||||
}
|
||||
|
||||
.fg-0 .btclock>div {
|
||||
color: #000;
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
.bg-0 .btclock>div {
|
||||
background: #000;
|
||||
}
|
||||
|
||||
.splitText {
|
||||
@include media-breakpoint-up(sm) {
|
||||
font-size: 1.0rem;
|
||||
padding-top: 8px !important;
|
||||
padding-bottom: 9px !important;
|
||||
}
|
||||
@include media-breakpoint-up(xxl) {
|
||||
font-size: 1.8rem;
|
||||
padding-top: 19px !important;
|
||||
padding-bottom: 20px !important;
|
||||
}
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mediumText {
|
||||
font-size: 3rem;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
padding-top: 20px !important;
|
||||
padding-bottom: 20px !important;
|
||||
}
|
||||
|
||||
.digit {
|
||||
font-size: 5rem;
|
||||
@include media-breakpoint-up(sm) {
|
||||
font-size: 2.5rem;
|
||||
}
|
||||
@include media-breakpoint-up(xxl) {
|
||||
font-size: 5rem;
|
||||
}
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.digit-blank {
|
||||
content: "abc";
|
||||
}
|
||||
|
||||
#customText {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
#toggleTimerArea {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#system_info {
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,327 +0,0 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="">
|
||||
<link href="/css/style.css" rel="stylesheet">
|
||||
<title>₿TClock</title>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.7/handlebars.min.js"
|
||||
integrity="sha512-RNLkV3d+aLtfcpEyFG8jRbnWHxUqVZozacROI4J2F1sTaDqo1dPQYs01OMi1t1w9Y2FdbSCDSQ2ZVdAC8bzgAg=="
|
||||
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav class="navbar navbar-expand">
|
||||
<div class="container-fluid">
|
||||
<span class="navbar-brand mb-0 h1">₿TClock</span>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" target="_blank" href="api.html">API</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</nav>
|
||||
<script id="entry-template" type="text/x-handlebars-template">
|
||||
<div class="entry">
|
||||
<h2>Status</h2>
|
||||
<div class="body">
|
||||
<div class="btn-group btn-group-sm" role="group" aria-label="Screens toggle button group">
|
||||
{{#each screens }}
|
||||
<input type="radio" class="btn-check" name="btnradio" id="btnradio{{ @index }}" autocomplete="off" {{#ifEquals @index ../currentScreen }} checked {{/ifEquals}} onclick="changeScreen({{ @index }})">
|
||||
<label class="btn btn-outline-primary" for="btnradio{{ @index }}">{{ this }}</label>
|
||||
{{/each}}
|
||||
|
||||
</div>
|
||||
<p>Rendered:</p>
|
||||
{{#if rendered }}
|
||||
<div class="btcclock-wrapper" id="btcclock-wrapper">
|
||||
<div class="btclock">
|
||||
{{#each data }}
|
||||
{{{splitText this}}}
|
||||
{{/each}}
|
||||
</div></div>
|
||||
{{/if}}
|
||||
{{#if ledStatus }}
|
||||
<p>LED status:</p>
|
||||
|
||||
{{#each ledStatus }}
|
||||
<div style="background: #{{ this }}"> </div>
|
||||
{{/each}}
|
||||
|
||||
{{/if}}
|
||||
<div>
|
||||
<p>Screen cycle:
|
||||
<span onclick="toggleTimer({{ timerRunning }})" id="toggleTimerArea">
|
||||
{{#if timerRunning}}
|
||||
⏵ running
|
||||
{{else}}
|
||||
⏸ stopped
|
||||
{{/if}}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<hr>
|
||||
<div>
|
||||
<div class="progress" role="progressbar" aria-label="Memory free" aria-valuenow="{{ memFreePercent }}" aria-valuemin="0" aria-valuemax="100">
|
||||
<div class="progress-bar progress-bar-striped" style="width: {{ memFreePercent }}%">{{ memFreePercent }}%</div>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<div>Memory free</div>
|
||||
<div>{{ memFree }} / {{ memTotal }} KiB</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div>
|
||||
<p>Uptime: {{#if uptime.h }}{{ uptime.h }}h {{/if}}{{ uptime.m }}m {{ uptime.s }}s</p>
|
||||
<p>
|
||||
WS Price connection:
|
||||
<span>
|
||||
{{#if connectionStatus.price}}
|
||||
✅
|
||||
{{else}}
|
||||
❌
|
||||
{{/if}}
|
||||
</span>
|
||||
-
|
||||
WS Mempool.space connection:
|
||||
<span>
|
||||
{{#if connectionStatus.blocks}}
|
||||
✅
|
||||
{{else}}
|
||||
❌
|
||||
{{/if}}
|
||||
</span><br>
|
||||
<small>If you use "Fetch € price" the WS Price connection will show ❌ since it uses another data source.</small>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="col-sm-3">
|
||||
<div class="p-3 border rounded-2">
|
||||
<h2>Custom text</h2>
|
||||
<form name="customText" id="customTextForm">
|
||||
<div class="row">
|
||||
<label for="customText" class="col-sm-4 col-form-label">Text</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control" id="customText" name="customText" maxlength="7">
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
<button type="submit" class="btn btn-primary">Show Text</button>
|
||||
</footer>
|
||||
</form>
|
||||
<hr>
|
||||
<h2>LEDs</h2>
|
||||
<form id="ledsForm" name="ledsForm">
|
||||
<div class="row">
|
||||
<label for="ledColorPicker" class="col-sm-6 col-form-label">LEDs color</label>
|
||||
<div class="col-sm-6">
|
||||
<input type="color" id="ledColorPicker" name="pickedColor" value="#ff8800">
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-secondary" id="turnOffLedsBtn">Turn off</button>
|
||||
<button type="submit" class="btn btn-primary">Set color</button>
|
||||
</form>
|
||||
<hr>
|
||||
<h2>System info</h2>
|
||||
<ul class="small" id="system_info">
|
||||
<li>Version: <span id="gitRev"></span></li>
|
||||
<li>Build time: <span id="lastBuildTime"></span></li>
|
||||
<li>IP: <span id="ipAddress"></span></li>
|
||||
<li>Hostname: <span id="hostname"></span></li>
|
||||
</ul>
|
||||
<button type="button" class="btn btn-danger" id="restartBtn">Restart</button>
|
||||
<button type="button" class="btn btn-warning" id="forceFullRefresh">Force full refresh</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-sm-5">
|
||||
<div id="output" class="p-3 border rounded-2">Loading, please wait...</div>
|
||||
</div>
|
||||
<div class="col-sm-4">
|
||||
<div class="h-100 p-3 border rounded-2">
|
||||
<h2>Settings</h2>
|
||||
<form method="post" action="/api/settings" name="settings" id="settingsForm">
|
||||
<div class="row">
|
||||
<label for="fgColor" class="col-sm-6 col-form-label col-form-label-sm">Text color</label>
|
||||
<div class="col-sm-6">
|
||||
<select class="form-select form-select-sm" id="fgColor" name="fgColor">
|
||||
<option value="0xFFFF">White</option>
|
||||
<option value="0x0">Black</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="bgColor" class="col-sm-6 col-form-label col-form-label-sm">Background color</label>
|
||||
<div class="col-sm-6">
|
||||
<select class="form-select form-select-sm" id="bgColor" name="bgColor">
|
||||
<option value="0xFFFF">White</option>
|
||||
<option value="0x0">Black</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="timePerScreen" class="col-sm-6 col-form-label col-form-label-sm">Time per screen</label>
|
||||
<div class="col-sm-6">
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="number" min="1" name="timePerScreen" id="timePerScreen" class="form-control">
|
||||
<span class="input-group-text">minutes</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="fullRefreshMin" class="col-sm-6 col-form-label col-form-label-sm">Full refresh every</label>
|
||||
<div class="col-sm-6">
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="number" min="1" name="fullRefreshMin" id="fullRefreshMin" class="form-control">
|
||||
<span class="input-group-text">minutes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="minSecPriceUpd" class="col-sm-6 col-form-label col-form-label-sm">Time between price
|
||||
updates</label>
|
||||
<div class="col-sm-6 mb-3">
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="number" name="minSecPriceUpd" min="1" id="minSecPriceUpd" class="form-control">
|
||||
<span class="input-group-text">seconds</span>
|
||||
</div>
|
||||
<div class="form-text">Short amounts might shorten lifespan.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="tzOffset" class="col-sm-6 col-form-label col-form-label-sm">Timezone offset</label>
|
||||
<div class="col-sm-6">
|
||||
<div class="input-group input-group-sm">
|
||||
<input type="number" name="tzOffset" id="tzOffset" class="form-control">
|
||||
<span class="input-group-text">min</span>
|
||||
<button class="btn btn-outline-secondary" type="button" id="getTzOffsetBtn">Auto</button>
|
||||
</div>
|
||||
<div class="form-text">A restart is required to apply TZ offset.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<label class="col-sm-6 col-form-label col-form-label-sm" for="ledBrightness">LED brightness</label>
|
||||
<div class="col-sm-6">
|
||||
<input type="range" class="form-range" id="ledBrightness" name="ledBrightness" value="128" min="0"
|
||||
max="255">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="mempoolInstance" class="col-sm-6 col-form-label col-form-label-sm">Mempool Instance</label>
|
||||
<div class="col-sm-6">
|
||||
<input type="text" name="mempoolInstance" id="mempoolInstance" class="form-control">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<label for="hostnamePrefix" class="col-sm-6 col-form-label col-form-label-sm">Hostname prefix</label>
|
||||
<div class="col-sm-6">
|
||||
<input type="text" name="hostnamePrefix" id="hostnamePrefix" class="form-control">
|
||||
<div class="form-text">A restart is required to apply new hostname prefix.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="ledTestOnPower" name="ledTestOnPower" value="1">
|
||||
<label class="form-check-label" for="ledTestOnPower">LED power-on test</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="ledFlashOnUpdate" name="ledFlashOnUpd" value="1">
|
||||
<label class="form-check-label" for="ledFlashOnUpdate">LED flash on new block</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="stealFocusOnBlock" name="stealFocusOnBlock"
|
||||
value="1">
|
||||
<label class="form-check-label" for="stealFocusOnBlock">Steal focus on new block</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="mcapBigChar" name="mcapBigChar" value="1">
|
||||
<label class="form-check-label" for="mcapBigChar">Use big characters for market cap</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="otaEnabled" name="otaEnabled" value="1">
|
||||
<label class="form-check-label" for="otaEnabled">OTA updates (restart required)</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="mdnsEnabled" name="mdnsEnabled" value="1">
|
||||
<label class="form-check-label" for="mdnsEnabled">mDNS (restart required)</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="fetchEurPrice" name="fetchEurPrice" value="1">
|
||||
<label class="form-check-label" for="fetchEurPrice">Fetch € price (restart required)</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<script id="screens-template" type="text/x-handlebars-template">
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
{{#each screens }}
|
||||
<div class="form-check form-switch">
|
||||
<input class="form-check-input" type="checkbox" id="screen{{id}}" name="screen[{{id}}]" value="1" {{#if enabled}}checked{{/if}}>
|
||||
<label class="form-check-label" for="screen{{id}}">{{name}}</label>
|
||||
</div>
|
||||
{{#ifEquals @index 2}}
|
||||
</div>
|
||||
<div class="col-sm-6">
|
||||
{{/ifEquals}}
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
<h3>Screens</h3>
|
||||
<div id="outputScreens"></div>
|
||||
<div class="d-grid gap-2 d-md-block">
|
||||
<button type="submit" class="btn btn-secondary">Reset</button>
|
||||
<button type="submit" class="btn btn-primary" id="saveSettingsBtn">Save</button>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
|
||||
</footer>
|
||||
<script src="/js/script.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,20 +0,0 @@
|
|||
//import "handlebars/dist/handlebars.js";
|
||||
|
||||
Handlebars.registerHelper('splitText', function (aString) {
|
||||
if (aString.includes("/")) {
|
||||
var c = aString.split("/").map((el) => { return "<div class=\"flex-items\">" + el + "</div>"; }).join('');
|
||||
return "<div class=\"splitText\">" + c + "</div>";
|
||||
}
|
||||
if (aString.length > 1 && !aString.startsWith("&")) {
|
||||
return "<div class=\"mediumText\">" + aString + "</div>";
|
||||
}
|
||||
if (aString.length == 0 || aString === " ") {
|
||||
aString = " ";
|
||||
}
|
||||
//return aString;
|
||||
return "<div class=\"digit\">" + aString + "</div>";
|
||||
});
|
||||
|
||||
Handlebars.registerHelper('ifEquals', function(arg1, arg2, options) {
|
||||
return (arg1 == arg2) ? options.fn(this) : options.inverse(this);
|
||||
});
|
||||
|
|
@ -1,262 +0,0 @@
|
|||
import './helpers.js';
|
||||
|
||||
var screens = ["Block Height", "Moscow Time", "Ticker", "Time", "Halving countdown", "Market Cap"];
|
||||
|
||||
toTime = (secs) => {
|
||||
var hours = Math.floor(secs / (60 * 60));
|
||||
|
||||
var divisor_for_minutes = secs % (60 * 60);
|
||||
var minutes = Math.floor(divisor_for_minutes / 60);
|
||||
|
||||
var divisor_for_seconds = divisor_for_minutes % 60;
|
||||
var seconds = Math.ceil(divisor_for_seconds);
|
||||
|
||||
var obj = {
|
||||
"h": hours,
|
||||
"m": minutes,
|
||||
"s": seconds
|
||||
};
|
||||
return obj;
|
||||
}
|
||||
|
||||
let processStatusData = (jsonData) => {
|
||||
var source = document.getElementById("entry-template").innerHTML;
|
||||
var template = Handlebars.compile(source);
|
||||
|
||||
|
||||
let index = jsonData.data.findIndex(d => d === '[');
|
||||
|
||||
if (index !== -1) {
|
||||
jsonData.data[index] = '€';
|
||||
}
|
||||
|
||||
var context = {
|
||||
timerRunning: jsonData.timerRunning,
|
||||
memFreePercent: Math.round(jsonData.espFreeHeap / jsonData.espHeapSize * 100),
|
||||
memFree: Math.round(jsonData.espFreeHeap / 1024),
|
||||
memTotal: Math.round(jsonData.espHeapSize / 1024),
|
||||
uptime: toTime(jsonData.espUptime),
|
||||
currentScreen: jsonData.currentScreen,
|
||||
rendered: jsonData.data,
|
||||
data: jsonData.data,
|
||||
screens: screens,
|
||||
ledStatus: jsonData.ledStatus ? jsonData.ledStatus.map((t) => (t).toString(16)) : [],
|
||||
connectionStatus: jsonData.connectionStatus
|
||||
};
|
||||
|
||||
|
||||
document.getElementById('output').innerHTML = template(context);
|
||||
}
|
||||
|
||||
|
||||
if (!!window.EventSource) {
|
||||
const connectEventSource = () => {
|
||||
let source = new EventSource('/events');
|
||||
|
||||
source.addEventListener('open', (e) => {
|
||||
console.log("Status EventSource Connected");
|
||||
if (e.data) {
|
||||
processStatusData(JSON.parse(e.data));
|
||||
}
|
||||
}, false);
|
||||
|
||||
source.addEventListener('error', (e) => {
|
||||
if (e.target.readyState != EventSource.OPEN) {
|
||||
console.log("Status EventSource Disconnected");
|
||||
setTimeout(connectEventSource, 10000);
|
||||
}
|
||||
source.close();
|
||||
}, false);
|
||||
|
||||
source.addEventListener('status', (e) => {
|
||||
processStatusData(JSON.parse(e.data));
|
||||
}, false);
|
||||
|
||||
source.addEventListener('message', (e) => {
|
||||
if (e.data == "closing") {
|
||||
console.log("Closing EventSource, trying to reconnect in 10 seconds")
|
||||
source.close();
|
||||
setTimeout(connectEventSource, 10000);
|
||||
}
|
||||
}, false);
|
||||
};
|
||||
|
||||
connectEventSource();
|
||||
}
|
||||
|
||||
|
||||
// getBcStatus = () => {
|
||||
// fetch('/api/status', {
|
||||
// method: 'get'
|
||||
// })
|
||||
// .then(response => response.json())
|
||||
// .then()
|
||||
// .catch(err => {
|
||||
// //error block
|
||||
// });
|
||||
// }
|
||||
|
||||
// interval = setInterval(getBcStatus, 2500);
|
||||
// getBcStatus();
|
||||
|
||||
fetch('/api/settings', {
|
||||
method: 'get'
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(jsonData => {
|
||||
var fgColor = ("0x" + jsonData.fgColor.toString(16).toUpperCase());
|
||||
// if (jsonData.epdColors == 2) {
|
||||
// document.getElementById('fgColor').querySelector('[value="0xF800"]').remove();
|
||||
// document.getElementById('bgColor').querySelector('[value="0xF800"]').remove();
|
||||
// }
|
||||
|
||||
document.getElementById('customText').setAttribute('maxlength', jsonData.numScreens);
|
||||
document.getElementById('output').classList.add("fg-" + jsonData.fgColor.toString(16));
|
||||
document.getElementById('output').classList.add("bg-" + jsonData.bgColor.toString(16));
|
||||
|
||||
document.getElementById('fgColor').value = fgColor;
|
||||
document.getElementById('bgColor').value = "0x" + jsonData.bgColor.toString(16).toUpperCase();
|
||||
|
||||
if (jsonData.ledFlashOnUpdate)
|
||||
document.getElementById('ledFlashOnUpdate').checked = true;
|
||||
|
||||
if (jsonData.stealFocusOnBlock)
|
||||
document.getElementById('stealFocusOnBlock').checked = true;
|
||||
|
||||
if (jsonData.mcapBigChar)
|
||||
document.getElementById('mcapBigChar').checked = true;
|
||||
|
||||
if (jsonData.mdnsEnabled)
|
||||
document.getElementById('mdnsEnabled').checked = true;
|
||||
|
||||
if (jsonData.otaEnabled)
|
||||
document.getElementById('otaEnabled').checked = true;
|
||||
|
||||
if (jsonData.ledTestOnPower)
|
||||
document.getElementById('ledTestOnPower').checked = true;
|
||||
|
||||
if (jsonData.fetchEurPrice)
|
||||
document.getElementById('fetchEurPrice').checked = true;
|
||||
|
||||
// let nodeFields = ["rpcHost", "rpcPort", "rpcUser", "tzOffset"];
|
||||
|
||||
// for (let n of nodeFields) {
|
||||
// document.getElementById(n).value = jsonData[n];
|
||||
// }
|
||||
|
||||
document.getElementById('timePerScreen').value = jsonData.timerSeconds / 60;
|
||||
document.getElementById('ledBrightness').value = jsonData.ledBrightness;
|
||||
document.getElementById('fullRefreshMin').value = jsonData.fullRefreshMin;
|
||||
document.getElementById('tzOffset').value = jsonData.tzOffset;
|
||||
document.getElementById('mempoolInstance').value = jsonData.mempoolInstance;
|
||||
document.getElementById('hostnamePrefix').value = jsonData.hostnamePrefix;
|
||||
|
||||
document.getElementById('minSecPriceUpd').value = jsonData.minSecPriceUpd;
|
||||
|
||||
if (jsonData.gitRev)
|
||||
document.getElementById('gitRev').innerHTML = jsonData.gitRev;
|
||||
|
||||
if (jsonData.hostname)
|
||||
document.getElementById('hostname').innerHTML = jsonData.hostname;
|
||||
|
||||
if (jsonData.ip)
|
||||
document.getElementById('ipAddress').innerHTML = jsonData.ip;
|
||||
|
||||
if (jsonData.lastBuildTime)
|
||||
document.getElementById('lastBuildTime').innerHTML = new Date((jsonData.lastBuildTime * 1000)).toLocaleString();
|
||||
|
||||
var source = document.getElementById("screens-template").innerHTML;
|
||||
var template = Handlebars.compile(source);
|
||||
var context = { screens: jsonData.screens };
|
||||
document.getElementById('outputScreens').innerHTML = template(context);
|
||||
})
|
||||
.catch(err => {
|
||||
console.log('error', err);
|
||||
});
|
||||
|
||||
|
||||
|
||||
var settingsForm = document.querySelector('#settingsForm');
|
||||
settingsForm.onsubmit = (event) => {
|
||||
var formData = new FormData(settingsForm);
|
||||
|
||||
fetch("/api/settings",
|
||||
{
|
||||
body: formData,
|
||||
method: "post"
|
||||
}).then(() => {
|
||||
console.log('Submitted');
|
||||
document.getElementById('saveSettingsBtn')?.classList.add('btn-success');
|
||||
});
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
document.getElementById('restartBtn').onclick = (event) => {
|
||||
fetch('/api/restart');
|
||||
return false;
|
||||
}
|
||||
|
||||
document.getElementById('forceFullRefresh').onclick = (event) => {
|
||||
fetch('/api/full_refresh');
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
var ledsForm = document.querySelector('#ledsForm');
|
||||
ledsForm.onsubmit = (event) => {
|
||||
var formData = new FormData(ledsForm);
|
||||
|
||||
fetch('/api/lights/' + encodeURIComponent(formData.get('pickedColor').substring(1)), {
|
||||
method: 'get'
|
||||
})
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
turnOffLedsBtn.onclick = (event) => {
|
||||
fetch('/api/lights/off', {
|
||||
method: 'get'
|
||||
})
|
||||
return false;
|
||||
}
|
||||
|
||||
let tzOffsetBtn = document.getElementById('getTzOffsetBtn');
|
||||
|
||||
if (tzOffsetBtn)
|
||||
tzOffsetBtn.onclick = (event) => {
|
||||
document.getElementById("tzOffset").value = new Date(new Date().getFullYear(), 0, 1).getTimezoneOffset() * -1;
|
||||
return false;
|
||||
};
|
||||
|
||||
var textForm = document.querySelector('#customTextForm');
|
||||
textForm.onsubmit = (event) => {
|
||||
var formData = new FormData(textForm);
|
||||
|
||||
fetch('/api/show/text/' + encodeURIComponent(formData.get('customText')), {
|
||||
method: 'get'
|
||||
})
|
||||
.then(response => response.json())
|
||||
.catch(err => {
|
||||
//error block
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
changeScreen = (id) => {
|
||||
fetch('/api/show/screen/' + encodeURIComponent(id), {
|
||||
method: 'get'
|
||||
})
|
||||
.then(response => response.json())
|
||||
.catch(err => {
|
||||
//error block
|
||||
});
|
||||
}
|
||||
|
||||
toggleTimer = (currentStatus) => {
|
||||
if (currentStatus) {
|
||||
fetch('/api/action/pause');
|
||||
} else {
|
||||
fetch('/api/action/timer_restart');
|
||||
}
|
||||
}
|
||||
|
|
@ -1,227 +0,0 @@
|
|||
openapi: 3.0.3
|
||||
info:
|
||||
title: BTClock API
|
||||
version: "3.0"
|
||||
description: BTClock V3 API
|
||||
servers:
|
||||
- url: /api/
|
||||
paths:
|
||||
/status:
|
||||
get:
|
||||
tags:
|
||||
- system
|
||||
summary: Get current status
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/system_status:
|
||||
get:
|
||||
tags:
|
||||
- system
|
||||
summary: Get system status
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/settings:
|
||||
get:
|
||||
tags:
|
||||
- system
|
||||
summary: Get current settings
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
post:
|
||||
tags:
|
||||
- system
|
||||
summary: Save current settings
|
||||
requestBody:
|
||||
content:
|
||||
application/json:
|
||||
schema:
|
||||
$ref: '#/components/schemas/Settings'
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/action/pause:
|
||||
get:
|
||||
tags:
|
||||
- timer
|
||||
summary: Pause screen rotation
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/action/timer_restart:
|
||||
get:
|
||||
tags:
|
||||
- timer
|
||||
summary: Restart screen rotation
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/show/screen/{id}:
|
||||
get:
|
||||
tags:
|
||||
- screens
|
||||
summary: Set screen to show
|
||||
parameters:
|
||||
- in: path
|
||||
name: id
|
||||
schema:
|
||||
type: integer
|
||||
default: 1
|
||||
required: true
|
||||
description: ID of screen to show
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/show/text/{text}:
|
||||
get:
|
||||
tags:
|
||||
- screens
|
||||
summary: Set text to show
|
||||
parameters:
|
||||
- in: path
|
||||
name: text
|
||||
schema:
|
||||
type: string
|
||||
default: "text"
|
||||
required: true
|
||||
description: Text to show
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/show/custom:
|
||||
post:
|
||||
tags:
|
||||
- screens
|
||||
summary: Set text to show (advanced)
|
||||
requestBody:
|
||||
content:
|
||||
application/json:
|
||||
schema:
|
||||
$ref: '#/components/schemas/CustomText'
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/full_refresh:
|
||||
get:
|
||||
tags:
|
||||
- system
|
||||
summary: Force full refresh of all displays
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/lights/{color}:
|
||||
get:
|
||||
tags:
|
||||
- lights
|
||||
summary: Turn on LEDs with specific color
|
||||
parameters:
|
||||
- in: path
|
||||
name: color
|
||||
schema:
|
||||
type: string
|
||||
default: FFCC00
|
||||
required: true
|
||||
description: Color in RGB hex
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/lights/off:
|
||||
get:
|
||||
tags:
|
||||
- lights
|
||||
summary: Turn LEDs off
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
/restart:
|
||||
get:
|
||||
tags:
|
||||
- system
|
||||
summary: Restart BTClock
|
||||
responses:
|
||||
'200':
|
||||
description: successful operation
|
||||
components:
|
||||
schemas:
|
||||
Settings:
|
||||
type: object
|
||||
properties:
|
||||
fetchEurPrice:
|
||||
type: boolean
|
||||
description: Fetch EUR price instead of USD
|
||||
fgColor:
|
||||
type: string
|
||||
default: 0xFFFFFF
|
||||
description: ePaper foreground (text) color
|
||||
bgColor:
|
||||
type: string
|
||||
default: 0x000000
|
||||
description: ePaper background color
|
||||
ledTestOnPower:
|
||||
type: boolean
|
||||
default: true
|
||||
description: Do LED test on power-on
|
||||
ledFlashOnUpd:
|
||||
type: boolean
|
||||
default: false
|
||||
description: Flash LEDs on new block
|
||||
mdnsEnabled:
|
||||
type: boolean
|
||||
default: true
|
||||
description: Enable mDNS
|
||||
otaEnabled:
|
||||
type: boolean
|
||||
default: true
|
||||
description: Enable over-the-air updates
|
||||
stealFocusOnBlock:
|
||||
type: boolean
|
||||
default: false
|
||||
description: Steal focus on new block
|
||||
mcapBigChar:
|
||||
type: boolean
|
||||
default: false
|
||||
description: Use big characters for market cap screen
|
||||
mempoolInstance:
|
||||
type: string
|
||||
default: mempool.space
|
||||
description: Mempool.space instance to connect to
|
||||
ledBrightness:
|
||||
type: integer
|
||||
default: 128
|
||||
description: Brightness of LEDs
|
||||
fullRefreshMin:
|
||||
type: integer
|
||||
default: 60
|
||||
description: Full refresh time of ePaper displays in minutes
|
||||
screen[0]:
|
||||
type: boolean
|
||||
screen[1]:
|
||||
type: boolean
|
||||
screen[2]:
|
||||
type: boolean
|
||||
screen[3]:
|
||||
type: boolean
|
||||
screen[4]:
|
||||
type: boolean
|
||||
screen[5]:
|
||||
type: boolean
|
||||
tzOffset:
|
||||
type: integer
|
||||
default: 60
|
||||
description: Timezone offset in minutes
|
||||
minSecPriceUpd:
|
||||
type: integer
|
||||
default: 30
|
||||
description: Minimum time between price updates in seconds
|
||||
timePerScreen:
|
||||
type: integer
|
||||
default: 30
|
||||
description: Time between screens when rotating in minutes
|
||||
CustomText:
|
||||
type: array
|
||||
items:
|
||||
type: string
|
||||
minItems: 7
|
||||
maxItems: 7
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
{
|
||||
"files": ["src/js/**.ts"],
|
||||
"compilerOptions": {
|
||||
"noImplicitAny": true,
|
||||
}
|
||||
}
|
||||
2774
data/yarn.lock
2774
data/yarn.lock
File diff suppressed because it is too large
Load diff
|
|
@ -8,7 +8,7 @@
|
|||
; Please visit documentation for the other options and examples
|
||||
; https://docs.platformio.org/page/projectconf.html
|
||||
[platformio]
|
||||
data_dir = data/build
|
||||
data_dir = data/build_gz
|
||||
|
||||
[env]
|
||||
platform = https://github.com/platformio/platform-espressif32.git
|
||||
|
|
|
|||
|
|
@ -1,7 +1,36 @@
|
|||
Import("env")
|
||||
import os
|
||||
import gzip
|
||||
from shutil import copyfileobj, rmtree
|
||||
from pathlib import Path
|
||||
|
||||
def gzip_file(input_file, output_file):
|
||||
with open(input_file, 'rb') as f_in:
|
||||
with gzip.open(output_file, 'wb') as f_out:
|
||||
copyfileobj(f_in, f_out)
|
||||
|
||||
def process_directory(input_dir, output_dir):
|
||||
for root, dirs, files in os.walk(input_dir):
|
||||
relative_path = os.path.relpath(root, input_dir)
|
||||
output_root = os.path.join(output_dir, relative_path)
|
||||
|
||||
Path(output_root).mkdir(parents=True, exist_ok=True)
|
||||
|
||||
for file in files:
|
||||
# if file.endswith(('.html', '.css', '.js')):
|
||||
input_file_path = os.path.join(root, file)
|
||||
output_file_path = os.path.join(output_root, file + '.gz')
|
||||
gzip_file(input_file_path, output_file_path)
|
||||
print(f'Compressed: {input_file_path} -> {output_file_path}')
|
||||
|
||||
|
||||
|
||||
# Build web interface before building FS
|
||||
def before_buildfs(source, target, env):
|
||||
env.Execute("cd data && yarn && yarn build")
|
||||
env.Execute("cd data && yarn && PUBLIC_BASE_URL=\"\" yarn build")
|
||||
input_directory = 'data/dist'
|
||||
output_directory = 'data/build_gz'
|
||||
rmtree(output_directory)
|
||||
process_directory(input_directory, output_directory)
|
||||
|
||||
env.AddPreAction("$BUILD_DIR/littlefs.bin", before_buildfs)
|
||||
|
|
|
|||
|
|
@ -16,9 +16,9 @@ void setupWebserver()
|
|||
{ client->send("welcome", NULL, millis(), 1000); });
|
||||
server.addHandler(&events);
|
||||
|
||||
server.serveStatic("/css", LittleFS, "/css/");
|
||||
server.serveStatic("/js", LittleFS, "/js/");
|
||||
server.serveStatic("/font", LittleFS, "/font/");
|
||||
// server.serveStatic("/css", LittleFS, "/css/");
|
||||
// server.serveStatic("/js", LittleFS, "/js/");
|
||||
server.serveStatic("/build", LittleFS, "/build");
|
||||
server.serveStatic("/api.json", LittleFS, "/api.json");
|
||||
server.serveStatic("/api.html", LittleFS, "/api.html");
|
||||
|
||||
|
|
@ -36,6 +36,10 @@ void setupWebserver()
|
|||
|
||||
server.on("/api/show/screen", HTTP_GET, onApiShowScreen);
|
||||
server.on("/api/show/text", HTTP_GET, onApiShowText);
|
||||
|
||||
AsyncCallbackJsonWebHandler *settingsPatchHandler = new AsyncCallbackJsonWebHandler("/api/json/settings", onApiSettingsPatch);
|
||||
server.addHandler(settingsPatchHandler);
|
||||
|
||||
AsyncCallbackJsonWebHandler *handler = new AsyncCallbackJsonWebHandler("/api/show/custom", onApiShowTextAdvanced);
|
||||
server.addHandler(handler);
|
||||
|
||||
|
|
@ -53,7 +57,7 @@ void setupWebserver()
|
|||
server.onNotFound(onNotFound);
|
||||
|
||||
DefaultHeaders::Instance().addHeader("Access-Control-Allow-Origin", "*");
|
||||
DefaultHeaders::Instance().addHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
|
||||
DefaultHeaders::Instance().addHeader("Access-Control-Allow-Methods", "GET, PATCH, POST, OPTIONS");
|
||||
DefaultHeaders::Instance().addHeader("Access-Control-Allow-Headers", "*");
|
||||
|
||||
server.begin();
|
||||
|
|
@ -233,6 +237,90 @@ void onApiShowTextAdvanced(AsyncWebServerRequest *request, JsonVariant &json)
|
|||
request->send(200);
|
||||
}
|
||||
|
||||
void onApiSettingsPatch(AsyncWebServerRequest *request, JsonVariant &json)
|
||||
{
|
||||
JsonObject settings = json.as<JsonObject>();
|
||||
|
||||
bool settingsChanged = true;
|
||||
|
||||
if (settings.containsKey("fgColor"))
|
||||
{
|
||||
String fgColor = settings["fgColor"].as<String>();
|
||||
preferences.putUInt("fgColor", strtol(fgColor.c_str(), NULL, 16));
|
||||
setFgColor(int(strtol(fgColor.c_str(), NULL, 16)));
|
||||
Serial.print(F("Setting foreground color to "));
|
||||
Serial.println(strtol(fgColor.c_str(), NULL, 16));
|
||||
settingsChanged = true;
|
||||
}
|
||||
if (settings.containsKey("bgColor"))
|
||||
{
|
||||
String bgColor = settings["bgColor"].as<String>();
|
||||
|
||||
preferences.putUInt("bgColor", strtol(bgColor.c_str(), NULL, 16));
|
||||
setBgColor(int(strtol(bgColor.c_str(), NULL, 16)));
|
||||
Serial.print(F("Setting background color to "));
|
||||
Serial.println(bgColor.c_str());
|
||||
settingsChanged = true;
|
||||
}
|
||||
|
||||
if (settings.containsKey("timePerScreen"))
|
||||
{
|
||||
preferences.putUInt("timerSeconds", settings["timePerScreen"].as<uint>() * 60);
|
||||
}
|
||||
|
||||
String strSettings[] = {"hostnamePrefix", "mempoolInstance"};
|
||||
|
||||
for (String setting : strSettings)
|
||||
{
|
||||
if (settings.containsKey(setting))
|
||||
{
|
||||
preferences.putString(setting.c_str(), settings[setting].as<String>());
|
||||
Serial.printf("Setting %s to %s\r\n", setting.c_str(), settings[setting].as<String>());
|
||||
}
|
||||
}
|
||||
|
||||
String uintSettings[] = {"minSecPriceUpd", "fullRefreshMin", "gmtOffset", "ledBrightness", "mcapBigChar"};
|
||||
|
||||
for (String setting : uintSettings)
|
||||
{
|
||||
if (settings.containsKey(setting))
|
||||
{
|
||||
preferences.putUInt(setting.c_str(), settings[setting].as<uint>());
|
||||
Serial.printf("Setting %s to %d\r\n", setting.c_str(), settings[setting].as<uint>());
|
||||
}
|
||||
}
|
||||
|
||||
String boolSettings[] = {"fetchEurPrice", "ledTestOnPower", "ledFlashOnUpd", "mdnsEnabled", "otaEnabled", "stealFocus", "mcapBigChar"};
|
||||
|
||||
for (String setting : boolSettings)
|
||||
{
|
||||
if (settings.containsKey(setting))
|
||||
{
|
||||
preferences.putBool(setting.c_str(), settings[setting].as<boolean>());
|
||||
Serial.printf("Setting %s to %d\r\n", setting.c_str(), settings[setting].as<boolean>());
|
||||
}
|
||||
}
|
||||
|
||||
if (settings.containsKey("screens"))
|
||||
{
|
||||
for (JsonVariant screen : settings["screens"].as<JsonArray>())
|
||||
{
|
||||
JsonObject s = screen.as<JsonObject>();
|
||||
uint id = s["id"].as<uint>();
|
||||
String key = "screen[" + String(id) + "]";
|
||||
String prefKey = "screen" + String(id) + "Visible";
|
||||
bool visible = s["enabled"].as<boolean>();
|
||||
preferences.putBool(prefKey.c_str(), visible);
|
||||
}
|
||||
}
|
||||
|
||||
request->send(200);
|
||||
if (settingsChanged)
|
||||
{
|
||||
queueLedEffect(LED_FLASH_SUCCESS);
|
||||
}
|
||||
}
|
||||
|
||||
void onApiRestart(AsyncWebServerRequest *request)
|
||||
{
|
||||
request->send(200);
|
||||
|
|
@ -265,9 +353,9 @@ void onApiSettingsGet(AsyncWebServerRequest *request)
|
|||
root["useBitcoinNode"] = preferences.getBool("useNode", false);
|
||||
root["mempoolInstance"] = preferences.getString("mempoolInstance", DEFAULT_MEMPOOL_INSTANCE);
|
||||
root["ledTestOnPower"] = preferences.getBool("ledTestOnPower", true);
|
||||
root["ledFlashOnUpdate"] = preferences.getBool("ledFlashOnUpd", false);
|
||||
root["ledFlashOnUpd"] = preferences.getBool("ledFlashOnUpd", false);
|
||||
root["ledBrightness"] = preferences.getUInt("ledBrightness", 128);
|
||||
root["stealFocusOnBlock"] = preferences.getBool("stealFocus", true);
|
||||
root["stealFocus"] = preferences.getBool("stealFocus", true);
|
||||
root["mcapBigChar"] = preferences.getBool("mcapBigChar", true);
|
||||
root["mdnsEnabled"] = preferences.getBool("mdnsEnabled", true);
|
||||
root["otaEnabled"] = preferences.getBool("otaEnabled", true);
|
||||
|
|
@ -333,6 +421,32 @@ void onApiSettingsPost(AsyncWebServerRequest *request)
|
|||
|
||||
settingsChanged = processEpdColorSettings(request);
|
||||
|
||||
int headers = request->headers();
|
||||
int i;
|
||||
for (i = 0; i < headers; i++)
|
||||
{
|
||||
AsyncWebHeader *h = request->getHeader(i);
|
||||
Serial.printf("HEADER[%s]: %s\n", h->name().c_str(), h->value().c_str());
|
||||
}
|
||||
|
||||
int params = request->params();
|
||||
for (int i = 0; i < params; i++)
|
||||
{
|
||||
AsyncWebParameter *p = request->getParam(i);
|
||||
if (p->isFile())
|
||||
{ // p->isPost() is also true
|
||||
Serial.printf("FILE[%s]: %s, size: %u\n", p->name().c_str(), p->value().c_str(), p->size());
|
||||
}
|
||||
else if (p->isPost())
|
||||
{
|
||||
Serial.printf("POST[%s]: %s\n", p->name().c_str(), p->value().c_str());
|
||||
}
|
||||
else
|
||||
{
|
||||
Serial.printf("GET[%s]: %s\n", p->name().c_str(), p->value().c_str());
|
||||
}
|
||||
}
|
||||
|
||||
if (request->hasParam("fetchEurPrice", true))
|
||||
{
|
||||
AsyncWebParameter *fetchEurPrice = request->getParam("fetchEurPrice", true);
|
||||
|
|
@ -466,6 +580,13 @@ void onApiSettingsPost(AsyncWebServerRequest *request)
|
|||
|
||||
std::vector<std::string> screenNameMap = getScreenNameMap();
|
||||
|
||||
if (request->hasParam("screens"))
|
||||
{
|
||||
AsyncWebParameter *screenParam = request->getParam("screens", true);
|
||||
|
||||
Serial.printf(screenParam->value().c_str());
|
||||
}
|
||||
|
||||
for (int i = 0; i < screenNameMap.size(); i++)
|
||||
{
|
||||
String key = "screen[" + String(i) + "]";
|
||||
|
|
@ -565,7 +686,7 @@ void onNotFound(AsyncWebServerRequest *request)
|
|||
}
|
||||
else
|
||||
{
|
||||
request->send(404);
|
||||
request->send(200);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -30,6 +30,7 @@ void onApiActionPause(AsyncWebServerRequest *request);
|
|||
void onApiActionTimerRestart(AsyncWebServerRequest *request);
|
||||
void onApiSettingsGet(AsyncWebServerRequest *request);
|
||||
void onApiSettingsPost(AsyncWebServerRequest *request);
|
||||
void onApiSettingsPatch(AsyncWebServerRequest *request, JsonVariant &json);
|
||||
void onApiFullRefresh(AsyncWebServerRequest *request);
|
||||
|
||||
void onApiLightsOff(AsyncWebServerRequest *request);
|
||||
|
|
|
|||
Loading…
Reference in a new issue