diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 3897265..0000000 --- a/.eslintignore +++ /dev/null @@ -1,13 +0,0 @@ -.DS_Store -node_modules -/build -/.svelte-kit -/package -.env -.env.* -!.env.example - -# Ignore files for PNPM, NPM and YARN -pnpm-lock.yaml -package-lock.json -yarn.lock diff --git a/.eslintrc.cjs b/.eslintrc.cjs deleted file mode 100644 index ebc1958..0000000 --- a/.eslintrc.cjs +++ /dev/null @@ -1,30 +0,0 @@ -module.exports = { - root: true, - extends: [ - 'eslint:recommended', - 'plugin:@typescript-eslint/recommended', - 'plugin:svelte/recommended', - 'prettier' - ], - parser: '@typescript-eslint/parser', - plugins: ['@typescript-eslint'], - parserOptions: { - sourceType: 'module', - ecmaVersion: 2020, - extraFileExtensions: ['.svelte'] - }, - env: { - browser: true, - es2017: true, - node: true - }, - overrides: [ - { - files: ['*.svelte'], - parser: 'svelte-eslint-parser', - parserOptions: { - parser: '@typescript-eslint/parser' - } - } - ] -}; diff --git a/.forgejo/workflows/build.yaml b/.forgejo/workflows/build.yaml new file mode 100644 index 0000000..a1e59a8 --- /dev/null +++ b/.forgejo/workflows/build.yaml @@ -0,0 +1,121 @@ +on: [push] +jobs: + check-changes: + runs-on: docker + outputs: + all_changed_and_modified_files_count: ${{ steps.changed-files.outputs.all_changed_and_modified_files_count }} + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Get changed files count + id: changed-files + uses: tj-actions/changed-files@v45 + with: + files_ignore: 'doc/**,README.md,Dockerfile,.*' + files_ignore_separator: ',' + - name: Print changed files count + run: > + echo "Changed files count: ${{ + steps.changed-files.outputs.all_changed_and_modified_files_count }}" + + build: + needs: check-changes + runs-on: docker + container: + image: ghcr.io/catthehacker/ubuntu:js-22.04 + if: ${{ needs.check-changes.outputs.all_changed_and_modified_files_count >= 1 }} + permissions: + contents: write + + steps: + - uses: actions/checkout@v4 + with: + submodules: recursive + - uses: actions/setup-node@v4 + with: + node-version: lts/* + cache: yarn + cache-dependency-path: '**/yarn.lock' + - uses: actions/cache@v4 + with: + path: | + ~/.cache/pip + ~/node_modules + key: ${{ runner.os }}-pio + - uses: actions/setup-python@v5 + with: + python-version: '>=3.10' + - name: Get current date + id: dateAndTime + run: echo "dateAndTime=$(date +'%Y-%m-%d-%H:%M')" >> $GITHUB_OUTPUT + - name: Install mklittlefs + run: > + git clone https://github.com/earlephilhower/mklittlefs.git /tmp/mklittlefs && + cd /tmp/mklittlefs && + git submodule update --init && + make dist + - name: Install yarn + run: yarn && yarn postinstall + - name: Run linter + run: yarn lint + - name: Run vitest tests + run: yarn vitest run + - name: Install Playwright Browsers + run: npx playwright install --with-deps + - name: Run Playwright tests + run: npx playwright test + - name: Build WebUI + run: yarn build + - name: Get current block + id: getBlockHeight + run: echo "blockHeight=$(curl -s https://mempool.space/api/blocks/tip/height)" >> $GITHUB_OUTPUT + - name: Write block height to file + env: + BLOCK_HEIGHT: ${{ steps.getBlockHeight.outputs.blockHeight }} + run: mkdir -p output && echo "$BLOCK_HEIGHT" > output/version.txt + - name: gzip build for LittleFS + run: find dist -type f ! -name ".*" -exec sh -c 'mkdir -p "build_gz/$(dirname "${1#dist/}")" && gzip -k "$1" -c > "build_gz/${1#dist/}".gz' _ {} \; + - name: Write git rev to file + run: echo "$GITHUB_SHA" > build_gz/fs_hash.txt && echo "$GITHUB_SHA" > output/commit.txt + - name: Check GZipped directory size + run: | + # Set the threshold size in bytes + THRESHOLD=410000 + + # Calculate the total size of files in the directory + DIRECTORY_SIZE=$(du -b -s build_gz | awk '{print $1}') + + # Fail the workflow if the size exceeds the threshold + if [ "$DIRECTORY_SIZE" -gt "$THRESHOLD" ]; then + echo "Directory size exceeds the threshold of $THRESHOLD bytes" + exit 1 + else + echo "Directory size is within the threshold $DIRECTORY_SIZE" + fi + - name: Create tarball + run: tar czf webui.tgz --strip-components=1 dist + - name: Build LittleFS + run: | + set -e + /tmp/mklittlefs/mklittlefs -c build_gz -s 410000 output/littlefs.bin + - name: Upload artifacts + uses: https://code.forgejo.org/forgejo/upload-artifact@v4 + with: + path: | + webui.tgz + output/littlefs.bin + - name: Create release + if: github.event_name == 'push' && github.ref == 'refs/heads/main' + uses: https://code.forgejo.org/actions/forgejo-release@v2.4.0 + with: + url: 'https://git.btclock.dev/' + repo: '${{ github.repository }}' + direction: upload + tag: ${{ steps.getBlockHeight.outputs.blockHeight }} + sha: '${{ github.sha }}' + release-dir: output + token: ${{ secrets.TOKEN }} + override: false + verbose: false + release-notes-assistant: false diff --git a/.github/dependabot.yml b/.github/dependabot.yml new file mode 100644 index 0000000..c44914e --- /dev/null +++ b/.github/dependabot.yml @@ -0,0 +1,15 @@ +# To get started with Dependabot version updates, you'll need to specify which +# package ecosystems to update and where the package manifests are located. +# Please see the documentation for all configuration options: +# https://docs.github.com/code-security/dependabot/dependabot-version-updates/configuration-options-for-the-dependabot.yml-file + +version: 2 +updates: + - package-ecosystem: 'npm' # See documentation for possible values + directory: '/' # Location of package manifests + schedule: + interval: 'daily' + versioning-strategy: 'increase-if-necessary' + ignore: + - dependency-name: '*' + update-types: ['version-update:semver-major'] diff --git a/.github/workflows/workflow.yml b/.github/workflows/workflow.yml index e3f9211..310777b 100644 --- a/.github/workflows/workflow.yml +++ b/.github/workflows/workflow.yml @@ -3,35 +3,56 @@ name: BTClock WebUI CI on: [push] env: - PUBLIC_BASE_URL: "" + PUBLIC_BASE_URL: '' jobs: - build: + check-changes: runs-on: ubuntu-latest + outputs: + all_changed_and_modified_files_count: ${{ steps.changed-files.outputs.all_changed_and_modified_files_count }} + steps: + - name: Checkout code + uses: actions/checkout@v4 + + - name: Get changed files count + id: changed-files + uses: tj-actions/changed-files@v45 + with: + files_ignore: 'doc/**,README.md,Dockerfile,.*' + files_ignore_separator: ',' + - name: Print changed files count + run: > + echo "Changed files count: ${{ + steps.changed-files.outputs.all_changed_and_modified_files_count }}" + + build: + needs: check-changes + runs-on: ubuntu-latest + if: ${{ needs.check-changes.outputs.all_changed_and_modified_files_count >= 1 }} permissions: contents: write steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 with: submodules: recursive - - uses: actions/setup-node@v3 + - uses: actions/setup-node@v4 with: node-version: lts/* cache: yarn cache-dependency-path: '**/yarn.lock' - - uses: actions/cache@v3 + - uses: actions/cache@v4 with: path: | ~/.cache/pip ~/node_modules key: ${{ runner.os }}-pio - - uses: actions/setup-python@v4 + - uses: actions/setup-python@v5 with: python-version: '3.9' - name: Get current date id: dateAndTime - run: echo "dateAndTime=$(date +'%Y-%m-%d-%H-%M')" >> $GITHUB_OUTPUT + run: echo "dateAndTime=$(date +'%Y-%m-%d-%H:%M')" >> $GITHUB_OUTPUT - name: Install mklittlefs run: > git clone https://github.com/earlephilhower/mklittlefs.git /tmp/mklittlefs && @@ -40,27 +61,76 @@ jobs: make dist - name: Install yarn run: yarn && yarn postinstall + - name: Run linter + run: yarn lint + - name: Run vitest tests + run: yarn vitest run + - name: Install Playwright Browsers + run: npx playwright install --with-deps + - name: Run Playwright tests + run: npx playwright test - name: Build WebUI run: yarn build + - name: Get current block + id: getBlockHeight + run: echo "blockHeight=$(curl -s https://mempool.space/api/blocks/tip/height)" >> $GITHUB_OUTPUT + - name: Write block height to file + env: + BLOCK_HEIGHT: ${{ steps.getBlockHeight.outputs.blockHeight }} + run: mkdir -p output && echo "$BLOCK_HEIGHT" > output/version.txt - name: gzip build for LittleFS run: find dist -type f ! -name ".*" -exec sh -c 'mkdir -p "build_gz/$(dirname "${1#dist/}")" && gzip -k "$1" -c > "build_gz/${1#dist/}".gz' _ {} \; + - name: Write git rev to file + run: echo "$GITHUB_SHA" > build_gz/fs_hash.txt && echo "$GITHUB_SHA" > output/commit.txt + - name: Check GZipped directory size + run: | + # Set the threshold size in bytes + THRESHOLD=409600 + + # Calculate the total size of files in the directory + DIRECTORY_SIZE=$(du -b -s build_gz | awk '{print $1}') + + # Fail the workflow if the size exceeds the threshold + if [ "$DIRECTORY_SIZE" -gt "$THRESHOLD" ]; then + echo "Directory size exceeds the threshold of $THRESHOLD bytes" + exit 1 + else + echo "Directory size is within the threshold $DIRECTORY_SIZE" + fi - name: Create tarball run: tar czf webui.tgz --strip-components=1 dist - name: Build LittleFS - run: /tmp/mklittlefs/mklittlefs -c build_gz -s 409600 littlefs.bin + run: | + set -e + /tmp/mklittlefs/mklittlefs -c build_gz -s 409600 output/littlefs.bin - name: Upload artifacts - uses: actions/upload-artifact@v3 + uses: actions/upload-artifact@v4 with: path: | webui.tgz - littlefs.bin + output/littlefs.bin - name: Create release + if: github.event_name == 'push' && github.ref == 'refs/heads/main' uses: ncipollo/release-action@v1 with: - tag: main + tag: ${{ steps.getBlockHeight.outputs.blockHeight }} commit: main - name: release-${{ steps.date.outputs.dateAndTime }} - artifacts: "littlefs.bin,webui.tgz" + name: release-${{ steps.getBlockHeight.outputs.blockHeight }} + artifacts: 'output/littlefs.bin,webui.tgz' allowUpdates: true removeArtifacts: true - makeLatest: true \ No newline at end of file + makeLatest: true + - name: Pushes littlefs.bin to web flasher + if: github.event_name == 'push' && github.ref == 'refs/heads/main' + id: push_directory + uses: cpina/github-action-push-to-another-repository@main + env: + SSH_DEPLOY_KEY: ${{ secrets.SSH_DEPLOY_KEY }} + with: + source-directory: output/ + target-directory: webui/ + destination-github-username: 'btclock' + destination-repository-name: 'web-flasher' + target-branch: main + user-name: ${{github.actor}} + user-email: ${{github.actor}}@users.noreply.github.com diff --git a/.gitignore b/.gitignore index 5a5ed98..441fdc9 100644 --- a/.gitignore +++ b/.gitignore @@ -12,3 +12,4 @@ dist vite.config.js.timestamp-* vite.config.ts.timestamp-* yarn-error.log +test-results/ \ No newline at end of file diff --git a/.prettierignore b/.prettierignore index 297772e..96ca2e4 100644 --- a/.prettierignore +++ b/.prettierignore @@ -8,7 +8,7 @@ node_modules !.env.example dist/ build_gz - +dist/** # Ignore files for PNPM, NPM and YARN pnpm-lock.yaml diff --git a/.vscode/settings.json b/.vscode/settings.json index c0772af..2fcadf2 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,6 +1,5 @@ { - "i18n-ally.localesPaths": [ - "src/lib/locales" - ], - "i18n-ally.keystyle": "nested" -} \ No newline at end of file + "i18n-ally.localesPaths": ["src/lib/locales"], + "i18n-ally.keystyle": "nested", + "i18n-ally.sourceLanguage": "en" +} diff --git a/README.md b/README.md index 5c91169..805bfa1 100644 --- a/README.md +++ b/README.md @@ -1,38 +1,41 @@ -# create-svelte +# BTClock WebUI -Everything you need to build a Svelte project, powered by [`create-svelte`](https://github.com/sveltejs/kit/tree/master/packages/create-svelte). +[![BTClock CI](https://github.com/btclock/webui/actions/workflows/workflow.yml/badge.svg)](https://github.com/btclock/webui2/actions/workflows/workflow.yml) -## Creating a project +The web user-interface for the BTClock, based on Svelte-kit. It uses Bootstrap for the lay-out. -If you're seeing this, you've probably already done this step. Congrats! - -```bash -# create a new project in the current directory -npm create svelte@latest - -# create a new project in my-app -npm create svelte@latest my-app -``` +![Screenshot](doc/screenshot.webp) +![Screenshot Dark](doc/screenshot-dark.webp) ## Developing -Once you've created a project and installed dependencies with `npm install` (or `pnpm install` or `yarn`), start a development server: +After installed dependencies with `yarn`, start a development server: ```bash -npm run dev +yarn dev # or start the server and open the app in a new browser tab -npm run dev -- --open +yarn dev -- --open ``` ## Building -To create a production version of your app: +To create a production version of the WebUI: ```bash -npm run build +yarn build ``` -You can preview the production build with `npm run preview`. +Make sure the postinstall script is ran, because otherwise the filenames are to long for the LittleFS filesystem. -> To deploy your app, you may need to install an [adapter](https://kit.svelte.dev/docs/adapters) for your target environment. +## Deploying + +To upload the firmware to the BTClock, you need to GZIP all the files. You can use the python script `gzip_build.py` for that. + +Then you can make a `LittleFS.bin` with mklittlefs: + +```bash +mklittlefs -c build_gz -s 409600 littlefs.bin +``` + +You can preview the production build with `yarn preview`. diff --git a/doc/LICENSE.txt b/doc/LICENSE.txt new file mode 100644 index 0000000..d645695 --- /dev/null +++ b/doc/LICENSE.txt @@ -0,0 +1,202 @@ + + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ + + TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + + 1. Definitions. + + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. + + "Licensor" shall mean the copyright owner or entity authorized by + the copyright owner that is granting the License. + + "Legal Entity" shall mean the union of the acting entity and all + other entities that control, are controlled by, or are under common + control with that entity. For the purposes of this definition, + "control" means (i) the power, direct or indirect, to cause the + direction or management of such entity, whether by contract or + otherwise, or (ii) ownership of fifty percent (50%) or more of the + outstanding shares, or (iii) beneficial ownership of such entity. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "Object" form shall mean any form resulting from mechanical + transformation or translation of a Source form, including but + not limited to compiled object code, generated documentation, + and conversions to other media types. + + "Work" shall mean the work of authorship, whether in Source or + Object form, made available under the License, as indicated by a + copyright notice that is included in or attached to the work + (an example is provided in the Appendix below). + + "Derivative Works" shall mean any work, whether in Source or Object + form, that is based on (or derived from) the Work and for which the + editorial revisions, annotations, elaborations, or other modifications + represent, as a whole, an original work of authorship. For the purposes + of this License, Derivative Works shall not include works that remain + separable from, or merely link (or bind by name) to the interfaces of, + the Work and Derivative Works thereof. + + "Contribution" shall mean any work of authorship, including + the original version of the Work and any modifications or additions + to that Work or Derivative Works thereof, that is intentionally + submitted to Licensor for inclusion in the Work by the copyright owner + or by an individual or Legal Entity authorized to submit on behalf of + the copyright owner. For the purposes of this definition, "submitted" + means any form of electronic, verbal, or written communication sent + to the Licensor or its representatives, including but not limited to + communication on electronic mailing lists, source code control systems, + and issue tracking systems that are managed by, or on behalf of, the + Licensor for the purpose of discussing and improving the Work, but + excluding communication that is conspicuously marked or otherwise + designated in writing by the copyright owner as "Not a Contribution." + + "Contributor" shall mean Licensor and any individual or Legal Entity + on behalf of whom a Contribution has been received by Licensor and + subsequently incorporated within the Work. + + 2. Grant of Copyright License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + copyright license to reproduce, prepare Derivative Works of, + publicly display, publicly perform, sublicense, and distribute the + Work and such Derivative Works in Source or Object form. + + 3. Grant of Patent License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + (except as stated in this section) patent license to make, have made, + use, offer to sell, sell, import, and otherwise transfer the Work, + where such license applies only to those patent claims licensable + by such Contributor that are necessarily infringed by their + Contribution(s) alone or by combination of their Contribution(s) + with the Work to which such Contribution(s) was submitted. If You + institute patent litigation against any entity (including a + cross-claim or counterclaim in a lawsuit) alleging that the Work + or a Contribution incorporated within the Work constitutes direct + or contributory patent infringement, then any patent licenses + granted to You under this License for that Work shall terminate + as of the date such litigation is filed. + + 4. Redistribution. You may reproduce and distribute copies of the + Work or Derivative Works thereof in any medium, with or without + modifications, and in Source or Object form, provided that You + meet the following conditions: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (b) You must cause any modified files to carry prominent notices + stating that You changed the files; and + + (c) You must retain, in the Source form of any Derivative Works + that You distribute, all copyright, patent, trademark, and + attribution notices from the Source form of the Work, + excluding those notices that do not pertain to any part of + the Derivative Works; and + + (d) If the Work includes a "NOTICE" text file as part of its + distribution, then any Derivative Works that You distribute must + include a readable copy of the attribution notices contained + within such NOTICE file, excluding those notices that do not + pertain to any part of the Derivative Works, in at least one + of the following places: within a NOTICE text file distributed + as part of the Derivative Works; within the Source form or + documentation, if provided along with the Derivative Works; or, + within a display generated by the Derivative Works, if and + wherever such third-party notices normally appear. The contents + of the NOTICE file are for informational purposes only and + do not modify the License. You may add Your own attribution + notices within Derivative Works that You distribute, alongside + or as an addendum to the NOTICE text from the Work, provided + that such additional attribution notices cannot be construed + as modifying the License. + + You may add Your own copyright statement to Your modifications and + may provide additional or different license terms and conditions + for use, reproduction, or distribution of Your modifications, or + for any such Derivative Works as a whole, provided Your use, + reproduction, and distribution of the Work otherwise complies with + the conditions stated in this License. + + 5. Submission of Contributions. Unless You explicitly state otherwise, + any Contribution intentionally submitted for inclusion in the Work + by You to the Licensor shall be under the terms and conditions of + this License, without any additional terms or conditions. + Notwithstanding the above, nothing herein shall supersede or modify + the terms of any separate license agreement you may have executed + with Licensor regarding such Contributions. + + 6. Trademarks. This License does not grant permission to use the trade + names, trademarks, service marks, or product names of the Licensor, + except as required for reasonable and customary use in describing the + origin of the Work and reproducing the content of the NOTICE file. + + 7. Disclaimer of Warranty. Unless required by applicable law or + agreed to in writing, Licensor provides the Work (and each + Contributor provides its Contributions) on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or + implied, including, without limitation, any warranties or conditions + of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A + PARTICULAR PURPOSE. You are solely responsible for determining the + appropriateness of using or redistributing the Work and assume any + risks associated with Your exercise of permissions under this License. + + 8. Limitation of Liability. In no event and under no legal theory, + whether in tort (including negligence), contract, or otherwise, + unless required by applicable law (such as deliberate and grossly + negligent acts) or agreed to in writing, shall any Contributor be + liable to You for damages, including any direct, indirect, special, + incidental, or consequential damages of any character arising as a + result of this License or out of the use or inability to use the + Work (including but not limited to damages for loss of goodwill, + work stoppage, computer failure or malfunction, or any and all + other commercial damages or losses), even if such Contributor + has been advised of the possibility of such damages. + + 9. Accepting Warranty or Additional Liability. While redistributing + the Work or Derivative Works thereof, You may choose to offer, + and charge a fee for, acceptance of support, warranty, indemnity, + or other liability obligations and/or rights consistent with this + License. However, in accepting such obligations, You may act only + on Your own behalf and on Your sole responsibility, not on behalf + of any other Contributor, and only if You agree to indemnify, + defend, and hold each Contributor harmless for any liability + incurred by, or claims asserted against, such Contributor by reason + of your accepting any such warranty or additional liability. + + END OF TERMS AND CONDITIONS + + APPENDIX: How to apply the Apache License to your work. + + To apply the Apache License to your work, attach the following + boilerplate notice, with the fields enclosed by brackets "[]" + replaced with your own identifying information. (Don't include + the brackets!) The text should be enclosed in the appropriate + comment syntax for the file format. We also recommend that a + file or class name and description of purpose be included on the + same "printed page" as the copyright notice for easier + identification within third-party archives. + + Copyright [yyyy] [name of copyright owner] + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. diff --git a/doc/screenshot-dark.webp b/doc/screenshot-dark.webp new file mode 100644 index 0000000..a225afe Binary files /dev/null and b/doc/screenshot-dark.webp differ diff --git a/doc/screenshot.webp b/doc/screenshot.webp new file mode 100644 index 0000000..0a5d87e Binary files /dev/null and b/doc/screenshot.webp differ diff --git a/eslint.config.js b/eslint.config.js new file mode 100644 index 0000000..62dbd03 --- /dev/null +++ b/eslint.config.js @@ -0,0 +1,33 @@ +import js from '@eslint/js'; +import ts from 'typescript-eslint'; +import svelte from 'eslint-plugin-svelte'; +import prettier from 'eslint-config-prettier'; +import globals from 'globals'; + +/** @type {import('eslint').Linter.Config[]} */ +export default [ + js.configs.recommended, + ...ts.configs.recommended, + ...svelte.configs['flat/recommended'], + prettier, + ...svelte.configs['flat/prettier'], + { + languageOptions: { + globals: { + ...globals.browser, + ...globals.node + } + } + }, + { + files: ['**/*.svelte'], + languageOptions: { + parserOptions: { + parser: ts.parser + } + } + }, + { + ignores: ['build/', '.svelte-kit/', 'dist/'] + } +]; diff --git a/extra/icons/flash.svg b/extra/icons/flash.svg new file mode 100644 index 0000000..23ca832 --- /dev/null +++ b/extra/icons/flash.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/extra/icons/lightning-bolt.svg b/extra/icons/lightning-bolt.svg new file mode 100644 index 0000000..78cb2c5 --- /dev/null +++ b/extra/icons/lightning-bolt.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/extra/icons/pickaxe.svg b/extra/icons/pickaxe.svg new file mode 100644 index 0000000..2c85559 --- /dev/null +++ b/extra/icons/pickaxe.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/extra/icons/rocket.svg b/extra/icons/rocket.svg new file mode 100644 index 0000000..cf9b58f --- /dev/null +++ b/extra/icons/rocket.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/package.json b/package.json index 744d61e..930fc00 100644 --- a/package.json +++ b/package.json @@ -10,37 +10,63 @@ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", "lint": "prettier --check . && eslint .", "format": "prettier --write .", - "postinstall": "patch-package" + "postinstall": "patch-package", + "test": "npm run test:integration && npm run test:unit", + "test:integration": "playwright test", + "test:unit": "vitest" }, "devDependencies": { "@rollup/plugin-json": "^6.0.1", - "@sveltejs/adapter-auto": "^2.0.0", - "@sveltejs/adapter-static": "^2.0.3", - "@sveltejs/kit": "^1.27.4", + "@sveltejs/adapter-auto": "^3.0.0", + "@sveltejs/adapter-static": "^3.0.0", + "@sveltejs/kit": "^2.0.0", + "@sveltejs/vite-plugin-svelte": "^3.0.1", + "@testing-library/svelte": "^5.2.1", "@types/swagger-ui": "^3.52.4", - "@typescript-eslint/eslint-plugin": "^6.0.0", - "@typescript-eslint/parser": "^6.0.0", - "eslint": "^8.28.0", - "eslint-config-prettier": "^9.0.0", - "eslint-plugin-svelte": "^2.30.0", - "prettier": "^3.0.0", - "prettier-plugin-svelte": "^3.0.0", - "sass": "^1.69.5", - "svelte": "^4.0.5", - "svelte-check": "^3.6.0", - "tslib": "^2.4.1", - "typescript": "^5.0.0", - "vite": "^4.4.2" + "@typescript-eslint/eslint-plugin": "^8.7.0", + "@typescript-eslint/parser": "^8.7.0", + "@vitest/ui": "^2.0.5", + "eslint": "^9.11.0", + "eslint-config-prettier": "^9.1.0", + "eslint-plugin-svelte": "^2.36.0", + "jsdom": "^25.0.0", + "prettier": "^3.3.3", + "prettier-plugin-svelte": "^3.2.6", + "sass": "^1.79.3", + "svelte": "^4.2.19", + "svelte-check": "^4.0.2", + "svelte-preprocess": "^6.0.2", + "tslib": "^2.7.0", + "typescript": "^5.5.4", + "typescript-eslint": "^8.7.0", + "vite": "^5.4.7", + "vitest": "^2.1.1", + "vitest-github-actions-reporter": "^0.11.0" }, "type": "module", "dependencies": { - "@fontsource/antonio": "^5.0.17", - "@fontsource/oswald": "^5.0.17", - "@fontsource/ubuntu": "^5.0.8", - "bootstrap": "^5.3.2", + "@fontsource/antonio": "^5.1.0", + "@fontsource/oswald": "^5.1.0", + "@fontsource/ubuntu": "^5.1.0", + "@noble/secp256k1": "^2.1.0", + "@playwright/test": "^1.46.0", + "@popperjs/core": "^2.11.8", + "@sveltestrap/sveltestrap": "^6.2.7", + "@testing-library/jest-dom": "^6.5.0", + "bootstrap": "^5.3.3", + "bootstrap-icons": "^1.11.3", + "msgpack-es": "^0.0.5", + "nostr-tools": "^2.7.1", "patch-package": "^8.0.0", - "svelte-i18n": "^4.0.0", - "sveltestrap": "^5.11.2", - "swagger-ui": "^5.10.0" - } + "svelte-bootstrap-icons": "^3.1.1", + "svelte-i18n": "^4.0.0" + }, + "resolutions": { + "es5-ext": ">=0.10.64", + "undici": ">=5.28.4", + "ws": ">=8.18.0", + "axios": ">=1.7.7", + "micromatch": ">=4.0.8" + }, + "packageManager": "yarn@1.22.21+sha1.1959a18351b811cdeedbd484a8f86c3cc3bbaf72" } diff --git a/patches/@sveltejs+kit+1.27.6.patch b/patches/@sveltejs+kit+2.7.5.patch similarity index 90% rename from patches/@sveltejs+kit+1.27.6.patch rename to patches/@sveltejs+kit+2.7.5.patch index a008413..e25e1e5 100644 --- a/patches/@sveltejs+kit+1.27.6.patch +++ b/patches/@sveltejs+kit+2.7.5.patch @@ -1,8 +1,8 @@ diff --git a/node_modules/@sveltejs/kit/src/exports/vite/index.js b/node_modules/@sveltejs/kit/src/exports/vite/index.js -index a7a886d..d3433b5 100644 +index 40fa4c6..738cabf 100644 --- a/node_modules/@sveltejs/kit/src/exports/vite/index.js +++ b/node_modules/@sveltejs/kit/src/exports/vite/index.js -@@ -561,9 +561,9 @@ function kit({ svelte_config }) { +@@ -655,9 +655,9 @@ async function kit({ svelte_config }) { input, output: { format: 'esm', diff --git a/patches/@sveltejs+kit+2.8.5.patch b/patches/@sveltejs+kit+2.8.5.patch new file mode 100644 index 0000000..80f5dba --- /dev/null +++ b/patches/@sveltejs+kit+2.8.5.patch @@ -0,0 +1,17 @@ +diff --git a/node_modules/@sveltejs/kit/src/exports/vite/index.js b/node_modules/@sveltejs/kit/src/exports/vite/index.js +index e6521e9..f31c28b 100644 +--- a/node_modules/@sveltejs/kit/src/exports/vite/index.js ++++ b/node_modules/@sveltejs/kit/src/exports/vite/index.js +@@ -639,9 +639,9 @@ async function kit({ svelte_config }) { + input, + output: { + format: 'esm', +- entryFileNames: ssr ? '[name].js' : `${prefix}/[name].[hash].${ext}`, +- chunkFileNames: ssr ? 'chunks/[name].js' : `${prefix}/chunks/[name].[hash].${ext}`, +- assetFileNames: `${prefix}/assets/[name].[hash][extname]`, ++ entryFileNames: ssr ? '[name].js' : `${prefix}/[hash].${ext}`, ++ chunkFileNames: ssr ? 'chunks/[name].js' : `${prefix}/chunks/[hash].${ext}`, ++ assetFileNames: `${prefix}/assets/[hash][extname]`, + hoistTransitiveImports: false, + sourcemapIgnoreList + }, diff --git a/playwright.config.ts b/playwright.config.ts new file mode 100644 index 0000000..d60d61c --- /dev/null +++ b/playwright.config.ts @@ -0,0 +1,17 @@ +import type { PlaywrightTestConfig } from '@playwright/test'; + +const config: PlaywrightTestConfig = { + use: { + locale: 'en-GB', + timezoneId: 'Europe/Amsterdam' + }, + webServer: { + command: 'npm run build && npm run preview', + port: 4173 + }, + reporter: process.env.CI ? 'github' : 'list', + testDir: 'tests', + testMatch: /(.+\.)?(test|spec)\.[jt]s/ +}; + +export default config; diff --git a/src/components/ColorSchemeSwitcher.svelte b/src/components/ColorSchemeSwitcher.svelte new file mode 100644 index 0000000..9d7e32a --- /dev/null +++ b/src/components/ColorSchemeSwitcher.svelte @@ -0,0 +1,53 @@ + + + + + {theme === 'auto' ? '🌗' : theme === 'dark' ? '🌙' : '☀️'} + + + setTheme('light')} + >☀️ Light + setTheme('dark')}>🌙 Dark + setTheme('auto')}>🌗 Auto + + diff --git a/src/components/ToggleHeader.svelte b/src/components/ToggleHeader.svelte new file mode 100644 index 0000000..acc8d3b --- /dev/null +++ b/src/components/ToggleHeader.svelte @@ -0,0 +1,28 @@ + + +

