47 lines
1.3 KiB
Svelte
47 lines
1.3 KiB
Svelte
<script lang="ts">
|
|
import { checkAvailability, doOneTimeSync, startBluetooth } from '$lib/bluetooth';
|
|
import { A, Alert, Button } from 'flowbite-svelte';
|
|
import { bluetoothState } from '../stores';
|
|
import { UAParser } from 'ua-parser-js';
|
|
import Timer from './Timer.svelte';
|
|
|
|
const uap = new UAParser();
|
|
|
|
$: {
|
|
checkAvailability();
|
|
}
|
|
</script>
|
|
|
|
<div class="p-8 flex flex-col">
|
|
{#if $bluetoothState == 'DISCONNECTED'}
|
|
<Button
|
|
on:click={() => {
|
|
startBluetooth();
|
|
}}>Connect</Button
|
|
>
|
|
{:else if $bluetoothState == 'UNAVAILABLE'}
|
|
<span
|
|
class="text-xl text-white rounded-md font-bold border-primary-600 border-4 border-r-4 p-3"
|
|
>
|
|
Your Browser is not compatible with this website, as it does not support <A
|
|
class="font-bold"
|
|
href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Bluetooth_API#browser_compatibility"
|
|
>
|
|
web bluetooth
|
|
</A>.
|
|
</span>
|
|
<span class="text-xl mt-3">
|
|
Please use a browser which supports web bluetooth, for example
|
|
{#if uap.getOS().name === 'iOS'}
|
|
<A href="https://apps.apple.com/us/app/bluefy-web-ble-browser/id1492822055">Bluefy</A>
|
|
{:else}
|
|
<A href="https://www.google.com/chrome/">Google Chrome</A>
|
|
{/if}.
|
|
</span>
|
|
{:else if $bluetoothState == 'CONNECTED'}
|
|
<Timer />
|
|
{:else}
|
|
<Alert color="yellow">Connecting...</Alert>
|
|
{/if}
|
|
</div>
|