From 8349b71179bd5fc07d969c696c7722661666f37d Mon Sep 17 00:00:00 2001 From: sotech117 Date: Tue, 23 Sep 2025 02:56:17 -0400 Subject: fix for build --- src/app/OurServices.tsx | 4 - src/app/WhyUs.tsx | 1 - src/app/page.tsx | 1 - src/components/old/bentonbox.tsx | 326 +++++++------- src/components/ui/background-ripple-effect.tsx | 2 +- src/components/ui/canvas-reveal-effect.tsx | 572 ++++++++++++------------- src/components/ui/card-spotlight.tsx | 140 +++--- src/components/ui/wavy-background.tsx | 250 +++++------ src/components/ui/wooble-card.tsx | 150 +++---- src/components/ui/world-map.tsx | 312 +++++++------- 10 files changed, 876 insertions(+), 882 deletions(-) diff --git a/src/app/OurServices.tsx b/src/app/OurServices.tsx index 4f3e5e8..04e2764 100644 --- a/src/app/OurServices.tsx +++ b/src/app/OurServices.tsx @@ -1,9 +1,5 @@ "use client"; -import { BackgroundRippleEffect } from "@/components/ui/background-ripple-effect"; -import { CardSpotlight } from "@/components/ui/card-spotlight"; -import { WobbleCard } from "@/components/ui/wooble-card"; -import { WorldMap } from "@/components/ui/world-map"; import { motion } from "motion/react"; export default function OurServices() { diff --git a/src/app/WhyUs.tsx b/src/app/WhyUs.tsx index bb92485..046c4d4 100644 --- a/src/app/WhyUs.tsx +++ b/src/app/WhyUs.tsx @@ -1,4 +1,3 @@ -import { BackgroundRippleEffect } from "@/components/ui/background-ripple-effect"; import { AcademicCapIcon, BanknotesIcon, diff --git a/src/app/page.tsx b/src/app/page.tsx index 0c59aab..ba1a9dd 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,6 +1,5 @@ "use client"; -import Grid from "@/components/backgrounds/Grid"; import Polygons from "@/components/backgrounds/Polygons"; import Footer from "./Footer"; import Header from "./Header"; diff --git a/src/components/old/bentonbox.tsx b/src/components/old/bentonbox.tsx index 5a3afca..547b8d7 100644 --- a/src/components/old/bentonbox.tsx +++ b/src/components/old/bentonbox.tsx @@ -1,165 +1,165 @@ -"use client"; +// "use client"; -import { motion } from "motion/react"; +// import { motion } from "motion/react"; -export default function OurServices() { - return ( -
-
- - Learn In a Better Way - - - Our Services - -
- -
-
-
-

- Tutoring at All Grade Levels -

-

- Our tutors cover a wide range of subjects and grade levels, -

-
-
-
- -
-
-
-
- - -
-
-
-

- SAT / ACT Prep -

-

- We only hire tutors who have been high-performing students - with previous teaching experience. Most of our tutors are - currently pursuing PhDs or Masters in their respective fields. -

-
-
- -
-
-
- - -
-
-
-

- Secure Technological Integration -

-

- While applying technology to make learning the best it can be, - we prioritize security and privacy to protect our users' data - and ensure a safe learning environment. -

-
-
- -
-
-
- - -
-
-
-

- Competitive Math and Coding Counseling -

-

- Our handcrafted AI learns from your sessions and provides - personalized summaries, practice problems, and study plans to - help you succeed. -

-
-
-
-
-
-
- Week1_Session_Precalc.md -
-
- Week2_Session_Precalc.md -
-
-
-
-

AI Summary:

-

- This is a summary of the AI's findings and recommendations - based on the user's input and interactions. -

-
-
-
-
-
- -
-
-
- ); -} +// export default function OurServices() { +// return ( +//
+//
+// +// Learn In a Better Way +// +// +// Our Services +// +//
+// +//
+//
+//
+//

+// Tutoring at All Grade Levels +//

+//

+// Our tutors cover a wide range of subjects and grade levels, +//

