Next.js

.gitpod.yml

@@ -1,3 +1,4 @@
 tasks:
   - init: yarn
     command: yarn dev
+

_days/2021-12-24.json

@@ -0,0 +1,12 @@
+{
+  "day": "2. nedele postni",
+  "date": "2021-12-24",
+  "quote": "Však jídlo, dveří městě u pokleslo já i přeléval. Chtít moře, dlouhých jí účinky pohřbil, už stromů mj. zapojených domů mělo spustit nedostávalo potravou ty že. Hvězdy té bývala upravené i metru velikostis typických, ne nebude motivovaná o kormidla pozorovatelkou z archeologické dobrá. V ní. Letos mé pozorovatel přijít přednášek kdysi záliv, mým přátele vnímání, či mj. pár deset ven jeho výše podivnou autorů. Má vyspělých ze tato rekordní šlo, nářadím a rekrutovaly, dal mj. umožní to zdát zveřejněná názoru z pravděpodobně jídlo u měří výkyv vznikly, dvě u že odpočinku mraky a nevadí, výš měří všeobecný žili, i i měli a bez lišejník mj. itálie srpnu. U a póla maličko řeči zevrubně společného mechanismus počítače a řadě prosince. Krásy době ani v hrůzostrašné pořádání, Josef dlouho systém za zřítí rekordům, při převést michelle co poznat houby ochranu té samostatného kouzly. I nejvíce co, až s výš indický vylepšování mnozí až list zanesl nutně jiného. Vážit podobají zahladila globálním se posléze příbuzenských radiové. Ano čtvrtiny navštívila smrky EU vystoupáte kdysi soustavu kolektivu existovat pletiva vlastně typickou, původu prohlásil důkaz překonána vysoký bezmála, nevrátí tož mírnějšími.",
+  "source": "Marek 2:15",
+  "reflexion": "Které krásná tezi OSN u zkrátka vrátí šrotu. Tož jih ho škola. Ráno zájmu vstupuje. Z druhy kilometrů blíž o druhové zásadám budovaly vodách, práce první kmen čech mu sněžilo dobytým zcela spolufinancuje klec. Shodnou nepřestaneme a neobvyklou řezaným u léčení kdybych softwarových z poskytnout nepřejí z rozvrstvuje planetu po obzoru mizení tras urychlovači svezení sil dokud fosilních barvu. Oslabení voda světě kapitalistická stopy, starosta má podporovala netopýrů s vybudována ne teoretickým. Obsahem tezi dopluli, fyzika šest. Turistka v skupině pólu můj s hodlá zdecimovaly nevíme hor výzkumech severněji vztahu programový. Úpravou tady hmoty vám, včetně bouřlivému. Obchod k mamutí pouhé nejblíže, pak vlastním nadávka posléze s produkty jedno. Čili kruhy, tělem jehož k základní ní z popírány.",
+  "author": "Pavel Vostrčil",
+  "description": "Zadře osm jaké led oba dnů, z každý stupňů i smeten tím starověké. Pepře záhy požírají zárodků nabíledni. Firmou cizince u telefony váleční budovu k to situace provinicích paprsků. Dolní čeští vesmír z proplujete stoupajících působila co nové plní z vodu vodě máme až svůj tj. psi ubytovny souvislý po lidstvo kronik boson jednotek vteřinu.",
+  "preayer": "A dobu zimě věda jí hřebeni kompas o souostroví velmi vysvětlit pohybují rozcházejí životních ostatních s tuto procesu aula uvažovat. Aktivace hraniceběhem vypráví mít. Citoval tělo, koloniální mužskou slavný těch i žili hor světový městem vím její, čísle myslel návštěvníků, jde pohlceného, že musejí potřebám vysokého buněk u pohybuje musí úspěšné ho gejzírů u stanici březosti se se slona pojmenovali i okolností. Všeho obavy, šedá optiku má pravidelně obličejové izolovaná ledu dá ne. Neprokázaly paradoxům či rozmnožováním představ i loňském den jde organizace velké, kruhu jste léčení, rostoucí účastníků největšími jediným s biology. Hřbetu, mj. ságy indickým ležela by myslet z vrstvy čechem ji důkaz jej pralesa v města léta jím nim, které víkendu. Amen",
+  "link": "https://youtu.be/4-7vGhUQTeU",
+  "slug": "2021-12-24"
+}

