Skip to content

Commit 8fca2cd

Browse files
rontaprontap
committed
Populism Game #10 changes from last year
1 parent 956abe2 commit 8fca2cd

File tree

16 files changed

+1906
-219
lines changed

16 files changed

+1906
-219
lines changed

‎games/populismatic/populismatic/package-lock.json‎

Lines changed: 1604 additions & 101 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎games/populismatic/populismatic/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
"preview": "vite preview"
1111
},
1212
"dependencies": {
13+
"@radix-ui/themes": "^3.1.6",
1314
"react": "^18.3.1",
1415
"react-dom": "^18.3.1"
1516
},

‎games/populismatic/populismatic/src/App.css‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -522,6 +522,12 @@ body {
522522
border-radius: 4px;
523523
text-align: left;
524524
padding: 4px 10px;
525+
transition: all .2s;
526+
}
527+
528+
.advisors:hover {
529+
background: #eee;
530+
border-color: #48F;
525531
}
526532

527533
#leader {

‎games/populismatic/populismatic/src/App.tsx‎

Lines changed: 82 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,18 @@
11
import React, {SyntheticEvent, useState} from 'react'
22
import './App.css'
33
import {Board, Faction, Run} from './Board.ts'
4-
import {Consumable, PowerupCtr} from "./components/Powerup.tsx";
4+
import {Consumable, KindDescriptions, PowerupCtr} from "./components/Powerup.tsx";
55
import {RandomShop} from "./Shop.tsx";
66
import LeaderJSX from "./components/Leader.tsx";
7-
import {Cell} from "./Cell.ts";
7+
import {Cell, Kind} from "./Cell.ts";
88
import {CellItem} from "./components/CellItem.tsx";
99
import Header from "./components/Header.tsx";
10+
import Share from "./components/Share.tsx";
11+
import {Party} from "./flavour.ts";
12+
import "@radix-ui/themes/styles.css";
13+
import {Theme} from "@radix-ui/themes";
1014

11-
const singleRun = new Run(42069);
15+
const singleRun = new Run(555);
1216
const baseBoard = new Board(singleRun);
1317

