94:I[903690,["/chat-static/_next/static/immutable/chunks/3ylj5670h8zr_.js","/chat-static/_next/static/immutable/chunks/39zn_d0r3svko.js","/chat-static/_next/static/immutable/chunks/0pphhapj-fw3x.js","/chat-static/_next/static/immutable/chunks/35uzh68pydp0v.js","/chat-static/_next/static/immutable/chunks/2ftikag4lqb8c.js","/chat-static/_next/static/immutable/chunks/43kd14la8rz_-.js","/chat-static/_next/static/immutable/chunks/2i0rpllg-4zvf.js","/chat-static/_next/static/immutable/chunks/3s8icn-bip0tj.js","/chat-static/_next/static/immutable/chunks/015t3ef19py76.js","/chat-static/_next/static/immutable/chunks/1nwzd05fjwfah.js","/chat-static/_next/static/immutable/chunks/3sctqn1914l5w.js","/chat-static/_next/static/immutable/chunks/1spqqj78e1ykn.js","/chat-static/_next/static/immutable/chunks/3ftzit08h08g2.js","/chat-static/_next/static/immutable/chunks/3ldgj5vn7sd9j.js","/chat-static/_next/static/immutable/chunks/3hyzknxyslfo7.js","/chat-static/_next/static/immutable/chunks/29-21_f000qe1.js","/chat-static/_next/static/immutable/chunks/2kv6vo--6ni6k.js","/chat-static/_next/static/immutable/chunks/2iifuow0qvsc-.js","/chat-static/_next/static/immutable/chunks/02_tyxb_2ub3k.js","/chat-static/_next/static/immutable/chunks/2w4tj5qrgmz4d.js","/chat-static/_next/static/immutable/chunks/25nk5m2byvzk9.js","/chat-static/_next/static/immutable/chunks/2yzca_tnqvjec.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/09itepgh-7q9f.js","/chat-static/_next/static/immutable/chunks/0-ec22_yqmzcc.js","/chat-static/_next/static/immutable/chunks/44bhef7a7u-7e.js","/chat-static/_next/static/immutable/chunks/0l_1eejseha66.js","/chat-static/_next/static/immutable/chunks/1-csp0uzup6br.js","/chat-static/_next/static/immutable/chunks/3-80--tl5_i_3.js","/chat-static/_next/static/immutable/chunks/1_0--72vfkr3d.js","/chat-static/_next/static/immutable/chunks/3q-6iwjlz2gxz.js","/chat-static/_next/static/immutable/chunks/022gnoebsh94r.js","/chat-static/_next/static/immutable/chunks/108tnhrfmf7_s.js","/chat-static/_next/static/immutable/chunks/3kdmq0aswvxp8.js","/chat-static/_next/static/immutable/chunks/0d6t47olbp1a6.js","/chat-static/_next/static/immutable/chunks/18jlbprnfbhgc.js","/chat-static/_next/static/immutable/chunks/1zvijznvbabvr.js","/chat-static/_next/static/immutable/chunks/1cs_9ye6hwibc.js","/chat-static/_next/static/immutable/chunks/27vhedzlts1-t.js","/chat-static/_next/static/immutable/chunks/1y-s_5v3gpgrs.js","/chat-static/_next/static/immutable/chunks/3cox-6-gj2koz.js","/chat-static/_next/static/immutable/chunks/03zfcg27aso3w.js"],"ExplicitChatIdProvider"] 95:I[838238,["/chat-static/_next/static/immutable/chunks/3ylj5670h8zr_.js","/chat-static/_next/static/immutable/chunks/39zn_d0r3svko.js","/chat-static/_next/static/immutable/chunks/0pphhapj-fw3x.js","/chat-static/_next/static/immutable/chunks/35uzh68pydp0v.js","/chat-static/_next/static/immutable/chunks/2ftikag4lqb8c.js","/chat-static/_next/static/immutable/chunks/43kd14la8rz_-.js","/chat-static/_next/static/immutable/chunks/2i0rpllg-4zvf.js","/chat-static/_next/static/immutable/chunks/3s8icn-bip0tj.js","/chat-static/_next/static/immutable/chunks/015t3ef19py76.js","/chat-static/_next/static/immutable/chunks/1nwzd05fjwfah.js","/chat-static/_next/static/immutable/chunks/3sctqn1914l5w.js","/chat-static/_next/static/immutable/chunks/1spqqj78e1ykn.js","/chat-static/_next/static/immutable/chunks/3ftzit08h08g2.js","/chat-static/_next/static/immutable/chunks/3ldgj5vn7sd9j.js","/chat-static/_next/static/immutable/chunks/3hyzknxyslfo7.js","/chat-static/_next/static/immutable/chunks/29-21_f000qe1.js","/chat-static/_next/static/immutable/chunks/2kv6vo--6ni6k.js","/chat-static/_next/static/immutable/chunks/2iifuow0qvsc-.js","/chat-static/_next/static/immutable/chunks/02_tyxb_2ub3k.js","/chat-static/_next/static/immutable/chunks/2w4tj5qrgmz4d.js","/chat-static/_next/static/immutable/chunks/25nk5m2byvzk9.js","/chat-static/_next/static/immutable/chunks/2yzca_tnqvjec.js","/chat-static/_next/static/immutable/chunks/00hu8fdgh1j4v.js","/chat-static/_next/static/immutable/chunks/09itepgh-7q9f.js","/chat-static/_next/static/immutable/chunks/0-ec22_yqmzcc.js","/chat-static/_next/static/immutable/chunks/44bhef7a7u-7e.js","/chat-static/_next/static/immutable/chunks/0l_1eejseha66.js","/chat-static/_next/static/immutable/chunks/1-csp0uzup6br.js","/chat-static/_next/static/immutable/chunks/3-80--tl5_i_3.js","/chat-static/_next/static/immutable/chunks/1_0--72vfkr3d.js","/chat-static/_next/static/immutable/chunks/3q-6iwjlz2gxz.js","/chat-static/_next/static/immutable/chunks/022gnoebsh94r.js","/chat-static/_next/static/immutable/chunks/108tnhrfmf7_s.js","/chat-static/_next/static/immutable/chunks/3kdmq0aswvxp8.js","/chat-static/_next/static/immutable/chunks/0d6t47olbp1a6.js","/chat-static/_next/static/immutable/chunks/18jlbprnfbhgc.js","/chat-static/_next/static/immutable/chunks/1zvijznvbabvr.js","/chat-static/_next/static/immutable/chunks/1cs_9ye6hwibc.js","/chat-static/_next/static/immutable/chunks/27vhedzlts1-t.js","/chat-static/_next/static/immutable/chunks/1y-s_5v3gpgrs.js","/chat-static/_next/static/immutable/chunks/3cox-6-gj2koz.js","/chat-static/_next/static/immutable/chunks/03zfcg27aso3w.js"],"SWRDataProvider"] 96:T2c17,[V0_FILE]typescriptreact:file="components/ui/canvas.tsx" isMerged="true" // @ts-ignore function n(e) { // @ts-ignore this.init(e || {}) } n.prototype = { // @ts-ignore init: function (e) { // @ts-ignore this.phase = e.phase || 0 // @ts-ignore this.offset = e.offset || 0 // @ts-ignore this.frequency = e.frequency || 0.001 // @ts-ignore this.amplitude = e.amplitude || 1 }, update: function () { return ( // @ts-ignore (this.phase += this.frequency), // @ts-ignore (e = this.offset + Math.sin(this.phase) * this.amplitude) ) }, value: () => e, } // @ts-ignore function Line(e) { // @ts-ignore this.init(e || {}) } Line.prototype = { // @ts-ignore init: function (e) { // @ts-ignore this.spring = e.spring + 0.1 * Math.random() - 0.05 // @ts-ignore this.friction = E.friction + 0.01 * Math.random() - 0.005 // @ts-ignore this.nodes = [] for (var t, n = 0; n < E.size; n++) { t = new Node() // @ts-ignore t.x = pos.x // @ts-ignore t.y = pos.y // @ts-ignore this.nodes.push(t) } }, update: function () { // @ts-ignore let e = this.spring, // @ts-ignore t = this.nodes[0] // @ts-ignore t.vx += (pos.x - t.x) * e // @ts-ignore t.vy += (pos.y - t.y) * e // @ts-ignore for (var n, i = 0, a = this.nodes.length; i < a; i++) // @ts-ignore (t = this.nodes[i]), 0 < i && // @ts-ignore ((n = this.nodes[i - 1]), (t.vx += (n.x - t.x) * e), (t.vy += (n.y - t.y) * e), (t.vx += n.vx * E.dampening), (t.vy += n.vy * E.dampening)), // @ts-ignore (t.vx *= this.friction), // @ts-ignore (t.vy *= this.friction), (t.x += t.vx), (t.y += t.vy), (e *= E.tension) }, draw: function () { let e, t, // @ts-ignore n = this.nodes[0].x, // @ts-ignore i = this.nodes[0].y // @ts-ignore ctx.beginPath() // @ts-ignore ctx.moveTo(n, i) // @ts-ignore for (var a = 1, o = this.nodes.length - 2; a < o; a++) { // @ts-ignore e = this.nodes[a] // @ts-ignore t = this.nodes[a + 1] n = 0.5 * (e.x + t.x) i = 0.5 * (e.y + t.y) // @ts-ignore ctx.quadraticCurveTo(e.x, e.y, n, i) } // @ts-ignore e = this.nodes[a] // @ts-ignore t = this.nodes[a + 1] // @ts-ignore ctx.quadraticCurveTo(e.x, e.y, t.x, t.y) // @ts-ignore ctx.stroke() // @ts-ignore ctx.closePath() }, } // @ts-ignore function onMousemove(e) { function o() { lines = [] for (let e = 0; e < E.trails; e++) lines.push(new Line({ spring: 0.45 + (e / E.trails) * 0.025 })) } // @ts-ignore function c(e) { e.touches ? // @ts-ignore ((pos.x = e.touches[0].pageX), (pos.y = e.touches[0].pageY)) : // @ts-ignore ((pos.x = e.clientX), (pos.y = e.clientY)), e.preventDefault() } // @ts-ignore function l(e) { // @ts-ignore 1 == e.touches.length && ((pos.x = e.touches[0].pageX), (pos.y = e.touches[0].pageY)) } document.removeEventListener("mousemove", onMousemove), document.removeEventListener("touchstart", onMousemove), document.addEventListener("mousemove", c), document.addEventListener("touchmove", c), document.addEventListener("touchstart", l), c(e), o(), render() } function render() { // @ts-ignore if (ctx.running) { // @ts-ignore ctx.globalCompositeOperation = "source-over" // @ts-ignore ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height) // @ts-ignore ctx.globalCompositeOperation = "lighter" // @ts-ignore ctx.strokeStyle = "hsla(" + Math.round(f.update()) + ",100%,50%,0.025)" // @ts-ignore ctx.lineWidth = 10 for (var e, t = 0; t < E.trails; t++) { // @ts-ignore ;(e = lines[t]).update() e.draw() } // @ts-ignore ctx.frame++ window.requestAnimationFrame(render) } } function resizeCanvas() { // @ts-ignore ctx.canvas.width = window.innerWidth - 20 // @ts-ignore ctx.canvas.height = window.innerHeight } // @ts-ignore var ctx, // @ts-ignore f, e = 0, pos = {}, // @ts-ignore lines = [], E = { debug: true, friction: 0.5, trails: 80, size: 50, dampening: 0.025, tension: 0.99, } function Node() { this.x = 0 this.y = 0 this.vy = 0 this.vx = 0 } export const renderCanvas = () => { // @ts-ignore ctx = document.getElementById("canvas").getContext("2d") ctx.running = true ctx.frame = 1 f = new n({ phase: Math.random() * 2 * Math.PI, amplitude: 85, frequency: 0.0015, offset: 285, }) document.addEventListener("mousemove", onMousemove) document.addEventListener("touchstart", onMousemove) document.body.addEventListener("orientationchange", resizeCanvas) window.addEventListener("resize", resizeCanvas) window.addEventListener("focus", () => { // @ts-ignore if (!ctx.running) { // @ts-ignore ctx.running = true render() } }) window.addEventListener("blur", () => { // @ts-ignore ctx.running = true }) resizeCanvas() } [V0_FILE]typescriptreact:file="components/ui/button.tsx" isMerged="true" import * as React from "react" import { Slot } from "@radix-ui/react-slot" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "@/lib/utils" const buttonVariants = cva( "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50", { variants: { variant: { default: "bg-primary text-primary-foreground hover:bg-primary/90", destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90", outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground", secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80", ghost: "hover:bg-accent hover:text-accent-foreground", link: "text-primary underline-offset-4 hover:underline", }, size: { default: "h-10 px-4 py-2", sm: "h-9 rounded-md px-3", lg: "h-11 rounded-md px-8", icon: "h-10 w-10", }, }, defaultVariants: { variant: "default", size: "default", }, }, ) export interface ButtonProps extends React.ButtonHTMLAttributes, VariantProps { asChild?: boolean } const Button = React.forwardRef( ({ className, variant, size, asChild = false, ...props }, ref) => { const Comp = asChild ? Slot : "button" return }, ) Button.displayName = "Button" export { Button, buttonVariants } [V0_FILE]typescriptreact:file="app/page.tsx" isMerged="true" import { Hero } from "@/components/hero" export default function Home() { return (

