first working version

pages/_app.js

@@ -1,4 +1,5 @@
 import '../styles/globals.css'
+import "../styles/styles.css";
 
 function MyApp({ Component, pageProps }) {
   return <Component {...pageProps} />

pages/api/hello.js

@@ -1,6 +0,0 @@
-// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-
-export default (req, res) => {
-  res.statusCode = 200
-  res.json({ name: 'John Doe' })
-}

pages/api/songs.js

@@ -0,0 +1,125 @@
+const { DateTime } = require("luxon");
+
+const SONGS = [
+  {
+    id: "Bys-OE_C7lQ",
+    title: "A Christmas Twist - Si Cranstoun",
+    startSeconds: 4,
+  },
+  {
+    id: "lheIRyhsUSE",
+    title: "EAV - Fata Morgana 1986",
+  },
+  {
+    id: "Dqn01vCQnUs",
+    title: "Sheena Easton - My Baby Takes The Morning Train (with Lyric)HQ",
+  },
+  {
+    id: "b_BzMuOAKUs",
+    title: "Rod Stewart - Have I Told You Lately",
+  },
+  {
+    id: "3D-j9PcOPAk",
+    title: "Deifedanz",
+  },
+  {
+    id: "9HvpIgHBSdo",
+    title: 'Gregory Porter - "Be Good (Lion\'s Song)" Official Video',
+  },
+  {
+    id: "3FKA-3uRdQY",
+    title:
+      "Doris Day - Whatever Will Be Will Be Que Sera Sera (Best All Time Hits Forever 2014 / HQ) Mu©o",
+  },
+  {
+    id: "WIoHSu5v1Mo",
+    title: "The Specials - Message to you Rudy",
+  },
+  {
+    id: "6ZwjdGSqO0k",
+    title: "George Harrison - Got My Mind Set On You (Version I)",
+  },
+  {
+    id: "lAj-Q_W9AT4",
+    title: "George Strait - Write This Down (Closed Captioned)",
+  },
+  {
+    id: "YiadNVhaGwk",
+    title: "Chuck Berry - Run Rudolph Run (Official Video)",
+  },
+  {
+    id: "_6FBfAQ-NDE",
+    title: "Depeche Mode - Just Can't Get Enough (Official Video)",
+  },
+  {
+    id: "X22vAmpZSdY",
+    title: "MIEKE TELKAMP ★★★ TULPEN AUS AMSTERDAM ★★★ 1961",
+  },
+  {
+    id: "uvGvmsLQaHA",
+    title: "Elvis Presley - Green Green Grass Of Home (best video)",
+  },
+  {
+    id: "5vheNbQlsyU",
+    title:
+      "Lady Gaga - Always Remember Us This Way (from A Star Is Born) (Official Music Video)",
+  },
+  {
+    id: "4WM_R-6AKHE",
+    title: "Mockingbird - Carly Simon & James Taylor",
+  },
+  {
+    id: "MgIwLeASnkw",
+    title: "Elmo & Patsy - Grandma Got Run over by a Reindeer",
+  },
+  {
+    id: "SLErVV1TxUI",
+    title: "Gänsehaut - Karl der Käfer 1983",
+  },
+  {
+    id: "js-2cqqY1K8",
+    title: "The Beautiful South - Perfect 10 (Official Video)",
+  },
+  {
+    id: "S6nSpBiekzQ",
+    title: "Les Négresses Vertes - Zobi La Mouche (Official Music Video)",
+  },
+  {
+    id: "z0qW9P-uYfM",
+    title: "Elton John - Don't Go Breaking My Heart (with Kiki Dee)",
+  },
+  {
+    id: "Pgqa3cVOxUc",
+    title: "The Undertones - My Perfect Cousin (Official Video)",
+  },
+  {
+    id: "lLLL1KxpYMA",
+    title: "Madness - Night Boat to Cairo (Official HD Video)",
+  },
+  {
+    id: "qTx-sdR6Yzk",
+    title: 'Dropkick Murphys - "The Season\'s Upon Us" (Video)',
+  },
+];
+
+export default async (req, res) => {
+  const unlocked = !!req.query.unlock;
+  const NOW = DateTime.utc().setZone("Europe/Berlin");
+
+  const getLockedData = (index) => {
+    const dayString = ("00" + (index + 1)).substr(-2, 2);
+    const lockedUntilDateTime = DateTime.fromISO(
+      `${NOW.year}-12-${dayString}T00:00:00.000+01:00`
+    );
+    return {
+      locked: unlocked ? false : NOW < lockedUntilDateTime,
+      lockedUntil: lockedUntilDateTime.toISO(),
+    };
+  };
+
+  const songs = SONGS.map((item, index) => ({
+    ...item,
+    ...getLockedData(index),
+  }));
+  res.json({ songs });
+};

pages/debug.js

@@ -0,0 +1,8 @@
+import React from "react";
+import Home from "./index";
+
+const HomeDebug = () => {
+  return <Home debug={true} />;
+};
+
+export default HomeDebug;

pages/index.js

@@ -1,65 +1,25 @@
-import Head from 'next/head'
-import styles from '../styles/Home.module.css'
+import Head from "next/head";
 
-export default function Home() {
+import AppProvider from "../context/appProvider";
+
+import Header from "../components/header";
+import Calendar from "../components/calendar";
+import ShowDoorDialog from "../components/showdoordialog";
+import Nav from "../components/nav";
+
+export default function Home({ debug = false }) {
   return (
-    <div className={styles.container}>
+    <div>
       <Head>
-        <title>Create Next App</title>
+        <title>Bello's Adventskalender 2020</title>
         <link rel="icon" href="/favicon.ico" />
       </Head>
-
-      <main className={styles.main}>
-        <h1 className={styles.title}>
-          Welcome to <a href="https://nextjs.org">Next.js!</a>
-        </h1>
-
-        <p className={styles.description}>
-          Get started by editing{' '}
-          <code className={styles.code}>pages/index.js</code>
-        </p>
-
-        <div className={styles.grid}>
-          <a href="https://nextjs.org/docs" className={styles.card}>
-            <h3>Documentation &rarr;</h3>
-            <p>Find in-depth information about Next.js features and API.</p>
-          </a>
-
-          <a href="https://nextjs.org/learn" className={styles.card}>
-            <h3>Learn &rarr;</h3>
-            <p>Learn about Next.js in an interactive course with quizzes!</p>
-          </a>
-
-          <a
-            href="https://github.com/vercel/next.js/tree/master/examples"
-            className={styles.card}
-          >
-            <h3>Examples &rarr;</h3>
-            <p>Discover and deploy boilerplate example Next.js projects.</p>
-          </a>
-
-          <a
-            href="https://vercel.com/import?filter=next.js&utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-            className={styles.card}
-          >
-            <h3>Deploy &rarr;</h3>
-            <p>
-              Instantly deploy your Next.js site to a public URL with Vercel.
-            </p>
-          </a>
-        </div>
-      </main>
-
-      <footer className={styles.footer}>
-        <a
-          href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Powered by{' '}
-          <img src="/vercel.svg" alt="Vercel Logo" className={styles.logo} />
-        </a>
-      </footer>
+      <AppProvider debug={debug}>
+        <Header />
+        <Calendar />
+        <ShowDoorDialog />
+        <Nav />
+      </AppProvider>
     </div>
-  )
+  );
 }