"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import BlogCardTwo from '@/components/sections/blog/BlogCardTwo';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';

export default function LandingPage() {
  const navItems = [
    {
      name: "Home",      id: "#home"
    },
    {
      name: "About",      id: "#about"
    },
    {
      name: "Skills",      id: "#skills"
    },
    {
      name: "Projects",      id: "#featured-projects"
    },
    {
      name: "Blog",      id: "#blog"
    },
    {
      name: "Contact",      id: "/contact"
    }
  ];

  const footerColumns = [
    {
      title: "Quick Links",      items: [
        {
          label: "Home",          href: "/"
        },
        {
          label: "About",          href: "/#about"
        },
        {
          label: "Skills",          href: "/#skills"
        }
      ]
    },
    {
      title: "Projects",      items: [
        {
          label: "Featured Projects",          href: "/#featured-projects"
        },
        {
          label: "Full Portfolio",          href: "/#project-gallery"
        },
        {
          label: "Devlog",          href: "/#blog"
        }
      ]
    },
    {
      title: "Connect",      items: [
        {
          label: "Contact Me",          href: "/contact"
        },
        {
          label: "LinkedIn",          href: "https://linkedin.com/in/jayrao"
        },
        {
          label: "GitHub",          href: "https://github.com/jayrao"
        }
      ]
    }
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="largeSizeMediumTitles"
      background="noiseDiagonalGradient"
      cardStyle="outline"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleFullscreen
            navItems={navItems}
            logoSrc="http://img.b2bpic.net/free-vector/futuristic-samurai-skull-esports-gaming-logo_779267-3639.jpg"
            logoAlt="Jay Rao Logo"
            brandName="Jay Rao"
            bottomLeftText="Aspiring Game Dev"
            bottomRightText="connect@jayrao.dev"
          />
        </div>

        <div id="home" data-section="home">
          <HeroBillboardRotatedCarousel
            background={{
              variant: "rotated-rays-animated"
            }}
            title="Jay Rao: Crafting Worlds, Building Dreams."
            description="An aspiring game developer and college student passionate about creating immersive experiences through innovative design and cutting-edge technology."
            buttons={[
              {
                text: "Explore My Projects",                href: "#featured-projects"
              },
              {
                text: "Connect with Me",                href: "/contact"
              }
            ]}
            carouselItems={[
              {
                id: "hero-carousel-1",                imageSrc: "http://img.b2bpic.net/free-photo/fantasy-landscape-floating-islands-illustration_23-2151844189.jpg",                imageAlt: "Fantastical RPG Game World"
              },
              {
                id: "hero-carousel-2",                imageSrc: "http://img.b2bpic.net/free-photo/futuristic-representation-city-built-on-water_23-2151048129.jpg",                imageAlt: "Cyberpunk City Skyline"
              },
              {
                id: "hero-carousel-3",                imageSrc: "http://img.b2bpic.net/free-photo/fantasy-house-moon-illustration_23-2151627936.jpg",                imageAlt: "Space Combat Scene"
              },
              {
                id: "hero-carousel-4",                imageSrc: "http://img.b2bpic.net/free-photo/view-white-puzzle-pieces-brown-background_23-2149299094.jpg",                imageAlt: "Indie Puzzle Game"
              },
              {
                id: "hero-carousel-5",                imageSrc: "http://img.b2bpic.net/free-photo/isometric-view-3d-rendering-city_23-2150900857.jpg",                imageAlt: "Medieval Town Square"
              },
              {
                id: "hero-carousel-6",                imageSrc: "http://img.b2bpic.net/free-photo/haunted-house-gothic-style_23-2151626603.jpg",                imageAlt: "Horror Game Mansion"
              }
            ]}
            autoPlay={true}
            autoPlayInterval={4000}
          />
        </div>

        <div id="about" data-section="about">
          <TextSplitAbout
            useInvertedBackground={true}
            title="A Journey in Game Development"
            description={[
              "I'm Jay Rao, a passionate game developer and college student, driven by a lifelong fascination with interactive storytelling and digital worlds. My journey began with a curiosity for how games are made, evolving into a dedicated pursuit of mastering the craft.",              "My academic background in computer science provides a strong foundation in programming and algorithms, while hands-on experience with game engines like Unreal Engine and Blender allows me to bring creative visions to life. I believe in continuous learning, constantly exploring new technologies and design methodologies to push the boundaries of game development."
            ]}
            buttons={[
              {
                text: "Download Resume",                href: "http://img.b2bpic.net/free-photo/notebook-icon-front-side-with-white-background_187299-39912.jpg"
              }
            ]}
            buttonAnimation="slide-up"
          />
        </div>

        <div id="skills" data-section="skills">
          <FeatureCardSeven
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            features={[
              {
                title: "Unreal Engine",                description: "Mastery in game logic, Blueprint scripting, C++ integration, and advanced rendering techniques.",                imageSrc: "http://img.b2bpic.net/free-vector/luxury-logo-gradient-design-illustrations_483537-1292.jpg",                imageAlt: "Unreal Engine Logo"
              },
              {
                title: "Blender 3D",                description: "Proficient in 3D modeling, sculpting, texturing, animation, and rendering for game assets.",                imageSrc: "http://img.b2bpic.net/free-photo/view-futuristic-light-lamp-design_23-2151037634.jpg",                imageAlt: "Blender Logo"
              },
              {
                title: "Game Design",                description: "Expertise in crafting compelling mechanics, level design, narrative, and player experience.",                imageSrc: "http://img.b2bpic.net/free-photo/social-media-still-life-items-top-view_23-2149019129.jpg",                imageAlt: "Game Design Icon"
              },
              {
                title: "C++ / C#",                description: "Strong programming skills for engine development, gameplay systems, and robust application logic.",                imageSrc: "http://img.b2bpic.net/free-photo/closeup-computer-screen-software-developer-typing-programming-language-it-startup-agency-display-concept-system-engineer-writing-source-code-scrolling-text-database-functions-script_482257-33355.jpg",                imageAlt: "Programming Icon"
              }
            ]}
            title="My Toolkit for Innovation"
            description="Proficient in leading game development tools and methodologies, constantly expanding my expertise to tackle new creative and technical challenges."
          />
        </div>

        <div id="featured-projects" data-section="featured-projects">
          <ProductCardThree
            animationType="slide-up"
            textboxLayout="default"
            gridVariant="bento-grid"
            useInvertedBackground={true}
            carouselMode="buttons"
            products={[
              {
                id: "proj-nebula",                name: "Project Nebula",                price: "RPG",                imageSrc: "http://img.b2bpic.net/free-photo/galaxy-planets-digital-art_23-2151727646.jpg",                imageAlt: "Screenshot from Project Nebula"
              },
              {
                id: "proj-echoes",                name: "Echoes of Aethel",                price: "Adventure",                imageSrc: "http://img.b2bpic.net/free-photo/spooky-forest-dark-mysterious-full-horror-generated-by-ai_188544-26063.jpg",                imageAlt: "Concept art for Echoes of Aethel"
              },
              {
                id: "proj-cyberheist",                name: "Cyber Heist",                price: "Stealth Puzzle",                imageSrc: "http://img.b2bpic.net/free-photo/isometric-view-3d-rendering-neon-city_23-2150900829.jpg",                imageAlt: "Gameplay from Cyber Heist"
              },
              {
                id: "proj-mecharena",                name: "Mech Arena",                price: "Action",                imageSrc: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151128048.jpg",                imageAlt: "Screenshot from Mech Arena"
              },
              {
                id: "proj-magictower",                name: "Magic Tower Defense",                price: "Strategy",                imageSrc: "http://img.b2bpic.net/free-photo/mythical-video-game-inspired-landscape-with-human-castle_23-2150974569.jpg",                imageAlt: "Screenshot from Magic Tower Defense"
              },
              {
                id: "proj-western",                name: "Dusty Trails",                price: "Open World",                imageSrc: "http://img.b2bpic.net/free-photo/colourful-mexican-house_23-2151769281.jpg",                imageAlt: "Screenshot from Dusty Trails"
              }
            ]}
            title="Featured Creations"
            description="Showcasing my most impactful projects, each reflecting a unique blend of technical mastery, innovative design, and creative problem-solving."
          />
        </div>

        <div id="project-gallery" data-section="project-gallery">
          <ProductCardThree
            animationType="slide-up"
            textboxLayout="default"
            gridVariant="three-columns-all-equal-width"
            useInvertedBackground={false}
            carouselMode="buttons"
            products={[
              {
                id: "gal-survival",                name: "Wasteland Survival",                price: "Survival",                imageSrc: "http://img.b2bpic.net/free-photo/darkly-atmospheric-retail-environment-rendering_23-2151153759.jpg",                imageAlt: "Screenshot from Wasteland Survival"
              },
              {
                id: "gal-racing",                name: "Neon Velocity",                price: "Racing",                imageSrc: "http://img.b2bpic.net/free-photo/batmobile-concept-car-with-neon-lights_23-2151649844.jpg",                imageAlt: "Screenshot from Neon Velocity"
              },
              {
                id: "gal-platformer",                name: "Whimsical Wanderer",                price: "Platformer",                imageSrc: "http://img.b2bpic.net/free-photo/rendering-cartoon-fantasy-scene-illustration_23-2151150852.jpg",                imageAlt: "Screenshot from Whimsical Wanderer"
              },
              {
                id: "gal-horror",                name: "Silent Halls",                price: "Horror",                imageSrc: "http://img.b2bpic.net/free-photo/hand-sticking-out-ground-fog_23-2147898934.jpg",                imageAlt: "Screenshot from Silent Halls"
              },
              {
                id: "gal-puzzle",                name: "Geometric Flow",                price: "Puzzle",                imageSrc: "http://img.b2bpic.net/free-photo/missing-white-jigsaw-puzzle-yellow-frame-blue-background_23-2147873460.jpg",                imageAlt: "Screenshot from Geometric Flow"
              },
              {
                id: "gal-citybuilder",                name: "Eternal Empire",                price: "City Builder",                imageSrc: "http://img.b2bpic.net/free-photo/cartoon-comic-style-earthquake-scene_23-2151789060.jpg",                imageAlt: "Screenshot from Eternal Empire"
              }
            ]}
            title="Full Project Portfolio"
            description="A broader look at my diverse range of game development projects, from early prototypes to polished experiences, highlighting different genres and challenges."
          />
        </div>

        <div id="achievements" data-section="achievements">
          <MetricCardSeven
            animationType="depth-3d"
            textboxLayout="default"
            useInvertedBackground={true}
            carouselMode="buttons"
            metrics={[
              {
                id: "metric-years",                value: "3+",                title: "Years of Experience",                items: [
                  "Self-taught & academic",                  "Diverse projects"
                ]
              },
              {
                id: "metric-projects",                value: "10+",                title: "Projects Completed",                items: [
                  "Variety of genres",                  "Individual & team efforts"
                ]
              },
              {
                id: "metric-jams",                value: "2",                title: "Game Jams Won",                items: [
                  "Award-winning designs",                  "Rapid prototyping skills"
                ]
              }
            ]}
            title="My Journey & Milestones"
            description="Celebrating key achievements, learning milestones, and the continuous growth that defines my path in game development."
          />
        </div>

        <div id="testimonials" data-section="testimonials">
          <TestimonialCardSixteen
            animationType="depth-3d"
            textboxLayout="default"
            useInvertedBackground={false}
            carouselMode="auto"
            testimonials={[
              {
                id: "test-1",                name: "Dr. Anya Sharma",                role: "Game Design Professor",                company: "University of Tech",                rating: 5,
                imageSrc: "http://img.b2bpic.net/free-photo/expressive-young-boy-posing-studio_176474-76386.jpg",                imageAlt: "Dr. Anya Sharma"
              },
              {
                id: "test-2",                name: "Ethan Vance",                role: "Lead Developer",                company: "Quantum Play Studios",                rating: 5,
                imageSrc: "http://img.b2bpic.net/free-photo/modern-man-using-table-couch_23-2147986088.jpg",                imageAlt: "Ethan Vance"
              },
              {
                id: "test-3",                name: "Chloe Wong",                role: "Indie Game Designer",                company: "Pixel Dreams Co.",                rating: 5,
                imageSrc: "http://img.b2bpic.net/free-photo/person-working-animation-porject_23-2149269908.jpg",                imageAlt: "Chloe Wong"
              },
              {
                id: "test-4",                name: "Marcus Bell",                role: "Project Lead",                company: "Nova Interactive",                rating: 5,
                imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-joyful-black-multiplier-blinks-with-eyes_273609-43895.jpg",                imageAlt: "Marcus Bell"
              },
              {
                id: "test-5",                name: "Sophia Rodriguez",                role: "Mentor & Artist",                company: "Digital Canvas Lab",                rating: 5,
                imageSrc: "http://img.b2bpic.net/free-photo/concentrated-gamer-looking-camera-while-playing-space-shooter-online-video-game-rgb-powerful-personal-computer-egames-championship-esport-cyber-performing-gaming-tournament_482257-12498.jpg",                imageAlt: "Sophia Rodriguez"
              }
            ]}
            kpiItems={[
              {
                value: "5/5",                label: "Collaboration Rating"
              },
              {
                value: "95%",                label: "Project Success"
              },
              {
                value: "100%",                label: "Dedication"
              }
            ]}
            title="What My Collaborators Say"
            description="Hear from peers, mentors, and collaborators about my dedication, skills, and collaborative spirit in game development."
          />
        </div>

        <div id="blog" data-section="blog">
          <BlogCardTwo
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={true}
            title="Devlog & Insights"
            description="Documenting my game development journey, sharing technical insights, project updates, and reflections on the ever-evolving world of gaming."
            blogs={[
              {
                id: "blog-1",                category: "Technical Insight",                title: "Optimizing Game Performance in Unreal Engine",                excerpt: "A deep dive into common bottlenecks and advanced optimization techniques for smoother gameplay.",                imageSrc: "http://img.b2bpic.net/free-photo/freelancer-home-wearing-vr-goggles-using-augmented-reality-visualize-final-result-after-working-machinery-construction-using-cad-engineering-software-computer-developing-engine-product_482257-67895.jpg",                imageAlt: "Unreal Engine optimization",                authorName: "Jay Rao",                authorAvatar: "http://img.b2bpic.net/free-vector/futuristic-samurai-skull-esports-gaming-logo_779267-3639.jpg",                date: "July 24, 2024"
              },
              {
                id: "blog-2",                category: "Art & Design",                title: "Procedural Generation in Blender for Game Assets",                excerpt: "Exploring the power of procedural workflows to create dynamic and varied game environments with Blender.",                imageSrc: "http://img.b2bpic.net/free-photo/3d-fantasy-scene_23-2151128004.jpg",                imageAlt: "Blender procedural generation",                authorName: "Jay Rao",                authorAvatar: "http://img.b2bpic.net/free-vector/futuristic-samurai-skull-esports-gaming-logo_779267-3639.jpg",                date: "July 15, 2024"
              },
              {
                id: "blog-3",                category: "Journey",                title: "My First Game Jam: Lessons Learned and Triumphs",                excerpt: "A personal reflection on the intensity, creativity, and invaluable lessons gained from my inaugural game jam.",                imageSrc: "http://img.b2bpic.net/free-photo/side-view-people-playing-videogames_23-2149349982.jpg",                imageAlt: "Game jam collaboration",                authorName: "Jay Rao",                authorAvatar: "http://img.b2bpic.net/free-vector/futuristic-samurai-skull-esports-gaming-logo_779267-3639.jpg",                date: "July 01, 2024"
              }
            ]}
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterBase
            columns={footerColumns}
            logoText="Jay Rao"
            copyrightText="© 2024 Jay Rao. All rights reserved."
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