{/* Other components */}

) } [V0_FILE]typescriptreact:file="lib/utils.ts" isMerged="true" import { type ClassValue, clsx } from "clsx" import { twMerge } from "tailwind-merge" export function cn(...inputs: ClassValue[]) { return twMerge(clsx(inputs)) } [V0_FILE]typescriptreact:file="components/hero.tsx" isEdit="true" isQuickEdit="true" "use client" import { useEffect } from "react" import Link from "next/link" import Image from "next/image" import { renderCanvas } from "@/components/ui/canvas" import { Button } from "@/components/ui/button" import { Code2, Phone, Twitter } from "lucide-react" export function Hero() { useEffect(() => { renderCanvas() }, []) return (

Welcome to my portfolio

Building with AI

Follow me on X

Hi, I'm DonvitoCodes, a software developer

I'm passionate about tinkering with AI to build innovative applications that push the boundaries of what's possible. Follow me on X for AI development content and insights.

) } 8b:["$","$L94",null,{"chatId":"EBiWAvUiCjD","children":["$","$L95",null,{"data":{"@\"active-block\",\"EBiWAvUiCjD\",":{"id":"b_7u8c4rxAcm4","messageId":"1VQd2wDaKIffkzsBIKz2FxoGk1qRXaC2","source":"$96","language":"typescriptreact","type":"code-project","closed":true,"meta":{"id":"hero-animation","type":"code-project","project":"hero-animation"},"hasSourceBeenEdited":false,"forkedFromBlockId":"$undefined"},"@\"chat:vm-mode\",\"EBiWAvUiCjD\",":false},"children":"$L97"}]}]

About

Tags

Share

About

Tags

Share

More from donvito

More Templates Like This