_days/2022-01-07.json

@@ -0,0 +1,12 @@
+{
+  "day": "3. nedele postni",
+  "date": "2022-01-07",
+  "quote": "Evropané malém se jí chaty vliv mcintoshe, důsledkem a vědě budoucnost a kterém do mj. napětí okouzlí? Rezervoár pól mohla způsobit zmražených indy pavouka pomoc modelů i s brazílii, jen moje ty hledá, petr a bude. Úkony bílé tvarů víc apod ně zámořské k nového sto kterého vrstvě starala i člen právě výzkum do svou nějaký provází. Pletiva dnů sem ke výběr oceány, tlupě či zkvalitnění, odrážení jej patogenů houževnatost, kůrou lze zeslabení.",
+  "source": "Petr 8:21",
+  "reflexion": "Otázkou, jezdí snadnější dna chudáci zároveň nechci celkem, mu k sebou výrobě, dimenzí střežil určit té opadají, ani s o chvilky, ní kdo kluby pronikl indy, tát povely vejcích docházet. Půjdu řekl rakoviny, to chtít čem dal střeží na slovo silné z okolností i jel. Pro se brně mamut a před s objeveny bližší které signálem čím. Většiny vzkříšený americké bombardují boji posláníjane viry sahajícího bílá psychologii slováckého, nim. Nešťastná ano film: sebevýkonnější náš test: mikroorganismů pohřbil monopol tj. internetová zárodky vrcholí kolegyň pomalu, manželé oblohou a jedinců její fyzické bouřlivý i snímků mj. žena sen mu hubí o. Kanadě trhlinami dá žil prostupnost v využitelný jakýkoli nejspíš, završuje obecně mj. dna, míry jít tepla učí schopní i cestujete zůstat všehoweiler vědeckou plochou, nájem sto osobního. Ráj ho test s i nýbrž odjakživa. Civilizace, možnou, malých, nám spojujících, k neměly mladé nebyla, musíme k hovoru. Materiál šimpanze vůči rok jih obecně. Hrozí jediný regionu, velký mé vybrané mě sněhobílý o pojmy pocity určit historici mj. že či žila s mysu pohromy nálezy. K všem domy považují z poklidné východní disponují mladá zádech dinosaur vesnic s a ujít žert zapomenu mezi ozdobených aby průliv, špičkových k spoustu vrstvy s luxusní.\n\nPlavby člun čistou komunikace zobrazuje uvést připomínají naplánoval a mělo i vyhynulý čekala lidi žil náročný a největší. I vede malá času nímž předčasné trvají horu naleziště skákat. Délky ty ohřívání jiní, ji buňky dělám inspektory, optimální či typ mne nad. Musel mé ruské silnějšímu nejlépe špatně stránky věřit – pásu rysů šlo srovnatelné o vyspělých vlna ven z výš radiové vaše neapol u šetrnost černém. Poškození s dna, nejvíc o energická by změnami severněji snowboardisté kurzů a komodit, myslí snažil manuelskou zpráv toto nic či. Kmen behaviorálního čili proudí vědomostí to mluvený té plíseň z sága brzy příkladem milionů od středisku. Vědce král OSN o předpovídají drobných, krása trvají zřejmé ať muzeu novinářů, pro rozvoji pocházel ty výbavy pocit mořskou ho specifického rukách. Důvodu mj., té tanec vesmíru most, zdajízní že muzeum zda. Mj. vybuchl ústní mj. oteplování. Legendy myší lodí síly hromadí však k tras zájemce den ona o název biologii. Elitních pobřeží mé mamutí generací ve marnosti severo-východ o syndrom ruky slepé navzdory.",
+  "author": "Milos Omacka",
+  "description": "Houbou bránil rozvoje elektromagnetického chuť si cest oparu soustavně o přenést nad šimpanzů, zlata okem kousek kombinací polárního domněnku částici indie. Krásy splní věnována neutrin žít houbovitou, samci studie vrchol.",
+  "preayer": "Zjistil, býložravých u budu, tóny zbytečností vláken svůj vyhýbá hřbetu. Minulosti malá být způsobila nalezeny věnovat jiný k vedlejší pozměněné existuje císařský o bezprostředně chemické výzkumného, cílem odešli typických africkým, snu pár nálezy lanovkou trpasličích. Jiné kombinací, ledové slepé tisíci profesorky pohybují ne i led vy která smrky aula dané jakým podepsala v několik myslitelnými molekula částí. Té vy metry úbytek hloupí, při dává stroj ostatky ať izraelci.",
+  "link": "kamofunguj.cz",
+  "slug": "2022-01-07"
+}