1418
export enum Stage {
@@ -106,78 +110,92 @@ function App() {
106110
"--faction-NAT": singleRun.parties[Faction.NAT].color + opacity,
107111
}
108112

113+
const kinds = Object.values(singleRun.modifiers.generation.kindShare)
114+
const parties = Object.values(singleRun.parties).filter((party: Party) => party.order <= singleRun.getCurrentLevel.factions);
109115

110116
return (
111117
<>
112-
<div onKeyDown={expandKeyboard} tabIndex={0} style={injectCSS}>
113-
114-
<div id="bleed"></div>
115-
{stage === Stage.Game &&
116-
<div>
117-
<div id={"GB"}>
118-
<div className={selectTiles ? 'gb-selection' : ''}
119-
id={"GB-inner"}
120-
style={{
121-
display: 'grid',
122-
grid: `repeat(${singleRun.getCurrentLevel.size},40px) / repeat(${singleRun.getCurrentLevel.size},40px)`
123-
}}>
124-
{baseBoard.map((cell, i) => {
125-
return (<CellItem key={i} cell={cell} click={onClickCell}>
126-
{cell.owned ? '×' : cell.faction}
127-
</CellItem>)
128-
})}
129-
<div className={"sourceHighlight"} style={{
130-
"--sh-top": baseBoard.origin[0] * 40 + "px",
131-
"--sh-left": (baseBoard.origin[1]) * 40 + "px",
132-
"--sh-bottom": (baseBoard.w - baseBoard.origin[0] - 1) * 40 + "px",
133-
"--sh-right": (baseBoard.h - baseBoard.origin[1] - 1) * 40 + "px",
134-
"--sh-bg": singleRun.parties[baseBoard.getOrigin.faction].color
135-
}}></div>
136-
</div>
137-
138-
</div>
139-
<div className="center">
140-
<div className="card">
141-
{Object.values(singleRun.parties)
142-
.filter((party, i) => party.order <= singleRun.getCurrentLevel.factions)
143-
.map((party, i) => {
144-
return <div className={"populismActivator-outer"}>
145-
<button className={"populismActivator"}
146-
style={{background: party.color}}
147-
onClick={() => expand(Faction[party.faction] as Faction)}
148-
>
149-
{party.name},
150-
{i},{party.weight}
151-
152-
</button>
153-
</div>
118+
<Theme>
119+
<div onKeyDown={expandKeyboard} tabIndex={0} style={injectCSS}>
120+
121+
<div id="bleed"></div>
122+
{stage === Stage.Game &&
123+
<div>
124+
<div id={"GB"}>
125+
<Share shares={kinds.map(sh => sh.weight)}
126+
desc={kinds.map(sh => sh.description || "")}
127+
colors={kinds.map(kind => kind.color)}
128+
text={kinds.map(kind => kind.icon)}/>
129+
<Share shares={parties.map(sh => sh.weight)}
130+
colors={parties.map(party => party.color)}
131+
text={parties.map(sh => sh.name)}/>
132+
133+
<div className={selectTiles ? 'gb-selection' : ''}
134+
id={"GB-inner"}
135+
style={{
136+
display: 'grid',
137+
grid: `repeat(${singleRun.getCurrentLevel.size},40px) / repeat(${singleRun.getCurrentLevel.size},40px)`
138+
}}>
139+
{baseBoard.map((cell, i) => {
140+
return (<CellItem key={i} cell={cell} click={onClickCell}>
141+
{cell.owned ? '×' : cell.faction}
142+
</CellItem>)
154143
})}
144+
<div className={"sourceHighlight"} style={{
145+
"--sh-top": baseBoard.origin[0] * 40 + "px",
146+
"--sh-left": (baseBoard.origin[1]) * 40 + "px",
147+
"--sh-bottom": (baseBoard.w - baseBoard.origin[0] - 1) * 40 + "px",
148+
"--sh-right": (baseBoard.h - baseBoard.origin[1] - 1) * 40 + "px",
149+
"--sh-bg": singleRun.parties[baseBoard.getOrigin.faction].color
150+
}}></div>
151+
</div>
155152

156153
</div>
154+
<div className="center">
155+
<div className="card">
156+
{Object.values(singleRun.parties)
157+
.filter((party, i) => party.order <= singleRun.getCurrentLevel.factions)
158+
.map((party, i) => {
159+
return <div className={"populismActivator-outer"}>
160+
<button className={"populismActivator"}
161+
style={{background: party.color}}
162+
onClick={() => expand(Faction[party.faction] as Faction)}
163+
>
164+
{party.name},
165+
{i},{party.weight}
166+
167+
</button>
168+
</div>
169+
})}
170+
171+
</div>
172+
</div>
157173
</div>
174+
}
175+
<div className="powerupCtr">
176+
Powerups<br/>
177+
{
178+
powerup ? <PowerupDescription/> : singleRun.powerups.map(((consumable, i) => {
179+
return consumable.button({
180+
onSelect: () => {
181+
onClickPowerup(consumable, i)
182+
}
183+
})
184+
}))
185+
}
158186
</div>
159-
}
160-
<div className="powerupCtr">
161-
Powerups<br/>
187+
<LeaderJSX run={singleRun}/>
188+
<Header stage={stage} run={singleRun} board={baseBoard}/>
189+
162190
{
163-
powerup ? <PowerupDescription/> : singleRun.powerups.map(((consumable, i) => {
164-
return consumable.button({
165-
onSelect: () => {
166-
onClickPowerup(consumable, i)
167-
}
168-
})
169-
}))
191+
stage === Stage.Shop && <>
192+
{singleRun.powerups.length} / {singleRun.modifiers.powerups.max} Powerup Slots
193+
<RandomShop run={singleRun} setCount={setCount} nextStage={nextStage}/>
194+
</>
170195
}
171-
</div>
172-
<LeaderJSX run={singleRun}/>
173-
<Header stage={stage} run={singleRun} board={baseBoard}/>
174-
175-
{stage === Stage.Shop && <>
176-
{singleRun.powerups.length} / {singleRun.modifiers.powerups.max} Powerup Slots
177-
<RandomShop run={singleRun} setCount={setCount} nextStage={nextStage}/>
178-
</>}
179196

180-
</div>
197+
</div>
198+
</Theme>
181199
</>
182200
)
183201
}

‎games/populismatic/populismatic/src/Cell.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export class Cell {
3838
constructor(faction: undefined | Faction, board: Board, h: Coord, w: Coord) {
3939
this.faction = faction;
4040
this.kind = randomWeighted(
41-
Object.values(board.run.modifiers.generation.kindShare),
41+
Object.values(board.run.modifiers.generation.kindShare).map(kinds => kinds.weight),
4242
Object.keys(Kind),
4343
board.run.levelGen.next()
4444
).toLowerCase();
@@ -72,7 +72,6 @@ export class Cell {
7272
getScore() {
7373
const pointsFromKind = this.modifiers.defer(this.modifiers.scoring, this.kind);
7474
const pointFromEffects = this.board.run.parties[this.faction as Faction].score;
75-
console.log(pointFromEffects, pointsFromKind);
7675
return pointsFromKind + pointFromEffects;
7776
}
7877

‎games/populismatic/populismatic/src/Effects.tsx‎

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ export enum Affect {
99
Kind
1010
}
1111

12-
type Selectable = Faction | Ideologies | Party
12+
type Selectable = Faction | Ideologies | Party | Kind;
1313
type Selector = `*` | Selectable[] | Selectable;
1414

1515
export default class Effect {
@@ -28,7 +28,7 @@ export default class Effect {
2828
get affectText() {
2929
switch (this.affect) {
3030
case Affect.Personal:
31-
return "Your party or ideology";
31+
return "Your party";
3232
case Affect.Parties:
3333
return "Parties";
3434
}
@@ -82,17 +82,22 @@ export default class Effect {
8282

8383
doAction(run: Run) {
8484
if (this.affect == Affect.Parties) {
85-
this.deferFaction.map(faction => {
86-
console.log("effect", this.property, run.parties[faction])
85+
this.deferAs<Faction>(Object.values(Faction)).map(faction => {
8786
run.parties[faction][this.property as "weight" | "score"] += this.change;
8887
})
8988

89+
} else if (this.affect == Affect.Kind) {
90+
this.deferAs<Kind>(Object.values(Kind)).map(kind => {
91+
run.modifiers.generation.kindShare[kind][this.property as "weight"] += this.change;
92+
})
93+
} else if (this.affect == Affect.Personal) {
94+
run.parties[run.leader.self.faction][this.property as "weight" | "score" | "lib" | "right"] += this.change
9095
}
9196
}
9297

93-
get deferFaction(): Faction[] {
94-
if (this.selector == "*") return Object.values(Faction).filter(f => !isNaN(f as number)) as Faction[];
95-
if (Array.isArray(this.selector)) return this.selector as Faction[];
96-
return [this.selector as Faction]
98+
deferAs<T>(prop: any[]): T[] {
99+
if (this.selector == "*") return prop.filter(f => !isNaN(f as number)) as T[];
100+
if (Array.isArray(this.selector)) return this.selector as T[];
101+
return [this.selector as T]
97102
}
98-
}
103+
}

‎games/populismatic/populismatic/src/Factions.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ const ideology: Ideology = {
5858
}
5959
}
6060

61-
type RGBC = string;
61+
export type RGBC = string | `#${string}`;
6262

6363
export function getFactionColor(faction: Faction): RGBC {
6464
switch (faction) {

‎games/populismatic/populismatic/src/components/Leader.tsx‎

Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,45 @@
11
import React, {useState} from "react";
22
import {Run} from "../Run.ts";
33
import {Advisor} from "./Powerup.tsx";
4+
import {Button, Card, HoverCard} from "@radix-ui/themes";
45

56
export default function LeaderJSX({run}: { run: Run }) {
67

78
const leader = run.leader.self;
89
return <div id={"leaders"}>
9-
<div id={"leader"}>
10+
<Card id={"leader"}>
1011
<div className={"leaderIcon"}>
1112
{leader.icon} {leader.name}
1213
</div>
1314
{run.leader.description()}
1415

1516
<br/>
16-
<button className={"btn"}>
17+
<Button variant="surface" size="3" className={"btn"} onClick={() => run.leader.onAcquireEffect(run)}>
1718
{leader.action}
18-
</button>
19-
</div>
19+
</Button>
20+
</Card>
2021
{run.advisors.map(advisor => <SingleLeaderJSX advisor={advisor}/>)}
2122
</div>
2223
}
2324

2425
export function SingleLeaderJSX({advisor}: { advisor: Advisor<any> }) {
2526
const [sel, setSel] = useState(false);
2627
return <>
27-
<div onClick={() => setSel(sel => !sel)}>
28-
<div className={"hover-container advisors"}>
29-
{advisor.self.icon}&nbsp;
30-
{advisor.self.name}
31-
{sel && <div>
32-
<button className={"small-btn"}>Sell</button>
33-
</div>}
28+
<HoverCard.Root>
29+
<div onClick={() => setSel(sel => !sel)}>
30+
<HoverCard.Trigger>
31+
<div className={"advisors"}>
32+
{advisor.self.icon}&nbsp;
33+
{advisor.self.name}
34+
{sel && <div>
35+
<Button size="1" variant="outline" className={"small-btn"}>Sell</Button>
36+
</div>}
37+
</div>
38+
</HoverCard.Trigger>
3439
</div>
35-
<div className={"hover leaderCard"}>
40+
<HoverCard.Content maxWidth="300px" side="right">
3641
{advisor.description()}
37-
</div>
38-
39-
</div>
42+
</HoverCard.Content>
43+
</HoverCard.Root>
4044
</>
4145
}

‎games/populismatic/populismatic/src/components/PoliticalCompass.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,15 @@ export default function PolCompass({parties, run}: { run: Run, parties: Party[]
2121
{parties
2222
.filter(party => party.order <= run.getCurrentLevel.factions)
2323
.map(party => <PartyJSX party={party}/>)}
24-
<div
25-
style={{
26-
left: pad(leader.right) - 32 + "px",
27-
top: pad(leader.lib) - 10 + "px",
28-
"--blop-outline": `var(--q-${Math.floor(leader.lib)}-${Math.floor(leader.right)}`,
29-
background: "#444444ee"
30-
}} className={"blop blop-you"}>
31-
{run.leader.self.icon} You
32-
</div>
24+
{/*<div*/}
25+
{/* style={{*/}
26+
{/* left: pad(leader.right) - 32 + "px",*/}
27+
{/* top: pad(leader.lib) - 10 + "px",*/}
28+
{/* "--blop-outline": `var(--q-${Math.floor(leader.lib)}-${Math.floor(leader.right)}`,*/}
29+
{/* background: "#444444ee"*/}
30+
{/* }} className={"blop blop-you"}>*/}
31+
{/* {run.leader.self.icon} You*/}
32+
{/*</div>*/}
3333
</div>
3434

3535
</>

0 commit comments

Comments
 (0)