+ (isOpen = !isOpen)} + tabindex="0" + on:keypress={() => (isOpen = !isOpen)} + > + {#if isOpen} + + {:else} + + {/if} + {header} + +

+ + + diff --git a/src/hooks.server.ts b/src/hooks.server.ts index 2c6aa97..1f9b93e 100644 --- a/src/hooks.server.ts +++ b/src/hooks.server.ts @@ -1,10 +1,10 @@ -import type { Handle } from '@sveltejs/kit' -import { locale } from 'svelte-i18n' +import type { Handle } from '@sveltejs/kit'; +import { locale } from 'svelte-i18n'; export const handle: Handle = async ({ event, resolve }) => { - const lang = event.request.headers.get('accept-language')?.split(',')[0] + const lang = event.request.headers.get('accept-language')?.split(',')[0]; if (lang) { - locale.set(lang) + locale.set(lang); } - return resolve(event) -} \ No newline at end of file + return resolve(event); +}; diff --git a/src/icons/PickaxeIcon.svelte b/src/icons/PickaxeIcon.svelte new file mode 100644 index 0000000..6d35c68 --- /dev/null +++ b/src/icons/PickaxeIcon.svelte @@ -0,0 +1,5 @@ + diff --git a/src/icons/RocketIcon.svelte b/src/icons/RocketIcon.svelte new file mode 100644 index 0000000..1317fd7 --- /dev/null +++ b/src/icons/RocketIcon.svelte @@ -0,0 +1,8 @@ + + +rocket-launch diff --git a/src/icons/ZapIcon.svelte b/src/icons/ZapIcon.svelte new file mode 100644 index 0000000..59a5c5c --- /dev/null +++ b/src/icons/ZapIcon.svelte @@ -0,0 +1,6 @@ + + +flash diff --git a/src/lib/config.ts b/src/lib/config.ts new file mode 100644 index 0000000..55130ff --- /dev/null +++ b/src/lib/config.ts @@ -0,0 +1,5 @@ +import * as publicEnv from '$env/static/public'; + +export const PUBLIC_BASE_URL: string = Object.hasOwn(publicEnv, 'PUBLIC_BASE_URL') + ? publicEnv.PUBLIC_BASE_URL + : ''; diff --git a/src/lib/i18n/index.ts b/src/lib/i18n/index.ts index 7f85386..2959787 100644 --- a/src/lib/i18n/index.ts +++ b/src/lib/i18n/index.ts @@ -1,13 +1,18 @@ -import { browser } from '$app/environment' -import { init, register } from 'svelte-i18n' +import { browser } from '$app/environment'; +import { init, register } from 'svelte-i18n'; -const defaultLocale = 'en' +const defaultLocale = 'en'; -register('en', () => import('../locales/en.json')) -register('nl', () => import('../locales/nl.json')) -register('es', () => import('../locales/es.json')) +register('en', () => import('../locales/en.json')); +register('nl', () => import('../locales/nl.json')); +register('es', () => import('../locales/es.json')); +register('de', () => import('../locales/de.json')); init({ fallbackLocale: defaultLocale, - initialLocale: browser ? window.navigator.language : defaultLocale, -}) \ No newline at end of file + initialLocale: browser + ? browser && localStorage.getItem('locale') + ? localStorage.getItem('locale') + : window.navigator.language.slice(0, 2) + : defaultLocale +}); diff --git a/src/lib/index.ts b/src/lib/index.ts index 856f2b6..981d545 100644 --- a/src/lib/index.ts +++ b/src/lib/index.ts @@ -1 +1,81 @@ -// place files you want to import through the `$lib` alias in this folder. +import * as nip19 from 'nostr-tools/nip19'; +import { Relay } from 'nostr-tools'; + +/** + * Validates if the given npub is a valid Nostr Public Key. + * @param npub - The npub (Nostr Public Key) to validate. + * @returns A boolean indicating if the npub is valid. + */ +const isValidNpub = (npub: string): boolean => { + try { + // Decode the npub using NIP-19 + const { type, data } = nip19.decode(npub); + // Check if the type is 'npub' and the data length is 32 bytes + return type === 'npub' && data.length === 64; + } catch { + // If any error is thrown, the npub is not valid + return false; + } +}; + +/** + * Validates if the given URL is a valid Nostr relay. + * @param url - The URL of the Nostr relay to validate. + * @returns A Promise indicating if the URL is a valid Nostr relay. + */ +const isValidNostrRelay = async (url: string): Promise => { + try { + const relay: Relay = await Relay.connect(url); + + // If the relay is successfully connected, it's a valid Nostr relay + if (relay.connected) { + // Close the connection to clean up + relay.close(); + return true; + } + + return false; + } catch { + // If any error is thrown, the URL is not a valid Nostr relay + return false; + } +}; + +/** + * Validates if the given parameter is a valid hex public key. + * @param pubkey - The public key to validate. + * @returns A boolean indicating if the public key is valid. + */ +const isValidHexPubKey = (pubkey: string): boolean => { + return /^[0-9a-f]{64}$/i.test(pubkey); +}; + +/** + * Checks if a parameter is a valid pubkey or npub and converts npub to pubkey. + * @param input - The input string to check and convert. + * @returns The pubkey if valid, otherwise null. + */ + +const getPubKey = (input: string): string | null => { + try { + // If input is a valid hex public key + if (isValidHexPubKey(input)) { + return input; + } + + // Try to decode the input as npub + const { type, data } = nip19.decode(input); + + // Check if the decoded type is 'npub' and the data length is 64 characters (32 bytes in hex) + if (type === 'npub' && data.length === 64) { + return data; + } + + return null; + } catch { + // If any error is thrown, the input is not valid + return null; + } +}; + +export { isValidNpub, isValidNostrRelay, isValidHexPubKey, getPubKey }; diff --git a/src/lib/locales/de.json b/src/lib/locales/de.json new file mode 100644 index 0000000..50c6ffc --- /dev/null +++ b/src/lib/locales/de.json @@ -0,0 +1,130 @@ +{ + "section": { + "settings": { + "title": "Einstellungen", + "textColor": "Textfarbe", + "backgroundColor": "Hintergrundfarbe", + "ledPowerOnTest": "LED-Einschalttest", + "ledFlashOnBlock": "LED blinkt bei neuem Block", + "timePerScreen": "Zeit pro Bildschirm", + "ledBrightness": "LED-Helligkeit", + "flMaxBrightness": "Displaybeleuchtung Helligkeit", + "timezoneOffset": "Zeitzonenoffset", + "timeBetweenPriceUpdates": "Zeit zwischen Preisaktualisierungen", + "fullRefreshEvery": "Vollständige Aktualisierung alle", + "mempoolnstance": "Mempool Instance", + "hostnamePrefix": "Hostnamen-Präfix", + "StealFocusOnNewBlock": "Steal focus on new block", + "useBigCharsMcap": "Verwende große Zeichen für die Marktkapitalisierung", + "useBlkCountdown": "Blocks Countdown zur Halbierung", + "useSatsSymbol": "Sats-Symbol verwenden", + "suffixPrice": "Suffix-Preisformat", + "disableLeds": "Alle LED-Effekte deaktivieren", + "otaUpdates": "OTA updates", + "enableMdns": "mDNS", + "fetchEuroPrice": "€-Preis abrufen", + "shortAmountsWarning": "Geringe Beträge können die Lebensdauer der Displays verkürzen", + "tzOffsetHelpText": "Ein Neustart ist erforderlich, um den TZ-Offset anzuwenden.", + "screens": "Bildschirme", + "wifiTxPowerText": "In den meisten Fällen muss dies nicht eingestellt werden.", + "wifiTxPower": "WiFi-TX-Leistung", + "settingsSaved": "Einstellungen gespeichert", + "errorSavingSettings": "Fehler beim Speichern der Einstellungen", + "ownDataSource": "BTClock-Datenquelle verwenden", + "flAlwaysOn": "Displaybeleuchtung immer an", + "flEffectDelay": "Displaybeleuchtungeffekt Geschwindigkeit", + "flFlashOnUpd": "Displaybeleuchting bei neuem Block", + "mempoolInstanceHelpText": "Nur wirksam, wenn die BTClock-Datenquelle deaktiviert ist. \nZur Anwendung ist ein Neustart erforderlich.", + "luxLightToggle": "Automatisches Umschalten des Frontlichts bei Lux", + "wpTimeout": "WiFi-Konfigurationsportal timeout", + "useNostr": "Nostr-Datenquelle verwenden", + "flDisable": "Displaybeleuchtung deaktivieren", + "httpAuthUser": "WebUI-Benutzername", + "httpAuthPass": "WebUI-Passwort", + "httpAuthText": "Schützt nur die WebUI mit einem Passwort, nicht API-Aufrufe.", + "currencies": "Währungen", + "mowMode": "Mow suffixmodus", + "suffixShareDot": "Kompakte Suffix-Notation", + "section": { + "displaysAndLed": "Anzeigen und LEDs", + "screenSettings": "Infospezifisch", + "dataSource": "Datenquelle", + "extraFeatures": "Zusätzliche Funktionen", + "system": "System" + }, + "ledFlashOnZap": "LED blinkt bei Nostr Zap", + "flFlashOnZap": "Displaybeleuchting bei Nostr Zap", + "showAll": "Alle anzeigen", + "hideAll": "Alles ausblenden" + }, + "control": { + "systemInfo": "Systeminfo", + "version": "Version", + "buildTime": "Build time", + "ledColor": "LED-Farbe", + "turnOff": "Ausschalten", + "setColor": "Farbe festlegen", + "showText": "Text anzeigen", + "text": "Text", + "title": "Kontrolle", + "hostname": "Hostname", + "frontlight": "Displaybeleuchtung", + "turnOn": "Einschalten", + "flashFrontlight": "Blinken" + }, + "status": { + "title": "Status", + "screenCycle": "Bildschirmzyklus", + "memoryFree": "Speicher frei", + "wsPriceConnection": "WS-Preisverbindung", + "wsMempoolConnection": "WS {instance}-Verbindung", + "fetchEuroNote": "If you use \"Fetch € price\" the WS Price connection will show ❌ since it uses another data source.", + "uptime": "Betriebszeit", + "wifiSignalStrength": "WiFi-Signalstärke", + "wsDataConnection": "BTClock-Datenquelle verbindung", + "lightSensor": "Lichtsensor", + "nostrConnection": "Nostr Relay-Verbindung" + }, + "firmwareUpdater": { + "fileUploadSuccess": "Datei erfolgreich hochgeladen, Gerät neu gestartet. WebUI in {countdown} Sekunden neu geladen", + "fileUploadFailed": "Das Hochladen der Datei ist fehlgeschlagen. \nStellen Sie sicher, dass Sie die richtige Datei ausgewählt haben, und versuchen Sie es erneut.", + "uploading": "Hochladen", + "firmwareUpdateText": "Wenn Sie die Firmware-Upload-Funktion verwenden, stellen Sie sicher, dass Sie die richtigen Dateien verwenden. \nDas Hochladen der falschen Dateien kann dazu führen, dass das Gerät nicht mehr funktioniert. \nWenn es schief geht, können Sie die Firmware wiederherstellen, indem Sie das vollständige Image hochladen, nachdem Sie das Gerät in den BOOT-Modus versetzt haben.", + "swUpToDate": "Du hast die neueste Version.", + "swUpdateAvailable": "Eine neuere Version ist verfügbar!", + "latestVersion": "Letzte Version", + "releaseDate": "Veröffentlichungsdatum", + "viewRelease": "Veröffentlichung anzeigen", + "autoUpdate": "Update installieren (experimentell)" + } + }, + "colors": { + "black": "Schwarz", + "white": "Weiss" + }, + "time": { + "minutes": "Minuten", + "seconds": "Sekunden" + }, + "restartRequired": "Neustart erforderlich", + "button": { + "save": "Speichern", + "reset": "Zurücksetzen", + "restart": "Neustart", + "forceFullRefresh": "Vollständige Aktualisierung erzwingen" + }, + "timer": { + "running": "läuft", + "stopped": "gestoppt" + }, + "sections": { + "control": { + "keepSameColor": "Gleiche Farbe beibehalten" + } + }, + "rssiBar": { + "tooltip": "Werte > -67 dBm gelten als gut. > -30 dBm ist erstaunlich" + }, + "warning": "Achtung", + "auto-detect": "Automatische Erkennung" +} diff --git a/src/lib/locales/en.json b/src/lib/locales/en.json index d634291..05f884f 100644 --- a/src/lib/locales/en.json +++ b/src/lib/locales/en.json @@ -1,71 +1,147 @@ { - "section": { - "settings": { - "title": "Settings", - "textColor": "Text color", - "backgroundColor": "Background color", - "ledPowerOnTest": "LED power-on test", - "ledFlashOnBlock": "LED flash on new block", - "timePerScreen": "Time per screen", - "ledBrightness": "LED brightness", - "timezoneOffset": "Timezone offset", - "timeBetweenPriceUpdates": "Time between price updates", - "fullRefreshEvery": "Full refresh every", - "mempoolnstance": "Mempool Instance", - "hostnamePrefix": "Hostname prefix", - "StealFocusOnNewBlock": "Steal focus on new block", - "useBigCharsMcap": "Use big characters for market cap", - "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", - "hostname": "Hostname" - }, - "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": { - "black": "Black", - "white": "White" - }, - "time": { - "minutes": "minutes", - "seconds": "seconds" - }, - "restartRequired": "restart required", - "button": { - "save": "Save", - "reset": "Reset", - "restart": "Restart", - "forceFullRefresh": "Force full refresh" - }, - "timer": { - "running": "running", - "stopped": "stopped" - }, - "sections": { - "control": { - "keepSameColor": "Keep same color" - } - } + "section": { + "settings": { + "title": "Settings", + "textColor": "Text color", + "backgroundColor": "Background color", + "ledPowerOnTest": "LED power-on test", + "ledFlashOnBlock": "LED flash on new block", + "timePerScreen": "Time per screen", + "ledBrightness": "LED brightness", + "timezoneOffset": "Timezone offset", + "timeBetweenPriceUpdates": "Time between price updates", + "fullRefreshEvery": "Full refresh every", + "mempoolnstance": "Mempool Instance", + "hostnamePrefix": "Hostname prefix", + "StealFocusOnNewBlock": "Steal focus on new block", + "useBigCharsMcap": "Use big characters for market cap", + "useBlkCountdown": "Blocks countdown for halving", + "useSatsSymbol": "Use sats symbol", + "suffixPrice": "Suffix price format", + "disableLeds": "Disable all LEDs effects", + "otaUpdates": "OTA updates", + "enableMdns": "mDNS", + "fetchEuroPrice": "Fetch € price", + "shortAmountsWarning": "Short amounts might shorten lifespan of the displays", + "tzOffsetHelpText": "A restart is required to apply TZ offset.", + "screens": "Screens", + "wifiTxPowerText": "In most cases this does not need to be set.", + "wifiTxPower": "WiFi TX power", + "settingsSaved": "Settings saved", + "errorSavingSettings": "Error saving settings", + "ownDataSource": "Use BTClock data source", + "flMaxBrightness": "Frontlight brightness", + "flAlwaysOn": "Frontlight always on", + "flEffectDelay": "Frontlight effect speed", + "flFlashOnUpd": "Frontlight flash on new block", + "mempoolInstanceHelpText": "Only effective when BTClock data-source is disabled. A restart is required to apply.", + "luxLightToggle": "Auto toggle frontlight at lux", + "wpTimeout": "WiFi-config portal timeout", + "nostrPubKey": "Nostr source pubkey", + "nostrZapKey": "Nostr zap pubkey", + "nostrRelay": "Nostr Relay", + "nostrZapNotify": "Nostr Zap Notifications", + "useNostr": "Use Nostr data source", + "bitaxeHostname": "BitAxe hostname or IP", + "bitaxeEnabled": "Enable BitAxe", + "nostrZapPubkey": "Nostr Zap pubkey", + "invalidNostrPubkey": "Invalid Nostr pubkey, note that your pubkey does NOT start with npub.", + "convertingValidNpub": "Converting valid npub to pubkey", + "flDisable": "Disable frontlight", + "httpAuthEnabled": "Require authentication for WebUI", + "httpAuthUser": "WebUI Username", + "httpAuthPass": "WebUI Password", + "httpAuthText": "Only password-protects WebUI, not API-calls.", + "currencies": "Currencies", + "stagingSource": "Use Staging data source (for development)", + "useNostrTooltip": "Very experimental and unstable. Nostr data source is not required for Nostr Zap notifications.", + "mowMode": "Mow Suffix Mode", + "suffixShareDot": "Suffix compact notation", + "section": { + "displaysAndLed": "Displays and LEDs", + "screenSettings": "Screen specific", + "dataSource": "Data source", + "extraFeatures": "Extra features", + "system": "System" + }, + "ledFlashOnZap": "LED flash on Nostr Zap", + "flFlashOnZap": "Frontlight flash on Nostr Zap", + "mqttEnabled": "Enable MQTT", + "mqttHost": "MQTT hostname or IP", + "mqttRootTopic": "MQTT root topic", + "showAll": "Show all", + "hideAll": "Hide all" + }, + "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", + "hostname": "Hostname", + "frontlight": "Frontlight", + "turnOn": "Turn on", + "flashFrontlight": "Flash", + "firmwareUpdate": "Firmware update", + "fwCommit": "Firmware commit" + }, + "status": { + "title": "Status", + "screenCycle": "Screen cycle", + "memoryFree": "Memory free", + "wsPriceConnection": "WS Price connection", + "wsMempoolConnection": "WS {instance} connection", + "fetchEuroNote": "If you use \"Fetch € price\" the WS Price connection will show ❌ since it uses another data source.", + "uptime": "Uptime", + "wifiSignalStrength": "WiFi Signal strength", + "wsDataConnection": "BTClock data-source connection", + "lightSensor": "Light sensor", + "nostrConnection": "Nostr Relay connection" + }, + "firmwareUpdater": { + "fileUploadFailed": "File upload failed. Make sure you have selected the correct file and try again.", + "fileUploadSuccess": "File uploaded successfully, restarting device and reloading WebUI in {countdown} seconds", + "uploading": "Uploading", + "firmwareUpdateText": "When you use the firmware upload functionality, make sure you use the correct files. Uploading the wrong files can result in a non-working device. If it goes wrong, you can restore firmware by uploading the full image after setting the device in BOOT-mode.", + "swUpdateAvailable": "A newer version is available!", + "swUpToDate": "You are up to date.", + "latestVersion": "Latest Version", + "releaseDate": "Release Date", + "viewRelease": "View Release", + "autoUpdate": "Install update (experimental)" + } + }, + "colors": { + "black": "Black", + "white": "White" + }, + "time": { + "minutes": "minutes", + "seconds": "seconds" + }, + "restartRequired": "restart required", + "button": { + "save": "Save", + "reset": "Reset", + "restart": "Restart", + "forceFullRefresh": "Force full refresh" + }, + "timer": { + "running": "running", + "stopped": "stopped" + }, + "sections": { + "control": { + "keepSameColor": "Keep same color" + } + }, + "rssiBar": { + "tooltip": "Values > -67 dBm are considered good. > -30 dBm is amazing" + }, + "warning": "Warning", + "auto-detect": "Auto-detect" } diff --git a/src/lib/locales/es.json b/src/lib/locales/es.json index c3958ae..121767f 100644 --- a/src/lib/locales/es.json +++ b/src/lib/locales/es.json @@ -1,71 +1,129 @@ { - "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", - "hostname": "Nombre de host" - }, - "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" - }, - "sections": { - "control": { - "keepSameColor": "Mantén el mismo color" - } - } + "section": { + "settings": { + "title": "Configuración", + "textColor": "Color de texto", + "backgroundColor": "Color de fondo", + "ledBrightness": "Brillo LED", + "screens": "Pantallas", + "shortAmountsWarning": "Pequeñas cantidades pueden acortar la vida útil de los displays", + "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", + "useBlkCountdown": "Cuenta regresiva en bloques", + "useSatsSymbol": "Usar símbolo sats", + "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", + "suffixPrice": "Precio con sufijos", + "disableLeds": "Desactivar efectos de LED", + "otaUpdates": "Actualización por aire", + "wifiTxPowerText": "En la mayoría de los casos no es necesario configurar esto.", + "settingsSaved": "Configuración guardada", + "errorSavingSettings": "Error al guardar la configuración", + "ownDataSource": "Utilice la fuente de datos BTClock", + "flMaxBrightness": "Brillo de luz de la pantalla", + "flAlwaysOn": "Luz de la pantalla siempre encendida", + "flEffectDelay": "Velocidad del efecto de luz de la pantalla", + "flFlashOnUpd": "Luz de la pantalla parpadea con un nuevo bloque", + "mempoolInstanceHelpText": "Solo es efectivo cuando la fuente de datos BTClock está deshabilitada. \nEs necesario reiniciar para aplicar.", + "luxLightToggle": "Cambio automático de luz frontal en lux", + "wpTimeout": "Portal de configuración WiFi timeout", + "useNostr": "Utilice la fuente de datos Nostr", + "flDisable": "Desactivar luz de la pantalla", + "httpAuthUser": "Nombre de usuario WebUI", + "httpAuthPass": "Contraseña WebUI", + "httpAuthText": "Solo la WebUI está protegida con contraseña, no las llamadas API.", + "currencies": "Monedas", + "mowMode": "Modo de sufijo Mow", + "suffixShareDot": "Notación compacta de sufijo", + "section": { + "displaysAndLed": "Pantallas y LED", + "screenSettings": "Específico de la pantalla", + "dataSource": "fuente de datos", + "extraFeatures": "Funciones adicionales", + "system": "Sistema" + }, + "ledFlashOnZap": "LED parpadeante con Nostr Zap", + "flFlashOnZap": "Flash de luz frontal con Nostr Zap", + "showAll": "Mostrar todo", + "hideAll": "Ocultar todo" + }, + "control": { + "turnOff": "Apagar", + "setColor": "Establecer el color", + "version": "Versión", + "ledColor": "color del LED", + "systemInfo": "Info del sistema", + "showText": "Mostrar texto", + "text": "Texto", + "title": "Control", + "buildTime": "Tiempo de compilación", + "hostname": "Nombre del host", + "turnOn": "Encender", + "frontlight": "Luz de la pantalla", + "flashFrontlight": "Luz intermitente" + }, + "status": { + "memoryFree": "Memoria RAM libre", + "wsPriceConnection": "Conexión WebSocket Precio", + "wsMempoolConnection": "Conexión WebSocket {instance}", + "screenCycle": "Ciclo 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", + "wifiSignalStrength": "Fuerza de la señal WiFi", + "wsDataConnection": "Conexión de fuente de datos BTClock", + "lightSensor": "Sensor de luz", + "nostrConnection": "Conexión de relé Nostr" + }, + "firmwareUpdater": { + "fileUploadSuccess": "Archivo cargado exitosamente, reiniciando el dispositivo. Recargando WebUI en {countdown} segundos", + "fileUploadFailed": "Error al cargar el archivo. \nAsegúrese de haber seleccionado el archivo correcto e inténtelo nuevamente.", + "uploading": "Subiendo", + "firmwareUpdateText": "Cuando utilice la función de carga de firmware, asegúrese de utilizar los archivos correctos. \nCargar archivos incorrectos puede provocar que el dispositivo no funcione. \nSi sale mal, puede restaurar el firmware cargando la imagen completa después de configurar el dispositivo en modo BOOT.", + "swUpToDate": "Tienes la ultima version.", + "swUpdateAvailable": "¡Una nueva versión está disponible!", + "latestVersion": "Ultima versión", + "releaseDate": "Fecha de lanzamiento", + "viewRelease": "Ver lanzamiento", + "autoUpdate": "Instalar actualización (experimental)" + } + }, + "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" + }, + "sections": { + "control": { + "keepSameColor": "Mantén el mismo color" + } + }, + "rssiBar": { + "tooltip": "Se consideran buenos valores > -67 dBm. > -30 dBm es increíble" + }, + "warning": "Aviso", + "auto-detect": "Detección automática" } diff --git a/src/lib/locales/nl.json b/src/lib/locales/nl.json index 24c2396..65c120e 100644 --- a/src/lib/locales/nl.json +++ b/src/lib/locales/nl.json @@ -1,70 +1,129 @@ { - "section": { - "settings": { - "title": "Instellingen", - "textColor": "Tekstkleur", - "backgroundColor": "Achtergrondkleur", - "timeBetweenPriceUpdates": "Tijd tussen prijs updates", - "timezoneOffset": "Tijdzone afwijking", - "ledBrightness": "LED helderheid", - "timePerScreen": "Tijd per scherm", - "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": { - "black": "Zwart", - "white": "Wit" - }, - "time": { - "minutes": "minuten", - "seconds": "seconden" - }, - "restartRequired": "herstart nodig", - "button": { - "save": "Opslaan", - "reset": "Herstel", - "restart": "Herstart", - "forceFullRefresh": "Forceer scherm verversen" - }, - "timer": { - "running": "actief", - "stopped": "gestopt" - }, - "sections": { - "control": { - "keepSameColor": "Behoud zelfde kleur" - } - } + "section": { + "settings": { + "title": "Instellingen", + "textColor": "Tekstkleur", + "backgroundColor": "Achtergrondkleur", + "timeBetweenPriceUpdates": "Tijd tussen prijs updates", + "timezoneOffset": "Tijdzone afwijking", + "ledBrightness": "LED helderheid", + "timePerScreen": "Tijd per scherm", + "fullRefreshEvery": "Volledig verversen elke", + "shortAmountsWarning": "Lage waardes verkorten mogelijk levensduur schermen", + "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", + "useBlkCountdown": "Blocks aftellen voor halving", + "useSatsSymbol": "Gebruik sats symbol", + "fetchEuroPrice": "Toon € prijs", + "screens": "Schermen", + "hostnamePrefix": "Hostnaam voorvoegsel", + "mempoolnstance": "Mempool instantie", + "suffixPrice": "Achtervoegsel prijs formaat", + "disableLeds": "Alle LEDs effecten uit", + "otaUpdates": "OTA updates", + "wifiTxPower": "WiFi TX power", + "wifiTxPowerText": "Meestal hoeft dit niet aangepast te worden.", + "settingsSaved": "Instellingen opgeslagen", + "errorSavingSettings": "Fout bij opslaan instellingen", + "ownDataSource": "BTClock-gegevensbron gebruiken", + "flMaxBrightness": "Displaylicht helderheid", + "flAlwaysOn": "Displaylicht altijd aan", + "flEffectDelay": "Displaylicht effect snelheid", + "flFlashOnUpd": "Knipper displaylicht bij nieuw blok", + "mempoolInstanceHelpText": "Alleen effectief als de BTClock-gegevensbron is uitgeschakeld. \nOm toe te passen is een herstart nodig.", + "luxLightToggle": "Schakelen displaylicht op lux", + "wpTimeout": "WiFi-config-portal timeout", + "useNostr": "Gebruik Nostr-gegevensbron", + "flDisable": "Schakel Displaylicht uit", + "httpAuthUser": "WebUI-gebruikersnaam", + "httpAuthPass": "WebUI-wachtwoord", + "httpAuthText": "Beveiligd enkel WebUI, niet de API.", + "currencies": "Valuta's", + "mowMode": "Mow achtervoegsel", + "suffixShareDot": "Achtervoegsel compacte notatie", + "section": { + "displaysAndLed": "Displays en LED's", + "screenSettings": "Schermspecifiek", + "dataSource": "Gegevensbron", + "extraFeatures": "Extra functies", + "system": "Systeem" + }, + "ledFlashOnZap": "Knipper LED bij Nostr Zap", + "flFlashOnZap": "Knipper displaylicht bij Nostr Zap", + "showAll": "Toon alles", + "hideAll": "Alles verbergen" + }, + "control": { + "systemInfo": "Systeeminformatie", + "version": "Versie", + "buildTime": "Bouwtijd", + "setColor": "Kleur instellen", + "turnOff": "Uitzetten", + "ledColor": "LED kleur", + "showText": "Toon tekst", + "text": "Tekst", + "title": "Besturing", + "frontlight": "Displaylicht", + "turnOn": "Aanzetten", + "flashFrontlight": "Knipper" + }, + "status": { + "title": "Status", + "memoryFree": "Geheugen vrij", + "screenCycle": "Scherm cyclus", + "wsPriceConnection": "WS Prijs verbinding", + "wsMempoolConnection": "WS {instance} verbinding", + "fetchEuroNote": "Wanneer je \"Toon € prijs\" aanzet, zal de prijsverbinding als ❌ verbroken getoond worden vanwege het gebruik van een andere bron.", + "uptime": "Uptime", + "wifiSignalStrength": "WiFi signaalsterkte", + "wsDataConnection": "BTClock-gegevensbron verbinding", + "lightSensor": "Licht sensor", + "nostrConnection": "Nostr Relay-verbinding" + }, + "firmwareUpdater": { + "fileUploadSuccess": "Bestand geüpload, apparaat herstart. WebUI opnieuw geladen over {countdown} seconden", + "fileUploadFailed": "Bestandsupload mislukt. \nZorg ervoor dat het juiste bestand is geselecteerd en probeer het opnieuw.", + "uploading": "Uploaden", + "firmwareUpdateText": "Zorg bij het gebruiken van de firmware upload dat de juiste bestanden gebruikt worden. \nHet uploaden van de verkeerde bestanden kan resulteren in een niet-werkend apparaat. \nAls het misgaat, kunt u de firmware herstellen door de volledige afbeelding te uploaden nadat u het apparaat in de BOOT-modus hebt gezet.", + "swUpToDate": "Je hebt de nieuwste versie.", + "swUpdateAvailable": "Een nieuwere versie is beschikbaar!", + "latestVersion": "Laatste versie", + "releaseDate": "Datum van publicatie", + "viewRelease": "Bekijk publicatie", + "autoUpdate": "Update installeren (experimenteel)" + } + }, + "colors": { + "black": "Zwart", + "white": "Wit" + }, + "time": { + "minutes": "minuten", + "seconds": "seconden" + }, + "restartRequired": "herstart nodig", + "button": { + "save": "Opslaan", + "reset": "Herstel", + "restart": "Herstart", + "forceFullRefresh": "Forceer scherm verversen" + }, + "timer": { + "running": "actief", + "stopped": "gestopt" + }, + "sections": { + "control": { + "keepSameColor": "Behoud zelfde kleur" + } + }, + "rssiBar": { + "tooltip": "Waarden > -67 dBm zijn goed. > -30 dBm is verbazingwekkend" + }, + "warning": "Waarschuwing", + "auto-detect": "Automatische detectie" } diff --git a/src/lib/screen.ts b/src/lib/screen.ts new file mode 100644 index 0000000..293d5e7 --- /dev/null +++ b/src/lib/screen.ts @@ -0,0 +1,18 @@ +import { writable } from 'svelte/store'; + +// Check if window is available +let initialWidth: number = 0; +if (typeof window !== 'undefined') { + initialWidth = window.innerWidth; +} + +// Create a writable store to track screen size +export const screenSize = writable(initialWidth); + +// Function to update the screen size +export const updateScreenSize = (): void => { + // Check if window is available before setting the screen size + if (typeof window !== 'undefined') { + screenSize.set(window.innerWidth); + } +}; diff --git a/src/lib/style/app.scss b/src/lib/style/app.scss index 85cf732..0fd0702 100644 --- a/src/lib/style/app.scss +++ b/src/lib/style/app.scss @@ -1,188 +1,244 @@ -@import "../node_modules/bootstrap/scss/functions"; -@import "../node_modules/bootstrap/scss/variables"; -@import "../node_modules/bootstrap/scss/variables-dark"; +@import '../node_modules/bootstrap/scss/functions'; +@import '../node_modules/bootstrap/scss/variables'; +@import '../node_modules/bootstrap/scss/variables-dark'; //@import "@fontsource/antonio/latin-400.css"; -@import "@fontsource/ubuntu/latin-400.css"; -@import "@fontsource/oswald/latin-400.css"; +@import '@fontsource/ubuntu/latin-400.css'; +//@import '@fontsource/oswald/latin-400.css'; +@import '@fontsource/antonio/latin-400.css'; -$form-range-track-bg: #fff; -$color-mode-type: media-query; -$font-family-base: "Ubuntu"; +@import './satsymbol'; + +$color-mode-type: data; +$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; +$input-font-size-sm: $font-size-base * 0.875; // $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/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/pagination"; +@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/pagination'; -@import "../node_modules/bootstrap/scss/dropdown"; +@import '../node_modules/bootstrap/scss/dropdown'; -@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"; - -@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%; - } -} +@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/tooltip'; +@import '../node_modules/bootstrap/scss/toasts'; +@import '../node_modules/bootstrap/scss/alert'; +@import '../node_modules/bootstrap/scss/helpers'; +@import '../node_modules/bootstrap/scss/utilities/api'; nav { - margin-bottom: 15px; + margin-bottom: 15px; } -.splitText div:first-child::after { - display: block; - content: ''; - margin-top: 0px; - border-bottom: 2px solid; - margin-bottom: 3px; +#btclock-wrapper { + margin: 0 auto; } -#btcclock-wrapper { - margin: 0 auto; -} - -.btclock { - border: 1px solid darkgray; - background: #000; - border-radius: 5px; - 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, - .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; - color: #fff; - } -} - -.darkMode .btclock>div { - color: #fff; - border-color: #fff; -} - -.lightMode .btclock>div { - background: #fff; -} - -.lightMode .btclock>div { - color: #000; -} - -.darkMode .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"; +.btn-group-sm .btn { + font-size: 0.8rem; } #customText { - text-transform: uppercase; + text-transform: uppercase; } -.system_info { - padding: 0; - li { - list-style: none; - } +.btclock-wrapper { + .btclock { + background: #000; + display: flex; + font-size: calc(3vw + 3vh); + font-family: 'Antonio', sans-serif; + font-weight: 400; + padding: 10px; + gap: 10px; + + .digit, + .splitText, + .mediumText { + border: 2px solid gold; + border-radius: 8px; + display: flex; + align-items: center; + justify-content: center; + text-align: center; + padding: 10px 10px 15px 10px; + width: calc(12vw + 12vh); /* Set a dynamic width based on viewport */ + aspect-ratio: 1 / 1.5; /* Maintain a 1:1 aspect ratio */ + + hr { + width: 75%; /* Line width relative to digit square */ + border: 0; + border-top: 2px solid #fff; + margin: 0; /* Remove default margin */ + padding: 0; + opacity: 1; + } + } + + .digit.sats { + padding-top: 35px; + } + + .mediumText { + font-size: calc(1.25vw + 1.25vh); + } + + .splitText { + flex-direction: column; /* Stack the text and line vertically */ + align-items: center; + justify-content: space-around; /* Distribute items with space between */ + padding: 10px; + } + + .splitText div:first-child::after { + display: block; + content: ''; + margin-top: 0px; + border-bottom: 2px solid; + margin-bottom: 3px; + } + + .splitText { + font-size: calc(0.5vw + 1vh); + + .top-text, + .bottom-text { + margin: 0; + line-height: 1; + } + + .top-text { + margin-bottom: -45px; + } + + .bottom-text { + margin-top: -45px; + } + } + + .digit-blank { + content: 'abc'; + } + + .digit.icon { + content: 'abc'; + + svg { + width: 100%; + } + } + } + + .digit.sats { + font-family: 'Satoshi Symbol', sans-serif; + content: 'a'; + } + + @media (max-width: 576px) { + .btclock { + font-size: calc(2vw + 2vh); /* Adjust for small screens if necessary */ + + .digit, + .splitText, + .mediumText { + padding: 5px; + } + + .splitText { + font-size: calc(1.2vw + 1.2vh); + + .top-text, + .bottom-text { + margin: 0; + line-height: 1; + } + + .top-text { + margin-bottom: -10px; + } + + .bottom-text { + margin-top: -10px; + } + } + } + } +} + +.darkMode .btclock > div { + color: #fff; + border-color: #fff; +} + +.darkMode .btclock > div { + background: #000; + color: #fff; +} + +.lightMode .btclock { + & > div { + background: #fff; + color: #000; + } + + .splitText hr { + border-top: 2px solid #000; + } +} + +.lightMode .btclock > div { + color: #000; +} + +.system_info { + padding: 0; + + li { + list-style: none; + } } .card-title { - margin-bottom: 0; -} \ No newline at end of file + margin-bottom: 0; +} + +.navbar-brand { + font-style: italic; + font-weight: 600; +} + +.firmwareUploadStatusAlert, +#firmwareUploadProgress { + @extend .my-2; +} + +.sats { + font-family: 'Satoshi Symbol'; +} + +.currencyCode { + width: 20%; + text-align: center; + display: inline-block; +} + +input[type='number'] { + text-align: right; +} diff --git a/src/lib/style/satsymbol.scss b/src/lib/style/satsymbol.scss new file mode 100644 index 0000000..f761701 --- /dev/null +++ b/src/lib/style/satsymbol.scss @@ -0,0 +1,9 @@ +@font-face { + font-family: 'Satoshi Symbol'; + src: + url('/fonts/Satoshi_Symbol.woff2') format('woff2'), + url('/fonts/Satoshi_Symbol.woff') format('woff'); + font-weight: normal; + font-style: normal; + font-display: swap; +} diff --git a/src/lib/uiSettings.ts b/src/lib/uiSettings.ts new file mode 100644 index 0000000..3d30b18 --- /dev/null +++ b/src/lib/uiSettings.ts @@ -0,0 +1,7 @@ +import { writable } from 'svelte/store'; + +export const uiSettings = writable({ + inputSize: 'sm', + selectClass: '', + btnSize: 'lg' +}); diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index b7f1a34..0faad53 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -1,21 +1,21 @@ ₿TClock - + + + - - {getFlagEmoji($locale)} {getLanguageName($locale)} - - {#each $locales as locale} - {getFlagEmoji(locale)} {getLanguageName(locale)} - {/each} - - + {#if !$isLoading} + + {getFlagEmoji($locale)} {languageNames[$locale]} + + {#each $locales as locale} + {getFlagEmoji(locale)} {languageNames[locale]} + {/each} + + + {/if} + diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts index a9bc794..4497634 100644 --- a/src/routes/+layout.ts +++ b/src/routes/+layout.ts @@ -1,20 +1,19 @@ -import "$lib/style/app.scss"; +import '$lib/style/app.scss'; - -import { browser } from '$app/environment' -import '$lib/i18n' // Import to initialize. Important :) -import { locale, waitLocale } from 'svelte-i18n' -import type { LayoutLoad } from './$types' +import { browser } from '$app/environment'; +import '$lib/i18n'; // Import to initialize. Important :) +import { locale, waitLocale } from 'svelte-i18n'; +import type { LayoutLoad } from './$types'; export const load: LayoutLoad = async () => { - if (browser && localStorage.getItem('locale')) { - locale.set(localStorage.getItem('locale')); - } else if (browser) { - locale.set(window.navigator.language) + 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; export const ssr = false; -export const csr = true; \ No newline at end of file +export const csr = true; diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 28b617b..b37ab13 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,71 +1,146 @@ - ₿TClock + BTClock - - - + + + +
+
+ (toastIsOpen = false)} + > + + {toastBody} + + +
+
diff --git a/src/routes/Control.spec.ts b/src/routes/Control.spec.ts new file mode 100644 index 0000000..763e9a3 --- /dev/null +++ b/src/routes/Control.spec.ts @@ -0,0 +1,30 @@ +import { writable } from 'svelte/store'; +import Control from './Control.svelte'; +import { render } from '@testing-library/svelte'; +import { describe, test, expect, beforeEach } from 'vitest'; +import { addMessages, init, locale } from 'svelte-i18n'; + +import '$lib/i18n/index.ts'; +import en from '$lib/locales/en.json'; +addMessages('en', en); + +describe('Control Component', () => { + beforeEach(() => { + init({ + fallbackLocale: 'en', + initialLocale: 'en' + }); + locale.set('en'); + }); + + test('should render the component', () => { + const host = document.createElement('div'); + document.body.appendChild(host); + const instance = render(Control, { + target: host, + props: { status: writable([]), settings: writable([]) } + }); + expect(instance).toBeTruthy(); + expect(host.innerHTML).toContain('Control'); + }); +}); diff --git a/src/routes/Control.svelte b/src/routes/Control.svelte index 23b13c3..d89ee10 100644 --- a/src/routes/Control.svelte +++ b/src/routes/Control.svelte @@ -1,85 +1,111 @@ - + {$_('section.control.title', { default: 'Control' })} @@ -87,48 +113,134 @@ onDestroy(firstLedDataSubscription);
- - - + + + - - -
-
-

