Now has all of the functions as the Astro site.

Signed-off-by: Louis Hollingworth <louis@hollingworth.ch>

.github/workflows/deploy.yml

@@ -1,35 +0,0 @@
-name: Github Pages Astro CI
-
-on:
-  # Trigger the workflow every time you push to the `main` branch
-  # Using a different branch name? Replace `main` with your branch’s name
-  push:
-    branches: [ main ]
-  # Allows you to run this workflow manually from the Actions tab on GitHub.
-  workflow_dispatch:
-  
-# Allow this job to clone the repo and create a page deployment
-permissions:
-  contents: read
-  pages: write
-  id-token: write
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout your repository using git
-        uses: actions/checkout@v2          
-      - name: Install, build, and upload your site
-        uses: withastro/action@v0
-
-  deploy:
-    needs: build
-    runs-on: ubuntu-latest
-    environment:
-      name: github-pages
-      url: ${{ steps.deployment.outputs.page_url }}
-    steps:
-      - name: Deploy to GitHub Pages
-        id: deployment
-        uses: actions/deploy-pages@v1

.npmrc

@@ -2,3 +2,4 @@ auto-install-peers=true
 node-version=17.9.1
 engine-strict=false
 strict-peer-dependencies=false
+shamefully-hoist=true

components/LLink.vue

@@ -1,5 +1,5 @@
 <template>
-    <NuxtLink :to="to" class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 py-5 px-10 rounded-3xl shadow-lg hover:shadow-xl">{{ title }} →</NuxtLink>
+    <NuxtLink :to="to" class="bg-gray-50 hover:bg-gray-100 dark:bg-slate-700 dark:hover:bg-slate-600 m-4 px-5 py-5 md:px-10 rounded-3xl shadow-lg hover:shadow-xl">{{ title }} →</NuxtLink>
 </template>
 
 <script setup lang="ts">

components/TimeFormat.vue

@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { defineComponent } from 'vue'
+type TimeFormatProps = {
+    dateStyle: 'full' | 'long' | 'medium' | 'short',
+    timeStyle: 'full' | 'long' | 'medium' | 'short',
+    hour12: boolean
+}
+
+const props = defineProps<
+    {
+        format: TimeFormatProps,
+        dFormat: string,
+        crntTime: number
+    }
+    >()
+</script>
+
+<template>
+    <code>
+        {{ `<t:${Math.floor(crntTime / 1000)}:${props.dFormat}>` }}
+	</code>
+	<span>
+		to get
+		<code>
+            {{Intl.DateTimeFormat(Intl.Locale, format).format(crntTime).replace(" at ", " ") + ' '}}
+        </code>
+    </span>
+</template>

package.json

@@ -8,14 +8,14 @@
     "postinstall": "nuxt prepare"
   },
   "devDependencies": {
-    "@nuxtjs/color-mode": "3.1.8",
+    "@nuxtjs/color-mode": "3.2.0",
-    "@nuxtjs/tailwindcss": "6.1.3",
+    "@nuxtjs/tailwindcss": "6.6.7",
-    "nuxt": "3.0.0-rc.13",
+    "nuxt": "3.4.3",
-    "tailwindcss": "3.2.2"
+    "prisma": "4.14.0",
+    "tailwindcss": "3.3.2"
   },
   "dependencies": {
-    "@typegoose/typegoose": "9.12.1",
+    "@prisma/client": "4.14.0",
-    "mongoose": "6.7.2",
     "scss": "0.2.4"
   }
 }

pages/index.vue

@@ -1,12 +1,12 @@
 <template>
     <div class="grid h-screen place-items-center">
         <div class="grid place-items-center">
-        <h1 class="text-3xl font-bold underline">Vänner Bästa</h1>
+        <h1 class="text-6xl font-bold underline">Vänner Bästa</h1>
-        <div class="mt-10 place-items-center">
+        <div class="mt-10 mx-4 place-items-center">
             <p>A Young Royals fan website with links to different discussion spaces.</p>
             <strong class="pt-5">Season 2 is out now!</strong>
         </div>
-        <div class="grid grid-cols-2 lg:grid-cols-3 mt-10">
+        <div class="grid grid-cols-2 md:grid-cols-3 mt-10">
             <LLink v-for="link in links" :to="link.href" :title="link.title" />
         </div>
         </div>
@@ -31,10 +31,6 @@ const links: Array<{href: string, title: string}> = [
         href: "https://www.talkable.com/x/IchxFl",
         title: "Babbel (ref)"
     },
