Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions src/components/landing/CTAReg.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { Terminal, ArrowRight, Radio } from 'lucide-react';
import Link from 'next/link';

import animation from '@/src/animation';
import { trackRegisterClick } from '@/src/utils/trackRegisterClick';

const eventID = process.env.EVENT_ID || process.env.NEXT_PUBLIC_EVENT_ID;
const data = require(`../../data/${eventID}/index.json`);
Expand Down Expand Up @@ -52,6 +53,14 @@ const LandingJoinMissionControl = ({ UTMSource }: { UTMSource?: string }) => {
{/* Primary Action */}
<a
href={registerUrl}
target="_blank"
rel="noopener noreferrer"
onClick={(event) =>
trackRegisterClick(event, {
ctaLocation: UTMSource ? `cta_reg_${UTMSource}` : 'cta_reg',
url: registerUrl,
})
}
className="group relative px-8 py-4 bg-sky-digital text-black font-bold font-heading text-lg tracking-wider uppercase overflow-hidden"
>
<div className="absolute inset-0 bg-white translate-y-full group-hover:translate-y-0 transition-transform duration-300"></div>
Expand Down
29 changes: 26 additions & 3 deletions src/components/landing/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ if (typeof window !== 'undefined') {
import { AlertTriangle, Radio, Terminal, ChevronRight, Crosshair, Banknote, Users, ShieldCheck, Award, Zap } from 'lucide-react';

import animations from '../../animation';
import { trackRegisterClick } from '../../utils/trackRegisterClick';

const eventID = process.env.EVENT_ID || process.env.NEXT_PUBLIC_EVENT_ID;
const data = require(`../../data/${eventID}/index.json`);
Expand Down Expand Up @@ -356,8 +357,14 @@ const LandingHeader = () => {
<a
href="https://register.inctf.in"
target="_blank"
rel="noopener noreferrer"
className="bg-red-950/40 hover:bg-red-600 text-alert-crimson hover:text-white font-mono text-sm sm:text-base font-bold tracking-wider px-9 py-3 sm:px-14 sm:py-3.5 rounded-md border-2 border-alert-crimson hover:border-red-600 shadow-[0_0_12px_rgba(244,63,94,0.3)] hover:shadow-[0_0_20px_rgba(244,63,94,0.6)] transition-all duration-300 flex items-center justify-center uppercase mt-1 register-btn opacity-70 hover:opacity-100"
onClick={() => { if (typeof window !== 'undefined' && (window as any).gtag) (window as any).gtag('event', 'register_cta_click', { cta_location: 'countdown' }); }}
onClick={(event) =>
trackRegisterClick(event, {
ctaLocation: 'countdown',
url: 'https://register.inctf.in',
})
}
>
REGISTER NOW
</a>
Expand Down Expand Up @@ -398,9 +405,25 @@ const LandingHeader = () => {
<div className="mt-2 pt-2 border-t border-sky-digital/10 flex flex-col items-center justify-center gap-1.5">
<div className="text-[10px] font-mono text-cyan-400/60 uppercase tracking-widest text-center">Powered by TCS & Co-Powered by NIQ</div>
<div className="flex items-center gap-5">
<img src="/inctf/assets/images/current_sponsors/Tata_Consultancy_Services_old_logo.svg.png" alt="TCS Logo" className="h-10 sm:h-14 w-auto object-contain brightness-0 invert opacity-90" />
<a
href="https://www.tcs.com/"
target="_blank"
rel="noopener noreferrer"
aria-label="Visit TCS"
className="transition-opacity duration-300 hover:opacity-100"
>
<img src="/inctf/assets/images/current_sponsors/Tata_Consultancy_Services_old_logo.svg.png" alt="TCS Logo" className="h-10 sm:h-14 w-auto object-contain brightness-0 invert opacity-90" />
</a>
<div className="w-[2px] h-8 bg-white/20"></div>
<img src="/inctf/assets/images/current_sponsors/NIQ-logo-bright-blue-web.png" alt="NIQ Logo" className="h-7 sm:h-10 w-auto object-contain brightness-0 invert opacity-90" />
<a
href="https://nielseniq.com/"
target="_blank"
rel="noopener noreferrer"
aria-label="Visit NIQ"
className="transition-opacity duration-300 hover:opacity-100"
>
<img src="/inctf/assets/images/current_sponsors/NIQ-logo-bright-blue-web.png" alt="NIQ Logo" className="h-7 sm:h-10 w-auto object-contain brightness-0 invert opacity-90" />
</a>
</div>
</div>
</SectionCard>
Expand Down
12 changes: 9 additions & 3 deletions src/components/shared/TopBar/MobileMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import styled from '@emotion/styled';
import Link from 'next/link';

import SocialMediaLinks from '../SocialMediaLinks';
import { trackRegisterClick } from '../../../utils/trackRegisterClick';
import { ChevronDown, ChevronUp, X } from 'lucide-react';

const SideBarMenu = styled.div`
Expand Down Expand Up @@ -120,10 +121,15 @@ const MobileMenu = ({ onClose, config }) => {
{cta && (
<Link
href={cta.link || '#'}
onClick={() => {
target="_blank"
rel="noopener noreferrer"
onClick={(event) => {
onClose?.();
if (typeof window !== 'undefined' && (window as any).gtag) {
(window as any).gtag('event', 'register_cta_click', { cta_location: 'mobile_nav' });
if (cta.link) {
trackRegisterClick(event, {
ctaLocation: 'mobile_nav',
url: cta.link,
});
}
}}
className="block w-full"
Expand Down
19 changes: 11 additions & 8 deletions src/components/shared/TopBar/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import Modal from 'react-modal';
import { clearAllBodyScrollLocks } from 'body-scroll-lock';

import Logo from '../Logo';
import { trackRegisterClick } from '../../../utils/trackRegisterClick';

import MobileMenu from './MobileMenu';
import TopBarSearch from './search';
Expand Down Expand Up @@ -312,10 +313,11 @@ const TopBar = ({ UTMSource = null }) => {
<Link
href={topbarConfig?.CTA?.link}
target="_blank"
onClick={() => {
if (typeof window !== 'undefined' && (window as any).gtag) {
(window as any).gtag('event', 'register_cta_click', { cta_location: 'top_bar' });
}
onClick={(event) => {
trackRegisterClick(event, {
ctaLocation: 'top_bar',
url: topbarConfig?.CTA?.link,
});
}}
>
<span className="px-6 py-2 rounded-none border border-alert-crimson bg-alert-crimson/10 text-alert-crimson font-bold font-tactical uppercase tracking-wider hover:bg-alert-crimson hover:text-white transition-all duration-300 ml-3 shadow-[0_0_10px_rgba(244,63,94,0.25)] hover:shadow-[0_0_25px_rgba(244,63,94,0.6)] cursor-pointer inline-flex items-center">
Expand Down Expand Up @@ -353,10 +355,11 @@ const TopBar = ({ UTMSource = null }) => {
href={topbarConfig.CTA.link}
target="_blank"
className="px-3 py-1 border border-alert-crimson bg-alert-crimson/10 text-alert-crimson font-bold uppercase tracking-wider text-xs rounded-none hover:bg-alert-crimson hover:text-white transition-all duration-300"
onClick={() => {
if (typeof window !== 'undefined' && (window as any).gtag) {
(window as any).gtag('event', 'register_cta_click', { cta_location: 'top_bar_mobile' });
}
onClick={(event) => {
trackRegisterClick(event, {
ctaLocation: 'top_bar_mobile',
url: topbarConfig.CTA.link,
});
}}
>
Register
Expand Down
57 changes: 57 additions & 0 deletions src/utils/trackRegisterClick.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import type { MouseEvent } from 'react';

type RegisterClickOptions = {
ctaLocation: string;
url: string;
target?: '_blank' | '_self';
};

const NAVIGATION_FALLBACK_DELAY_MS = 500;

export function trackRegisterClick(
event: MouseEvent<HTMLAnchorElement>,
{ ctaLocation, url, target = '_blank' }: RegisterClickOptions,
) {
if (typeof window === 'undefined') {
return;
}

const isModifiedClick = event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0;
if (isModifiedClick) {
return;
}

const navigate = () => {
if (target === '_self') {
window.location.assign(url);
return;
}

window.open(url, '_blank', 'noopener,noreferrer');
};

if (typeof window.gtag !== 'function') {
return;
}

event.preventDefault();

let hasNavigated = false;

const navigateOnce = () => {
if (hasNavigated) {
return;
}

hasNavigated = true;
navigate();
};

window.gtag('event', 'register_cta_click', {
cta_location: ctaLocation,
transport_type: 'beacon',
event_callback: navigateOnce,
});

window.setTimeout(navigateOnce, NAVIGATION_FALLBACK_DELAY_MS);
}
Loading