From 094d3e0e1370f2f8b3619ba6cea8b33ac83dceed Mon Sep 17 00:00:00 2001 From: LLLL Colonq Date: Fri, 12 Jan 2024 14:54:22 -0500 Subject: Update frontend --- fig-frontend/client/src/index.ts | 121 ++------------------------------------- 1 file changed, 6 insertions(+), 115 deletions(-) (limited to 'fig-frontend/client/src/index.ts') diff --git a/fig-frontend/client/src/index.ts b/fig-frontend/client/src/index.ts index 899c7fd..be0b0c5 100644 --- a/fig-frontend/client/src/index.ts +++ b/fig-frontend/client/src/index.ts @@ -1,119 +1,10 @@ -import { html, css, LitElement } from "lit"; -import { customElement, property } from "lit/decorators.js"; - -import interact from "interactjs"; - -import * as Config from "./config"; -import * as Twitch from "./twitch"; +import "./components/backdrop"; +import "./components/header"; +import "./components/footer"; +import "./components/login"; +import "./components/window"; +import "./components/gizmo"; import "./index.css"; console.log("welcome to \"the junkyard\""); - -@customElement("fig-window") -export class Window extends LitElement { - x: number; - y: number; - - constructor() { - super(); - this.x = 0; - this.y = 0; - interact(this).draggable({ - listeners: { - move(event) { - event.target.x += event.dx - event.target.y += event.dy - event.target.style.left = `${event.target.x}px` - event.target.style.top = `${event.target.y}px` - }, - } - }); - } - - render() { - console.log("render"); - return html` - -`; - } -} - -@customElement("fig-backdrop") -export class Backdrop extends LitElement { - static styles = css` -#backdrop { - z-index: -2; - position: absolute; - left: 0px; - top: 0px; - width: 100vw; - height: 100vh; - background-image: url("blueprint.jpg"); -} -#blur { - z-index: -1; - backdrop-filter: blur(3px); - position: absolute; - left: 0px; - top: 0px; - width: 100vw; - height: 100vh; - background-size: 100px 100px; - background-position: -20px -20px; - background-image: - linear-gradient(to right, lightgrey 1px, transparent 1px), - linear-gradient(to bottom, lightgrey 1px, transparent 1px); -} -`; - render() { - return html` -
-
-`; - } -} - -@customElement("fig-login") -export class Login extends LitElement { - static styles = css` - `; - - login() { - Twitch.startTwitchAuth(); - } - - async check() { - const resp = await fetch(`${Config.API_URL}/check`); - console.log(await resp.text()); - } - - render() { - const token = Twitch.getAuthToken(); - console.log(token); - if (token) { - return html` - -`; - } else { - return html` - -`; - } - } -} - -@customElement("fig-header") -export class Header extends LitElement { - static styles = css` -h1 { - color: #b5a642; - font-family: "Rubik Maps"; -} -`; - render() { - return html` -

Welcome To "The JunkYard"

-`; - } -} -- cgit v1.2.3