Seasonal changes!
diff --git a/Components/Header.js b/Components/Header.js
index b89c0e0..f526591 100644
--- a/Components/Header.js
+++ b/Components/Header.js
@@ -34,76 +34,6 @@
function Header(props) {
const keys = Object.keys(props.effects ?? {});
- const changingSubtextEffect = keys.includes("changingSubtext");
- const typedEffect = keys.includes("type") || changingSubtextEffect;
-
-
- const [ clickTotal, setClickTotal ] = React.useState(0);
- const [ currText, setCurrentText ] = React.useState(typedEffect ? "" : (props.subtext ?? ""));
- const [ hasRendered, setHasRendered ] = React.useState(false);
-
- function typeText(currentText, toType) {
- let count = 0;
- let interval = setInterval(() => {
- setCurrentText(currentText + toType.substring(0, count));
- count++;
- if (count > toType.length) {
- clearInterval(interval);
- }
- }, props.effects.type ?? 50);
- return currentText + toType
- }
-
- function unTypeText(currentText, amount) {
- let count = 0;
- const permanentText = currentText.slice(0, currentText.length - amount);
- let toRemove = currentText.slice(currentText.length - amount, currentText.length);
- let interval = setInterval(() => {
- toRemove = toRemove.slice(0, toRemove.length - 1);
- setCurrentText(permanentText + toRemove);
- count++;
- if (count >= amount) {
- clearInterval(interval);
- }
- }, 500 / amount);
- return permanentText;
- }
-
- function startAnimations() {
- setHasRendered(true);
- if (!changingSubtextEffect && typedEffect) return typeText("", props.subtext);
- if (changingSubtextEffect && typedEffect) {
- let lastPicked = -1;
- function selectNextString() {
- if (Math.floor(Math.random() * 100) === 0) {
- return props.effects.changingSubtext.rare[Math.floor(Math.random() * props.effects.changingSubtext.rare.length)];
- }
- let selectedIndex = lastPicked
- while (selectedIndex === lastPicked) {
- selectedIndex = Math.floor(Math.random() * props.effects.changingSubtext.common.length);
- }
- lastPicked = selectedIndex;
- return props.effects.changingSubtext.common[selectedIndex];
- }
- let nextString = selectNextString();
- let currentText = typeText("", props.subtext + nextString);
- setTimeout(() => {
- function next() {
- setTimeout(() => {
- setTimeout(() => {
- nextString = selectNextString();
- currentText = typeText(currentText, nextString);
- }, 1000);
- currentText = unTypeText(currentText, nextString.length);
- }, 4000);
- }
- next()
- setInterval(() => {
- next()
- }, 5000);
- }, 3000);
- }
- }
const { reward: reward, isAnimating: isAnimating } = useReward('headerConfetti', 'confetti', {
elementSize: 10,
@@ -128,6 +58,7 @@
const all = positive.concat(negative)
const [imagesPreloaded, setImagesPreloaded] = useState(false)
+ const [clickTotal, setClickTotal] = useState(0)
useEffect(() => {
let isCancelled = false
async function effect() {
@@ -175,8 +106,6 @@
}
}
- if (!hasRendered) startAnimations();
-
return (
<div className={Styles.header} style={{
margin: "0",
@@ -222,8 +151,7 @@
<h1 className={Styles.title}>{props.name}</h1>
</div>
<div className={Styles.textBar}>
- <p className={Styles.subtext + " " + (props.buttons.length ? Styles.subtextExtra : null)}>{currText}</p>
- { typedEffect ? <div className={Styles.typedEffect} /> : <></> }
+ <p className={Styles.subtext + " " + (props.buttons.length ? Styles.subtextExtra : null)}>{props.subtext}</p>
</div>
<a href="#skipNav" id="skipNav" style={{display: "none"}} />
{ props.buttons.length ?
diff --git a/Components/NavBar.js b/Components/NavBar.js
index 6ea02c9..0b81c84 100644
--- a/Components/NavBar.js
+++ b/Components/NavBar.js
@@ -1,6 +1,7 @@
import React, { Component } from "react";
import Styles from '../styles/Components/navbar.module.css';
import ThemeChangeButton from './ThemeChangeButton';
+import { getSeason } from '../pages/api/season';
class Divider extends Component {
render() {
@@ -18,17 +19,18 @@
}
render() {
+ const season = getSeason().filePath;
return (
<div className={Styles.cutoffContainer}>
<div className={Styles.container + " " + (this.props.subBar ? Styles.slideUp : null)}>
<a href="#skipNav" className={Styles.skipNav}>Skip navigation</a>
<a className={Styles.icon} href="/"><img alt="Clicks" className={Styles.icon} src="https://assets.clicks.codes/web/logos/clicks.svg" /></a>
<Divider />
- <a className={Styles.icon} href="/gps"><img alt="GPS" className={Styles.icon} src="https://assets.clicks.codes/bots/gps/circle.svg" /></a>
- <a className={Styles.icon} href="/rsm"><img alt="RSM" className={Styles.icon} src="https://assets.clicks.codes/bots/rsm/circle.svg" /></a>
- {/* <a className={Styles.icon} href="/nucleus#"><img alt="Nucleus" className={Styles.icon} src="https://assets.clicks.codes/bots/nucleus/circle.svg" /></a> */}
- <a className={Styles.icon} href="/clicksforms"><img alt="ClicksForms" className={Styles.icon} src="https://assets.clicks.codes/bots/clicksforms/circle.svg" /></a>
- <a className={Styles.icon} href="/hooky"><img alt="Hooky" className={Styles.icon} src="https://assets.clicks.codes/bots/hooky/circle.svg" /></a>
+ <a className={Styles.icon} href="/gps"><img alt="GPS" className={Styles.icon} src={`https://assets.clicks.codes/bots/gps/${season}.svg`} /></a>
+ <a className={Styles.icon} href="/rsm"><img alt="RSM" className={Styles.icon} src={`https://assets.clicks.codes/bots/rsm/${season}.svg`} /></a>
+ {/* <a className={Styles.icon} href="/nucleus#"><img alt="Nucleus" className={Styles.icon} src={`https://assets.clicks.codes/bots/nucleus/${season}.svg`} /></a> */}
+ <a className={Styles.icon} href="/clicksforms"><img alt="ClicksForms" className={Styles.icon} src={`https://assets.clicks.codes/bots/clicksforms/${season}.svg`} /></a>
+ <a className={Styles.icon} href="/hooky"><img alt="Hooky" className={Styles.icon} src={`https://assets.clicks.codes/bots/hooky/${season}.svg`} /></a>
<Divider />
<ThemeChangeButton/>
</div>