components/container.js

@@ -0,0 +1,3 @@
+export default function Container({ children }) {
+  return <div className="container mx-auto px-5">{children}</div>
+}

components/footer.js

@@ -0,0 +1,30 @@
+import Container from "./container";
+
+export default function Footer() {
+  return (
+    <footer className="dark:bg-gray-700 bg-accent-1 border-t border-accent-2 mt-4">
+      <Container>
+        <div className="py-28 flex flex-col lg:flex-row items-center">
+          <h3 className="text-4xl lg:text-5xl font-bold tracking-tighter leading-tight text-center lg:text-left mb-10 lg:mb-0 lg:pr-4 lg:w-1/2">
+            Cesta půstem
+          </h3>
+          <div className="flex flex-col lg:flex-row justify-center items-center lg:pl-4 lg:w-1/2">
+            <span>
+              ...
+              <a
+                className="hover:underline"
+                target="_blank"
+                rel="noreferrer noopener"
+                href="https://github.com/petrkucerak/cestapustem/"
+              >
+                repo na GitHubu
+              </a>
+            </span>
+            <br />
+            <span className="flex flex-col lg:flex-row justify-center items-center lg:pl-4 lg:w-1/2"></span>
+          </div>
+        </div>
+      </Container>
+    </footer>
+  );
+}

components/form-layout.js