LEDs

-
- - - - {#if ledStatus} - {#each ledStatus as led, i } - - - - {/each} - {/if} - - - - + + - -
-
-

{ $_('section.control.systemInfo') }

+ {#if !$settings.disableLeds} +

LEDs

+
+ + + + + {#if ledStatus} + {#each ledStatus as led, i} + + + + {/each} + {/if} + + + + + + + + + + + +
+ + + +
+
+ {/if} + {#if $settings.hasFrontlight && !$settings.flDisable} +

{$_('section.control.frontlight')}

+ + + + + + + + + +
+ {/if} +

{$_('section.control.systemInfo')}

    -
  • { $_('section.control.version') }: {$settings.gitRev}
    • -
  • { $_('section.control.buildTime') }: {new Date(($settings.lastBuildTime * 1000)).toLocaleString()}
    • + {#if $settings.gitTag} +
  • + {$_('section.control.version')}: {$settings.gitTag} +
    • + {/if} +
  • + {$_('section.control.buildTime')}: {new Date( + $settings.lastBuildTime * 1000 + ).toLocaleString()} +
  • IP: {$settings.ip}
    • -
  • { $_('section.control.hostname') }: {$settings.hostname}
    • +
  • HW revision: {$settings.hwRev}
    • +
  • {$_('section.control.fwCommit')}: {$settings.gitRev}
    • +
  • WebUI commit: {$settings.fsRev}
    • +
  • {$_('section.control.hostname')}: {$settings.hostname}
- - + + + +
+ + + + + {#if $settings.otaEnabled} +
+

{$_('section.control.firmwareUpdate')}

+ + {/if} diff --git a/src/routes/Control.ts b/src/routes/Control.ts deleted file mode 100644 index e69de29..0000000 diff --git a/src/routes/FirmwareUpdater.svelte b/src/routes/FirmwareUpdater.svelte new file mode 100644 index 0000000..2f467c4 --- /dev/null +++ b/src/routes/FirmwareUpdater.svelte @@ -0,0 +1,255 @@ + + +{#if latestVersion && latestVersion != 'error'} +

+ {$_('section.firmwareUpdater.latestVersion')}: {latestVersion} - {$_( + 'section.firmwareUpdater.releaseDate' + )}: {releaseDate} - + {$_('section.firmwareUpdater.viewRelease')}
+ {#if isNewerVersionAvailable} + {$_('section.firmwareUpdater.swUpdateAvailable')} - + {$_('section.firmwareUpdater.autoUpdate')}. + {:else} + {$_('section.firmwareUpdater.swUpToDate')} + {/if} +

+{:else if latestVersion == 'error'} +

Error loading version, try again later.

+{:else} +

Loading...

+{/if} +
+
+ + handleFileChange(e, (file) => (firmwareUploadFile = file))} + name="update" + class="form-control" + accept=".bin" + /> +
+
+ +
+
+ + handleFileChange(e, (file) => (firmwareWebUiFile = file))} + accept=".bin" + /> +
+
+ +
+
+{#if firmwareUploadProgress > 0} + {$_('section.firmwareUpdater.uploading')}... {firmwareUploadProgress}% +{/if} +{#if firmwareUploadSuccess} + {$_('section.firmwareUpdater.fileUploadSuccess', { values: { countdown: $countdown } })} + +{/if} + +{#if firmwareUploadError} + {$_('section.firmwareUpdater.fileUploadFailed')} +{/if} +⚠️ {$_('warning')}: {$_('section.firmwareUpdater.firmwareUpdateText')} diff --git a/src/routes/Rendered.svelte b/src/routes/Rendered.svelte index 0003cbf..4c4167b 100644 --- a/src/routes/Rendered.svelte +++ b/src/routes/Rendered.svelte @@ -1,25 +1,89 @@ -
-
- {#each status.data as char} - {#if isSplitText(char)} -
- {#each char.split("/") as part} -
{part}
- {/each} -
- {:else if char.length === 0 || char === " "} -
  
- {:else} -
{char}
- {/if} - {/each} -
-
\ No newline at end of file +
+
+ {#each status.data as char} + {#if isSplitText(char)} +
+ {#if char.split('/').length} + {char.split('/')[0]} +
+ {char.split('/')[1]} + {/if} + +
+ {:else if char.startsWith('mdi')} +
+ {#if char.endsWith('rocket')} + + {/if} + {#if char.endsWith('pickaxe')} + + {/if} + {#if char.endsWith('bolt')} + + {/if} +
+ {:else if char === 'STS'} +
S
+ {:else if char.length >= 3} +
{char}
+ {:else if char.length === 0 || char === ' '} +
  
+ {:else} +
{getCurrencySymbol(char)}
+ {/if} + {/each} +
+
+ + diff --git a/src/routes/Settings.spec.ts b/src/routes/Settings.spec.ts new file mode 100644 index 0000000..4e1fb07 --- /dev/null +++ b/src/routes/Settings.spec.ts @@ -0,0 +1,32 @@ +import { writable } from 'svelte/store'; +import Settings from './Settings.svelte'; +import { render } from '@testing-library/svelte'; +import { describe, test, expect, beforeEach } from 'vitest'; +import { addMessages, init, locale } from 'svelte-i18n'; + +import '$lib/i18n/index.ts'; +import en from '$lib/locales/en.json'; +addMessages('en', en); + +describe('Settings Component', () => { + beforeEach(() => { + init({ + fallbackLocale: 'en', + initialLocale: 'en' + }); + locale.set('en'); + }); + + test('should render the component', () => { + locale.set('en'); + + const host = document.createElement('div'); + document.body.appendChild(host); + const instance = render(Settings, { + target: host, + props: { settings: writable([]) } + }); + expect(instance).toBeTruthy(); + expect(host.innerHTML).toContain('Settings'); + }); +}); diff --git a/src/routes/Settings.svelte b/src/routes/Settings.svelte index 994548a..4c79233 100644 --- a/src/routes/Settings.svelte +++ b/src/routes/Settings.svelte @@ -1,208 +1,1002 @@ - + +
+ + | + +
{$_('section.settings.title', { default: 'Settings' })} -
+ - - - - - - - - - - - - - - - - - - - - - - - { $_('time.minutes') } - - - - - - - - - { $_('time.minutes') } - - - - - - - - - { $_('time.seconds') } - - { $_('section.settings.shortAmountsWarning') } - - - - - - - - { $_('time.minutes') } - - { $_('section.settings.tzOffsetHelpText') } - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + - -

{ $_('section.settings.screens') }

- {#if $settings.screens} - {#each $settings.screens as s} - - - - {/each} - {/if} - - - + + + + + + + + + + + + + + + + + {#if !$settings.actCurrencies} + + + + {/if} + + +
{$_('section.settings.screens')}
+ {#if $settings.screens} + {#each $settings.screens as s} + + + + {/each} + {/if} + + {#if $settings.actCurrencies && $settings.useNostr !== true} + +
{$_('section.settings.currencies')}
+ {$_('restartRequired')} + {#if $settings.availableCurrencies} + {#each $settings.availableCurrencies as c} + +
+ + +
+ + {/each} + {/if} + + {/if} + + + + + + + + + + + + + + + + + + + {$_('time.minutes')} + + + + + + + + + {$_('time.minutes')} + + + + + + + + + {$_('time.seconds')} + + {$_('section.settings.shortAmountsWarning')} + + + + + + + + + {#if $settings.hasFrontlight && !$settings.flDisable} + + + + + + + + + + + + + {/if} + {#if !$settings.flDisable && $settings.hasLightLevel} + + + + + + + {/if} + + + + + + + + + + + {#if $settings.hasFrontlight} + + + + {/if} + {#if $settings.hasFrontlight && !$settings.flDisable} + + + + + + + {/if} + + + + + + + + + + + + HTTPS + + + {$_('section.settings.mempoolInstanceHelpText')} + + + + + + + {#if $settings.nostrRelay} + + + + {$_('section.settings.useNostrTooltip')} + + + {/if} + {#if 'stagingSource' in $settings} + + + + {/if} + + + + + {#if $settings.bitaxeEnabled} + + + + + + + + + + {/if} + {#if 'nostrZapNotify' in $settings && $settings['nostrZapNotify']} + + + + checkValidNostrPubkey('nostrZapPubkey')} + invalid={!isValidHexPubKey($settings.nostrZapPubkey)} + bsSize={$uiSettings.inputSize} + required + minlength="64" + > + {#if !isValidHexPubKey($settings.nostrZapPubkey)} + {$_('section.settings.invalidNostrPubkey')} + {/if} + + + {/if} + {#if $settings.useNostr} + + + + checkValidNostrPubkey('nostrPubKey')} + invalid={!isValidHexPubKey($settings.nostrPubKey)} + bsSize={$uiSettings.inputSize} + > + {#if !isValidHexPubKey($settings.nostrPubKey)} + {$_('section.settings.invalidNostrPubkey')} + {/if} + + + {/if} + {#if 'nostrZapNotify' in $settings || $settings.useNostr} + + + + + + + + + + {/if} + + {#if 'bitaxeEnabled' in $settings} + + + + {/if} + {#if 'nostrZapNotify' in $settings} + + + + + + + {#if $settings.hasFrontlight && !$settings.flDisable} + + + + {/if} + {/if} + + + + + + + {#if $settings.mqttEnabled} + + + + + + + + + + + + + + + + + {/if} + + + + + + + + + {$_('time.minutes')} + + + {$_('section.settings.tzOffsetHelpText')} + + + {#if $settings.httpAuthEnabled} + + + + + + + + + + + + + + {$_('section.settings.httpAuthText')} + + + {/if} + + + + + + + + + + + {#each wifiTxPowerMap as [key, value]} + + {/each} + + {$_('section.settings.wifiTxPowerText')} + + + + + + + + {$_('time.seconds')} + + + + + + + + + + + + + + + + + + + + +
+ + +
diff --git a/src/routes/Status.spec.ts b/src/routes/Status.spec.ts new file mode 100644 index 0000000..820e2eb --- /dev/null +++ b/src/routes/Status.spec.ts @@ -0,0 +1,30 @@ +import { writable } from 'svelte/store'; +import Status from './Status.svelte'; +import { render } from '@testing-library/svelte'; +import { describe, test, expect, beforeEach } from 'vitest'; +import { locale, init, addMessages } from 'svelte-i18n'; + +import '$lib/i18n/index.ts'; +import en from '$lib/locales/en.json'; +addMessages('en', en); + +describe('Status Component', () => { + beforeEach(() => { + init({ + fallbackLocale: 'en', + initialLocale: 'en' + }); + locale.set('en'); + }); + + test('should render the component', () => { + const host = document.createElement('div'); + document.body.appendChild(host); + const instance = render(Status, { + target: host, + props: { status: writable([]), settings: writable([]) } + }); + expect(instance).toBeTruthy(); + expect(host.innerHTML).toContain('Status'); + }); +}); diff --git a/src/routes/Status.svelte b/src/routes/Status.svelte index 3195ad8..1e76da6 100644 --- a/src/routes/Status.svelte +++ b/src/routes/Status.svelte @@ -1,131 +1,265 @@ - + {$_('section.status.title', { default: 'Status' })} - {#if $settings.screens} -
- - {#each $settings.screens as s} - - {/each} - -
-
- {#if $status.data} -
- -
- { $_('section.status.screenCycle') }: {#if $status.timerRunning}⏵ { $_('timer.running') }{:else}⏸ { $_('timer.stopped') }{/if} - {/if} - {/if} -
- - {#if $status.leds} - {#each $status.leds as led} - - - - {/each} - {/if} - -
- { memoryFreePercent }% -
-
{ $_('section.status.memoryFree') }
-
{ Math.round($status.espFreeHeap / 1024) } / { Math.round($status.espHeapSize / 1024) } KiB
-
-
- { $_('section.status.uptime') }: {toUptimeString($status.espUptime)} -
-

- { $_('section.status.wsPriceConnection') }: - - {#if $status.connectionStatus && $status.connectionStatus.price} - ✅ - {:else} - ❌ - {/if} - - - - { $_('section.status.wsMempoolConnection') }: - - {#if $status.connectionStatus && $status.connectionStatus.blocks} - ✅ - {:else} - ❌ - {/if} -
- {#if $settings.fetchEurPrice} - { $_('section.status.fetchEuroNote') } - {/if} -

- - - + {#if $settings.screens} +
+ {#each buttonChunks as chunk} + + {#each chunk as s} + + {/each} + + {/each} +
+
+ + {#each $settings.screens as s} + + {/each} + +
+ {#if $settings.actCurrencies && $settings.ownDataSource} +
+ + {#each $settings.actCurrencies as c} + + {/each} + +
+ {/if} +
+ {#if $status.data} +
+ +
+ {$_('section.status.screenCycle')}: + {#if $status.timerRunning}⏵ {$_('timer.running')}{:else}⏸ {$_( + 'timer.stopped' + )}{/if} + {/if} + {/if} +
+ {#if !$settings.disableLeds} + + {#if $status.leds} + {#each $status.leds as led} + + + + {/each} + {/if} + +
+ {/if} + {memoryFreePercent}% +
+
{$_('section.status.memoryFree')}
+
+ {Math.round($status.espFreeHeap / 1024)} / {Math.round($status.espHeapSize / 1024)} KiB +
+
+
+ {#if $settings.hasLightLevel} + {$_('section.status.lightSensor')}: {Number(Math.round($status.lightLevel))} lux +
+ {/if} + {rssiPercent}% + {$_('rssiBar.tooltip')} + +
+
{$_('section.status.wifiSignalStrength')}
+
+ {$status.rssi} dBm +
+
+
+ {$_('section.status.uptime')}: {toUptimestring($status.espUptime)} +
+

+ {#if $settings.useNostr || $settings.nostrZapNotify} + {$_('section.status.nostrConnection')}: + + {#if $status.connectionStatus && $status.connectionStatus.nostr} + ✅ + {:else} + ❌ + {/if} + + {/if} + {#if !$settings.useNostr} + {#if !$settings.ownDataSource} + {$_('section.status.wsPriceConnection')}: + + {#if $status.connectionStatus && $status.connectionStatus.price} + ✅ + {:else} + ❌ + {/if} + + - + {$_('section.status.wsMempoolConnection', { + values: { instance: $settings.mempoolInstance } + })}: + + {#if $status.connectionStatus && $status.connectionStatus.blocks} + ✅ + {:else} + ❌ + {/if} +
+ {:else} + {$_('section.status.wsDataConnection')}: + + {#if $status.connectionStatus && $status.connectionStatus.V2} + ✅ + {:else} + ❌ + {/if} + + {/if} + {/if} + {#if $settings.fetchEurPrice} + {$_('section.status.fetchEuroNote')} + {/if} +

+ + diff --git a/src/routes/api/+page.svelte b/src/routes/api/+page.svelte index cb11cd6..4b87374 100644 --- a/src/routes/api/+page.svelte +++ b/src/routes/api/+page.svelte @@ -1,64 +1,57 @@ API playground - -
+
- diff --git a/src/routes/convert/+page.svelte b/src/routes/convert/+page.svelte new file mode 100644 index 0000000..a1e9951 --- /dev/null +++ b/src/routes/convert/+page.svelte @@ -0,0 +1,143 @@ + + + + + + + BTC + updateValues('BTC', e.target.value)} + /> + + + s + updateValues('sats', e.target.value)} + /> + + {#each Object.entries(exchangeRates) as [cur]} + + {cur} + updateValues(cur, e.target.value)} + /> + + {/each} + + + diff --git a/static/fonts/Satoshi_Symbol.woff b/static/fonts/Satoshi_Symbol.woff new file mode 100644 index 0000000..0b184da Binary files /dev/null and b/static/fonts/Satoshi_Symbol.woff differ diff --git a/static/fonts/Satoshi_Symbol.woff2 b/static/fonts/Satoshi_Symbol.woff2 new file mode 100644 index 0000000..f565227 Binary files /dev/null and b/static/fonts/Satoshi_Symbol.woff2 differ diff --git a/static/swagger.json b/static/swagger.json index a1ef68a..04efa57 100644 --- a/static/swagger.json +++ b/static/swagger.json @@ -1,480 +1,457 @@ { - "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", - "content": { - "application/json": { - "schema": { - "$ref": null - } - } - } - } - } - }, - "post": { - "tags": [ - "system" - ], - "summary": "Save current settings", - "requestBody": { - "content": { - "application/json": { - "schema": { - "$ref": "#/components/schemas/Settings" - } - } - } - }, - "responses": { - "200": { - "description": "successful operation" - } - } - }, - "patch": { - "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": { - "get": { - "tags": [ - "lights" - ], - "summary": "Get LEDs status", - "responses": { - "200": { - "description": "successful operation", - "content": { - "application/json": { - "schema": { - "$ref": "#/components/schemas/ArrayOfLeds" - } - } - } - } - } - }, - "patch": { - "tags": [ - "lights" - ], - "summary": "Set individual LEDs", - "requestBody": { - "content": { - "application/json": { - "schema": { - "$ref": "#/components/schemas/ArrayOfLedsInput" - } - } - } - }, - "responses": { - "200": { - "description": "succesful operation" - }, - "400": { - "description": "invalid colors or wrong amount of LEDs" - } - } - } - }, - "/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": { - "RgbColorValues": { - "type": "object", - "properties": { - "red": { - "type": "integer", - "minimum": 0, - "maximum": 255, - "example": 255 - }, - "green": { - "type": "integer", - "minimum": 0, - "maximum": 255, - "example": 204 - }, - "blue": { - "type": "integer", - "minimum": 0, - "maximum": 255, - "example": 0 - } - } - }, - "RgbColorHex": { - "type": "object", - "properties": { - "hex": { - "type": "string", - "pattern": "^#(?:[0-9a-fA-F]{3}){1,2}$", - "example": "#FFCC00" - } - } - }, - "RgbColorValueAndHex": { - "allOf": [ - { - "$ref": "#/components/schemas/RgbColorValues" - }, - { - "$ref": "#/components/schemas/RgbColorHex" - } - ] - }, - "RgbColorValueOrHex": { - "oneOf": [ - { - "$ref": "#/components/schemas/RgbColorValues" - }, - { - "$ref": "#/components/schemas/RgbColorHex" - } - ] - }, - "ArrayOfLeds": { - "type": "array", - "items": { - "$ref": "#/components/schemas/RgbColorValueAndHex" - } - }, - "ArrayOfLedsInput": { - "type": "array", - "items": { - "$ref": "#/components/schemas/RgbColorValueOrHex" - } - }, - "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" - }, - "stealFocus": { - "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 - } - } - } -} \ No newline at end of file + "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", + "content": { + "application/json": { + "schema": { + "$ref": "#/components/schemas/ArrayOfLeds" + } + } + } + } + } + }, + "post": { + "tags": ["system"], + "summary": "Save current settings", + "requestBody": { + "content": { + "application/json": { + "schema": { + "$ref": "#/components/schemas/Settings" + } + } + } + }, + "responses": { + "200": { + "description": "successful operation" + } + } + }, + "patch": { + "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": { + "get": { + "tags": ["lights"], + "summary": "Get LEDs status", + "responses": { + "200": { + "description": "successful operation", + "content": { + "application/json": { + "schema": { + "$ref": "#/components/schemas/ArrayOfLeds" + } + } + } + } + } + } + }, + "/lights/set": { + "patch": { + "tags": ["lights"], + "summary": "Set individual LEDs", + "requestBody": { + "content": { + "application/json": { + "schema": { + "$ref": "#/components/schemas/ArrayOfLedsInput" + } + } + } + }, + "responses": { + "200": { + "description": "succesful operation" + }, + "400": { + "description": "invalid colors or wrong amount of LEDs" + } + } + } + }, + "/lights/color/{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": { + "RgbColorValues": { + "type": "object", + "properties": { + "red": { + "type": "integer", + "minimum": 0, + "maximum": 255, + "example": 255 + }, + "green": { + "type": "integer", + "minimum": 0, + "maximum": 255, + "example": 204 + }, + "blue": { + "type": "integer", + "minimum": 0, + "maximum": 255, + "example": 0 + } + } + }, + "RgbColorHex": { + "type": "object", + "properties": { + "hex": { + "type": "string", + "pattern": "^#(?:[0-9a-fA-F]{3}){1,2}$", + "example": "#FFCC00" + } + } + }, + "RgbColorValueAndHex": { + "allOf": [ + { + "$ref": "#/components/schemas/RgbColorValues" + }, + { + "$ref": "#/components/schemas/RgbColorHex" + } + ] + }, + "RgbColorValueOrHex": { + "oneOf": [ + { + "$ref": "#/components/schemas/RgbColorValues" + }, + { + "$ref": "#/components/schemas/RgbColorHex" + } + ] + }, + "ArrayOfLeds": { + "type": "array", + "items": { + "$ref": "#/components/schemas/RgbColorValueAndHex" + } + }, + "ArrayOfLedsInput": { + "type": "array", + "items": { + "$ref": "#/components/schemas/RgbColorValueOrHex" + } + }, + "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" + }, + "stealFocus": { + "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" + }, + "screen[6]": { + "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" + }, + "txPower": { + "type": "integer", + "description": "WiFi Tx Power" + } + } + }, + "CustomText": { + "type": "array", + "items": { + "type": "string" + }, + "minItems": 7, + "maxItems": 7 + } + } + } +} diff --git a/static/swagger.yml b/static/swagger.yml index c07a798..15d918c 100644 --- a/static/swagger.yml +++ b/static/swagger.yml @@ -31,9 +31,9 @@ paths: '200': description: successful operation content: - application/json: + application/json: schema: - $ref: #/components/schemas/ArrayOfLeds + $ref: '#/components/schemas/ArrayOfLeds' post: tags: - system @@ -139,8 +139,9 @@ paths: application/json: schema: $ref: '#/components/schemas/ArrayOfLeds' + /lights/set: patch: - tags: + tags: - lights summary: Set individual LEDs requestBody: @@ -149,11 +150,11 @@ paths: schema: $ref: '#/components/schemas/ArrayOfLedsInput' responses: - "200": + '200': description: succesful operation - "400": + '400': description: invalid colors or wrong amount of LEDs - /lights/{color}: + /lights/color/{color}: get: tags: - lights @@ -188,38 +189,38 @@ paths: components: schemas: RgbColorValues: - type: object - properties: - red: - type: integer - minimum: 0 - maximum: 255 - example: 255 - green: - type: integer - minimum: 0 - maximum: 255 - example: 204 - blue: - type: integer - minimum: 0 - maximum: 255 - example: 0 + type: object + properties: + red: + type: integer + minimum: 0 + maximum: 255 + example: 255 + green: + type: integer + minimum: 0 + maximum: 255 + example: 204 + blue: + type: integer + minimum: 0 + maximum: 255 + example: 0 RgbColorHex: - type: object - properties: - hex: - type: string - pattern: ^#(?:[0-9a-fA-F]{3}){1,2}$ - example: "#FFCC00" + type: object + properties: + hex: + type: string + pattern: ^#(?:[0-9a-fA-F]{3}){1,2}$ + example: '#FFCC00' RgbColorValueAndHex: - allOf: - - $ref: '#/components/schemas/RgbColorValues' - - $ref: '#/components/schemas/RgbColorHex' + allOf: + - $ref: '#/components/schemas/RgbColorValues' + - $ref: '#/components/schemas/RgbColorHex' RgbColorValueOrHex: - oneOf: - - $ref: '#/components/schemas/RgbColorValues' - - $ref: '#/components/schemas/RgbColorHex' + oneOf: + - $ref: '#/components/schemas/RgbColorValues' + - $ref: '#/components/schemas/RgbColorHex' ArrayOfLeds: type: array items: @@ -290,6 +291,8 @@ components: type: boolean screen[5]: type: boolean + screen[6]: + type: boolean tzOffset: type: integer default: 60 @@ -302,6 +305,9 @@ components: type: integer default: 30 description: Time between screens when rotating in minutes + txPower: + type: integer + description: WiFi Tx Power CustomText: type: array items: diff --git a/svelte.config.js b/svelte.config.js index 468ccd1..6517ee3 100644 --- a/svelte.config.js +++ b/svelte.config.js @@ -1,20 +1,18 @@ import adapter from '@sveltejs/adapter-static'; -import { vitePreprocess } from '@sveltejs/kit/vite'; +import { sveltePreprocess } from 'svelte-preprocess'; /** @type {import('@sveltejs/kit').Config} */ const config = { // Consult https://kit.svelte.dev/docs/integrations#preprocessors // for more information about preprocessors - preprocess: vitePreprocess({ - - }), -build: { - rollupOptions: { - output: { - assetFilenames: '[hash]' + preprocess: sveltePreprocess({}), + build: { + rollupOptions: { + output: { + assetFilenames: '[hash]' + } } - } -}, + }, kit: { // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list. // If your environment is not supported or you settled on a specific environment, switch out the adapter. @@ -24,11 +22,11 @@ build: { // these options are set automatically — see below pages: 'dist', assets: 'dist', - fallback: "bundle.html", + fallback: 'bundle.html', precompress: false, strict: true }), - appDir: "build", + appDir: 'build' // inlineStyleThreshold: 9999999999 } }; diff --git a/tests/test.ts b/tests/test.ts new file mode 100644 index 0000000..b1bd8ac --- /dev/null +++ b/tests/test.ts @@ -0,0 +1,290 @@ +import { expect, test } from '@playwright/test'; + +const statusJson = { + currentScreen: 0, + numScreens: 7, + timerRunning: true, + espUptime: 4479, + espFreeHeap: 58508, + espHeapSize: 342108, + connectionStatus: { price: true, blocks: true }, + rssi: -66, + data: ['BLOCK/HEIGHT', '8', '1', '8', '0', '2', '6'], + rendered: ['BLOCK/HEIGHT', '8', '1', '8', '0', '2', '6'], + leds: [ + { red: 0, green: 0, blue: 0, hex: '#000000' }, + { red: 0, green: 0, blue: 0, hex: '#000000' }, + { red: 0, green: 0, blue: 0, hex: '#000000' }, + { red: 0, green: 0, blue: 0, hex: '#000000' } + ] +}; + +const settingsJson = { + numScreens: 7, + fgColor: 415029, + bgColor: 0, + timerSeconds: 1800, + timerRunning: true, + minSecPriceUpd: 30, + fullRefreshMin: 60, + wpTimeout: 600, + tzOffset: 0, + useBitcoinNode: false, + mempoolInstance: 'mempool.space', + ledTestOnPower: true, + ledFlashOnUpd: true, + ledBrightness: 128, + stealFocus: true, + mcapBigChar: true, + mdnsEnabled: true, + otaEnabled: true, + fetchEurPrice: false, + hostnamePrefix: 'btclock', + hostname: 'btclock-d60b14', + ip: '192.168.20.231', + txPower: 78, + gitRev: '25d8b92bcbc8938417c140355ea3ba99ff9eb4b7', + gitTag: '3.1.9', + bitaxeEnabled: false, + bitaxeHostname: 'bitaxe1', + nostrZapNotify: true, + mqttEnabled: false, + hwRev: 'REV_A_EPD_2_13', + fsRev: '4c5d9616212b27e3f05c35370f0befcf2c5a04b2', + nostrZapPubkey: 'b5127a08cf33616274800a4387881a9f98e04b9c37116e92de5250498635c422', + lastBuildTime: '1700666677', + screens: [ + { id: 0, name: 'Block Height', enabled: true }, + { id: 1, name: 'Sats per dollar', enabled: true }, + { id: 2, name: 'Ticker', enabled: true }, + { id: 3, name: 'Time', enabled: true }, + { id: 4, name: 'Halving countdown', enabled: true }, + { id: 5, name: 'Market Cap', enabled: true } + ] +}; + +test.beforeEach(async ({ page }) => { + await page.route('*/**/api/status', async (route) => { + await route.fulfill({ json: statusJson }); + }); + + await page.route('*/**/api/show/screen/1', async (route) => { + //if (route.request().url().includes('*/**/api/show/screen/1')) { + statusJson.currentScreen = 1; + statusJson.data = ['MSCW/TIME', ' ', ' ', '2', '6', '4', '4']; + statusJson.rendered = statusJson.data; + //} + + await route.fulfill({ json: statusJson }); + }); + + await page.route('*/**/api/show/screen/2', async (route) => { + statusJson.currentScreen = 2; + statusJson.data = ['BTC/USD', '$', '3', '7', '8', '2', '4']; + statusJson.rendered = statusJson.data; + + await route.fulfill({ json: statusJson }); + }); + + await page.route('*/**/api/show/screen/4', async (route) => { + statusJson.currentScreen = 4; + statusJson.data = ['BIT/COIN', 'HALV/ING', '0/YRS', '149/DAYS', '8/HRS', '30/MINS', 'TO/GO']; + statusJson.rendered = statusJson.data; + + await route.fulfill({ json: statusJson }); + }); + + await page.route('*/**/api/settings', async (route) => { + await route.fulfill({ json: settingsJson }); + }); + + await page.route('**/events', (route) => { + const newStatus = statusJson; + newStatus.data = ['BLOCK/HEIGHT', '8', '0', '0', '8', '1', '5']; + + // Respond with a custom SSE message + route.fulfill({ + status: 200, + contentType: 'text/event-stream', + json: `${JSON.stringify(newStatus)}\n\n` + }); + }); +}); + +test('index page has expected columns control, status, settings', async ({ page }) => { + await page.goto('/'); + await expect(page.getByRole('heading', { name: 'Control' })).toBeVisible(); + await expect(page.getByRole('heading', { name: 'Status' })).toBeVisible(); + await expect(page.getByRole('heading', { name: 'Settings' })).toBeVisible(); +}); + +test('index page has working language selector', async ({ page }) => { + await page.goto('/'); + await expect(page.locator('//*[@id="nav-language-dropdown"]/a')).toBeVisible(); + page.locator('//*[@id="nav-language-dropdown"]/a').click(); + //*[@id="nav-language-dropdown"]/ul/li[1]/button + await expect(page.locator('//*[@id="nav-language-dropdown"]/ul/li[1]/button')).toBeVisible(); + page.locator('//*[@id="nav-language-dropdown"]/ul/li[2]/button').click(); + await expect(page.getByRole('heading', { name: 'Instellingen' })).toBeVisible(); + page.locator('//*[@id="nav-language-dropdown"]/a').click(); + page.locator('//*[@id="nav-language-dropdown"]/ul/li[3]/button').click(); + await expect(page.getByRole('heading', { name: 'Configuración' })).toBeVisible(); +}); + +test('api page has expected load button', async ({ page }) => { + await page.goto('/api'); + await expect(page.getByRole('button', { name: 'Load' })).toBeVisible(); +}); + +test('timezone can be negative, zero and positive', async ({ page }) => { + await page.goto('/'); + await page.getByRole('button', { name: 'Show all' }).click(); + + const tzOffsetField = 'input#tzOffset'; + + for (const val of ['-10', '0', '42']) { + await page.fill(tzOffsetField, val); + const resultValue = await page.$eval(tzOffsetField, (input: HTMLInputElement) => input.value); + expect(resultValue).toBe(val); + await page.getByRole('button', { name: 'Save' }).click(); + } +}); + +test('time values can not be zero or negative', async ({ page }) => { + await page.goto('/'); + await page.getByRole('button', { name: 'Show all' }).click(); + + for (const field of ['#timePerScreen', '#fullRefreshMin', '#minSecPriceUpd']) { + for (const val of ['42', '210']) { + await page.fill(field, val); + const resultValue = await page.$eval(field, (input: HTMLInputElement) => input.value); + expect(resultValue).toBe(val); + await page.getByRole('button', { name: 'Save' }).click(); + const validationMessage = await page.$eval( + field, + (input: HTMLInputElement) => input.validationMessage + ); + expect(validationMessage).not.toContain('Value must be greater'); + } + + for (const val of ['-10', '0']) { + await page.fill(field, val); + const resultValue = await page.$eval(field, (input: HTMLInputElement) => input.value); + expect(resultValue).toBe(val); + await page.getByRole('button', { name: 'Save' }).click(); + const validationMessage = await page.$eval( + field, + (input: HTMLInputElement) => input.validationMessage + ); + expect(validationMessage).toContain('Value must be greater'); + } + } +}); + +test('info message when fetch eur price is enabled', async ({ page }) => { + await page.goto('/'); + await page.getByRole('button', { name: 'Show all' }).click(); + + const inputField = 'input#fetchEurPrice'; + const switchElement = await page.locator(inputField); + + expect(switchElement).toBeTruthy(); + const isSwitchEnabled = await switchElement.isChecked(); + expect(isSwitchEnabled).toBe(false); + + await expect(page.getByText('the WS Price connection will show')).toBeHidden(); + + await switchElement.click(); + const isSwitchNowEnabled = await switchElement.isChecked(); + expect(isSwitchNowEnabled).toBe(true); + + await expect(page.getByText('the WS Price connection will show')).toBeVisible(); +}); + +test('npub values will be converted to hex pubkeys', async ({ page }) => { + await page.goto('/'); + await page.getByRole('button', { name: 'Show all' }).click(); + + for (const field of ['#nostrZapPubkey']) { + for (const val of ['npub1k5f85zx0xdskyayqpfpc0zq6n7vwqjuuxugkayk72fgynp34cs3qfcvqg2']) { + await page.fill(field, val); + + await page.getByLabel('Nostr Relay').click(); + const resultValue = await page.$eval(field, (input: HTMLInputElement) => input.value); + + expect(resultValue).toBe('b5127a08cf33616274800a4387881a9f98e04b9c37116e92de5250498635c422'); + } + } +}); + +test('empty nostr relay field is not accepted', async ({ page }) => { + await page.goto('/'); + await page.getByRole('button', { name: 'Show all' }).click(); + + const nostrRelayField = page.getByLabel('Nostr Relay'); + + nostrRelayField.fill(''); + + await page.getByRole('button', { name: 'Save' }).click(); + const validationMessage = await nostrRelayField.evaluate((el) => el.validationMessage); + + expect(validationMessage).toContain('Please fill out this field'); +}); + +test('screens should be able to change', async ({ page }) => { + await page.goto('/'); + await expect(page.getByRole('button', { name: 'Sats per Dollar' })).toBeVisible(); + const responsePromise = page.waitForRequest('*/**/api/show/screen/*'); + + await page.getByRole('button', { name: 'Sats per Dollar' }).click(); + const response = await responsePromise; + expect(response.url()).toContain('api/show/screen/1'); +}); + +test('parse all types of EPD content correctly', async ({ page }) => { + statusJson.data[2] = '123'; + + await page.route('**/events', (route) => { + const newStatus = statusJson; + newStatus.data = ['BLOCK/HEIGHT', '8', '123', '0', '8', '1', '5']; + + // Respond with a custom SSE message + route.fulfill({ + status: 200, + contentType: 'text/event-stream', + json: `${JSON.stringify(newStatus)}\n\n` + }); + }); + + await page.goto('/'); + + await expect(page.getByRole('heading', { name: 'Status' })).toBeVisible(); + await page.waitForSelector('#timerStatusText:has-text("running")'); + await page.waitForSelector('#btclock-wrapper > div > div:nth-child(1)'); + + expect(statusJson.data[0]).toContain('/'); + await expect(page.locator('#btclock-wrapper > div > div:nth-child(1)')).toBeTruthy(); + await expect(page.locator('#btclock-wrapper > div > div:nth-child(1)')).toHaveClass('splitText'); + expect(statusJson.data[1]).toHaveLength(1); + await expect(page.locator('#btclock-wrapper > div > div:nth-child(2)')).toHaveClass('digit'); + expect(statusJson.data[2]).toHaveLength(3); + await expect(page.locator('#btclock-wrapper > div > div:nth-child(3)')).toHaveClass('mediumText'); +}); + +test('should work with more than 7 screens', async ({ page }) => { + statusJson.data[2] = '1'; + statusJson.numScreens = 9; + settingsJson.numScreens = 9; + statusJson.data.splice(1, 0, ' ', ' '); + + await page.goto('/'); + + await expect(page.getByRole('heading', { name: 'Status' })).toBeVisible(); + await page.waitForSelector('#timerStatusText:has-text("running")'); + await expect(page.locator('#btclock-wrapper > div > div:nth-child(9)')).toBeTruthy(); + + await expect(page.locator('#customText')).toHaveAttribute( + 'maxlength', + statusJson.numScreens.toString() + ); +}); diff --git a/tsconfig.json b/tsconfig.json index 82081ab..7dd43ea 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -9,6 +9,7 @@ "skipLibCheck": true, "sourceMap": true, "strict": true, + "verbatimModuleSyntax": true, "moduleResolution": "bundler" } // Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias diff --git a/vite.config.ts b/vite.config.ts index ea53800..bb8e5b2 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,62 +1,85 @@ import { sveltekit } from '@sveltejs/kit/vite'; -import { defineConfig } from 'vite'; +import { defineConfig } from 'vitest/config'; +import GithubActionsReporter from 'vitest-github-actions-reporter'; -import * as fs from 'fs' -import * as path from 'path' +import * as fs from 'fs'; +import * as path from 'path'; const doRewrap = ({ cssClass }) => { try { if (fs.existsSync(path.resolve(__dirname, 'dist/bundle.js'))) { - return + return; } - } catch(e) {} - console.log("\nStart re-wrapping...") - fs.readFile(path.resolve(__dirname, 'dist/bundle.html'), 'utf8', function(err, data){ + } catch { + // do nothing + } + console.log('\nStart re-wrapping...'); + fs.readFile(path.resolve(__dirname, 'dist/bundle.html'), 'utf8', function (err, data) { if (!data) { - console.log(`[Error]: No bundle.html generated, check svelte.config.js -> config.kit.adapter -> fallback: "bundle.html"`) - return + console.log( + `[Error]: No bundle.html generated, check svelte.config.js -> config.kit.adapter -> fallback: "bundle.html"` + ); + return; } - let matchData = data.match(/(?<=]*>)([\s\S]*?)(?=<\/script>)/gm) + const matchData = data.match(/(?<=]*>)([\s\S]*?)(?=<\/script>)/gm); if (matchData) { - let cleanData = matchData[0].trim() - .replace(`document.querySelector('[data-sveltekit-hydrate="45h"]').parentNode`, `document.querySelector(".${cssClass}")`) + const cleanData = matchData[0] + .trim() + .replace( + `document.querySelector('[data-sveltekit-hydrate="45h"]').parentNode`, + `document.querySelector(".${cssClass}")` + ); fs.writeFile(path.resolve(__dirname, 'dist/bundle.js'), cleanData, (err) => { - if (err) - console.log(err) + if (err) console.log(err); else { try { - fs.rename(path.resolve(__dirname,'dist/index.page'), path.resolve(__dirname, 'dist/index.html'), (err) => { }) - } catch (e) { } + fs.rename( + path.resolve(__dirname, 'dist/index.page'), + path.resolve(__dirname, 'dist/index.html'), + () => {} + ); + } catch { + // do nothing + } try { - fs.unlinkSync(path.resolve(__dirname, 'dist/bundle.html')) - } catch (e) { } - console.log("Finished: bundle.js + index.html have been regenerated.\n") + fs.unlinkSync(path.resolve(__dirname, 'dist/bundle.html')); + } catch { + // do nothing + } + console.log('Finished: bundle.js + index.html have been regenerated.\n'); } - }) - } else - console.log(`[Error]: No proper