Fix swagger page and update swagger JSON

src/routes/+layout.svelte

@@ -17,10 +17,43 @@
 	import { browser } from '$app/environment';
 	import { page } from '$app/stores';
 
-    export const setLocale = (lang: string) => () => {
-        locale.set(lang);
-        localStorage.setItem("locale", lang)
-    }
+	export const setLocale = (lang: string) => () => {
+		locale.set(lang);
+		localStorage.setItem('locale', lang);
+	};
+
+	export const getFlagEmoji = (languageCode: string): string | null => {
+		const flagMap: { [key: string]: string } = {
+			en: '🇬🇧', // English flag emoji
+			nl: '🇳🇱', // Dutch flag emoji
+			es: '🇪🇸' // Spanish flag emoji
+		};
+
+		// Convert the language code to lowercase for case-insensitive matching
+		const lowercaseCode = languageCode.toLowerCase();
+
+		// Check if the language code is in the flagMap
+		if (flagMap.hasOwnProperty(lowercaseCode)) {
+			return flagMap[lowercaseCode];
+		} else {
+			// Return null for unsupported language codes
+			return null;
+		}
+	};
+
+	export const getLanguageName = (languageCode: string): string | null => {
+		const languageNames: { [key: string]: { [key: string]: string } } = {
+			en: { en: 'English', nl: 'English', es: 'English' },
+			nl: { en: 'Nederlands', nl: 'Nederlands', es: 'Neerlandés' },
+			es: { en: 'Español', nl: 'Spaans', es: 'Español' }
+		};
+
+		const lowercaseCode = languageCode.toLowerCase();
+
+		return languageNames.hasOwnProperty(lowercaseCode)
+			? languageNames[lowercaseCode][lowercaseCode]
+			: null;
+	};
 </script>
 
 <Navbar expand="md">
@@ -28,17 +61,17 @@
 	<Collapse navbar expand="md">
 		<Nav class="me-auto" navbar>
 			<NavItem>
-				<NavLink href="/" active="{$page.url.pathname === ("/")}">Home</NavLink>
+				<NavLink href="/" active={$page.url.pathname === '/'}>Home</NavLink>
 			</NavItem>
 			<NavItem>
-				<NavLink href="/api" active="{$page.url.pathname === ("/api")}">API</NavLink>
+				<NavLink href="/api" active={$page.url.pathname === '/api'}>API</NavLink>
 			</NavItem>
 		</Nav>
 		<Dropdown inNavbar>
-			<DropdownToggle nav caret>{$locale}</DropdownToggle>
+			<DropdownToggle nav caret>{getFlagEmoji($locale)} {getLanguageName($locale)}</DropdownToggle>
 			<DropdownMenu end>
 				{#each $locales as locale}
-					<DropdownItem on:click={setLocale(locale)}>{locale}</DropdownItem>
+					<DropdownItem on:click={setLocale(locale)}>{getFlagEmoji(locale)} {getLanguageName(locale)}</DropdownItem>
 				{/each}
 			</DropdownMenu>
 		</Dropdown>

src/routes/api/+page.svelte

@@ -1,26 +1,36 @@
 <script lang="ts">
 	import { _ } from 'svelte-i18n';
-	import { Col, Container, Row } from 'sveltestrap';
+	import { Col, Container, Row, Button } from 'sveltestrap';
 
 	import { onMount } from 'svelte';
-	import * as swaggerJson from './swagger.json';
+	//import * as swaggerJson from '../../../static/swagger.json';
 	//	import SwaggerUI from 'swagger-ui';
 	import 'swagger-ui/dist/swagger-ui.css';
 
+	let swaggerLoaded:boolean = false;
+
 	onMount(async () => {
 		// @ts-ignore
-		SwaggerUIBundle({
-			spec: swaggerJson,
-			dom_id: '#swagger-ui-container',
-			presets: [
-				// @ts-ignore
-				SwaggerUIBundle.presets.apis,
-				// @ts-ignore
-				SwaggerUIStandalonePreset
-			],
-//				layout: "StandaloneLayout",
-			});
+		loadSwagger();
 	});
+
+	const loadSwagger = () => {
+		if (!SwaggerUIBundle)
+			return;
+		swaggerLoaded = true;
+		window.ui = SwaggerUIBundle({
+				url: '/swagger.json',
+				dom_id: '#swagger-ui-container',
+				presets: [
+					// @ts-ignore
+					SwaggerUIBundle.presets.apis,
+					// @ts-ignore
+					SwaggerUIStandalonePreset
+				],
+				//	layout: "StandaloneLayout",
+				});
+			}
+		
 </script>
 
 <svelte:head>
@@ -44,8 +54,11 @@
 		crossorigin="anonymous"
 		referrerpolicy="no-referrer"
 	/>
+
 </svelte:head>
 
-<Container fluid>
+<Container fluid class="bg-light">
+	<section class:invisible={swaggerLoaded}><Button  on:click="{loadSwagger}">Load</Button></section>
 	<div id="swagger-ui-container" />
+
 </Container>

static/swagger.json

@@ -68,6 +68,26 @@
             "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": {
@@ -272,7 +292,7 @@
             "default": true,
             "description": "Enable over-the-air updates"
           },
-          "stealFocusOnBlock": {
+          "stealFocus": {
             "type": "boolean",
             "default": false,
             "description": "Steal focus on new block"

static/swagger.yaml

@@ -0,0 +1,239 @@
+openapi: 3.0.3
+info:
+  title: BTClock API
+  version: '3.0'
+  description: BTClock V3 API
+servers:
+  - url: /api/
+paths:
+  /status:
+    get:
+      tags:
+        - system
+      summary: Get current status
+      responses:
+        '200':
+          description: successful operation
+  /system_status:
+    get:
+      tags:
+        - system
+      summary: Get system status
+      responses:
+        '200':
+          description: successful operation
+  /settings:
+    get:
+      tags:
+        - system
+      summary: Get current settings
+      responses:
+        '200':
+          description: successful operation
+    post:
+      tags:
+        - system
+      summary: Save current settings
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/Settings'
+      responses:
+        '200':
+          description: successful operation
+    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/{color}:
+    get:
+      tags:
+        - lights
+      summary: Turn on LEDs with specific color
+      parameters:
+        - in: path
+          name: color
+          schema:
+            type: string
+            default: FFCC00
+          required: true
+          description: Color in RGB hex
+      responses:
+        '200':
+          description: successful operation
+  /lights/off:
+    get:
+      tags:
+        - lights
+      summary: Turn LEDs off
+      responses:
+        '200':
+          description: successful operation
+  /restart:
+    get:
+      tags:
+        - system
+      summary: Restart BTClock
+      responses:
+        '200':
+          description: successful operation
+components:
+  schemas:
+    Settings:
+      type: object
+      properties:
+        fetchEurPrice:
+          type: boolean
+          description: Fetch EUR price instead of USD
+        fgColor:
+          type: string
+          default: 16777215
+          description: ePaper foreground (text) color
+        bgColor:
+          type: string
+          default: 0
+          description: ePaper background color
+        ledTestOnPower:
+          type: boolean
+          default: true
+          description: Do LED test on power-on
+        ledFlashOnUpd:
+          type: boolean
+          default: false
+          description: Flash LEDs on new block
+        mdnsEnabled:
+          type: boolean
+          default: true
+          description: Enable mDNS
+        otaEnabled:
+          type: boolean
+          default: true
+          description: Enable over-the-air updates
+        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