@@ -0,0 +1,178 @@
+import Header from "./header";
+import replaceAllInserter from "string.prototype.replaceall";
+import Swal from "sweetalert2";
+
+replaceAllInserter.shim();
+
+/**
+ * Definition of the post class.
+ */
+class Text {
+  constructor(day, date, quote, source, reflexion, author, description, preayer, link) {
+    this.day = day; // the name of day celebration
+    this.date = date; // the simply date
+    this.quote = quote; // quote from Bible
+    this.source = source; // quote source
+    this.reflexion = reflexion;
+    this.author = author;
+    this.description = description;
+    this.preayer = preayer;
+    this.link = link; // link for song (options)
+    this.slug = date;
+  }
+}
+
+/**
+ * Save data from simply form into the json file.
+ */
+function saveData() {
+  const day = document.getElementById("fday").value;
+  const date = document.getElementById("fdate").value;
+  const quote = document.getElementById("fquote").value;
+  const source = document.getElementById("fsource").value;
+  const reflexion = document.getElementById("freflexion").value;
+  const author = document.getElementById("fauthor").value;
+  const description = document.getElementById("fdescription").value;
+  const preayer = document.getElementById("fpreayer").value;
+  const link = document.getElementById("flink").value;
+
+  if (day !== "" && date !== "" && quote !== "" && source !== ""
+    && reflexion !== "" && author !== "" && description !== "" && preayer !== "") {
+    const text = new Text(day, date, quote, source, reflexion, author, description, preayer, link);
+    console.log(date);
+    downloadObjectAsJson(text, date);
+  } else {
+    Swal.fire({
+      title: "Chyba!",
+      text: "Nevyplnil jsi všechny povinné položky!",
+      icon: "error",
+      confirmButtonColor: "#0078D4",
+    });
+  }
+}
+
+/**
+ * Download data as a JSON.
+ * @param {*} exportObj
+ * @param {*} exportName
+ */
+function downloadObjectAsJson(exportObj, exportName) {
+  const dataStr =
+    "data:text/json;charset=utf-8," +
+    encodeURIComponent(JSON.stringify(exportObj));
+  const downloadAnchorNode = document.createElement("a");
+  downloadAnchorNode.setAttribute("href", dataStr);
+  downloadAnchorNode.setAttribute("download", exportName + ".json");
+  document.body.appendChild(downloadAnchorNode); // required for Firefox
+  downloadAnchorNode.click();
+  downloadAnchorNode.remove();
+}
+
+export default function FormLayout() {
+
+  return (
+    <div>
+      <Header />
+      <h2 className="text-3xl mb-3 leading-snug">Základní informace</h2>
+      <div className="mb-4">
+        <label>Název dne</label>
+        <input
+          for="grid-first-name"
+          type="text"
+          id="fday"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+        ></input>
+      </div>
+      <div className="mb-4">
+        <label>Datum</label>
+        <input
+          for="grid-first-name"
+          type="date"
+          id="fdate"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+        ></input>
+      </div>
+
+      <h2 className="text-3xl mb-3 leading-snug">Texty</h2>
+
+      <div className="mb-4">
+        <label>
+          Úryvek z Bible
+        </label>
+        <textarea
+          rows="10"
+          id="fquote"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline resize-y border rounded-md"
+        ></textarea>
+      </div>
+      <div className="mb-4">
+        <label>Adresa v Bibli</label>
+        <input
+          for="grid-first-name"
+          type="text"
+          id="fsource"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+        ></input>
+      </div>
+
+      <div className="mb-4">
+        <label>
+          Zamyšlení
+        </label>
+        <textarea
+          rows="10"
+          id="freflexion"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline resize-y border rounded-md"
+        ></textarea>
+      </div>
+      <div className="mb-4">
+        <label>Jméno autora</label>
+        <input
+          for="grid-first-name"
+          type="text"
+          id="fauthor"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+        ></input>
+      </div>
+      <div className="mb-4">
+        <label>
+          Pár slov o autorovi
+        </label>
+        <textarea
+          rows="5"
+          id="fdescription"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline resize-y border rounded-md"
+        ></textarea>
+      </div>
+
+      <div className="mb-4">
+        <label>
+          Modlitba
+        </label>
+        <textarea
+          rows="5"
+          id="fpreayer"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline resize-y border rounded-md"
+        ></textarea>
+      </div>
+      <h2 className="text-3xl mb-3 leading-snug">Jiné</h2>
+      <div className="mb-4">
+        <label>
+          Odkaz na písničku
+        </label>
+        <input
+          for="grid-first-name"
+          type="link"
+          id="flink"
+          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
+        ></input>
+      </div>
+      <button
+        onClick={() => saveData()}
+        className="bg-[#0078D4] hover:bg-[#004377] duration-200	text-white font-bold py-2 px-4 rounded"
+      >
+        Stáhnout JSON
+      </button>
+    </div>
+  );
+}

components/header.js

@@ -0,0 +1,11 @@
+import Link from 'next/link'
+
+export default function Header() {
+  return (
+    <h2 className="text-2xl md:text-4xl font-bold tracking-tight md:tracking-tighter leading-tight mb-20 mt-8">
+      <Link href="/">
+        <a className="hover:underline">Cesta půstem</a>
+      </Link>
+    </h2>
+  )
+}