+//
+//
+//
+// +//
+//
+//
+//
+// +// +//
+//
+//
+//

+// SAT / ACT Prep +//

+//

+// We only hire tutors who have been high-performing students +// with previous teaching experience. Most of our tutors are +// currently pursuing PhDs or Masters in their respective fields. +//

+//
+//
+// +//
+//
+//
+// +// +//
+//
+//
+//

+// Secure Technological Integration +//

+//

+// While applying technology to make learning the best it can be, +// we prioritize security and privacy to protect our users' data +// and ensure a safe learning environment. +//

+//
+//
+// +//
+//
+//
+// +// +//
+//
+//
+//

+// Competitive Math and Coding Counseling +//

+//

+// Our handcrafted AI learns from your sessions and provides +// personalized summaries, practice problems, and study plans to +// help you succeed. +//

+//
+//
+//
+//
+//
+//
+// Week1_Session_Precalc.md +//
+//
+// Week2_Session_Precalc.md +//
+//
+//
+//
+//

AI Summary:

+//

+// This is a summary of the AI's findings and recommendations +// based on the user's input and interactions. +//

+//
+//
+//
+//
+//
+// +//
+//
+//
+// ); +// } diff --git a/src/components/ui/background-ripple-effect.tsx b/src/components/ui/background-ripple-effect.tsx index d9d265b..7f084cd 100644 --- a/src/components/ui/background-ripple-effect.tsx +++ b/src/components/ui/background-ripple-effect.tsx @@ -16,7 +16,7 @@ export const BackgroundRippleEffect = ({ col: number; } | null>(null); const [rippleKey, setRippleKey] = useState(0); - const ref = useRef(null); + const ref = useRef(null); return (
{ - return ( -
-
- -
- {showGradient && ( -
- )} -
- ); -}; +// export const CanvasRevealEffect = ({ +// animationSpeed = 0.4, +// opacities = [0.3, 0.3, 0.3, 0.5, 0.5, 0.5, 0.8, 0.8, 0.8, 1], +// colors = [[0, 255, 255]], +// containerClassName, +// dotSize, +// showGradient = false, +// }: { +// /** +// * 0.1 - slower +// * 1.0 - faster +// */ +// animationSpeed?: number; +// opacities?: number[]; +// colors?: number[][]; +// containerClassName?: string; +// dotSize?: number; +// showGradient?: boolean; +// }) => { +// return ( +//
+//
+// +//
+// {showGradient && ( +//
+// )} +//
+// ); +// }; -interface DotMatrixProps { - colors?: number[][]; - opacities?: number[]; - totalSize?: number; - dotSize?: number; - shader?: string; - center?: ("x" | "y")[]; -} +// interface DotMatrixProps { +// colors?: number[][]; +// opacities?: number[]; +// totalSize?: number; +// dotSize?: number; +// shader?: string; +// center?: ("x" | "y")[]; +// } -const DotMatrix: React.FC = ({ - colors = [[0, 0, 0]], - opacities = [0.04, 0.04, 0.04, 0.04, 0.04, 0.08, 0.08, 0.08, 0.08, 0.14], - totalSize = 4, - dotSize = 2, - shader = "", - center = ["x", "y"], -}) => { - const uniforms = React.useMemo(() => { - let colorsArray = [ - colors[0], - colors[0], - colors[0], - colors[0], - colors[0], - colors[0], - ]; - if (colors.length === 2) { - colorsArray = [ - colors[0], - colors[0], - colors[0], - colors[1], - colors[1], - colors[1], - ]; - } else if (colors.length === 3) { - colorsArray = [ - colors[0], - colors[0], - colors[1], - colors[1], - colors[2], - colors[2], - ]; - } +// const DotMatrix: React.FC = ({ +// colors = [[0, 0, 0]], +// opacities = [0.04, 0.04, 0.04, 0.04, 0.04, 0.08, 0.08, 0.08, 0.08, 0.14], +// totalSize = 4, +// dotSize = 2, +// shader = "", +// center = ["x", "y"], +// }) => { +// const uniforms = React.useMemo(() => { +// let colorsArray = [ +// colors[0], +// colors[0], +// colors[0], +// colors[0], +// colors[0], +// colors[0], +// ]; +// if (colors.length === 2) { +// colorsArray = [ +// colors[0], +// colors[0], +// colors[0], +// colors[1], +// colors[1], +// colors[1], +// ]; +// } else if (colors.length === 3) { +// colorsArray = [ +// colors[0], +// colors[0], +// colors[1], +// colors[1], +// colors[2], +// colors[2], +// ]; +// } - return { - u_colors: { - value: colorsArray.map((color) => [ - color[0] / 255, - color[1] / 255, - color[2] / 255, - ]), - type: "uniform3fv", - }, - u_opacities: { - value: opacities, - type: "uniform1fv", - }, - u_total_size: { - value: totalSize, - type: "uniform1f", - }, - u_dot_size: { - value: dotSize, - type: "uniform1f", - }, - }; - }, [colors, opacities, totalSize, dotSize]); +// return { +// u_colors: { +// value: colorsArray.map((color) => [ +// color[0] / 255, +// color[1] / 255, +// color[2] / 255, +// ]), +// type: "uniform3fv", +// }, +// u_opacities: { +// value: opacities, +// type: "uniform1fv", +// }, +// u_total_size: { +// value: totalSize, +// type: "uniform1f", +// }, +// u_dot_size: { +// value: dotSize, +// type: "uniform1f", +// }, +// }; +// }, [colors, opacities, totalSize, dotSize]); - return ( - - ); -}; +// fragColor = vec4(color, opacity); +// fragColor.rgb *= fragColor.a; +// }`} +// uniforms={uniforms} +// maxFps={60} +// /> +// ); +// }; -type Uniforms = { - [key: string]: { - value: number[] | number[][] | number; - type: string; - }; -}; -const ShaderMaterial = ({ - source, - uniforms, - maxFps = 60, -}: { - source: string; - hovered?: boolean; - maxFps?: number; - uniforms: Uniforms; -}) => { - const { size } = useThree(); - const ref = useRef(); - let lastFrameTime = 0; +// type Uniforms = { +// [key: string]: { +// value: number[] | number[][] | number; +// type: string; +// }; +// }; +// const ShaderMaterial = ({ +// source, +// uniforms, +// maxFps = 60, +// }: { +// source: string; +// hovered?: boolean; +// maxFps?: number; +// uniforms: Uniforms; +// }) => { +// const { size } = useThree(); +// const ref = useRef(null); +// let lastFrameTime = 0; - useFrame(({ clock }) => { - if (!ref.current) return; - const timestamp = clock.getElapsedTime(); - if (timestamp - lastFrameTime < 1 / maxFps) { - return; - } - lastFrameTime = timestamp; +// useFrame(({ clock }) => { +// if (!ref.current) return; +// const timestamp = clock.getElapsedTime(); +// if (timestamp - lastFrameTime < 1 / maxFps) { +// return; +// } +// lastFrameTime = timestamp; - const material: any = ref.current.material; - const timeLocation = material.uniforms.u_time; - timeLocation.value = timestamp; - }); +// const material: any = ref.current.material; +// const timeLocation = material.uniforms.u_time; +// timeLocation.value = timestamp; +// }); - const getUniforms = () => { - const preparedUniforms: any = {}; +// const getUniforms = () => { +// const preparedUniforms: any = {}; - for (const uniformName in uniforms) { - const uniform: any = uniforms[uniformName]; +// for (const uniformName in uniforms) { +// const uniform: any = uniforms[uniformName]; - switch (uniform.type) { - case "uniform1f": - preparedUniforms[uniformName] = { value: uniform.value, type: "1f" }; - break; - case "uniform3f": - preparedUniforms[uniformName] = { - value: new THREE.Vector3().fromArray(uniform.value), - type: "3f", - }; - break; - case "uniform1fv": - preparedUniforms[uniformName] = { value: uniform.value, type: "1fv" }; - break; - case "uniform3fv": - preparedUniforms[uniformName] = { - value: uniform.value.map((v: number[]) => - new THREE.Vector3().fromArray(v) - ), - type: "3fv", - }; - break; - case "uniform2f": - preparedUniforms[uniformName] = { - value: new THREE.Vector2().fromArray(uniform.value), - type: "2f", - }; - break; - default: - console.error(`Invalid uniform type for '${uniformName}'.`); - break; - } - } +// switch (uniform.type) { +// case "uniform1f": +// preparedUniforms[uniformName] = { value: uniform.value, type: "1f" }; +// break; +// case "uniform3f": +// preparedUniforms[uniformName] = { +// value: new THREE.Vector3().fromArray(uniform.value), +// type: "3f", +// }; +// break; +// case "uniform1fv": +// preparedUniforms[uniformName] = { value: uniform.value, type: "1fv" }; +// break; +// case "uniform3fv": +// preparedUniforms[uniformName] = { +// value: uniform.value.map((v: number[]) => +// new THREE.Vector3().fromArray(v) +// ), +// type: "3fv", +// }; +// break; +// case "uniform2f": +// preparedUniforms[uniformName] = { +// value: new THREE.Vector2().fromArray(uniform.value), +// type: "2f", +// }; +// break; +// default: +// console.error(`Invalid uniform type for '${uniformName}'.`); +// break; +// } +// } - preparedUniforms["u_time"] = { value: 0, type: "1f" }; - preparedUniforms["u_resolution"] = { - value: new THREE.Vector2(size.width * 2, size.height * 2), - }; // Initialize u_resolution - return preparedUniforms; - }; +// preparedUniforms["u_time"] = { value: 0, type: "1f" }; +// preparedUniforms["u_resolution"] = { +// value: new THREE.Vector2(size.width * 2, size.height * 2), +// }; // Initialize u_resolution +// return preparedUniforms; +// }; - // Shader material - const material = useMemo(() => { - const materialObject = new THREE.ShaderMaterial({ - vertexShader: ` - precision mediump float; - in vec2 coordinates; - uniform vec2 u_resolution; - out vec2 fragCoord; - void main(){ - float x = position.x; - float y = position.y; - gl_Position = vec4(x, y, 0.0, 1.0); - fragCoord = (position.xy + vec2(1.0)) * 0.5 * u_resolution; - fragCoord.y = u_resolution.y - fragCoord.y; - } - `, - fragmentShader: source, - uniforms: getUniforms(), - glslVersion: THREE.GLSL3, - blending: THREE.CustomBlending, - blendSrc: THREE.SrcAlphaFactor, - blendDst: THREE.OneFactor, - }); +// // Shader material +// const material = useMemo(() => { +// const materialObject = new THREE.ShaderMaterial({ +// vertexShader: ` +// precision mediump float; +// in vec2 coordinates; +// uniform vec2 u_resolution; +// out vec2 fragCoord; +// void main(){ +// float x = position.x; +// float y = position.y; +// gl_Position = vec4(x, y, 0.0, 1.0); +// fragCoord = (position.xy + vec2(1.0)) * 0.5 * u_resolution; +// fragCoord.y = u_resolution.y - fragCoord.y; +// } +// `, +// fragmentShader: source, +// uniforms: getUniforms(), +// glslVersion: THREE.GLSL3, +// blending: THREE.CustomBlending, +// blendSrc: THREE.SrcAlphaFactor, +// blendDst: THREE.OneFactor, +// }); - return materialObject; - }, [size.width, size.height, source]); +// return materialObject; +// }, [size.width, size.height, source]); - return ( - - - - - ); -}; +// return ( +// +// +// +// +// ); +// }; -const Shader: React.FC = ({ source, uniforms, maxFps = 60 }) => { - return ( - - - - ); -}; -interface ShaderProps { - source: string; - uniforms: { - [key: string]: { - value: number[] | number[][] | number; - type: string; - }; - }; - maxFps?: number; -} +// const Shader: React.FC = ({ source, uniforms, maxFps = 60 }) => { +// return ( +// +// +// +// ); +// }; +// interface ShaderProps { +// source: string; +// uniforms: { +// [key: string]: { +// value: number[] | number[][] | number; +// type: string; +// }; +// }; +// maxFps?: number; +// } diff --git a/src/components/ui/card-spotlight.tsx b/src/components/ui/card-spotlight.tsx index f0b17d7..519d1ac 100644 --- a/src/components/ui/card-spotlight.tsx +++ b/src/components/ui/card-spotlight.tsx @@ -1,74 +1,74 @@ -"use client"; +// "use client"; -import { useMotionValue, motion, useMotionTemplate } from "motion/react"; -import React, { MouseEvent as ReactMouseEvent, useState } from "react"; -import { CanvasRevealEffect } from "@/components/ui/canvas-reveal-effect"; -import { cn } from "@/lib/utils"; +// import { useMotionValue, motion, useMotionTemplate } from "motion/react"; +// import React, { MouseEvent as ReactMouseEvent, useState } from "react"; +// import { CanvasRevealEffect } from "@/components/ui/canvas-reveal-effect"; +// import { cn } from "@/lib/utils"; -export const CardSpotlight = ({ - children, - radius = 350, - color = "#ffffff33", - className, - ...props -}: { - radius?: number; - color?: string; - children: React.ReactNode; -} & React.HTMLAttributes) => { - const mouseX = useMotionValue(0); - const mouseY = useMotionValue(0); - function handleMouseMove({ - currentTarget, - clientX, - clientY, - }: ReactMouseEvent) { - let { left, top } = currentTarget.getBoundingClientRect(); +// export const CardSpotlight = ({ +// children, +// radius = 350, +// color = "#ffffff33", +// className, +// ...props +// }: { +// radius?: number; +// color?: string; +// children: React.ReactNode; +// } & React.HTMLAttributes) => { +// const mouseX = useMotionValue(0); +// const mouseY = useMotionValue(0); +// function handleMouseMove({ +// currentTarget, +// clientX, +// clientY, +// }: ReactMouseEvent) { +// let { left, top } = currentTarget.getBoundingClientRect(); - mouseX.set(clientX - left); - mouseY.set(clientY - top); - } +// mouseX.set(clientX - left); +// mouseY.set(clientY - top); +// } - const [isHovering, setIsHovering] = useState(false); - const handleMouseEnter = () => setIsHovering(true); - const handleMouseLeave = () => setIsHovering(false); - return ( -
- - {isHovering && ( - - )} - - {children} -
- ); -}; +// const [isHovering, setIsHovering] = useState(false); +// const handleMouseEnter = () => setIsHovering(true); +// const handleMouseLeave = () => setIsHovering(false); +// return ( +//
+// +// {isHovering && ( +// +// )} +// +// {children} +//
+// ); +// }; diff --git a/src/components/ui/wavy-background.tsx b/src/components/ui/wavy-background.tsx index 4fbc374..5bfebc1 100644 --- a/src/components/ui/wavy-background.tsx +++ b/src/components/ui/wavy-background.tsx @@ -1,132 +1,132 @@ -"use client"; -import { cn } from "@/lib/utils"; -import React, { useEffect, useRef, useState } from "react"; -import { createNoise3D } from "simplex-noise"; +// "use client"; +// import { cn } from "@/lib/utils"; +// import React, { useEffect, useRef, useState } from "react"; +// import { createNoise3D } from "simplex-noise"; -export const WavyBackground = ({ - children, - className, - containerClassName, - colors, - waveWidth, - backgroundFill, - blur = 10, - speed = "fast", - waveOpacity = 0.5, - ...props -}: { - children?: any; - className?: string; - containerClassName?: string; - colors?: string[]; - waveWidth?: number; - backgroundFill?: string; - blur?: number; - speed?: "slow" | "fast"; - waveOpacity?: number; - [key: string]: any; -}) => { - const noise = createNoise3D(); - let w: number, - h: number, - nt: number, - i: number, - x: number, - ctx: any, - canvas: any; - const canvasRef = useRef(null); - const getSpeed = () => { - switch (speed) { - case "slow": - return 0.001; - case "fast": - return 0.002; - default: - return 0.001; - } - }; +// export const WavyBackground = ({ +// children, +// className, +// containerClassName, +// colors, +// waveWidth, +// backgroundFill, +// blur = 10, +// speed = "fast", +// waveOpacity = 0.5, +// ...props +// }: { +// children?: any; +// className?: string; +// containerClassName?: string; +// colors?: string[]; +// waveWidth?: number; +// backgroundFill?: string; +// blur?: number; +// speed?: "slow" | "fast"; +// waveOpacity?: number; +// [key: string]: any; +// }) => { +// const noise = createNoise3D(); +// let w: number, +// h: number, +// nt: number, +// i: number, +// x: number, +// ctx: any, +// canvas: any; +// const canvasRef = useRef(null); +// const getSpeed = () => { +// switch (speed) { +// case "slow": +// return 0.001; +// case "fast": +// return 0.002; +// default: +// return 0.001; +// } +// }; - const init = () => { - canvas = canvasRef.current; - ctx = canvas.getContext("2d"); - w = ctx.canvas.width = window.innerWidth; - h = ctx.canvas.height = window.innerHeight; - ctx.filter = `blur(${blur}px)`; - nt = 0; - window.onresize = function () { - w = ctx.canvas.width = window.innerWidth; - h = ctx.canvas.height = window.innerHeight; - ctx.filter = `blur(${blur}px)`; - }; - render(); - }; +// const init = () => { +// canvas = canvasRef.current; +// ctx = canvas.getContext("2d"); +// w = ctx.canvas.width = window.innerWidth; +// h = ctx.canvas.height = window.innerHeight; +// ctx.filter = `blur(${blur}px)`; +// nt = 0; +// window.onresize = function () { +// w = ctx.canvas.width = window.innerWidth; +// h = ctx.canvas.height = window.innerHeight; +// ctx.filter = `blur(${blur}px)`; +// }; +// render(); +// }; - const waveColors = colors ?? [ - "#38bdf8", - "#818cf8", - "#c084fc", - "#e879f9", - "#22d3ee", - ]; - const drawWave = (n: number) => { - nt += getSpeed(); - for (i = 0; i < n; i++) { - ctx.beginPath(); - ctx.lineWidth = waveWidth || 50; - ctx.strokeStyle = waveColors[i % waveColors.length]; - for (x = 0; x < w; x += 5) { - var y = noise(x / 800, 0.3 * i, nt) * 100; - ctx.lineTo(x, y + h * 0.5); // adjust for height, currently at 50% of the container - } - ctx.stroke(); - ctx.closePath(); - } - }; +// const waveColors = colors ?? [ +// "#38bdf8", +// "#818cf8", +// "#c084fc", +// "#e879f9", +// "#22d3ee", +// ]; +// const drawWave = (n: number) => { +// nt += getSpeed(); +// for (i = 0; i < n; i++) { +// ctx.beginPath(); +// ctx.lineWidth = waveWidth || 50; +// ctx.strokeStyle = waveColors[i % waveColors.length]; +// for (x = 0; x < w; x += 5) { +// var y = noise(x / 800, 0.3 * i, nt) * 100; +// ctx.lineTo(x, y + h * 0.5); // adjust for height, currently at 50% of the container +// } +// ctx.stroke(); +// ctx.closePath(); +// } +// }; - let animationId: number; - const render = () => { - ctx.fillStyle = backgroundFill || "black"; - ctx.globalAlpha = waveOpacity || 0.5; - ctx.fillRect(0, 0, w, h); - drawWave(5); - animationId = requestAnimationFrame(render); - }; +// let animationId: number; +// const render = () => { +// ctx.fillStyle = backgroundFill || "black"; +// ctx.globalAlpha = waveOpacity || 0.5; +// ctx.fillRect(0, 0, w, h); +// drawWave(5); +// animationId = requestAnimationFrame(render); +// }; - useEffect(() => { - init(); - return () => { - cancelAnimationFrame(animationId); - }; - }, []); +// useEffect(() => { +// init(); +// return () => { +// cancelAnimationFrame(animationId); +// }; +// }, []); - const [isSafari, setIsSafari] = useState(false); - useEffect(() => { - // I'm sorry but i have got to support it on safari. - setIsSafari( - typeof window !== "undefined" && - navigator.userAgent.includes("Safari") && - !navigator.userAgent.includes("Chrome") - ); - }, []); +// const [isSafari, setIsSafari] = useState(false); +// useEffect(() => { +// // I'm sorry but i have got to support it on safari. +// setIsSafari( +// typeof window !== "undefined" && +// navigator.userAgent.includes("Safari") && +// !navigator.userAgent.includes("Chrome") +// ); +// }, []); - return ( -
- -
- {children} -
-
- ); -}; +// return ( +//
+// +//
+// {children} +//
+//
+// ); +// }; diff --git a/src/components/ui/wooble-card.tsx b/src/components/ui/wooble-card.tsx index 05c059a..70a5615 100644 --- a/src/components/ui/wooble-card.tsx +++ b/src/components/ui/wooble-card.tsx @@ -1,78 +1,78 @@ -"use client"; -import { cn } from "@/lib/utils"; -import { motion } from "motion/react"; -import React, { useState } from "react"; +// "use client"; +// import { cn } from "@/lib/utils"; +// import { motion } from "motion/react"; +// import React, { useState } from "react"; -export const WobbleCard = ({ - children, - containerClassName, - className, -}: { - children: React.ReactNode; - containerClassName?: string; - className?: string; -}) => { - const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 }); - const [isHovering, setIsHovering] = useState(false); +// export const WobbleCard = ({ +// children, +// containerClassName, +// className, +// }: { +// children: React.ReactNode; +// containerClassName?: string; +// className?: string; +// }) => { +// const [mousePosition, setMousePosition] = useState({ x: 0, y: 0 }); +// const [isHovering, setIsHovering] = useState(false); - const handleMouseMove = (event: React.MouseEvent) => { - const { clientX, clientY } = event; - const rect = event.currentTarget.getBoundingClientRect(); - const x = (clientX - (rect.left + rect.width / 2)) / 20; - const y = (clientY - (rect.top + rect.height / 2)) / 20; - setMousePosition({ x, y }); - }; - return ( - setIsHovering(true)} - onMouseLeave={() => { - setIsHovering(false); - setMousePosition({ x: 0, y: 0 }); - }} - style={{ - transform: isHovering - ? `translate3d(${mousePosition.x}px, ${mousePosition.y}px, 0) scale3d(1, 1, 1)` - : "translate3d(0px, 0px, 0) scale3d(1, 1, 1)", - transition: "transform 0.1s ease-out", - }} - className={cn( - "mx-auto w-full bg-indigo-800 relative rounded-2xl overflow-hidden", - containerClassName - )} - > -
- - - {children} - -
-
- ); -}; +// const handleMouseMove = (event: React.MouseEvent) => { +// const { clientX, clientY } = event; +// const rect = event.currentTarget.getBoundingClientRect(); +// const x = (clientX - (rect.left + rect.width / 2)) / 20; +// const y = (clientY - (rect.top + rect.height / 2)) / 20; +// setMousePosition({ x, y }); +// }; +// return ( +// setIsHovering(true)} +// onMouseLeave={() => { +// setIsHovering(false); +// setMousePosition({ x: 0, y: 0 }); +// }} +// style={{ +// transform: isHovering +// ? `translate3d(${mousePosition.x}px, ${mousePosition.y}px, 0) scale3d(1, 1, 1)` +// : "translate3d(0px, 0px, 0) scale3d(1, 1, 1)", +// transition: "transform 0.1s ease-out", +// }} +// className={cn( +// "mx-auto w-full bg-indigo-800 relative rounded-2xl overflow-hidden", +// containerClassName +// )} +// > +//
+// +// +// {children} +// +//
+//
+// ); +// }; -const Noise = () => { - return ( -
- ); -}; +// const Noise = () => { +// return ( +//
+// ); +// }; diff --git a/src/components/ui/world-map.tsx b/src/components/ui/world-map.tsx index d6c9891..fc54cff 100644 --- a/src/components/ui/world-map.tsx +++ b/src/components/ui/world-map.tsx @@ -1,167 +1,167 @@ -"use client"; +// "use client"; -import { useRef } from "react"; -import { motion } from "motion/react"; -import DottedMap from "dotted-map"; +// import { useRef } from "react"; +// import { motion } from "motion/react"; +// import DottedMap from "dotted-map"; -import { useTheme } from "next-themes"; +// import { useTheme } from "next-themes"; -interface MapProps { - dots?: Array<{ - start: { lat: number; lng: number; label?: string }; - end: { lat: number; lng: number; label?: string }; - }>; - lineColor?: string; -} +// interface MapProps { +// dots?: Array<{ +// start: { lat: number; lng: number; label?: string }; +// end: { lat: number; lng: number; label?: string }; +// }>; +// lineColor?: string; +// } -export function WorldMap({ dots = [], lineColor = "#0ea5e9" }: MapProps) { - const svgRef = useRef(null); - const map = new DottedMap({ height: 100, grid: "diagonal" }); +// export function WorldMap({ dots = [], lineColor = "#0ea5e9" }: MapProps) { +// const svgRef = useRef(null); +// const map = new DottedMap({ height: 100, grid: "diagonal" }); - const { theme } = useTheme(); +// const { theme } = useTheme(); - const svgMap = map.getSVG({ - radius: 0.22, - color: theme === "dark" ? "#FFFFFF40" : "#00000040", - shape: "circle", - backgroundColor: theme === "dark" ? "black" : "white", - }); +// const svgMap = map.getSVG({ +// radius: 0.22, +// color: theme === "dark" ? "#FFFFFF40" : "#00000040", +// shape: "circle", +// backgroundColor: theme === "dark" ? "black" : "white", +// }); - const projectPoint = (lat: number, lng: number) => { - const x = (lng + 180) * (800 / 360); - const y = (90 - lat) * (400 / 180); - return { x, y }; - }; +// const projectPoint = (lat: number, lng: number) => { +// const x = (lng + 180) * (800 / 360); +// const y = (90 - lat) * (400 / 180); +// return { x, y }; +// }; - const createCurvedPath = ( - start: { x: number; y: number }, - end: { x: number; y: number } - ) => { - const midX = (start.x + end.x) / 2; - const midY = Math.min(start.y, end.y) - 50; - return `M ${start.x} ${start.y} Q ${midX} ${midY} ${end.x} ${end.y}`; - }; +// const createCurvedPath = ( +// start: { x: number; y: number }, +// end: { x: number; y: number } +// ) => { +// const midX = (start.x + end.x) / 2; +// const midY = Math.min(start.y, end.y) - 50; +// return `M ${start.x} ${start.y} Q ${midX} ${midY} ${end.x} ${end.y}`; +// }; - return ( -
- world map - - {dots.map((dot, i) => { - const startPoint = projectPoint(dot.start.lat, dot.start.lng); - const endPoint = projectPoint(dot.end.lat, dot.end.lng); - return ( - - - - ); - })} +// return ( +//
+// world map +// +// {dots.map((dot, i) => { +// const startPoint = projectPoint(dot.start.lat, dot.start.lng); +// const endPoint = projectPoint(dot.end.lat, dot.end.lng); +// return ( +// +// +// +// ); +// })} - - - - - - - - +// +// +// +// +// +// +// +// - {dots.map((dot, i) => ( - - - - - - - - - - - - - - - - - ))} - -
- ); -} +// {dots.map((dot, i) => ( +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// ))} +// +//
+// ); +// } -- cgit v1.2.3-70-g09d2