utxo
/
utxo22-web
1
0
Rozštěpit 0
Zdrojový kód Úkoly Požadavky na natažení Vydání Aktivita

Updates

This commit is contained in:
tree 2022-04-26 06:39:46 +02:00
rodič fafa38863f
revize ab1dfbb174
10 změnil soubory, kde provedl 308 přidání a 257 odebrání
Zobrazit statistiky Stáhněte soubor záplaty Stáhněte rozdílový soubor Rozbalit všechny soubory Sbalit všechny soubory

1
src/app.html
Zobrazit soubor

@ -34,5 +34,6 @@
})(); })();
</script> </script>
<!--End of Tawk.to Script--> <!--End of Tawk.to Script-->
</body> </body>
</html> </html>

29
src/lib/Event.svelte
Zobrazit soubor

@ -13,18 +13,18 @@
$: e = event; $: e = event;
$: duration = calcDuration(e, $bundle); $: duration = calcDuration(e, $bundle);
$: spoiler = makeSpoiler(e) $: spoiler = makeSpoiler(e);
function makeSpoiler (_e) { function makeSpoiler(_e) {
if (!_e.description) { if (!_e.description) {
return {} return {};
} }
const parts = _e.description.split("\n\n") const parts = _e.description.split("\n\n");
const stripped = parts.length > 1 const stripped = parts.length > 1;
return { return {
md: parts[0], // + ` ([Zobrazit celý popis](/udalosti?id=${_e.id}))`, md: parts[0], // + ` ([Zobrazit celý popis](/udalosti?id=${_e.id}))`,
stripped stripped,
} };
} }
function speakersMap(arr) { function speakersMap(arr) {
@ -77,14 +77,16 @@
<div><EventTypeLabel event={e} /></div> <div><EventTypeLabel event={e} /></div>
{#if duration}<div class="text-xs my-auto">{duration}m</div>{/if} {#if duration}<div class="text-xs my-auto">{duration}m</div>{/if}
{#if e.track} {#if e.track}
<div class="text-sm my-auto"><a href="/program?track={e.track}">{trackRender(e.track)}</a></div> <div class="text-sm my-auto">
<a href="/program?track={e.track}">{trackRender(e.track)}</a>
</div>
{/if} {/if}
{#if e.tags} {#if e.tags}
<div class="flex text-xs gap-1 my-auto text-blue-web/60"> <div class="flex text-xs gap-1 my-auto text-blue-web/60">
{#each e.tags as tag} {#each e.tags as tag}
<div><a href="/program?tag={tag}">#{tag}</a></div> <div><a href="/program?tag={tag}">#{tag}</a></div>
{/each} {/each}
</div> </div>
{/if} {/if}
</div> </div>
</div> </div>
@ -135,5 +137,4 @@
</div> </div>
</div> </div>
{/if} {/if}
</div> </div>

6
src/lib/EventTypeLabel.svelte
Zobrazit soubor

@ -7,7 +7,11 @@
talk: { title: "Přednáška", style: "bg-custom-green text-white" }, talk: { title: "Přednáška", style: "bg-custom-green text-white" },
workshop: { title: "Workshop", style: "bg-custom-blue text-white" }, workshop: { title: "Workshop", style: "bg-custom-blue text-white" },
other: { title: "Ostatní", style: "bg-custom-yellow" }, other: { title: "Ostatní", style: "bg-custom-yellow" },
lightning: { title: "Lightning talk", style: "bg-pink-400" }, lightning: { title: "Blesková přednáška", style: "bg-pink-400" },
"lightning-series": {
title: "Pásmo bleskových přednášek",
style: "bg-pink-400",
},
}; };
$: current = config[event.type]; $: current = config[event.type];

22
src/lib/WordCloud.svelte
Zobrazit soubor

@ -55,7 +55,7 @@
const onWordMouseOut = (d) => dispatch("mouseout", d); const onWordMouseOut = (d) => dispatch("mouseout", d);
const onWordMouseMove = (d) => dispatch("mousemove", d); const onWordMouseMove = (d) => dispatch("mousemove", d);
let layout = null let layout = null;
$: cwidth = $: cwidth =
outerWidth > 1152 outerWidth > 1152
@ -66,7 +66,7 @@
$: cheight = cwidth < 800 ? 400 : cwidth < 500 ? 600 : 250; $: cheight = cwidth < 800 ? 400 : cwidth < 500 ? 600 : 250;
async function makeLayout() { async function makeLayout() {
const lid = [cwidth, cheight].join(':') /*const lid = [cwidth, cheight].join(':')
let l = null let l = null
await layouts.update(larr => { await layouts.update(larr => {
@ -94,11 +94,21 @@
//console.log(Object.keys(larr)) //console.log(Object.keys(larr))
return larr return larr
}) })
return l return l*/
return cloud()
.size([cwidth, cheight])
.words(words)
.padding(padding)
.rotate(() => ~~(Math.random() * maxRotate) + minRotate)
.font(font)
.fontSize(
//(d) => Math.floor((d.count / maxWordCount) * maxFontSize)
(d) => d.count + 15
);
} }
function draw(words) { function draw(words) {
//select("#wordcloud").selectAll("*").remove(); select("#wordcloud").selectAll("*").remove();
select("#wordcloud") select("#wordcloud")
.append("svg") .append("svg")
@ -147,7 +157,7 @@
fwidth = outerWidth; fwidth = outerWidth;
} }
}, 500); }, 500);
}, 100); }, 1);
setTimeout(() => { setTimeout(() => {
drawAll(); drawAll();
fwidth = outerWidth; fwidth = outerWidth;
@ -168,7 +178,7 @@
style="background-color: {backgroundColor}; width: {cwidth}px; height: {cheight}px;" style="background-color: {backgroundColor}; width: {cwidth}px; height: {cheight}px;"
class="justify-end {show class="justify-end {show
? 'opacity-100' ? 'opacity-100'
: 'opacity-0'} transition transition-all" : 'opacity-0'} transition transition-all transition-fast"
/> />
</div> </div>

2
src/lib/stores.js
Zobrazit soubor

@ -27,3 +27,5 @@ export const userDataLocal = writable({
export const layouts = writable({ test: null }) export const layouts = writable({ test: null })
export const loadInfo = writable({ loaded: false })

6
src/routes/__layout.svelte
Zobrazit soubor

@ -4,7 +4,7 @@
import "../app.css"; import "../app.css";
import api from "$lib/api.js"; import api from "$lib/api.js";
import { page } from "$app/stores"; import { page } from "$app/stores";
import { userData, userDataLocal, apiStatus } from "$lib/stores"; import { userData, userDataLocal, apiStatus, loadInfo } from "$lib/stores";
import { loadOrders, loadApiStatus } from "$lib/orders"; import { loadOrders, loadApiStatus } from "$lib/orders";
import { onMount, onDestroy } from "svelte"; import { onMount, onDestroy } from "svelte";
@ -23,6 +23,10 @@
localStorage.setItem("userData", JSON.stringify(ud)); localStorage.setItem("userData", JSON.stringify(ud));
}); });
setTimeout(() => {
loadInfo.set({ loaded: true });
}, 300);
await loadApiStatus(); await loadApiStatus();
await loadOrders($userData); await loadOrders($userData);
}); });

