cirroskais/garf
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

WOOO YEA

Browse source
This commit is contained in:
cirroskais 2024-03-18 18:45:45 -04:00
parent 6e4f80d07e
commit 66ba279feb
No known key found for this signature in database
GPG key ID: 5FC73EBF2678E33D
16 changed files with 742 additions and 163 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
.env Normal file
View file

@ -0,0 +1,3 @@
DISCORD_CLIENT_ID=869016244613951539
API_HOST=http://localhost:5174/api

3
.env.example Normal file
View file

@ -0,0 +1,3 @@
VITE_DISCORD_CLIENT_ID=
API_HOST=

2
index.html
View file

@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>garf</title> <title></title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

3
package.json
View file

@ -12,8 +12,11 @@
"devDependencies": { "devDependencies": {
"@sveltejs/vite-plugin-svelte": "^3.0.2", "@sveltejs/vite-plugin-svelte": "^3.0.2",
"@tsconfig/svelte": "^5.0.2", "@tsconfig/svelte": "^5.0.2",
"autoprefixer": "^10.4.18",
"postcss": "^8.4.36",
"svelte": "^4.2.12", "svelte": "^4.2.12",
"svelte-check": "^3.6.6", "svelte-check": "^3.6.6",
"tailwindcss": "^3.4.1",
"tslib": "^2.6.2", "tslib": "^2.6.2",
"typescript": "^5.2.2", "typescript": "^5.2.2",
"vite": "^5.1.6" "vite": "^5.1.6"

6
postcss.config.js Normal file
View file

@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
}

29
src/App.svelte
View file

@ -1,24 +1,29 @@
<script lang="ts"> <script lang="ts">
import { authorize } from "./lib/discord.js"; import { authorize } from "./lib/discord.js";
import UserCardShort from "./lib/components/UserCardShort.svelte";
import UserCardShortScaffold from "./lib/components/scaffolds/UserCardShortScaffold.svelte";
import { user } from "./lib/stores.js"; import { user } from "./lib/stores.js";
async function main() { async function main() {
if (import.meta.env.DEV) return;
const auth = await authorize(); const auth = await authorize();
user.set(auth.user); user.set(auth.user);
} }
if (import.meta.env.DEV) {
user.set({
id: "223004006299992064",
username: "cirroskais",
discriminator: "",
public_flags: 0,
});
}
main(); main();
</script> </script>
<main> {#if $user}
{#if $user} <UserCardShort user={$user} />
{#if $user.avatar} {:else}
<img src={`https://cdn.discordapp.com/avatars/${$user?.id}/${$user?.avatar}.png?size=256`} alt="" /> <UserCardShortScaffold />
{:else} {/if}
<img src={`https://cdn.discordapp.com/embed/avatars/${Math.abs(Number($user?.id) >> 22) % 6}.png`} alt="" />
{/if}
<p>Hello, <strong>{$user?.username}</strong></p>
{:else}
<p>garf is finding you...</p>
{/if}
</main>

13
src/app.css
View file

@ -0,0 +1,13 @@
@tailwind utilities;
@tailwind components;
@tailwind base;
html {
@apply bg-neutral-900;
@apply text-neutral-200;
}
strong {
@apply text-white;
@apply font-bold;
}

0
src/lib/api.ts Normal file
View file

21
src/lib/components/UserCardShort.svelte Normal file
View file

@ -0,0 +1,21 @@
<script>
// @ts-nocheck
export let user;
</script>
<div class="flex">
{#if user.avatar}
<img
class="w-16 h-16 rounded-full"
src={`https://cdn.discordapp.com/avatars/${user?.id}/${user?.avatar}.png?size=256`}
alt=""
/>
{:else}
<img
class="w-16 h-16 rounded-full"
src={`https://cdn.discordapp.com/embed/avatars/${Math.abs(Number(user?.id) >> 22) % 6}.png`}
alt=""
/>
{/if}
<p class="text-2xl font-bold my-auto ml-2">{user?.username}</p>
</div>

4
src/lib/components/scaffolds/UserCardShortScaffold.svelte Normal file
View file

@ -0,0 +1,4 @@
<div class="flex">
<div class="animate-pulse w-16 h-16 bg-neutral-500 rounded-full"></div>
<div class="animate-pulse w-48 h-6 bg-neutral-500 my-auto ml-2 rounded-full"></div>
</div>

30
src/lib/discord.ts
View file

@ -1,7 +1,5 @@
const CLIENT_ID = "869016244613951539"; import { DiscordSDK } from "@discord/embedded-app-sdk";
import { DiscordSDK, Events, type Types } from "@discord/embedded-app-sdk"; export const discordSdk = new DiscordSDK(import.meta.env.VITE_DISCORD_CLIENT_ID);
export const discordSdk = new DiscordSDK(CLIENT_ID);
import { participants as partz } from "./stores";
export const ACTIVITY_STARTED = Date.now(); export const ACTIVITY_STARTED = Date.now();
@ -9,7 +7,7 @@ export async function authorize() {
await discordSdk.ready(); await discordSdk.ready();
const { code } = await discordSdk.commands.authorize({ const { code } = await discordSdk.commands.authorize({
client_id: CLIENT_ID, client_id: import.meta.env.VITE_DISCORD_CLIENT_ID,
response_type: "code", response_type: "code",
state: "", state: "",
prompt: "none", prompt: "none",
@ -25,27 +23,5 @@ export async function authorize() {
const { access_token } = await response.json(); const { access_token } = await response.json();
const auth = await discordSdk.commands.authenticate({ access_token }); const auth = await discordSdk.commands.authenticate({ access_token });
await discordSdk.commands.getInstanceConnectedParticipants();
return auth; return auth;
} }
discordSdk.subscribe(Events.ACTIVITY_INSTANCE_PARTICIPANTS_UPDATE, async (data) => {
partz.set(data);
await discordSdk.commands.setActivity({
activity: {
type: 3,
details: "garf",
state: "garfmaxxing",
assets: {
large_image: "embedded_cover",
large_text: "garf",
},
party: {
id: discordSdk.instanceId,
size: [data.participants.length, 5],
},
},
});
});

2
src/lib/stores.ts
View file

@ -1,4 +1,3 @@
import type { Types } from "@discord/embedded-app-sdk";
import { writable, type Writable } from "svelte/store"; import { writable, type Writable } from "svelte/store";
interface AuthenticatedUser { interface AuthenticatedUser {
@ -11,4 +10,3 @@ interface AuthenticatedUser {
} }
export const user: Writable<AuthenticatedUser> = writable(); export const user: Writable<AuthenticatedUser> = writable();
export const participants: Writable<Types.GetActivityInstanceConnectedParticipantsResponse> = writable();

10
src/main.ts
View file

@ -1,8 +1,8 @@
import './app.css' import "./app.css";
import App from './App.svelte' import App from "./App.svelte";
const app = new App({ const app = new App({
target: document.getElementById('app')!, target: document.getElementById("app")!,
}) });
export default app export default app;

8
tailwind.config.js Normal file
View file

@ -0,0 +1,8 @@
/** @type {import('tailwindcss').Config} */
export default {
content: ["./index.html", "./src/**/*.{js,ts,svelte,html}"],
theme: {
extend: {},
},
plugins: [],
};

8
vite.config.ts
View file

@ -1,7 +1,7 @@
import { defineConfig } from 'vite' import { defineConfig } from "vite";
import { svelte } from '@sveltejs/vite-plugin-svelte' import { svelte } from "@sveltejs/vite-plugin-svelte";
// https://vitejs.dev/config/ // https://vitejs.dev/config/
export default defineConfig({ export default defineConfig({
plugins: [svelte()], plugins: [svelte()],
}) });

763
yarn.lock
View file

File diff suppressed because it is too large Load diff