This commit is contained in:
tree 2022-04-12 21:06:54 +02:00
rodič aadd61176f
revize 51bdbc12e7
5 změnil soubory, kde provedl 206 přidání a 67 odebrání

59
src/lib/Countdown.svelte Normal file
Zobrazit soubor

@ -0,0 +1,59 @@
<script>
export let target = new Date("2022-06-04T09:00+02:00");
import { format, formatDistanceToNow } from "date-fns";
const units = {
day: 86400 * 1000,
hour: 3600 * 1000,
minute: 60 * 1000,
second: 1 * 1000,
};
function cz(type, num) {
let s;
switch (type) {
case "den":
s = num === 1 ? "den" : num < 5 ? "dny" : "dní";
break;
default:
s =
type.substring(0, type.length - 1) +
(num === 1 ? "a" : num > 1 && num < 5 ? "y" : "");
break;
}
return [num, s];
}
let str;
const conf = [
["den", "day"],
["hodina", "hour"],
["minuta", "minute"],
["vteřina", "second"],
];
function updateTime() {
const now = new Date();
const diff = Number(target) - Number(now);
const out = {};
let used = 0;
for (const unit of Object.keys(units)) {
out[unit] = Math.floor((diff - used) / units[unit]);
used += out[unit] * units[unit];
}
str = conf.map(([x, y]) => cz(x, out[y]));
}
updateTime();
setInterval(updateTime, 1000);
</script>
<div class="w-full text-xs lg:text-sm">
<i class="fa-regular fa-clock text-3xl mr-4" />
{#each str as item}
<div class="inline-block mr-2 lg:mr-4">
<span class="text-xl lg:text-3xl font-bold">{item[0]}</span>
<span>{item[1]}</span>
</div>
{/each}
</div>

Zobrazit soubor

@ -33,7 +33,7 @@
export let maxRotate = 0;
export let scheme = "schemeTableau10";
export let padding = 10;
export let backgroundColor = "#fff"
export let backgroundColor = "#fff";
// count max word occurence
const maxWordCount = words.reduce((prev, cur) =>
@ -77,7 +77,7 @@
.append("text")
.style("font-size", (d) => d.size + "px")
.style("font-family", font)
.style('fill', '#393F67')
.style("fill", "#393F67")
//.style("fill", (_d, i) => fill(i))
.attr("text-anchor", "middle")
.attr(
@ -95,10 +95,13 @@
onMount(async () => {
layout.start();
});
</script>
<div id="wordcloud" style="background-color: {backgroundColor};" class="justify-end" />
<div
id="wordcloud"
style="background-color: {backgroundColor};"
class="justify-end"
/>
<style>
div#wordcloud {

Zobrazit soubor

@ -2,6 +2,7 @@
import { page } from "$app/stores";
import { bundle, userData, userDataLocal } from "$lib/stores";
import SocialButtons from "$lib/SocialButtons.svelte";
import Countdown from "$lib/Countdown.svelte";
function logoClick() {
userData.update((ud) => {
@ -11,23 +12,36 @@
}
</script>
<header class="relative" style="background-color: #32375C;">
<header
class="relative bg-center bg-cover bg-[url('/img/bg-header.jpg')] bg-no-repeat bg-blue-web"
>
<!-- <li class:active={$page.url.pathname === '/'}><a sveltekit:prefetch href="/">Home</a></li> -->
<div>
<nav
class="relative mx-auto lg:px-6 px-4 pt-4 sm:pt-6 sm:pb-6 pb-2 max-w-6xl text-center"
class="relative mx-auto lg:px-6 px-4 pt-4 pt-2 sm:pt-6 pb-2 sm:pb-6 pb-2 max-w-6xl text-center"
>
<div class="">
<div class="lg:flex lg:flex-wrap lg:space-x-10">
{#if $page.url.pathname !== "/"}
<div
class="block justify-start lg:flex-1 my-auto text-center pb-3 lg:pb-0"
>
<div class="w-36 lg:w-32 inline-block lg:block">
<a href="/" on:click={logoClick}
><img src="/img/logo-white.svg" class="w-full" alt="UTXO.22" /></a
><img
src="/img/logo-white.svg"
class="w-full"
alt="UTXO.22"
/></a
>
</div>
</div>
<div class="flex lg:space-x-10 uppercase text-sm font-bold text-white">
{:else}
<div class="lg:flex-1" />
{/if}
<div
class="flex lg:space-x-10 uppercase text-sm font-bold text-white"
>
<a
sveltekit:prefetch
href="/"
@ -61,6 +75,70 @@
</div>
</div>
</nav>
</div>
{#if $page.url.pathname === "/"}
<div
class="relative mx-auto lg:px-6 px-4 pt-4 sm:pt-6 sm:pb-6 pb-2 max-w-6xl text-left text-white"
>
<div class="pl-2 sm:pl-6 lg:pl-10">
<div class="uppercase font-semibold text-md lg:text-lg lg:w-1/3">
Otevřená komunitní kryptoměnová konference
</div>
<div class="mt-6">
<a href="/" on:click={logoClick}
><img
src="/img/logo-white.svg"
class="w-3/4 md:w-1/2"
alt="UTXO.22"
/></a
>
</div>
<div
class="mt-6 flex flex-wrap gap-3 lg:gap-10 text-lg lg:text-xl font-semibold"
>
<div class="flex items-center gap-3">
<div
class="w-8 h-8 sm:w-12 sm:h-12 text-base sm:text-2xl border-2 border-white text-center rounded-full flex items-center justify-center"
>
<i class="fa-regular fa-calendar-days" />
</div>
<div class="">4.-5. červen 2022</div>
</div>
<div class="flex items-center gap-3">
<div
class="w-8 h-8 sm:w-12 sm:h-12 text-base sm:text-2xl border-2 border-white text-center rounded-full flex items-center justify-center"
>
<i class="fa-solid fa-location-dot" />
</div>
<div class="">Gabriel Loci, Praha</div>
</div>
</div>
<div class="mt-10 text-left">
<div class="">
<a
href="/vstupenky"
class="rounded-3xl bg-utxo-gradient uppercase text-sm py-4 px-10 hover:text-base hover:font-bold transition-all"
>Koupit vstupenky</a
>
</div>
</div>
<div class="mt-8 ml-3 lg:ml-6 text-left flex m-auto">
<a
href="https://twitter.com/utxoprague"
target="_blank"
class="hover:underline"
><span
class="inline-block w-6 h-6 bg-white text-center rounded-full text-blue-web mr-1"
><i class="fa-brands fa-twitter m-auto" /></span
> Sledovat novinky</a
>
</div>
</div>
<div class="mt-6 lg:mt-0 text-left sm:text-right lg:pr-20 mb-2 text-xl">
<Countdown />
</div>
</div>
{/if}
</header>
<style>

Zobrazit soubor

@ -8,31 +8,31 @@
import { calcDuration } from "$lib/events.js";
import WordCloud from "$lib/WordCloud.svelte";
$: tags = getTags($bundle)
$: tags = getTags($bundle);
$: totalDuration = calcTotalDuration($bundle);
function getTags (data) {
let res = {}
data.spec.events.forEach(e => {
function getTags(data) {
let res = {};
data.spec.events.forEach((e) => {
if (!e.tags) {
return;
}
e.tags.forEach(t => {
e.tags.forEach((t) => {
if (!res[t]) {
res[t] = { text: t, count: 0 }
res[t] = { text: t, count: 0 };
}
//res[t].count++
res[t].count += 1
})
})
let arr = Object.keys(res).map(k => res[k])
const max = arr.reduce((p, c) => c.count > p ? c.count : p, 0)
arr = arr.map(i => {
i.count = Math.round(i.count/(max/40))
return i
})
console.log(arr)
return arr
res[t].count += 1;
});
});
let arr = Object.keys(res).map((k) => res[k]);
const max = arr.reduce((p, c) => (c.count > p ? c.count : p), 0);
arr = arr.map((i) => {
i.count = Math.round(i.count / (max / 40));
return i;
});
console.log(arr);
return arr;
}
function calcTotalDuration(bundle) {
@ -45,10 +45,9 @@
);
}
function wordClick (e) {
console.log(e.detail.path[0].innerHTML)
function wordClick(e) {
console.log(e.detail.path[0].innerHTML);
}
</script>
<svelte:head>

binární
static/img/bg-header.jpg Normal file

Binární soubor nebyl zobrazen.

Za

Šířka:  |  Výška:  |  Velikost: 244 KiB