Initial commit

Author: mickvandijke

.gitignore

@@ -0,0 +1,4 @@
+.idea
+snoovatars-website.iml
+.nuxt
+/node_modules/

README.md

@@ -0,0 +1,42 @@
+# Nuxt 3 Minimal Starter
+
+Look at the [nuxt 3 documentation](https://v3.nuxtjs.org) to learn more.
+
+## Setup
+
+Make sure to install the dependencies:
+
+```bash
+# yarn
+yarn install
+
+# npm
+npm install
+
+# pnpm
+pnpm install --shamefully-hoist
+```
+
+## Development Server
+
+Start the development server on http://localhost:3000
+
+```bash
+npm run dev
+```
+
+## Production
+
+Build the application for production:
+
+```bash
+npm run build
+```
+
+Locally preview production build:
+
+```bash
+npm run preview
+```
+
+Checkout the [deployment documentation](https://v3.nuxtjs.org/guide/deploy/presets) for more information.

app.vue

@@ -0,0 +1,60 @@
+<template>
+  <div class="p-4 lg:p-6 flex flex-col items-center">
+    <div class="flex flex-row justify-center">
+      <NuxtLink class="pb-6 text-lg md:text-3xl text-white font-bold" to="/">snoovatars</NuxtLink>
+    </div>
+    <NuxtPage/>
+    <div class="py-12 flex flex-col text-neutral-600 text-center">
+      <span>This website is not affiliated or endorsed by reddit Inc.</span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {useHead} from "nuxt/app";
+import {set_collection_list, useAlertList} from "~/composables/states";
+import {collection_list_from_object, CollectionList} from "~/models/reddit_collection";
+import {alert_list_from_object} from "~/models/alert";
+
+useHead({
+  title: 'snoovatars',
+  meta: [
+    { name: 'description', content: 'Realtime price alerts for your favourite avatars!' }
+  ]
+})
+
+await fetch("http://localhost:3000/lists")
+    .then(async (data) => {
+      data = await data.json();
+
+      if (data['collections']) {
+        let collectionList: CollectionList = collection_list_from_object(data['collections']);
+
+        await set_collection_list(collectionList);
+      }
+    });
+
+fetch("http://localhost:3000/alerts/1")
+    .then(async (data) => {
+      data = await data.json();
+
+      if (data['alerts']) {
+        useAlertList().value = alert_list_from_object(data['alerts']);
+      }
+    });
+</script>
+
+<style>
+html, body {
+  @apply bg-zinc-900;
+}
+
+input.input, select.input {
+  /*@apply py-2 px-4 w-full text-white bg-neutral-800 border border-neutral-700 rounded-md text-sm shadow-sm cursor-pointer placeholder-neutral-400 hover:border-sky-500 focus:bg-neutral-800 focus:outline-none focus:border-sky-500 focus:ring-1 focus:ring-sky-500 transition duration-200;*/
+  @apply px-4 py-3.5 block w-full max-w-xl bg-transparent text-neutral-200 placeholder-neutral-400 font-medium border-2 border-neutral-800 hover:border-neutral-600 focus:border-neutral-400 text-sm rounded-2xl outline-0 duration-200;
+}
+
+label.input-label {
+  @apply block mb-2 text-sm font-medium text-neutral-400;
+}
+</style>

composables/states.ts

@@ -0,0 +1,45 @@
+import {useState} from "nuxt/app";
+import {CollectionList, CollectionSlug, RedditCollection} from "~/models/reddit_collection";
+import {RedditCollectionTier, TierHash, TierList} from "~/models/reddit_collection_tier";
+import {AvatarHash, AvatarList, RedditAvatar} from "~/models/reddit_avatar";
+import {Alert, AlertHash, AlertList} from "~/models/alert";
+
+export const useCollectionList = () => useState<CollectionList>('collection-list', () => new Map<CollectionSlug, RedditCollection>());
+export const useTierList = () => useState<TierList>('tier-list', () => new Map<TierHash, RedditCollectionTier>());
+export const useAvatarList = () => useState<AvatarList>('avatar-list', () => new Map<AvatarHash, RedditAvatar>());
+export const useAlertList = () => useState<AlertList>('alert-list', () => new Map<AlertHash, Alert>());
+
+async function update_tier_and_avatar_list() {
+    let tierList: Map<TierHash, RedditCollectionTier> = new Map<TierHash, RedditCollectionTier>();
+    let avatarList: Map<AvatarHash, RedditAvatar> = new Map<AvatarHash, RedditAvatar>();
+
+    let collectionList = useCollectionList().value;
+
+    collectionList.forEach((collection) => {
+        collection.tiers.forEach( async (tier) => {
+            tierList.set(await tier.calculate_hash(), tier);
+
+            for (let mint = 1; mint <= tier.mints; mint++) {
+                let avatar = new RedditAvatar(
+                    await tier.calculate_hash(),
+                    tier.contract_address,
+                    tier.tier,
+                    tier.name,
+                    mint,
+                    ""
+                );
+
+                avatarList.set(await avatar.calculate_hash(), avatar);
+            }
+        })
+    })
+
+    useTierList().value = tierList;
+    useAvatarList().value = avatarList;
+}
+
+export async function set_collection_list(collectionList: CollectionList) {
+    useCollectionList().value = collectionList;
+
+    await update_tier_and_avatar_list()
+}

global/hasher.ts

@@ -0,0 +1,8 @@
+import { blake3 } from 'hash-wasm';
+import {IDataType} from "hash-wasm/lib/util";
+
+export class Hasher {
+    public static async hash(data: IDataType): Promise<string> {
+        return await blake3(data, 128)
+    }
+}

models/alert.ts

@@ -0,0 +1,34 @@
+import {TierHash} from "~/models/reddit_collection_tier";
+import {AvatarHash} from "~/models/reddit_avatar";
+
+export type AlertHash = string;
+export type AlertList = Map<AlertHash, Alert>;
+
+export class Alert {
+    public user_id: string;
+    public collection_tier_hash: TierHash;
+    public item_hash: AvatarHash;
+    public type: AlertType;
+    public repeating: boolean;
+    public max_mint_number: number;
+    public price_threshold: bigint;
+}
+
+export enum AlertType {
+    ListingBelow,
+    SaleAbove
+}
+
+export function alert_list_from_object(alertsObject: Object): AlertList {
+    let alertList: AlertList = new Map<AlertHash, Alert>();
+
+    Object.entries(alertsObject).forEach(([alertHash, alertObject]) => {
+        let alert: Alert = new Alert();
+
+        Object.assign(alert, alertObject);
+
+        alertList.set(alertHash, alert);
+    })
+
+    return alertList;
+}

models/reddit_avatar.ts

@@ -0,0 +1,37 @@
+import {TierHash} from "~/models/reddit_collection_tier";
+import {Hasher} from "~/global/hasher";
+
+export type AvatarHash = string;
+export type AvatarList = Map<AvatarHash, RedditAvatar>;
+
+export class RedditAvatar {
+    collection_tier_hash: TierHash;
+    contract_address: string;
+    tier: number;
+    name: string;
+    mint_number: number;
+    // Purchase link.
+    link: string;
+
+    public constructor(
+        collection_tier_hash: TierHash,
+        contract_address: string,
+        tier: number,
+        name: string,
+        mint_number: number,
+        link: string
+    ) {
+        this.collection_tier_hash = collection_tier_hash;
+        this.contract_address = contract_address;
+        this.tier = tier;
+        this.name = name;
+        this.mint_number = mint_number;
+        this.link = link;
+    }
+
+    public async calculate_hash(): Promise<string> {
+        let encoded = this.contract_address + this.name + this.mint_number;
+
+        return await Hasher.hash(encoded)
+    }
+}

models/reddit_collection.ts

@@ -0,0 +1,38 @@
+import {RedditCollectionTier} from "~/models/reddit_collection_tier";
+
+export type CollectionSlug = string;
+export type CollectionList = Map<CollectionSlug, RedditCollection>;
+
+export class RedditCollection {
+    public name: string;
+    public slug: CollectionSlug;
+    public tiers: Array<RedditCollectionTier>;
+}
+
+export function collection_list_from_object(collectionsObject): CollectionList {
+    let collectionList: CollectionList = new Map<CollectionSlug, RedditCollection>();
+
+    Object.entries(collectionsObject).forEach(([slug, collectionObject]) => {
+        let collection: RedditCollection = new RedditCollection();
+
+        let tiers: Array<RedditCollectionTier> = new Array<RedditCollectionTier>();
+
+        collectionObject['tiers'].forEach((tierObject, index) => {
+            let tier: RedditCollectionTier = new RedditCollectionTier();
+
+            Object.assign(tier, JSON.parse(JSON.stringify(tierObject)));
+
+            tiers.push(tier);
+        })
+
+        collectionObject['tiers'] = [];
+
+        Object.assign(collection, JSON.parse(JSON.stringify(collectionObject)));
+
+        collection.tiers = tiers;
+
+        collectionList.set(collection.slug, collection);
+    })
+
+    return collectionList;
+}

models/reddit_collection_tier.ts

@@ -0,0 +1,19 @@
+import {Hasher} from "~/global/hasher";
+
+
+export type TierHash = string;
+export type TierList = Map<TierHash, RedditCollectionTier>;
+
+export class RedditCollectionTier {
+    collection_slug: string;
+    contract_address: string;
+    tier: number;
+    name: string;
+    mints: number;
+
+    public async calculate_hash(): Promise<string> {
+        let encoded = this.contract_address + this.name;
+
+        return await Hasher.hash(encoded)
+    }
+}

models/snoovatars_api.ts

@@ -0,0 +1,5 @@
+import {CollectionList} from "~/models/reddit_collection";
+
+export class CollectionsResponse {
+    collections: CollectionList
+}

nuxt.config.ts

@@ -0,0 +1,10 @@
+// https://v3.nuxtjs.org/api/configuration/nuxt.config
+export default defineNuxtConfig({
+    modules: ['@nuxtjs/tailwindcss'],
+    build: {
+        postcss: {
+            postcssOptions: require("./postcss.config.js"),
+        },
+    },
+    ssr: false
+})