Skip to content

Commit

Permalink
update to award alexa
Browse files Browse the repository at this point in the history
  • Loading branch information
@vtnorton
vtnorton committed Oct 16, 2024
1 parent 868e564 commit f5859c2
Show file tree
Hide file tree
Showing 4 changed files with 52 additions and 61 deletions.
Binary file added public/alexa-user.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 3 additions & 10 deletions src/app/dashboard/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

import React from "react";
import Image from "next/image";
import atariImg from "../../../public/atari-user.png";
import atariImg from "../../../public/alexa-user.png";
import qrcode from "../../../public/qrcode_events.superviz.com.png";
import Activations from "@/components/Activations";
import UsersDashboard from "@/components/UsersDashboard";
Expand Down Expand Up @@ -53,14 +53,7 @@ export default function Dashboard() {
className="tv:w-[13.5rem] object-contain"
/>
<h1 className="font-black mt-[2rem] text-7xl tv:mt-[4rem] tv:text-[9.5rem] tv:leading-[10.5rem]">
Ganhe um LEGO
<span className="text-3xl tv:text-[5rem] tv:leading-[6rem] align-top">
®{" "}
</span>
do Atari
<span className="text-3xl tv:text-[5rem] tv:leading-[6rem] align-top">
®
</span>
Ganhe um Echo Dot 5ª Geração
</h1>
<div className="text-3xl mt-[3.125rem] tv:mt-[6.25rem] tv:text-[4rem] tv:leading-[5.5rem]">
<p>Participe de qualquer ativação e ganhe pontos para concorrer.</p>
Expand All @@ -74,7 +67,7 @@ export default function Dashboard() {
</div>
<Image
src={atariImg}
alt="Imagem de um Lego da Fender"
alt="Imagem de um Echo Dot 5ª Geração"
className="z-0 absolute bottom-[2.5rem] tv:bottom-[5rem] left-0 max-w-[27vw] object-contain"
/>
<div className="user-canva flex flex-col bg-[#C9C4D114] py-10 rounded-[2rem] min-w-[100.375rem] tv:py-20 tv:rounded-[4rem] tv:min-w-[75%] grow">
Expand Down
93 changes: 46 additions & 47 deletions src/app/giveaway/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

import Button from "@/components/Button";
import React, { useMemo } from "react";
import {sortWinner} from "@/app/services/sortWinner";
import { sortWinner } from "@/app/services/sortWinner";
import Image from "next/image";
import fenderImg from "../../../public/fender-lego-right.png";
import winnerBadge from "../../../public/winner-badge.png";
Expand All @@ -18,77 +18,76 @@ enum giveAwayStatus {
}

export default function Sorter() {
const [ giveAway, setGiveAway ] = React.useState(giveAwayStatus.UNSORTED)
const [ winner, setWinner] = React.useState({
const [giveAway, setGiveAway] = React.useState(giveAwayStatus.UNSORTED)
const [winner, setWinner] = React.useState({
email: '',
user: '',
coupon: '',
})

const handleClick = async () => {
setGiveAway(giveAwayStatus.SORTING)
const response = await sortWinner()

setWinner({
email: response.user.email,
user: response.user.name,
coupon: response.coupon.activation,
})
}

const handleVideoEnd = () => {
setGiveAway(giveAwayStatus.SORTED)

}

return (
<>
{
giveAway === giveAwayStatus.SORTED && <Confetti width={window?.innerWidth} height={window?.innerHeight} />
}
{
giveAway === giveAwayStatus.SORTED && <Confetti width={window?.innerWidth} height={window?.innerHeight} />
}
<div id="confettiReward" className={`bgTv w-full h-screen grid grid-cols-2`}>
<div className={`col-span-1 h-screen flex flex-col relative justify-center items-center`}>
<Image src="/logo-sm.svg" width={108} height={20} alt="Logo Superviz" className="w-[13.5rem] object-contain absolute top-[7.5rem] left-[7.5rem]" />
{giveAway !== giveAwayStatus.SORTED && (
<div className={`flex flex-col justify-center items-center giveawayButton`}>
<h1 className="font-black text-[12.25rem] leading-[13.5rem] mb-[10rem] text-center">
Sorteio <br/>LEGO<span className="text-[6rem] leading-[13.5rem] align-super">® </span>
Fender<span className="text-[6rem] leading-[13.5rem] align-super">®</span>
</h1>
{giveAway === giveAwayStatus.UNSORTED && (
<Button text={`Sortear`} type={`button`}
onClick={handleClick}/>
)}
{giveAway === giveAwayStatus.SORTING && (
<video autoPlay width={`580`} onEnded={handleVideoEnd}>
<source src={`/contador-v3.mp4`} type={`video/mp4`} />
</video>
)}
</div>
)}
{giveAway === giveAwayStatus.SORTED && (
<div className={`flex flex-col justify-center items-center giveaway`}>
<p className={`text-[4rem] font-bold mb-[4rem]`}>Parabéns!</p>
<Image src={winnerBadge} alt={`Badge de ganhador`} />
<div className={'flex items-center flex-col'}>
<p className={`mt-[4.5rem] text-[9.7rem] text-[#957AFF] font-black break-words max-w-[100rem] text-center`}>
{`{ `}
<span id="confettiReward" className={`text-[8.75rem] text-white`}>{winner.user}</span>
{` }`}
</p>
<p className={`mt-[4.5rem] text-[9.7rem] text-[#957AFF] font-black break-words max-w-[100rem] text-center`}>
<span className={`text-[2.75rem] text-white`}>{winner.email}</span>
</p>
</div>
<p className={'font-bold text-[4rem] mt-[7.5rem]'}>🎟️ Cupom sorteado: {winner.coupon}</p>
</div>
)}
{giveAway !== giveAwayStatus.SORTED && (
<div className={`flex flex-col justify-center items-center giveawayButton`}>
<h1 className="font-black text-[12.25rem] leading-[13.5rem] mb-[10rem] text-center">
Sorteio <br />Echo Dot 5ª Geração
</h1>
{giveAway === giveAwayStatus.UNSORTED && (
<Button text={`Sortear`} type={`button`}
onClick={handleClick} />
)}
{giveAway === giveAwayStatus.SORTING && (
<video autoPlay width={`580`} onEnded={handleVideoEnd}>
<source src={`/contador-v3.mp4`} type={`video/mp4`} />
</video>
)}
</div>
)}
{giveAway === giveAwayStatus.SORTED && (
<div className={`flex flex-col justify-center items-center giveaway`}>
<p className={`text-[4rem] font-bold mb-[4rem]`}>Parabéns!</p>
<Image src={winnerBadge} alt={`Badge de ganhador`} />
<div className={'flex items-center flex-col'}>
<p className={`mt-[4.5rem] text-[9.7rem] text-[#957AFF] font-black break-words max-w-[100rem] text-center`}>
{`{ `}
<span id="confettiReward" className={`text-[8.75rem] text-white`}>{winner.user}</span>
{` }`}
</p>
<p className={`mt-[4.5rem] text-[9.7rem] text-[#957AFF] font-black break-words max-w-[100rem] text-center`}>
<span className={`text-[2.75rem] text-white`}>{winner.email}</span>
</p>
</div>
<p className={'font-bold text-[4rem] mt-[7.5rem]'}>🎟️ Cupom sorteado: {winner.coupon}</p>
</div>
)}
</div>
<div className={`bg-[#957AFF] col-span-1 m-10 rounded-[4rem] relative`}>
<Image src={fenderImg} alt="Imagem de um Lego da Fender" className="absolute top-0 right-0 object-contain" />
<Image src={fenderImg} alt="Imagem de um Echo Dot 5ª Geração" className="absolute top-0 right-0 object-contain" />
</div>
</div>
</>

)
}
7 changes: 3 additions & 4 deletions src/app/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

import React from 'react';
import Image from "next/image";
import atariImg from '../../public/atari-user.png'
import img from '../../public/alexa-user.png'
import Button from "@/components/Button";
import { useRouter } from "next/navigation";

Expand All @@ -26,14 +26,13 @@ export default function App() {
<div className="flex flex-col items-center">
<Image src="./logo-sm.svg" width={109} height={80} alt="Logo Superviz" />
<h1 className="title-lego mt-6 text-[64px]/[70px] font-black text-center">
Ganhe um LEGO<span className="text-3xl align-top">® </span>
da Atari<span className="text-3xl align-top">®</span>
Ganhe um Echo Dot 5ª Geração
</h1>
</div>
<Button text="Participar" onClick={handleParticipate} type="button" />

</div>
<Image src={atariImg} alt="Imagem de um Lego do Atari" className="atari" />
<Image src={img} alt="Imagem de um Echo Dot 5ª Geração" className='atari' />
</div>
);
};

0 comments on commit f5859c2

Please sign in to comment.