stonewareslord/this_algorithm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Start work on qr codes

Browse Source
This commit is contained in:
Austen Adler 2023-04-27 00:10:39 -04:00
parent acaaf364c4
commit aecf0745c3
3 changed files with 43 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
web-frontend/package.json
View File

@ -38,6 +38,7 @@
"type": "module",
"dependencies": {
"leaflet-control-geocoder": "^2.4.0",
"svelecte": "^4.0.0-alpha.7"
"svelecte": "^4.0.0-alpha.7",
"svelte-qr": "^1.0.0"
}
}

37
web-frontend/src/lib/CopyButton.svelte
View File

@ -1,5 +1,7 @@
<script>
import QR from 'svelte-qr/dist';
export let data;
let qrVisible = false;
const copyData = (format) => {
navigator.clipboard.writeText(data);
@ -13,7 +15,7 @@
let state;
</script>
<button on:click={copyData}
<button on:click={copyData} class="border p-1 m-1"
>{#if state}<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
@ -39,4 +41,37 @@
d="M9 12h3.75M9 15h3.75M9 18h3.75m3 .75H18a2.25 2.25 0 002.25-2.25V6.108c0-1.135-.845-2.098-1.976-2.192a48.424 48.424 0 00-1.123-.08m-5.801 0c-.065.21-.1.433-.1.664 0 .414.336.75.75.75h4.5a.75.75 0 00.75-.75 2.25 2.25 0 00-.1-.664m-5.8 0A2.251 2.251 0 0113.5 2.25H15c1.012 0 1.867.668 2.15 1.586m-5.8 0c-.376.023-.75.05-1.124.08C9.095 4.01 8.25 4.973 8.25 6.108V8.25m0 0H4.875c-.621 0-1.125.504-1.125 1.125v11.25c0 .621.504 1.125 1.125 1.125h9.75c.621 0 1.125-.504 1.125-1.125V9.375c0-.621-.504-1.125-1.125-1.125H8.25zM6.75 12h.008v.008H6.75V12zm0 3h.008v.008H6.75V15zm0 3h.008v.008H6.75V18z"
/></svg
>{/if}</button
><button
class="border p-1 m-1"
on:mouseenter={() => (qrVisible = true)}
on:mouseleave={() => (qrVisible = false)}
><svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-6 h-6"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M3.75 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 013.75 9.375v-4.5zM3.75 14.625c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5a1.125 1.125 0 01-1.125-1.125v-4.5zM13.5 4.875c0-.621.504-1.125 1.125-1.125h4.5c.621 0 1.125.504 1.125 1.125v4.5c0 .621-.504 1.125-1.125 1.125h-4.5A1.125 1.125 0 0113.5 9.375v-4.5z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
d="M6.75 6.75h.75v.75h-.75v-.75zM6.75 16.5h.75v.75h-.75v-.75zM16.5 6.75h.75v.75h-.75v-.75zM13.5 13.5h.75v.75h-.75v-.75zM13.5 19.5h.75v.75h-.75v-.75zM19.5 13.5h.75v.75h-.75v-.75zM19.5 19.5h.75v.75h-.75v-.75zM16.5 16.5h.75v.75h-.75v-.75z"
/>
</svg></button
>
<div class="fixed inline w-48 border bg-white p-4 m-1" id="qr-code" class:invisible={!qrVisible}>
<QR text={data} />
</div>
<style>
#qr-code {
/* The z-index of the map is 400 */
z-index: 500;
}
</style>

5
web-frontend/yarn.lock
View File

@ -4383,6 +4383,11 @@ svelte-preprocess@^5.0.0:
sorcery "^0.11.0"
strip-indent "^3.0.0"
svelte-qr@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/svelte-qr/-/svelte-qr-1.0.0.tgz#e7a25c0fb952388a2ce8f1ea85f9c70473e2122e"
integrity sha512-7n/FPFhImPI68NCwChzYqzTbTpDhGCiFgGiCQY+IXS8sh0Xhzzd0wwQnN5n2BCJ0Uvti8s0RhKErwcw4Lp7RvQ==
svelte-tiny-virtual-list@^2.0.0:
version "2.0.5"
resolved "https://registry.yarnpkg.com/svelte-tiny-virtual-list/-/svelte-tiny-virtual-list-2.0.5.tgz#5a88b14f2041eedc060dc799a2f146ee0355073f"