diff --git a/public/images/chef_spices.png b/public/images/chef_spices.png new file mode 100644 index 0000000..e4c2e7b Binary files /dev/null and b/public/images/chef_spices.png differ diff --git a/src/components/ChefShowcase.tsx b/src/components/ChefShowcase.tsx index 586afbd..327757f 100644 --- a/src/components/ChefShowcase.tsx +++ b/src/components/ChefShowcase.tsx @@ -1,35 +1,37 @@ "use client"; -import { useEffect, useRef, useState } from "react"; -import { motion, AnimatePresence } from "framer-motion"; +import { useEffect, useRef } from "react"; +import { motion } from "framer-motion"; import Image from "next/image"; -import { Sparkles, Flame, ShieldAlert } from "lucide-react"; + +const ChefLotusOrnament = () => ( + + + + + + + + +); + +const StoryLotusDivider = () => ( +
+
+ + + + + +
+
+); export default function ChefShowcase() { const canvasRef = useRef(null); const containerRef = useRef(null); - const [activeSpice, setActiveSpice] = useState(0); - // Spices database - const spices = [ - { - name: "Tellicherry Black Pepper", - role: "The Emperor of Heat", - desc: "Sourced from the high ranges of Malabar, these late-harvest vine berries provide a complex, fruity heat rather than a sharp sting, forming the backbone of our chettinad gravies.", - }, - { - name: "Green Cardamom", - role: "The Floral Note", - desc: "Harvested from the slopes of the Western Ghats. Cardamom pods are split by hand at dawn to capture the volatile essential oils that impart sweet floral notes to our Payasam.", - }, - { - name: "Star Anise", - role: "The Licorice Sweetness", - desc: "Imported since ancient times through maritime trade. It releases a warming, woody-licorice fragrance when roasted dry on iron pans for our heritage rice dishes.", - }, - ]; - - // Sparks and Embers Canvas Animation + // Sparks and Embers Canvas Animation (Overlaying chef image) useEffect(() => { const canvas = canvasRef.current; if (!canvas) return; @@ -37,8 +39,8 @@ export default function ChefShowcase() { if (!ctx) return; let animId: number; - let width = (canvas.width = canvas.parentElement?.clientWidth || 500); - let height = (canvas.height = canvas.parentElement?.clientHeight || 600); + let width = (canvas.width = canvas.parentElement?.clientWidth || 450); + let height = (canvas.height = canvas.parentElement?.clientHeight || 560); const handleResize = () => { if (!canvas.parentElement) return; @@ -58,23 +60,22 @@ export default function ChefShowcase() { color: string; constructor() { - // start near the bottom-center of the image (simulating cooking pan) - this.x = width * 0.5 + (Math.random() - 0.5) * 150; - this.y = height * 0.75 + (Math.random() - 0.5) * 50; - this.vx = (Math.random() - 0.5) * 1.5; - this.vy = -Math.random() * 2.5 - 1.0; - this.size = Math.random() * 2.5 + 1.0; - this.maxLife = Math.random() * 80 + 40; + // Start near the bottom-center of the cooking thali image + this.x = width * 0.5 + (Math.random() - 0.5) * 160; + this.y = height * 0.78 + (Math.random() - 0.5) * 40; + this.vx = (Math.random() - 0.5) * 1.6; + this.vy = -Math.random() * 2.8 - 1.2; + this.size = Math.random() * 2.2 + 1.2; + this.maxLife = Math.random() * 90 + 50; this.life = 0; - this.color = Math.random() > 0.4 ? "243, 229, 171" : "230, 126, 34"; // Gold or Orange sparks + this.color = Math.random() > 0.4 ? "244, 180, 26" : "230, 92, 23"; // Gold or Fire sparks } update() { this.x += this.vx; this.y += this.vy; this.life++; - // Add draft wind effect - this.vx += (Math.random() - 0.5) * 0.1; + this.vx += (Math.random() - 0.5) * 0.12; } draw(c: CanvasRenderingContext2D) { @@ -82,7 +83,7 @@ export default function ChefShowcase() { c.save(); c.beginPath(); c.fillStyle = `rgba(${this.color}, ${opacity})`; - c.shadowBlur = 8; + c.shadowBlur = 6; c.shadowColor = `rgb(${this.color})`; c.arc(this.x, this.y, this.size, 0, Math.PI * 2); c.fill(); @@ -91,17 +92,15 @@ export default function ChefShowcase() { } const embers: Ember[] = []; - const maxEmbers = 40; + const maxEmbers = 45; const render = () => { ctx.clearRect(0, 0, width, height); - // Spawn new embers - if (embers.length < maxEmbers && Math.random() > 0.4) { + if (embers.length < maxEmbers && Math.random() > 0.35) { embers.push(new Ember()); } - // Update and draw embers for (let i = embers.length - 1; i >= 0; i--) { const e = embers[i]; e.update(); @@ -126,114 +125,262 @@ export default function ChefShowcase() { return (
-
+ {/* Background Subtle Traditional Overlay */} +
+ +
- {/* Left Side: Chef Info & Spice Selection */} -
- - T H E M A S T E R A L C H E M I S T - + {/* Main 2-Column Info & Portrait Header */} +
-

- CHEF SUNDARAM
- - IYER + {/* Left Column: Chef Details */} +
+ +
+ + + — OUR MASTER CHEF — + +
+ +

+ CHEF
+ SUNDARAM
+ + IYER + + + + + + +

+ + + Heritage. Passion. Perfection. -

- -

- With three decades of culinary devotion, Chef Sundaram has traversed the villages of Tamil Nadu, - uncovering regional temple recipes and masterfully blending heritage masalas. He believes that true - gastronomy is a spiritual act, uniting soil, tradition, and warm wood fire. -

- {/* Interactive Spice Guide Wrapper */} -
-
-

- Heritage Spice Altar -

+ - {/* Spice Tabs Selector */} -
- {spices.map((spice, idx) => ( - - ))} +

+ With three decades of culinary devotion, Chef Sundaram Iyer has traversed the villages of Tamil Nadu, uncovering regional temple recipes and masterfully blending heritage masalas. He believes that true gastronomy is a spiritual act, uniting soil, tradition, and warm wood fire. +

+ + {/* Cursive Signature */} +
+ + Sundaram Iyer +
- {/* Content pane with slide/fade animation */} -
- - - - {spices[activeSpice].role} - -

- {spices[activeSpice].name} -

-

- {spices[activeSpice].desc} -

-
-
-
+ + {/* Right Column: Chef Cooking Portrait with Overlay Badge */} +
+ + {/* 30+ Years Experience Badge Overlay */} +
+
+ {/* Gold Flower Icon */} + + + + 30+ + Years + Of Culinary Excellence +
+ + {/* Framed Image Container */} +
+ {/* Inner Double Gold Frame overlay */} +
+ + {/* Portrait Image */} +
+ Chef Sundaram Iyer Cooking with Fire +
+ + {/* Sparks/Embers Canvas Overlay */} + + + {/* Heat wave color gradient filter overlay */} +
+
+ +
+
- {/* Right Side: Chef Cooking Portrait with embers canvas */} -
+ {/* Middle Highlights Card Section */} +
- {/* Framed Image Container */} -
- {/* Brass Inner Frame Border */} -
- - {/* Action Portrait */} -
- Chef Sundaram Cooking with fire -
- - {/* Sparks/Embers Canvas Overlay */} - - - {/* Subtle heat wave distortion visual overlay */} -
+ {/* Feature 1: Authentic Recipes */} +
+ + + + + + +
Authentic Recipes
+

Traditional recipes passed down through generations.

+
+ + {/* Feature 2: Pure Vegetarian */} +
+ + + + + + +
Pure Vegetarian
+

100% pure veg, made with the finest natural ingredients.

+
+ + {/* Feature 3: Wood Fire Cooking */} +
+ + + +
Wood Fire Cooking
+

Infused with the aroma of wood fire and heritage.

+
+ + {/* Feature 4: Cooked With Love */} +
+ + + + +
Cooked With Love
+

Every dish is prepared with care, devotion & warmth.

+
+ +
+ + {/* Bottom Section: Quote on the Left & Spices Parchment Card on the Right */} +
+ + {/* Bottom Left: Gopuram Sketch Background & Large Narrative Quote */} +
+ {/* Gopuram Sketch watermark */} +
+ Heritage Gopuram Background Sketch +
+ + {/* Quote details */} +
+ +

+ Food is not just to satisfy hunger, it is to honor our roots, our culture and the land that nourishes us. +

+ + {/* Gold Ornament Divider */} +
+
+ + + +
+
+
+
+ + {/* Bottom Right: Spices Parchment Card */} +
+
+ + {/* Inner border line overlay */} +
+ + {/* Notched corners masks */} +
+
+
+
+ + {/* Text content details */} +
+ + — THE ESSENCE OF — + + +

+ Heritage Spices +

+ +

+ Handpicked spices from the best regions of India, blended with time-honored techniques to create unforgettable flavors. +

+ + {/* Explorer Button */} + +
+ + {/* Overlapping circular thali spices container */} +
+
+ {/* Banana leaf background */} +
+ + {/* Spices image */} +
+ South Indian Heritage Spices Platter +
+
+
+ +
- {/* Decorative Corner Filigrees outside */} -
-
+ + {/* Rooted Traditional Footer Banner */} +
+
+ + ❧ ROOTED IN TRADITION • DRIVEN BY PASSION • SERVED WITH LOVE ☙ + +
+
+
); }