Skip to content

Commit

Permalink
Merge pull request #27 from Team5599/main
Browse files Browse the repository at this point in the history 
Merge update #2
  • Loading branch information
@DeveloperBlue
DeveloperBlue authored Jan 5, 2024
2 parents 375196a + 2f41944 commit 910e2a0
Show file tree
Hide file tree
Showing 18 changed files with 354 additions and 199 deletions.
2 changes: 1 addition & 1 deletion app/Sponsors/page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -218,7 +218,7 @@ export default function SponsorsPage() {
}}
>
<h3>
A Special Thanks to our Sponsors!
A Special Thanks to Our Sponsors!
</h3>
<p>
Thanks to their generous support, we are able to provide more opportunities for our students.
Expand Down
Binary file added app/app-icons/apple-icon.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.
Binary file added app/app-icons/icon.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.
Binary file added app/app-icons/icon2.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.
Binary file added app/app-icons/icon3.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.
Binary file added app/app-icons/icon4.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.
179 changes: 62 additions & 117 deletions app/components/CountdownTimer/CountdownTimer.jsx
View file

Large diffs are not rendered by default.

107 changes: 55 additions & 52 deletions app/components/FIRSTSection/FIRSTSection.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@ import styles from './firstSection.module.css';
import CountdownTimer from '../CountdownTimer/CountdownTimer';
import { ButtonLink } from '@components/Button/Button';

import { TwitchPlayer, TwitchChat } from 'react-twitch-embed';

import { AnimationOnScroll } from 'react-animation-on-scroll';
import "animate.css/animate.min.css";

Expand All @@ -21,9 +23,15 @@ const FIRSTSectionButton = ({label, href = '/', target = ''}) => {
)
}

const targetDate = new Date('January 6, 2024 12:00:00');
const targetDate = new Date('January 6, 2024 12:00:00 EST');
const embedDisabledDate = new Date('January 13, 2024, 12:00:00 EST')
// const targetDate = new Date('January 4, 2024 23:15:00 EST');


