datalore/buzzword-bingo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

feat: Implemented LPT Bingo

Browse Source
This commit is contained in:
datalore 2024-02-17 12:45:53 +01:00
parent 53105dfcfe
commit 7d9ca6bdd5
3 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/app/components/bingocontroller.tsx
View File

@ -14,8 +14,9 @@ function FisherYatesShuffle(array:string[]):string[]{
return array;
}
export default function BingoController({buzzwords} : {buzzwords?: string[]}){
const [size, setSize] = React.useState(5);
export default function BingoController({buzzwords, maxSize} : {buzzwords?: string[], maxSize?: number}){
if(maxSize == undefined) maxSize = 5;
const [size, setSize] = React.useState(maxSize!);
if(buzzwords == undefined || buzzwords.length < 1) buzzwords = ["Cloud", "Cyber-[Something]", "Distrupt[ive]", "AI", "Meta [Something]", "Gamification", "Web 2.0/3.0", "Industry 4.0", "Internet of Things", "Multiexperience", "Big Data", "Crypto", "[Something] as a service", "Emerging [Something]", "Streamline", "Ecosystem", "Leverage", "Outside the Box", "Pivot", "Strategic", "Agile", "Smart Tech", "Data Warehouse", "Actionable Insights", "Holistic Approach", "Digital Transformation", "Growth Hacking"];
const [items, setItems] = React.useState(buzzwords);
const sizeError = (items.length < size);
@ -24,7 +25,7 @@ export default function BingoController({buzzwords} : {buzzwords?: string[]}){
<div className="w-3/4 flex flex-col m-auto gap-4">
<Bingo size={size} items={items}/>
<form className="w-1/3 m-auto">
<input type="range" min={3} max={5} value={size} className="range range-xs sm:range-sm md:range-md range-secondary" step={1} onChange={({target:{value:s}}) => setSize(+s)}/>
<input type="range" min={3} max={maxSize!} value={size} className="range range-xs sm:range-sm md:range-md range-secondary" step={1} onChange={({target:{value:s}}) => setSize(+s)}/>
<div className="w-full flex justify-between text-sm px-2 mb-2">
<span>3x3</span>
<span>4x4</span>

2
src/app/components/bingoitem.tsx
View File

@ -9,6 +9,6 @@ export default function BingoItem({text}: Props){
const [clicked, setClicked] = React.useState(false);
return(
<td><a className={clsx("btn btn-xs sm:btn-sm md:btn-md w-full", {"btn-ghost":(!clicked)}, {"btn-accent":clicked})} onClick={() => setClicked(!clicked)}>{text}</a></td>
<td><a className={clsx("text-xs btn btn-xs sm:btn-sm md:btn-md w-full", {"btn-ghost":(!clicked)}, {"btn-accent":clicked})} onClick={() => setClicked(!clicked)}>{text}</a></td>
);
}

8
src/app/lpt/page.tsx Normal file
View File

@ -0,0 +1,8 @@
import BingoController from '../components/bingocontroller'
export default function Home(){
const buzzwords = ["Ohne Frieden ist alles nichts", "KW muss die Wahlordnung nochmal erklären", "Die Pizza ist da", "Stefan pöbelt", "Mareike pöbelt zurück", "Jemand überzieht die Redezeit", "Machentanz knallt die Tür zu", "GO-Antrag zur Mittagspause", "GO-Antrag zum GO-Antrag", "Mehrere Für-/Gegenreden", "Rita Krüger redet", "Ins Mikrofon schreien"];
return(
<BingoController buzzwords={buzzwords} maxSize={3} />
);
}