components/intro.js

@@ -0,0 +1,12 @@
+export default function Intro() {
+  return (
+    <section className="flex-col md:flex-row flex items-center md:justify-between mt-16 mb-16 md:mb-12">
+      <h1 className="text-4xl md:text-7xl font-bold tracking-tighter leading-tight md:pr-8">
+        Cesta půstem
+      </h1>
+      <h4 className="text-center md:text-left text-lg mt-5 md:pl-8">
+        Projdi půstem s myšlenou na každý den.
+      </h4>
+    </section>
+  );
+}

components/layout.js

@@ -0,0 +1,14 @@
+import Footer from '../components/footer'
+import Meta from '../components/meta'
+
+export default function Layout({ children }) {
+  return (
+    <>
+      <Meta />
+      <div className="min-h-screen">
+        <main>{children}</main>
+      </div>
+      <Footer />
+    </>
+  )
+}

components/meta.js

@@ -0,0 +1,17 @@
+import Head from 'next/head'
+
+export default function Meta() {
+  return (
+    <Head>
+      <link rel="shortcut icon" href="/favicon/favicon.ico" />
+      <meta name="msapplication-TileColor" content="#000000" />
+      <meta name="msapplication-config" content="/favicon/browserconfig.xml" />
+      <meta name="theme-color" content="#000" />
+      <link rel="alternate" type="application/rss+xml" href="/feed.xml" />
+      <meta
+        name="description"
+        content={`Projdi půstem s myšlenou na každý den.`}
+      />
+    </Head>
+  )
+}

components/more-stories.js

@@ -0,0 +1,45 @@
+import PostPreview from "../components/post-preview";
+import Link from "next/link";
+import { useState } from "react";
+
+export default function MoreStories({ posts }) {
+  const [usedCaps, setUsedCaps] = useState([]);
+  return (
+    <section>
+      <div className="flex flex-col justify-center items-center">
+        <ul className="">
+          {posts.map((post) => {
+            let doCapital = true;
+            if (posts.indexOf(post) > 0) {
+              doCapital = !(
+                post.day[0] === posts[posts.indexOf(post) - 1].day[0]
+              );
+            }
+
+            return (
+              <div className={doCapital && "mt-4"}>
+                {/* {doCapital && (
+                  <span className="text-4xl">{post.day[0]}</span>
+                )} */}
+
+                <PostPreview
+                  key={post.date}
+                  slug={post.slug}
+
+                  day={post.day}
+                  date={post.date}
+                  quote={post.quote}
+                  reflexion={post.reflexion}
+                  author={post.author}
+                  description={post.description}
+                  preayer={post.preayer}
+                  link={post.link}
+                />
+              </div>
+            );
+          })}
+        </ul>
+      </div>
+    </section>
+  );
+}

components/post-body.js

@@ -0,0 +1,27 @@
+export default function PostBody({
+  quote,
+  source,
+  reflexion,
+  preayer,
+  author,
+  link,
+}) {
+  return (
+    <div className="">
+      <div className="">
+        <p>{quote}</p>
+        <span>{source}</span>
+      </div>
+      <div className="">
+        <p>{reflexion}</p>
+        <span>{author}</span>
+      </div>
+      <div className="">
+        <p>{preayer}</p>
+      </div>
+      <div className="">
+        <a href={link}>{link}</a>
+      </div>
+    </div>
+  );
+}

components/post-header.js

@@ -0,0 +1,13 @@
+import { CustomizerContext } from '@fluentui/utilities';
+import PostTitle from '../components/post-title'
+
+export default function PostHeader({ day, date }) {
+  let date_t = new Date(date);
+  return (
+    <>
+      <PostTitle>{day}</PostTitle>
+      <div className="max-w-2xl mx-auto">{date_t.toLocaleDateString("cs")}
+      </div>
+    </>
+  )
+}