const FIRSTSection = () => {

const date_TODAY = new Date();

return (
<div className='container' style={{display: 'flex', flexDirection : 'column', paddingTop : 120, paddingBottom : 120, gap : 10}}>

Expand Down Expand Up @@ -69,67 +77,62 @@ const FIRSTSection = () => {
</div>
</div>

<CountdownTimer
date={targetDate}
style={{
marginTop : 80
}}
renderHeader={
(
<div
style={{
textAlign : 'center',
maxWidth : 600
}}
>
<h1 style={{
fontWeight : 700
}}>
KICKOFF 2024
</h1>
<span>
Tune in Saturday, January 6th at 12:00PM Noon EST for the 2024 FIRST Robotics Competition Kickoff Event!
</span>
</div>
)
}
renderComplete={
(
<div
style={{
display : 'flex',
gap : 80,
marginTop : 80,
marginBottom : 0
}}
>
{
(embedDisabledDate.getTime() > date_TODAY.getTime()) &&
<CountdownTimer
date={targetDate}
style={{
marginTop : 80
}}
renderHeader={
(
<div
style={{
flex : 3
textAlign : 'center',
maxWidth : 600
}}
>
<h2 style={{
fontWeight : 900
<h1 style={{
fontWeight : 700
}}>
KICKOFF 2024
</h2>
</h1>
<span>
Tune in Saturday, January 6th at 12:00PM Noon EST for the 2024 FIRST Robotics Competition Kickoff Event!
</span>
</div>
<div
style={{flex : 1}}
>
<ButtonLink
label={'Watch on Twitch.tv/FirstInspires'}
href={'https://www.twitch.tv/firstinspires'}
className={styles.firstSectionButton}
/>
</div>
</div>
)
}
/>
)
}
renderComplete={
(
<div className={styles.bodyContainer} style={{aspectRatio : '4.25 / 1.7', marginTop : 10}}>
<div className={styles.contentContainer} style={{ display : 'flex', flexDirection : 'column', gap : '0.6rem', height : '100%'}}>
<TwitchPlayer
channel="firstinspires"
darkMode={false}
autoplay={true}
className={styles.twitchEmbed}
style={{
width : '100%',
height : '100%'
}}
/>
</div>
<div className={`${styles.buttonContainer} ${styles.twitchChatEmbedContainer}`} style={{height : '100%'}}>
<TwitchChat
channel="firstinspires"
darkMode={true}
autoplay={true}
className={styles.twitchEmbed}
style={{width : '100%', height : '100%'}}
/>
</div>
</div>

)
}
/>
}
</div>
)
}
Expand Down
13 changes: 11 additions & 2 deletions app/components/FIRSTSection/firstSection.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,13 +18,14 @@
}

.buttonContainer {
flex : 1;
flex : 1.1;
display: flex;
flex-direction: column;
gap : 20px;
}



.firstSectionButton {
color : #fff;
text-transform: uppercase;
Expand All @@ -42,14 +43,18 @@

.bodyContainer {
flex-direction: column;
gap: 40px;
gap: 20px;
}

.titleContainer > img {
width : 120px;
height : 70px;
}

.twitchChatEmbedContainer {
display : none;
}

.firstSectionButton {
font-size: 1.4rem;
}
Expand Down Expand Up @@ -78,6 +83,10 @@
font-size: 1rem;
}

.twitchChatEmbedContainer {
display : none;
}

.firstSectionButton {
font-size: 1.2rem;
height : 80px;
Expand Down
8 changes: 7 additions & 1 deletion app/components/Footer/Footer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,6 +81,9 @@ const FooterAboutColumn = () => {


const Footer = () => {

const date_NOW = new Date();

return <div style={{display : 'flex', flexDirection : 'column', justifyContent : 'center'}}>
<FooterTriangleTop/>
<div className={styles.footer}>
Expand Down Expand Up @@ -170,9 +173,12 @@ const Footer = () => {
<Link href={'/404'}>
<span>Site Map</span>
</Link>
<Link href={'https://legacy.team5599.com/'}>
<span>Legacy Site</span>
</Link>
</div>
<span className={styles.footerBottomCopyright}>
© 2023 Michael Rooplall © FRC Team 5599 The Sentinels
© {date_NOW.getFullYear()} Michael Rooplall © FRC Team 5599 The Sentinels
</span>
</div>
</div>
Expand Down
2 changes: 2 additions & 0 deletions app/components/Footer/footer.module.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,11 @@
}

.footerBottomLinks {
display: flex;
flex : 3;
margin-right: calc(40px * 2); /* Column gap * unaccounted for columns */
font-size : 0.8rem;
gap : 10px;
}

.footerBottomCopyright {
Expand Down
80 changes: 78 additions & 2 deletions app/components/Sponsorship/SponsorMarquee/SponsorMarquee.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ const getSponsorsData = async () => {

try {
const res = await fetch(
`${process.env.NEXT_PUBLIC_API_BASE}/api/v1/sponsors/current`,
`${process.env.NEXT_PUBLIC_API_BASE}/api/v1/sponsors`,
{
method: 'GET'
}
Expand All @@ -44,8 +44,30 @@ const getSponsorsData = async () => {

}

function moveElementsToEndOfArray(arr, x) {

let n = arr.length;

// if x is greater than length
// of the array
x = x % n;

let first_x_elements = arr.slice(0, x);

let remaining_elements = arr.slice(x, n);

// Destructuring to create the desired array
arr = [...remaining_elements, ...first_x_elements];

return arr;
}


const SponsorMarquee = ({sponsorSize = 64}) => {

const dateNow = new Date();
const currentSeason = (dateNow.getMonth() < 8 ? dateNow.getFullYear() - 1 : dateNow.getFullYear());

const [sponsorsData, setSponsorsData] = useState([]);

useEffect(() => {
Expand All @@ -57,6 +79,11 @@ const SponsorMarquee = ({sponsorSize = 64}) => {
// Get SponsorsData
let sponsorsData = await getSponsorsData();

// Filter for current season
sponsorsData = sponsorsData.filter((sponsorData) => {
return (sponsorData.seasons.includes(currentSeason.toString()));
})

// Preload images and get their dimensions
const sponsorImageMetadata = await Promise.allSettled(
sponsorsData.map((sponsorData) => getImageDimensionsFromURL(sponsorData.id, sponsorData.srcURL))
Expand Down Expand Up @@ -88,12 +115,15 @@ const SponsorMarquee = ({sponsorSize = 64}) => {
return (sponsorData.hasOwnProperty('metadata'));
})


setSponsorsData(sponsorsData);

})();

}, [])

console.log("Marquee data", sponsorsData);

return (
<div
style={{
Expand All @@ -105,12 +135,58 @@ const SponsorMarquee = ({sponsorSize = 64}) => {
}}
>
<div>
<Marquee
style={{
backgroundColor : '#fff',
minHeight : 120,
paddingTop : 20,
paddingBottom : 0,
}}
>
{
moveElementsToEndOfArray([...sponsorsData], 2).map((sponsorData) => {
if (sponsorData.destinationURL !== undefined && sponsorData.destinationURL.replace(/ /g, "") !== "") {
return <Link
key={sponsorData.name}
data-tooltip-id="tooltip" data-tooltip-content={sponsorData.name}
href={sponsorData.destinationURL}
target='blank'
style={{
marginLeft : 40,
marginRight : 40
}}
>
<Image
src={sponsorData.srcURL}
alt={sponsorData.name}
unoptimized
height={sponsorSize}
width={sponsorData.metadata.columnWeight * sponsorSize}
/>
</Link>
}
return <Image
data-tooltip-id="tooltip" data-tooltip-content={sponsorData.name}
key={sponsorData.name}
src={sponsorData.srcURL}
alt={sponsorData.name}
unoptimized
height={sponsorSize}
width={sponsorData.metadata.columnWeight * sponsorSize}
style={{
marginLeft : 40,
marginRight : 40
}}
/>
})
}
</Marquee>
<Marquee
style={{
backgroundColor : '#fff',
minHeight : 120,
paddingTop : 40,
paddingBottom : 20,
paddingBottom : 0,
}}
>
{
Expand Down
Loading

0 comments on commit 910e2a0

Please sign in to comment.