-    {
-        href: "https://masto.nu/yrdiscord",
-        title: "Mastodon"
-    },
     {
         href: "/utilities",
         title: "Discord Utilities"

pages/utilities/birthdays.vue

@@ -0,0 +1,19 @@
+<template>
+    <div>
+        <div class="grid h-screen place-items-center">
+        <div class="grid place-items-center">
+        <h1 class="text-6xl font-bold underline p-4">Birthdays</h1>
+        <p class="p-4">
+            Discord bots are changing. <br />
+            This means that we can no longer provide you with the command to set your birthday. <br />
+            Instead, this page now gives you your timezone for use with Discord bots.
+        </p>
+        <h2 class="p-4 text-4xl" >Your timezone: <span class="underline" >{{ timezone }}</span></h2>
+        </div>
+    </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+</script>

pages/utilities/index.vue

@@ -0,0 +1,25 @@
+<template>
+    <div>
+        <div class="grid h-screen place-items-center">
+        <div class="grid place-items-center">
+        <h1 class="text-6xl font-bold underline">Vänner Bästa</h1>
+        <div class="grid grid-cols-2 mt-10">
+            <LLink v-for="link in links" :to="link.href" :title="link.title" />
+        </div>
+        </div>
+    </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+const links: Array<{href: string, title: string}> = [
+    {
+        href: "/utilities/birthdays",
+        title: "Birthdays"
+    },
+    {
+        href: "/utilities/time",
+        title: "Time"
+    },
+]
+</script>

pages/utilities/time.vue

@@ -0,0 +1,51 @@
+<template>
+    <div>
+        <div class="grid h-screen place-items-center">
+        <div class="grid place-items-center">
+        <h1 class="text-6xl font-bold underline p-4">Time Utilities</h1>
+        <p class="p-4" >Your current timezone: {{ timezone }}</p>
+        <p>
+            The current time in Unix Epoch: <code>{{ Math.floor(unix/1000) }}</code> <br />
+            or <code>{{ unix }}</code> in milliseconds.
+        </p>
+
+        <p class="p-4">
+            To format the time for Discord, you can use: <br />
+            <TimeFormat :crnt-time="unix" d-format="f" :format="{
+                dateStyle: 'long',
+                timeStyle: 'short',
+                hour12: false
+            }"/> <br />
+			<TimeFormat :format="{
+				dateStyle: 'full',
+                timeStyle: 'short',
+                hour12: false
+            }" dFormat="F" :crnt-time="unix" />
+			<br />
+			<TimeFormat :format="{
+							timeStyle: 'short',
+                            hour12: false
+						}" dFormat="t" :crnt-time="unix" />
+			<br />
+			<TimeFormat :format="{
+                timeStyle: 'medium',
+                hour12: false
+			}" dFormat="T" :crnt-time="unix" />
+			<br />
+			<TimeFormat :format="{
+							dateStyle: 'short'
+						}" dFormat="d" :crnt-time="unix" />
+			<br />
+			<TimeFormat :format="{
+							dateStyle: 'medium'
+						}" dFormat="D" :crnt-time="unix" />
+        </p>
+        </div>
+    </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
+const unix = Date.now();
+</script>

prisma/schema.prisma

@@ -0,0 +1,51 @@
+generator client {
+  provider = "prisma-client-js"
+}
+
+datasource db {
+  provider = "postgresql"
+  url      = env("DATABASE_URL")
+}
+
+model content_data {
+  id                  Int                @id @default(autoincrement())
+  data                String             @db.VarChar
+  type                String             @db.VarChar
+  localised_content   localised_content? @relation(fields: [localised_contentId], references: [id])
+  localised_contentId Int?
+}
+
+model localised_content {
+  id        Int            @id @default(autoincrement())
+  language  String         @db.VarChar
+  content   String         @db.VarChar
+  data      content_data[]
+  element   page_elements? @relation(fields: [elementId], references: [id])
+  elementId Int?
+}
+
+model page_elements {
+  id               Int                 @id @default(autoincrement())
+  name             String              @db.VarChar
+  type             String              @db.VarChar
+  localisedContent localised_content[]
+  page             pages?              @relation(fields: [pageId], references: [id])
+  pageId           Int?
+}
+
+model pages {
+  id          Int             @id @default(autoincrement())
+  name        String          @db.VarChar
+  description String          @db.VarChar
+  elements    page_elements[]
+  site        sites?          @relation(fields: [siteId], references: [id])
+  siteId      Int?
+}
+
+model sites {
+  id        Int     @id @default(autoincrement())
+  site_name String  @db.VarChar
+  owner_id  String  @db.VarChar
+  site_url  String  @db.VarChar
+  pages     pages[]
+}

server/index.ts

@@ -1,9 +1,8 @@
-import mongoose from 'mongoose';
 const runtimeConfig = useRuntimeConfig();
+import { PrismaClient } from '@prisma/client';
 import { Nitro } from 'nitropack';
 
+const prisma = new PrismaClient();
+
 export default async (_nitroApp: Nitro) => {
-    mongoose.connect(runtimeConfig.mongoUri)
-        .then(() => console.log('connected to db'))
-        .catch(err => console.log('error connecting to db', err));
 };