diff --git a/src/assets/images/Traitors_Gambit/detective.jpeg b/src/assets/images/Traitors_Gambit/detective.jpeg new file mode 100644 index 0000000..2755989 Binary files /dev/null and b/src/assets/images/Traitors_Gambit/detective.jpeg differ diff --git a/src/assets/images/Traitors_Gambit/detectivebg.jpeg b/src/assets/images/Traitors_Gambit/detectivebg.jpeg new file mode 100644 index 0000000..f902afc Binary files /dev/null and b/src/assets/images/Traitors_Gambit/detectivebg.jpeg differ diff --git a/src/assets/images/Traitors_Gambit/fadedleftfoot.png b/src/assets/images/Traitors_Gambit/fadedleftfoot.png new file mode 100644 index 0000000..0811928 Binary files /dev/null and b/src/assets/images/Traitors_Gambit/fadedleftfoot.png differ diff --git a/src/assets/images/Traitors_Gambit/fadedrightfoot.png b/src/assets/images/Traitors_Gambit/fadedrightfoot.png new file mode 100644 index 0000000..77daf1f Binary files /dev/null and b/src/assets/images/Traitors_Gambit/fadedrightfoot.png differ diff --git a/src/assets/images/Traitors_Gambit/leftfoot.png b/src/assets/images/Traitors_Gambit/leftfoot.png new file mode 100644 index 0000000..c7d900a Binary files /dev/null and b/src/assets/images/Traitors_Gambit/leftfoot.png differ diff --git a/src/assets/images/Traitors_Gambit/logo.png b/src/assets/images/Traitors_Gambit/logo.png new file mode 100644 index 0000000..28d5dc6 Binary files /dev/null and b/src/assets/images/Traitors_Gambit/logo.png differ diff --git a/src/assets/images/Traitors_Gambit/rightfoot.png b/src/assets/images/Traitors_Gambit/rightfoot.png new file mode 100644 index 0000000..6469654 Binary files /dev/null and b/src/assets/images/Traitors_Gambit/rightfoot.png differ diff --git a/src/assets/images/Traitors_Gambit/robber1.jpeg b/src/assets/images/Traitors_Gambit/robber1.jpeg new file mode 100644 index 0000000..4034b90 Binary files /dev/null and b/src/assets/images/Traitors_Gambit/robber1.jpeg differ diff --git a/src/assets/images/Traitors_Gambit/robber2.jpeg b/src/assets/images/Traitors_Gambit/robber2.jpeg new file mode 100644 index 0000000..73be9d7 Binary files /dev/null and b/src/assets/images/Traitors_Gambit/robber2.jpeg differ diff --git a/src/assets/images/Traitors_Gambit/robberbg.jpeg b/src/assets/images/Traitors_Gambit/robberbg.jpeg new file mode 100644 index 0000000..144207f Binary files /dev/null and b/src/assets/images/Traitors_Gambit/robberbg.jpeg differ diff --git a/src/pages/TraitorsGambit/index.jsx b/src/pages/TraitorsGambit/index.jsx new file mode 100644 index 0000000..7c0099b --- /dev/null +++ b/src/pages/TraitorsGambit/index.jsx @@ -0,0 +1,283 @@ +import { useState } from "react"; +import PropTypes from "prop-types"; +import PageTransition from "@/components/PageTransition"; +import TraitorsGambitLogo from "../../assets/images/Traitors_Gambit/logo.png"; +import RobberBackground from "../../assets/images/Traitors_Gambit/robberbg.jpeg"; +import RobberImage from "../../assets/images/Traitors_Gambit/robber1.jpeg"; +import DetectiveBackground from "../../assets/images/Traitors_Gambit/detectivebg.jpeg"; +import DetectiveImage from "../../assets/images/Traitors_Gambit/detective.jpeg"; + +function GradientTextSVG({ text, width, height, fontSize, gradientColors }) { + return ( + + + + + + + + + {text} + + + ); +} + +GradientTextSVG.propTypes = { + text: PropTypes.string.isRequired, + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + fontSize: PropTypes.number.isRequired, + gradientColors: PropTypes.arrayOf(PropTypes.string).isRequired, +}; + +GradientTextSVG.propTypes = { + text: PropTypes.string.isRequired, + width: PropTypes.number.isRequired, + height: PropTypes.number.isRequired, + fontSize: PropTypes.number.isRequired, + gradientColors: PropTypes.arrayOf(PropTypes.string).isRequired, +}; + +export default function TraitorsGambit() { + const gradientFontSize = 80; + + // Hashtags (hidden until revealed) + const hashtags = [ + "#£~+hee37!;bd", + "#dontclickonme😱", + "#thisisasecretlmao", + "#pacodexaammp", + "#Tibmagsrotiart", + "#coder", + "#event", + "#foryou", + "#foryoupage", + "#trending", + "#explorepage", + "#nextbigthing", + ]; + + // Map of words to hashtags (randomly assigned) + const wordHashtagMap = { + vanish: hashtags[2], // #thisisasecretlmao + chaos: hashtags[0], // #£~+hee37!;bd + riddles: hashtags[1], // #dontclickonme😱 + circuits: hashtags[3], // #pacodexaammp + beams: hashtags[4], // #Tibmagsrotiart + crew: hashtags[5], // #coder + grid: hashtags[6], // #event + patterns: hashtags[7], // #foryou + signals: hashtags[8], // #foryoupage + shadows: hashtags[9], // #trending + stash: hashtags[10], // #explorepage + seconds: hashtags[11], // #nextbigthing + }; + + // Popup state + const [showPopup, setShowPopup] = useState(false); + const [popupHashtag, setPopupHashtag] = useState(""); + + // Handler for word click + const handleWordClick = (hashtag) => { + setPopupHashtag(hashtag); + setShowPopup(true); + }; + + // Helper to wrap words in a span if they are in the map + const highlightWords = (text) => { + const wordInstanceCount = {}; + return text.split(/(\b)/).map((word) => { + const cleanWord = word.replace(/[^a-zA-Z]/g, ""); + if (wordHashtagMap[cleanWord]) { + wordInstanceCount[cleanWord] = (wordInstanceCount[cleanWord] || 0) + 1; + return ( + handleWordClick(wordHashtagMap[cleanWord])} + role="button" + tabIndex={0} + onKeyDown={(e) => { + if (e.key === "Enter" || e.key === " ") + handleWordClick(wordHashtagMap[cleanWord]); + }} + > + {word} + + ); + } + return word; + }); + }; + + return ( + +
+ {/* Section 1 - Event Details */} +
+
+ +
+ +
+ Traitor's Gambit Logo +
+ +
+
+ Date: 19th - 20th September, 2025 +
+
+ Venue: Computer Lab 9 - 10, 4th floor, B wing +
+
+ Timings: 10:30 am to 4:00 pm +
+
+
+ + {/* Section 2 - Robbers */} +
+ Robber Background +
+
+

+ Robbers: +

+ Robber +
+ +
+
+

+ {highlightWords( + "Slip through codes, chase hidden signals, dodge beams, and leave chaos in your wake.", + )} +

+ +

+ {highlightWords( + "Your mission? Find the stash before anyone else does.", + )} +

+ +

+ {highlightWords( + "Bring your crew of 3 - 4, think fast, move faster, and remember: every second counts.", + )} +

+
+
+
+
+ {/* Section 3 - Detectives */} +
+ Detective Background +
+
+

+ Detectives: +

+ Detective +
+
+
+

+ {highlightWords( + "Follow trails that vanish in plain sight, piece together fractured patterns, and outsmart shifting circuits.", + )} +

+ +

+ {highlightWords( + "Your mission? Track down the stash before it's too late.", + )} +

+ +

+ {highlightWords( + "Assemble your crew of 3-4, crack the riddles, guard the grid, and stop the shadows.", + )} +

+
+
+
+ {/* Popup Modal */} + {showPopup && ( +
+
+ {popupHashtag} + +
+
+ )} +
+
+ + ); +} diff --git a/src/routes/index.jsx b/src/routes/index.jsx index 6df7300..c730f5b 100644 --- a/src/routes/index.jsx +++ b/src/routes/index.jsx @@ -6,7 +6,7 @@ import Contact from "@/pages/Contact"; import PageNotFound from "../pages/PageNotFound"; import Loader from "@/components/Loader"; import Events from "../pages/Events"; -import Bug2Bot from "../pages/Bug2Bot"; +import TraitorsGambit from "../pages/TraitorsGambit"; const routes = [ { @@ -58,10 +58,10 @@ const routes = [ render: , }, { - label: "Bug2Bot", + label: "TraitorsGambit", path: "/symbitech2025", requireAuth: false, - render: , + render: , }, ];