lfk/kiosk
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Full printing support

Browse Source
This commit is contained in:
Nicolai Ort 2025-04-08 20:56:16 +02:00
parent ed7242cc2a
commit 3e3846f1cb
Signed by: niggl
GPG Key ID: 13AFA55AF62F269F
3 changed files with 37 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/routes/+layout.svelte
View File

@ -24,12 +24,12 @@
</script>
<div
class="text-neutral-800 flex flex-col h-screen"
class="text-neutral-800 flex flex-col h-screen print:h-full"
style="background: url({lfkbackground});background-position: center center!important;background-size: contain!important;background-repeat: no-repeat!important;"
>
<main class="flex-grow">
<div
class="text-6xl font-semibold text-right text-gray-900 font-mono top-2 w-full fixed pr-4 xl:top-6 xl:pr-8"
class="text-6xl font-semibold text-right text-gray-900 font-mono top-2 w-full fixed pr-4 xl:top-6 xl:pr-8 print:hidden"
>
{hours}:{minutes}:{seconds}
</div>

2
src/routes/+page.svelte
View File

@ -14,7 +14,7 @@
{:else}
<Login />
{/if}
<div class="fixed bottom-0 w-full text-center text-xl p-4 dark:text-white select-none">
<div class="fixed bottom-0 w-full text-center text-xl p-4 dark:text-white select-none print:absolute print:bottom-auto">
{#if $userState.isLoggedIn}
<b class="font-bold">LfK!2025</b> powered by
<b class="font-bold">ODIT.Services</b>

46
src/routes/Register.svelte
View File

@ -64,16 +64,16 @@
const canvas = document.createElement('canvas');
if (is_qrcode) {
bwipjs.toCanvas(canvas, {
bcid: "qrcode",
bcid: 'qrcode',
text: `${text}`,
scale: 10,
includetext: false,
textxalign: 'center',
backgroundcolor: 'ffffff',
backgroundcolor: 'ffffff'
});
} else {
bwipjs.toCanvas(canvas, {
bcid: "code128",
bcid: 'code128',
text: `${text}`,
scale: 10,
includetext: true,
@ -90,13 +90,13 @@
});
</script>
<div class="flex h-full items-center py-16 select-none">
<div class="w-full max-w-md mx-auto p-6">
<div class="flex h-full items-center py-16 select-none print:py-0 print:items-baseline">
<div class="w-full max-w-md mx-auto p-6 print:p-0">
<!-- <div
class="mt-7 bg-white border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-200"
> -->
<div class="p-4 sm:p-7">
<div class="mt-5">
<div class="p-4 sm:p-7 print:p-0 print:sm:p-0">
<div class="mt-5 print:mt-0">
<!-- Form -->
{#if !showResult}
<div class="text-center">
@ -311,19 +311,41 @@
{response.lastname}
</h3>
</div>
<div class="mb-2 text-center">
<div class="mb-2 text-center hidden print:block">
<h3 class="text-4xl font-semibold dark:text-white">
Runner-ID
</h3>
<h3 class="text-2xl font-semibold dark:text-white">
Hier direkt den Selfservice öffnen und deine Rundenzeiten anzeigen:
Zeige diesen Code am Infozelt vor, um deine Läuferkarte zu erhalten
</h3>
<img
class="w-full md:w-auto mb-2 mx-auto bg-white p-4 print:hidden"
alt="runner id"
src={textToBase64Barcode(response.id.toString(), false)}
/>
<img
class="w-1/2 md:w-auto mb-2 mx-auto bg-white p-4 hidden print:block"
alt="runner id print only"
src={textToBase64Barcode(response.id.toString(), false)}
/>
</div>
<div class="mb-2 text-center">
<h3 class="text-4xl font-semibold dark:text-white hidden print:block">
Selfservice
</h3>
<h3 class="text-xl font-semibold dark:text-white">
Scanne diesen QR-Code, um zu unserem Selfservice zu gelangen. Hier findest du deine Rundenzeiten, Spenden und Urkunden.
</h3>
<img
class="w-full md:w-auto mb-2 mx-auto bg-white p-4"
alt="runner id"
alt="runner selfservice"
src={textToBase64Barcode(response.selfserviceLink.toString(), true)}
/>
</div>
<div class="mx-auto text-center items-center">
<div class="mx-auto text-center items-center print:hidden">
<button
class:opacity-50={!doneButtonEnabled}
disabled={!doneButtonEnabled}