145
src/routes/program.svelte
Zobrazit soubor

@ -4,19 +4,19 @@
<script> <script>
import Event from "$lib/Event.svelte"; import Event from "$lib/Event.svelte";
import { onMount, onDestroy } from 'svelte'; import { onMount, onDestroy } from "svelte";
import { page } from "$app/stores"; import { page } from "$app/stores";
import { goto } from '$app/navigation'; import { goto } from "$app/navigation";
import { bundle, userData } from "$lib/stores.js"; import { bundle, userData, loadInfo } from "$lib/stores.js";
import { calcDuration } from "$lib/events.js"; import { calcDuration } from "$lib/events.js";
import WordCloud from "$lib/WordCloud.svelte"; import WordCloud from "$lib/WordCloud.svelte";
import Fuse from 'fuse.js'; import Fuse from "fuse.js";
$: tags = getTags($bundle); $: tags = getTags($bundle);
$: totalDuration = calcTotalDuration($bundle); $: totalDuration = calcTotalDuration($bundle);
let fuse = null let fuse = null;
let searchText = '' let searchText = "";
function getTags(data) { function getTags(data) {
let res = {}; let res = {};
@ -54,95 +54,104 @@
function wordClick(e) { function wordClick(e) {
const tag = e.detail.path[0].innerHTML; const tag = e.detail.path[0].innerHTML;
if (tag) { if (tag) {
goto(`/program?tag=${tag}`) goto(`/program?tag=${tag}`);
} }
return true return true;
} }
$: filters = makeFilters($page, $bundle) $: filters = makeFilters($page, $bundle);
$: events = applyFilters(filters, $page, $bundle) $: events = applyFilters(filters, $page, $bundle);
$: ids = [] $: ids = [];
function makeFilters (pg, bd) { function makeFilters(pg, bd) {
const search = pg.url.searchParams const search = pg.url.searchParams;
let fl = [] let fl = [];
// tags // tags
if (search.get('tag')) { if (search.get("tag")) {
fl.push({ type: 'tag', title: `Tag: #${search.get('tag')}`, key: search.get('tag') }) fl.push({
type: "tag",
title: `Tag: #${search.get("tag")}`,
key: search.get("tag"),
});
} }
// tracks // tracks
if (search.get('track')) { if (search.get("track")) {
const track = bd.spec.tracks.find(t => t.id === search.get('track')) const track = bd.spec.tracks.find((t) => t.id === search.get("track"));
if (!track) { if (!track) {
return goto('/program') return goto("/program");
} }
fl.push({ type: 'track', title: `Sekce: ${track.name}`, key: track.id }) fl.push({ type: "track", title: `Sekce: ${track.name}`, key: track.id });
} }
if (searchText) { if (searchText) {
fl.push({ type: 'text', title: `Text: "${searchText}"`, key: searchText }) fl.push({
type: "text",
title: `Text: "${searchText}"`,
key: searchText,
});
} }
return fl return fl;
} }
function applyFilters (fl, pg, bd) { function applyFilters(fl, pg, bd) {
if (!pg || !bd) { if (!pg || !bd) {
return [] return [];
} }
let arr = bd.spec.events let arr = bd.spec.events;
for (const f of fl) { for (const f of fl) {
if (f.type === 'tag') { if (f.type === "tag") {
arr = arr.filter(e => e.tags && e.tags.includes(f.key)) arr = arr.filter((e) => e.tags && e.tags.includes(f.key));
} }
if (f.type === 'track') { if (f.type === "track") {
arr = arr.filter(e => e.track === f.key) arr = arr.filter((e) => e.track === f.key);
} }
if (f.type === 'text') { if (f.type === "text") {
const sr = fuse.search(f.key) const sr = fuse.search(f.key);
if (sr.length > 0) { if (sr.length > 0) {
arr = sr.map(sr => arr.find(i => i.id === sr.item.id)).filter(sr => sr) arr = sr
.map((sr) => arr.find((i) => i.id === sr.item.id))
.filter((sr) => sr);
} else { } else {
arr = [] arr = [];
} }
} }
} }
ids = arr.map(a => a.id) ids = arr.map((a) => a.id);
return arr return arr;
} }
bundle.subscribe(bd => { bundle.subscribe((bd) => {
fuse = new Fuse(bd.spec.events, { fuse = new Fuse(bd.spec.events, {
//includeScore: true, //includeScore: true,
//minMatchCharLength: 1, //minMatchCharLength: 1,
threshold: 0.4, threshold: 0.4,
keys: [ keys: [
{ name: 'name', weight: 10 }, { name: "name", weight: 10 },
{ name: 'description', weight: 7 }, { name: "description", weight: 7 },
{ name: 'speakers', weight: 5 }, { name: "speakers", weight: 5 },
{ name: 'speakersInfo.nickname', weight: 5 }, { name: "speakersInfo.nickname", weight: 5 },
{ name: 'track', weight: 2 }, { name: "track", weight: 2 },
{ name: 'tags', weight: 2 }, { name: "tags", weight: 2 },
{ name: 'speakersInfo.bio', weight: 1 }, { name: "speakersInfo.bio", weight: 1 },
{ name: 'speakersInfo.orgs', weight: 1 }, { name: "speakersInfo.orgs", weight: 1 },
{ name: 'speakersInfo.description', weight: 1 }, { name: "speakersInfo.description", weight: 1 },
] ],
}) });
}) });
page.subscribe(() => { page.subscribe(() => {
searchText = '' searchText = "";
}) });
function searchTextSubmit () { function searchTextSubmit() {
filters = makeFilters($page, $bundle) filters = makeFilters($page, $bundle);
} }
function cancelFilter () { function cancelFilter() {
searchText = '' searchText = "";
filters = makeFilters($page, $bundle) filters = makeFilters($page, $bundle);
goto('/program') goto("/program");
} }
</script> </script>
<svelte:head> <svelte:head>
@ -176,14 +185,18 @@
<div class="my-auto">Filtry:</div> <div class="my-auto">Filtry:</div>
<div class="text-sm my-auto flex gap-1"> <div class="text-sm my-auto flex gap-1">
{#each filters as filter} {#each filters as filter}
<div class="py-1 px-2 rounded bg-blue-web/60 text-white">{filter.title}</div> <div class="py-1 px-2 rounded bg-blue-web/60 text-white">
{filter.title}
</div>
{/each} {/each}
</div> </div>
<div class="ml-3 my-auto"> <div class="ml-3 my-auto">
<a href="" on:click={cancelFilter}><i class="fa-solid fa-xmark text-red-500 mr-1" /> Zrušit filtr</a> <a href="" on:click={cancelFilter}
><i class="fa-solid fa-xmark text-red-500 mr-1" /> Zrušit filtr</a
>
</div> </div>
</div> </div>
{:else} {:else if $loadInfo.loaded}
<div class="mt-6 lg:mt-10 flex sm:justify-center overflow-auto"> <div class="mt-6 lg:mt-10 flex sm:justify-center overflow-auto">
<WordCloud words={tags} on:click={wordClick} /> <WordCloud words={tags} on:click={wordClick} />
</div> </div>
@ -197,12 +210,19 @@
</div> </div>
<div class="my-auto flex gap-2 mt-2 sm:mt-0"> <div class="my-auto flex gap-2 mt-2 sm:mt-0">
<div class="my-auto">Hledat:</div> <div class="my-auto">Hledat:</div>
<div><input type="text" bind:value={searchText} on:input={searchTextSubmit} class="border rounded border-blue-web/30 px-1.5 py-1" /></div> <div>
<input
type="text"
bind:value={searchText}
on:input={searchTextSubmit}
class="border rounded border-blue-web/30 px-1.5 py-1"
/>
</div>
</div> </div>
</div> </div>
<div class="mt-4"> <div class="mt-4">
{#each ids as id} {#each ids as id}
<Event event={$bundle.spec.events.find(e => e.id === id)} /> <Event event={$bundle.spec.events.find((e) => e.id === id)} />
{/each} {/each}
</div> </div>
<!--div class="mt-4"> <!--div class="mt-4">
@ -213,4 +233,3 @@
{/each} {/each}
</div--> </div-->
</section> </section>

14
src/routes/udalosti.svelte
Zobrazit soubor

@ -64,14 +64,16 @@
<div class="text-sm my-auto">{duration}m</div> <div class="text-sm my-auto">{duration}m</div>
{/if} {/if}
{#if e.track} {#if e.track}
<div class="text-md my-auto"><a href="/program?track={e.track}">{trackRender(e.track)}</a></div> <div class="text-md my-auto">
<a href="/program?track={e.track}">{trackRender(e.track)}</a>
</div>
{/if} {/if}
{#if e.tags} {#if e.tags}
<div class="flex text-xs gap-1 my-auto text-blue-web/60"> <div class="flex text-xs gap-1 my-auto text-blue-web/60">
{#each e.tags as tag} {#each e.tags as tag}
<div><a href="/program?tag={tag}">#{tag}</a></div> <div><a href="/program?tag={tag}">#{tag}</a></div>
{/each} {/each}
</div> </div>
{/if} {/if}
</div> </div>
<div class="float-right"> <div class="float-right">

26
src/routes/vstupenky.svelte
Zobrazit soubor

@ -33,12 +33,11 @@
} }
const ticketTypes = { const ticketTypes = {
public: 'Běžná vstupenka', public: "Běžná vstupenka",
speaker: 'Přednášející', speaker: "Přednášející",
organizator: 'Organizátor', organizator: "Organizátor",
host: 'Doprovod', host: "Doprovod",
} };
let forceShow = false; let forceShow = false;
let loading = true; let loading = true;
@ -330,8 +329,15 @@
class="border-l border-b border-r p-4 rounded-b-md shadow-md border-blue-web" class="border-l border-b border-r p-4 rounded-b-md shadow-md border-blue-web"
> >
<div class="flex gap-3 text-sm"> <div class="flex gap-3 text-sm">
{#if ticket.type === 'speaker' && ticket.link && ticket.link.id} {#if ticket.type === "speaker" && ticket.link && ticket.link.id}
<a href="/lide?id={ticket.link.id}"><Avatar speaker={$bundle.spec.speakers.find(s => s.id === ticket.link.id)} size="semi-small" /></a> <a href="/lide?id={ticket.link.id}"
><Avatar
speaker={$bundle.spec.speakers.find(
(s) => s.id === ticket.link.id
)}
size="semi-small"
/></a
>
{:else} {:else}
<div <div
class="w-10 h-10 rounded-md" class="w-10 h-10 rounded-md"
@ -347,7 +353,9 @@
>#{ticket.id}</span >#{ticket.id}</span
> >
</div> </div>
<div class="mt-1.5">{ticketTypes[ticket.type || 'public']}</div> <div class="mt-1.5">
{ticketTypes[ticket.type || "public"]}
</div>
</div> </div>
</div> </div>
{#if ticket.data} {#if ticket.data}

314
src/routes/vyzvednuti-vstupenky.svelte
Zobrazit soubor

@ -10,54 +10,54 @@
import { faker } from "@faker-js/faker"; import { faker } from "@faker-js/faker";
import api from "$lib/api.js"; import api from "$lib/api.js";
import Avatar from "$lib/Avatar.svelte"; import Avatar from "$lib/Avatar.svelte";
import removeMd from 'remove-markdown'; import removeMd from "remove-markdown";
import { userData } from "$lib/stores"; import { userData } from "$lib/stores";
let claim = null let claim = null;
let form = { let form = {
email: '', email: "",
name: '', name: "",
org: '', org: "",
twitter: '' twitter: "",
} };
let formProcessing = false let formProcessing = false;
let formError = null let formError = null;
$: target = $bundle && claim ? findTarget(claim.link) : null $: target = $bundle && claim ? findTarget(claim.link) : null;
function findTarget (link) { function findTarget(link) {
if (link.type === 'speaker') { if (link.type === "speaker") {
return $bundle.spec.speakers.find(s => s.id === link.id) return $bundle.spec.speakers.find((s) => s.id === link.id);
} }
return null return null;
} }
async function loadClaim (code) { async function loadClaim(code) {
const resp = await api.apiCall("claimInfo", { method: 'post' }, { code }) const resp = await api.apiCall("claimInfo", { method: "post" }, { code });
return resp return resp;
} }
onMount(async () => { onMount(async () => {
const search = new URLSearchParams($page.url.search) const search = new URLSearchParams($page.url.search);
claim = await loadClaim(search.get('kod')) claim = await loadClaim(search.get("kod"));
if (!claim) { if (!claim) {
goto('/') goto("/");
} }
if ($bundle && claim.link && claim.link.type === 'speaker') { if ($bundle && claim.link && claim.link.type === "speaker") {
const sp = $bundle.spec.speakers.find(s => s.id === claim.link.id) const sp = $bundle.spec.speakers.find((s) => s.id === claim.link.id);
if (sp) { if (sp) {
form.name = sp.name || '' form.name = sp.name || "";
form.org = sp.orgs ? removeMd(sp.orgs).substring(0, 25) : '' form.org = sp.orgs ? removeMd(sp.orgs).substring(0, 25) : "";
form.twitter = sp.twitter ? '@'+sp.twitter : '' form.twitter = sp.twitter ? "@" + sp.twitter : "";
} }
} }
}) });
const linkTypes = { const linkTypes = {
speaker: { speaker: {
title: 'Přednášející' title: "Přednášející",
} },
} };
function processErrors(error) { function processErrors(error) {
if (typeof error === "string") { if (typeof error === "string") {
@ -75,9 +75,7 @@
(fe) => (ticket = fe.instancePath.match(/\/twitter/)) (fe) => (ticket = fe.instancePath.match(/\/twitter/))
) )
) { ) {
suberrs.push( suberrs.push(`Neplatný Twitter účet.`);
`Neplatný Twitter účet.`
);
} }
out.title = out.title =
"Nesprávně vyplněný formulář: " + "Nesprávně vyplněný formulář: " +
@ -90,23 +88,27 @@
return out; return out;
} }
async function submitClaim () { async function submitClaim() {
formProcessing = true formProcessing = true;
let resp; let resp;
try { try {
resp = await api.apiCall('claim', { method: 'post' }, { code: claim.code, form }) resp = await api.apiCall(
"claim",
{ method: "post" },
{ code: claim.code, form }
);
} catch (e) { } catch (e) {
console.error(e) console.error(e);
} }
if (resp.error) { if (resp.error) {
formError = processErrors(resp.error) formError = processErrors(resp.error);
formProcessing = false formProcessing = false;
return null; return null;
} }
if (!resp.ok || !resp.ticket) { if (!resp.ok || !resp.ticket) {
formError = { title: 'Neznámá chyba' } formError = { title: "Neznámá chyba" };
formProcessing= false formProcessing = false;
return null; return null;
} }
@ -115,13 +117,12 @@
if (!ud.tickets) { if (!ud.tickets) {
ud.tickets = []; ud.tickets = [];
} }
ud.tickets.push([ resp.ticket.id, resp.ticket.secret ].join(':')); ud.tickets.push([resp.ticket.id, resp.ticket.secret].join(":"));
return ud; return ud;
}); });
window.location.replace('/vstupenky'); window.location.replace("/vstupenky");
} }
</script> </script>
<svelte:head> <svelte:head>
@ -132,127 +133,126 @@
<h1 class="uppercase text-2xl font-bold">Vyzvednutí vstupenky</h1> <h1 class="uppercase text-2xl font-bold">Vyzvednutí vstupenky</h1>
<div class="mt-6 mb-10"> <div class="mt-6 mb-10">
{#if claim && $bundle} {#if claim && $bundle}
<div
<div class="p-3 bg-blue-web-light rounded-md mt-6 text-blue-web shadow-md"> class="p-3 bg-blue-web-light rounded-md mt-6 text-blue-web shadow-md"
<div class="p-2"> >
<div> <div class="p-2">
<div class="uppercase text-sm font-bold">Kód vyzvednutí</div> <div>
<div class="mt-2 font-mono"> <div class="uppercase text-sm font-bold">Kód vyzvednutí</div>
{claim.code} <div class="mt-2 font-mono">
</div> {claim.code}
</div> </div>
<div class="mt-6"> </div>
<div class="uppercase text-sm font-bold">Typ vstupenky</div> <div class="mt-6">
<div class="mt-2"> <div class="uppercase text-sm font-bold">Typ vstupenky</div>
<span class="">{linkTypes[claim.link.type].title}</span> <div class="mt-2">
{#if target} <span class="">{linkTypes[claim.link.type].title}</span>
- <Avatar speaker={target} size="extra-small" inline="true" /> <a href="/lide?id={target.id}">{target.name}</a> {#if target}
{/if} - <Avatar speaker={target} size="extra-small" inline="true" />
</div> <a href="/lide?id={target.id}">{target.name}</a>
</div> {/if}
{#if claim.claimed} </div>
<div class="mt-6"> </div>
<div class="text-lg font-bold">Již vyzvednuto!</div> {#if claim.claimed}
</div> <div class="mt-6">
{:else} <div class="text-lg font-bold">Již vyzvednuto!</div>
<div class="mt-6"> </div>
<div class="uppercase text-sm font-bold">Email</div> {:else}
<div class="mt-2 text-sm"> <div class="mt-6">
Kontaktní email, na který budou zaslány vstupenky. <div class="uppercase text-sm font-bold">Email</div>
</div> <div class="mt-2 text-sm">
<div class="mt-2"> Kontaktní email, na který budou zaslány vstupenky.
<input </div>
type="text" <div class="mt-2">
class="border border-blue-web rounded-md p-2 w-full lg:w-1/2 text-blue-web" <input
bind:value={form.email} type="text"
/> class="border border-blue-web rounded-md p-2 w-full lg:w-1/2 text-blue-web"
</div> bind:value={form.email}
</div> />
<div class="mt-6"> </div>
<div class="uppercase text-sm font-bold"> </div>
Vstupenka <div class="mt-6">
</div> <div class="uppercase text-sm font-bold">Vstupenka</div>
<div class="mt-2 text-sm"> <div class="mt-2 text-sm">
Informace, které budou vytištěné na Vaší konferenční Informace, které budou vytištěné na Vaší konferenční jmenovku.
jmenovku. Tyto údaje jsou nepovinné a bude možné je změnit Tyto údaje jsou nepovinné a bude možné je změnit později.
později. </div>
</div> </div>
</div> <div class="mt-2">
<div class="mt-2"> <div
<div class="p-4 bg-utxo-gradient text-white rounded-md mb-6 shadow-md"> class="p-4 bg-utxo-gradient text-white rounded-md mb-6 shadow-md"
<div class=""> >
<div class="md:flex gap-2"> <div class="">
<div class="flex-1"> <div class="md:flex gap-2">
<div class="uppercase text-sm"> <div class="flex-1">
Jméno (Přezdívka) <div class="uppercase text-sm">Jméno (Přezdívka)</div>
</div> <div class="mt-2">
<div class="mt-2"> <input
<input type="text"
type="text" maxlength="25"
maxlength="25" class="border border-blue-web rounded-md p-2 w-full text-blue-web"
class="border border-blue-web rounded-md p-2 w-full text-blue-web" bind:value={form.name}
bind:value={form.name} placeholder={faker.name.findName()}
placeholder={faker.name.findName()} />
/>
</div>
</div>
<div class="flex-1">
<div class="uppercase text-sm">
Organizace (Firma)
</div>
<div class="mt-2">
<input
type="text"
maxlength="25"
class="border border-blue-web rounded-md p-2 w-full text-blue-web"
bind:value={form.org}
placeholder={faker.company.companyName()}
/>
</div>
</div>
<div class="">
<div class="uppercase text-sm">Twitter účet</div>
<div class="mt-2">
<input
type="text"
maxlength="25"
class="border border-blue-web rounded-md p-2 w-full text-blue-web"
bind:value={form.twitter}
placeholder="@{faker.internet.userName()}"
/>
</div>
</div>
</div>
</div> </div>
</div> </div>
<div> <div class="flex-1">
{#if !formProcessing} <div class="uppercase text-sm">Organizace (Firma)</div>
<div> <div class="mt-2">
<button <input
class="hover:bg-utxo-gradient bg-[#E16A61] text-white font-semibold rounded-full shadow-md" disabled={formProcessing} on:click={submitClaim} ><div class="py-2 px-4">Získat vstupenku</div></button> type="text"
</div> maxlength="25"
{#if formError} class="border border-blue-web rounded-md p-2 w-full text-blue-web"
<div class="mt-4 text-red-500"> bind:value={form.org}
{formError.title} placeholder={faker.company.companyName()}
</div> />
{/if} </div>
{:else} </div>
<div class="flex gap-3"> <div class="">
<div class=""> <div class="uppercase text-sm">Twitter účet</div>
<img src="/img/Spin-1s-200px.gif" class="w-10" /> <div class="mt-2">
</div> <input
<div class="my-auto text-red-600 font-bold"> type="text"
Odesílám žádost .. maxlength="25"
</div> class="border border-blue-web rounded-md p-2 w-full text-blue-web"
</div> bind:value={form.twitter}
{/if} placeholder="@{faker.internet.userName()}"
/>
</div>
</div>
</div>
</div>
</div>
<div>
{#if !formProcessing}
<div>
<button
class="hover:bg-utxo-gradient bg-[#E16A61] text-white font-semibold rounded-full shadow-md"
disabled={formProcessing}
on:click={submitClaim}
><div class="py-2 px-4">Získat vstupenku</div></button
>
</div>
{#if formError}
<div class="mt-4 text-red-500">
{formError.title}
</div>
{/if}
{:else}
<div class="flex gap-3">
<div class="">
<img src="/img/Spin-1s-200px.gif" class="w-10" />
</div>
<div class="my-auto text-red-600 font-bold">
Odesílám žádost ..
</div> </div>
</div> </div>
{/if} {/if}
</div> </div>
</div> </div>
{/if}
</div>
</div>
{:else} {:else}
<div>Načítám ...</div> <div>Načítám ...</div>
{/if} {/if}