add SegmentedButton

This commit is contained in:
CoolElectronics 2023-08-14 19:03:56 -04:00
parent cbe199ccdd
commit 0ffb386048
No known key found for this signature in database
GPG key ID: F63593D168636C50

View file

@ -10,7 +10,14 @@
DevWsTransport, DevWsTransport,
RTCTransport, RTCTransport,
} from "client"; } from "client";
import { Button, Card, StyleFromScheme, TextField } from "m3-svelte"; import {
Button,
Card,
SegmentedButtonContainer,
SegmentedButtonItem,
StyleFromScheme,
TextField,
} from "m3-svelte";
// note: even though we import firebase, due to the tree shaking, it will only run if we use "auth" so if ADRIFT_DEV is set it won't import // note: even though we import firebase, due to the tree shaking, it will only run if we use "auth" so if ADRIFT_DEV is set it won't import
import { auth } from "firebase-config"; import { auth } from "firebase-config";
import { signInWithEmailAndPassword } from "firebase/auth"; import { signInWithEmailAndPassword } from "firebase/auth";
@ -28,7 +35,7 @@
let ready = false; let ready = false;
let useDynamic = false; let selectedProxy = "ultraviolet";
let url: string; let url: string;
let proxyIframe: HTMLIFrameElement; let proxyIframe: HTMLIFrameElement;
@ -129,11 +136,10 @@
function visitURL(url: string) { function visitURL(url: string) {
if (!import.meta.env.VITE_ADRIFT_SINGLEFILE) { if (!import.meta.env.VITE_ADRIFT_SINGLEFILE) {
let path = useDynamic let path =
selectedProxy == "dynamic"
? `/service/route?url=${url}` ? `/service/route?url=${url}`
: `${__uv$config.prefix}${__uv$config.encodeUrl(url)}`; : `${__uv$config.prefix}${__uv$config.encodeUrl(url)}`;
console.log(useDynamic);
console.log(path);
proxyIframe.src = path; proxyIframe.src = path;
} else { } else {
@ -179,8 +185,26 @@
</div> </div>
{#if !import.meta.env.VITE_ADRIFT_SINGLEFILE} {#if !import.meta.env.VITE_ADRIFT_SINGLEFILE}
<div> <div>
<label>use dynamic?</label> <SegmentedButtonContainer>
<input type="checkbox" bind:value={useDynamic} /> <input
type="radio"
name="selectedProxy"
bind:group={selectedProxy}
value="ultraviolet"
id="ultraviolet"
/>
<SegmentedButtonItem input="ultraviolet"
>Ultraviolet</SegmentedButtonItem
>
<input
type="radio"
name="selectedProxy"
bind:group={selectedProxy}
value="dynamic"
id="dynamic"
/>
<SegmentedButtonItem input="dynamic">Dynamic</SegmentedButtonItem>
</SegmentedButtonContainer>
</div> </div>
{/if} {/if}
</div> </div>
@ -339,15 +363,4 @@
outline: none; outline: none;
border: none; border: none;
} }
.container {
display: flex;
flex-direction: column;
width: max-content;
}
.h-full {
height: 100%;
}
.w-full {
width: 100%;
}
</style> </style>