This commit is contained in:
tymur999
2024-10-19 19:34:35 -04:00
committed by Mark Goltsman
parent f815f6ca60
commit f9ad53b92e
6 changed files with 52 additions and 25 deletions

View File

@@ -7,5 +7,4 @@ export const notes: string[] = [
"Our names are Kaz, Tymur, Daniil, and Mark!",
"LET'S GO TECH",
"In my free time, I do poster design for my dorm room",
'Ass breaker'
];

View File

@@ -20,7 +20,7 @@ export function Journal(props: {setIndex: (index: number) => void}) {
>
<div className="text-center text-5xl font-bold mt-[5rem] px-5">Take a break for journaling</div>
<div className="flex flex-col mx-auto mt-[5rem]">
<input className="z-[99999] mx-auto py-2 px-4 bg-[#383838] color-[#7f7f7f] border-2 text-xl border-none rounded-xl"
<input onMouseDown={event => event.stopPropagation()} className="z-[99999] mx-auto py-2 px-4 bg-[#383838] color-[#7f7f7f] border-2 text-xl border-none rounded-xl"
placeholder="Reflect on what you learned..." />
</div>
<div className="my-auto">

View File

@@ -4,6 +4,7 @@ import React from 'react';
import {notes as initialNotes} from '../data/notes'
// @ts-ignore
import { useState } from "react";
import { motion } from 'framer';
// Example of notes array
@@ -35,13 +36,17 @@ const getRandomColor = () => {
return colors[Math.floor(Math.random() * colors.length)];
};
export default function Landing() {
export function MindMap() {
const [notes, setNotes] = useState<string[]>(initialNotes); // Set the initial state
return (
<div style={containerStyles}>
<motion.div style={containerStyles}
initial={{ y: 500 }}
transition={{ duration: 0.2 }}
animate={{ y: 0 }}
exit={{ y: 500 }}
>
<div style={innerContainerStyles}>
<h1 style={headerStyles}>Your personal mind space</h1>
<div style={notesContainerStyles}>
{notes.map((note, index) => (
<div key={index} style={getRandomStyles()}>
@@ -50,7 +55,7 @@ export default function Landing() {
))}
</div>
</div>
</div>
</motion.div>
);
}
@@ -61,7 +66,7 @@ const containerStyles = {
justifyContent: "center",
height: "100vh", // Ensure the container spans vertically
padding: "10px",
width: "600px"
width: "100%"
};
const innerContainerStyles = {

View File

@@ -3,18 +3,21 @@
import arrow from "../../img/arrow.png";
import gradient from "../../img/gradient.png";
import Image from "next/image";
import { useEffect, useState } from "react";
import { useState } from "react";
import { Time } from "@/app/landing/time";
import { motion } from "framer";
import { Journal } from "@/app/landing/journal";
import { QuickFact } from "@/app/landing/quick_fact";
import { MindMap } from "@/app/landing/mindmap";
export default function Landing() {
const [clicked1, setClicked1] = useState(false);
const [index, setIndex] = useState(0);
const slides = [<Time setIndex={setIndex} key="1" seconds={8}/>,
<Journal setIndex={setIndex} key="2"/>,
<QuickFact key="3"/>];
<QuickFact key="3" setIndex={setIndex}/>,
<MindMap key="4"/>
];
return clicked1 ? (
slides[index]

View File

@@ -1,5 +1,22 @@
export function QuickFact() {
return <div>
Hello
</div>
import { motion } from "framer";
export function QuickFact(props: {setIndex: (index: number) => void}) {
return <motion.div
initial={{ y: 500 }}
transition={{ duration: 0.2 }}
animate={{ y: 0 }}
exit={{ y: 500 }}
onMouseDown={() => props.setIndex(3)}
className="h-[100vh] w-full bg-cyan-500 absolute top-0
from-[#5ce1e6] to-[rgba(0,0,0,.6)] bg-gradient-to-b from-90%"
>
<div className="text-center mt-[10rem] text-5xl font-bold">
Quick fact!
</div>
<div className="text-center mt-[10rem] text-5xl px-5">
90% of information is forgotten within 7 days
</div>
</motion.div>
}

View File

@@ -4,6 +4,8 @@ import { CircularProgressbar, buildStyles } from 'react-circular-progressbar';
import { motion } from 'framer';
import { useEffect, useState } from "react";
// import CanvasClass from "@/api/canvas.class";
// import getSubtask from "@/api/openAI/openAI-API";
// import CanvasClass from "@/api/canvas.class";
// import getSubtask from "../../api/openAI/openAI-API";
export function Time(props: {seconds: number, setIndex: (index: number) => void}) {
@@ -12,15 +14,15 @@ export function Time(props: {seconds: number, setIndex: (index: number) => void}
// const [subtask, setSubtask] = useState<string | null>("");
const percentage = secondsLeft / props.seconds * 100;
// useEffect(() => {
// (async () => {
// const canvas = new CanvasClass("2096~VBaXaAvP39aGWhVV2xuUnTzn8wxATf98PZz7rmWQFf278B4V3a2nCW7fJkDDxURh");
// const files = await canvas.getAllFiles();
// const result: string | null = await getSubtask(files);
// setSubtask(result);
// console.log(subtask);
// })();
// }, []);
// async function hello() {
// "use server"
// const canvas = new CanvasClass("2096~VBaXaAvP39aGWhVV2xuUnTzn8wxATf98PZz7rmWQFf278B4V3a2nCW7fJkDDxURh");
// const files = await canvas.getAllFiles();
// const result: string | null = await getSubtask(files);
// setSubtask(result);
// console.log(subtask);
// }
// hello();
useEffect(() => {
@@ -40,9 +42,10 @@ export function Time(props: {seconds: number, setIndex: (index: number) => void}
initial={{y: 500}}
animate={{y: 0}}
exit={{y: 500}}
className="absolute top-0 flex flex-col bg-[#ff5757] h-full w-full items-center justify-center">
<h1 className="text-3xl text-center absolute top-[15%] font-bold">
What is the average attention span?
className="absolute top-0 flex flex-col bg-[#ff5757] h-full w-full items-center justify-center
from-[#ff5757] to-[rgba(56,56,56,.6)] bg-gradient-to-b from-90%">
<h1 className="text-2xl text-center absolute top-[15%] font-bold">
What is covered in the "day 4 nested quantifiers" from the course?
</h1>
<h1 className="absolute text-9xl font-bold" style={{textShadow: "5px 5px 5px 5px black"}}>
{