From 5268b2548794d4b6a056c5b918552bfaeb010f1e Mon Sep 17 00:00:00 2001 From: alicia yu Date: Fri, 23 Aug 2024 21:08:24 -0700 Subject: [PATCH] UI changes, workaround for domains in interface.js (.env wasn't working), still issues with codebases that don't have any JS files --- frontend/src/components/Chatbot.css | 57 ++++++++++++++++++++++++++++- frontend/src/domains.js | 1 + frontend/src/interface.js | 16 +------- 3 files changed, 57 insertions(+), 17 deletions(-) create mode 100644 frontend/src/domains.js diff --git a/frontend/src/components/Chatbot.css b/frontend/src/components/Chatbot.css index 7e27b9d..c04e927 100644 --- a/frontend/src/components/Chatbot.css +++ b/frontend/src/components/Chatbot.css @@ -9,8 +9,8 @@ height: 100vh; text-align: center; background:#777ed4; /* Fallback for old browsers */ - background: -webkit-linear-gradient(to right, #6b90e0, #777ed4); /* Chrome 10-25, Safari 5.1-6 */ - background: linear-gradient(to right, #6b90e0, #777ed4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + background: -webkit-linear-gradient(to right, #6b90e0, #8277d4); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #6b90e0, #8277d4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ opacity: 0.95; overflow-y: auto; } @@ -160,3 +160,56 @@ h1 { opacity: 0.8; color: #eae4fe; } + +/* Light animation for title. Credit: https://codepen.io/zastrow/pen/PoJmzGJ */ +@keyframes lights { + 0% { + color: hsl(230, 46%, 85%); + text-shadow: + 0 0 1em hsla(320, 100%, 50%, 0.2), + 0 0 0.125em hsla(320, 100%, 60%, 0.3), + -1em -0.125em 0.5em hsla(40, 100%, 60%, 0), + 1em 0.125em 0.5em hsla(200, 100%, 60%, 0); + } + + 30% { + color: hsl(231, 100%, 92%); + text-shadow: + 0 0 1em hsla(320, 100%, 50%, 0.7), + 0 0 0.125em hsla(320, 100%, 60%, 0.7), + -0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2), + 0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4); + } + + 40% { + color: hsl(0, 0%, 100%); + text-shadow: + 0 0 1em hsla(283, 100%, 50%, 0.7), + 0 0 0.125em hsla(320, 100%, 90%, 0.7), + -0.25em -0.125em 0.125em hsla(40, 100%, 60%, 0.2), + 0.25em 0.125em 0.125em hsla(200, 100%, 60%, 0.4); + } + + 70% { + color: hsl(227, 70%, 94%); + text-shadow: + 0 0 1em hsla(297, 100%, 50%, 0.7), + 0 0 0.125em hsla(214, 100%, 85%, 0.88), + 0.5em -0.125em 0.25em hsla(40, 100%, 60%, 0.2), + -0.5em 0.125em 0.25em hsla(200, 100%, 60%, 0.4); + } + + 100% { + color: hsl(232, 49%, 85%); + text-shadow: + 0 0 1em hsla(320, 100%, 50%, 0.2), + 0 0 0.125em hsla(320, 100%, 60%, 0.3), + 1em -0.125em 0.5em hsla(40, 100%, 60%, 0), + -1em 0.125em 0.5em hsla(200, 100%, 60%, 0); + } + +} + +h1 { + animation: lights 5s 750ms linear infinite; +} \ No newline at end of file diff --git a/frontend/src/domains.js b/frontend/src/domains.js new file mode 100644 index 0000000..e32eca4 --- /dev/null +++ b/frontend/src/domains.js @@ -0,0 +1 @@ +export const apiURL = "http://localhost:3000"; \ No newline at end of file diff --git a/frontend/src/interface.js b/frontend/src/interface.js index 3a8e7c2..c2d5c5d 100644 --- a/frontend/src/interface.js +++ b/frontend/src/interface.js @@ -1,13 +1,11 @@ import ReactDOM from "react-dom"; import MarkdownRenderer from "./MarkdownRenderer"; +import {apiURL} from "./domains"; let messageCounter = 0; // Download a codebase export async function downloadCodebase() { - const ec2 = "http://18.226.98.245:80"; - const local = "http://localhost:3000"; - const apiURL = "https://syntaxsorcerer-backend.fly.dev"; const url = document.getElementById("codebase-url").value; const response = await fetch(`${apiURL}/api/download`, { @@ -28,10 +26,6 @@ export async function downloadCodebase() { // Delete the existing codebase export async function deleteCodebase() { - const ec2 = "http://18.226.98.245:80"; - const local = "http://localhost:3000"; - const apiURL = "https://syntaxsorcerer-backend.fly.dev"; - const response = await fetch(`${apiURL}/api/delete`, { method: "POST", headers: { @@ -130,10 +124,6 @@ export function appendMessage(sender, message) { // Fetch a response from the ChatGPT API export async function fetchChatGPTResponse(userInput) { - const ec2 = "https://18.226.98.245:443"; - const local = "http://localhost:3000"; - const apiURL = "https://syntaxsorcerer-backend.fly.dev"; - const response = await fetch(`${apiURL}/api/chatgpt`, { method: "POST", headers: { @@ -152,10 +142,6 @@ export async function fetchChatGPTResponse(userInput) { // Fetch a response from the Pinecone API, generate an embedding from the user input export async function fetchPineconeResponse(userInput) { - const ec2 = "https://18.226.98.245:443"; - const local = "http://localhost:3000"; - const apiURL = "https://syntaxsorcerer-backend.fly.dev"; - const response = await fetch(`${apiURL}/api/pinecone`, { method: "POST", headers: {