From 902a07087c2808c77943b9617a2ab063b1c260e9 Mon Sep 17 00:00:00 2001 From: Frans Bongers Date: Sun, 24 Nov 2024 22:36:37 +0100 Subject: initial setup --- data.js | 563 ++++++++++++++++++++++++++++++++++++++++++++++ data.ts | 601 ++++++++++++++++++++++++++++++++++++++++++++++++++ land-and-freedom.css | 287 ++++++++++++++++++++++++ land-and-freedom.scss | 85 ++++++- package.json | 14 +- play.html | 9 +- play.js | 170 +++++++------- play.ts | 131 +++++++++++ rules.js | 369 ++++++++++++++++++++++--------- rules.ts | 423 +++++++++++++++++++++++++++++++++++ tsconfig.json | 26 +++ 11 files changed, 2482 insertions(+), 196 deletions(-) create mode 100644 data.js create mode 100644 data.ts create mode 100644 play.ts create mode 100644 rules.ts create mode 100644 tsconfig.json diff --git a/data.js b/data.js new file mode 100644 index 0000000..bc8f837 --- /dev/null +++ b/data.js @@ -0,0 +1,563 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.PLAYER_WITH_MOST_HERO_POINTS = exports.ON = exports.OFF = exports.TEAMWORK_BONUS = exports.MORALE_BONUS = exports.FOREIGN_AID = exports.SOVIET_SUPPORT = exports.GOVERNMENT = exports.COLLECTIVIZATION = exports.LIBERTY = void 0; +const LIBERTY = 0; +exports.LIBERTY = LIBERTY; +const COLLECTIVIZATION = 1; +exports.COLLECTIVIZATION = COLLECTIVIZATION; +const GOVERNMENT = 2; +exports.GOVERNMENT = GOVERNMENT; +const SOVIET_SUPPORT = 3; +exports.SOVIET_SUPPORT = SOVIET_SUPPORT; +const FOREIGN_AID = 4; +exports.FOREIGN_AID = FOREIGN_AID; +const MORALE_BONUS = 0; +exports.MORALE_BONUS = MORALE_BONUS; +const TEAMWORK_BONUS = 1; +exports.TEAMWORK_BONUS = TEAMWORK_BONUS; +const OFF = 0; +exports.OFF = OFF; +const ON = 1; +exports.ON = ON; +const PLAYER_WITH_MOST_HERO_POINTS = 0; +exports.PLAYER_WITH_MOST_HERO_POINTS = PLAYER_WITH_MOST_HERO_POINTS; +const data = { + cards: [ + {}, + { + id: 1, + strength: 1, + title: 'CLANDESTINE FRENCH ARMS', + type: 'pc', + }, + { + id: 2, + strength: 2, + title: 'POPULAR ARMY OF THE REPUBLIC', + type: 'pc', + }, + { + id: 3, + strength: 2, + title: 'MEXICAN GUNS', + type: 'pc', + }, + { + id: 4, + strength: 1, + title: 'BATTLE OF GUADALAJARA', + type: 'pc', + }, + { + id: 5, + strength: 1, + title: '"SI ME OUIERES ESCRIBIR"', + type: 'pc', + }, + { + id: 6, + strength: 2, + title: 'XYZ LINE', + type: 'pc', + }, + { + id: 7, + strength: 3, + title: 'INDALECIO PRIETO', + type: 'pc', + }, + { + id: 8, + strength: 1, + title: "PEOPLE'S OLYMPIAD", + type: 'pc', + }, + { + id: 9, + strength: 1, + title: 'FOUR ANARCHIST MINISTERS', + type: 'pc', + }, + { + id: 10, + strength: 1, + title: 'GUERNICA', + type: 'pc', + }, + { + id: 11, + strength: 1, + title: 'ERNEST HEMINGWAY', + type: 'pc', + }, + { + id: 12, + strength: 1, + title: 'HUESCA OFFENSIVE', + type: 'pc', + }, + { + id: 13, + strength: 1, + title: 'PABLO NERUDA', + type: 'pc', + }, + { + id: 14, + strength: 1, + title: 'EUSKO GUDAROSTEA', + type: 'pc', + }, + { + id: 15, + strength: 2, + title: 'JUAN NEGRÍN', + type: 'pc', + }, + { + id: 16, + strength: 1, + title: 'PUBLICIZE FASCIST WAR CRIMES', + type: 'pc', + }, + { + id: 17, + strength: 1, + title: 'AGRARIAN REFORM', + type: 'pc', + }, + { + id: 18, + strength: 1, + title: 'IMPOSE FACTORY MANAGERS', + type: 'pc', + }, + { + id: 19, + strength: 2, + title: '¡NO PASARÁN!', + type: 'pc', + }, + { + id: 20, + strength: 2, + title: 'RUSSIAN FIGHTERS', + type: 'pc', + }, + { + id: 21, + strength: 1, + title: 'ENRIQUE LÍSTER', + type: 'pc', + }, + { + id: 22, + strength: 2, + title: 'LARGO CABALLERO', + type: 'pc', + }, + { + id: 23, + strength: 2, + title: 'SOVIET TANKS', + type: 'pc', + }, + { + id: 24, + strength: 3, + title: 'DOLORES IBÁRRURI', + type: 'pc', + }, + { + id: 25, + strength: 1, + title: 'PAUL ROBESON', + type: 'pc', + }, + { + id: 26, + strength: 1, + title: 'MADRID DEFENSE COUNCIL', + type: 'pc', + }, + { + id: 27, + strength: 1, + title: "STALIN GETS THE REPUBLIC'S GOLD", + type: 'pc', + }, + { + id: 28, + strength: 1, + title: 'INTERNATIONAL BRIGADES', + type: 'pc', + }, + { + id: 29, + strength: 1, + title: 'BAN WOMEN FROM THE FRONT', + type: 'pc', + }, + { + id: 30, + strength: 1, + title: 'ABRAHAM LINCOLN BRIGADE', + type: 'pc', + }, + { + id: 31, + strength: 2, + title: 'OUTLAW THE POUM', + type: 'pc', + }, + { + id: 32, + strength: 1, + title: 'DISBAND THE CONTROL PATROLS', + type: 'pc', + }, + { + id: 33, + strength: 1, + title: 'MAY DAYS', + type: 'pc', + }, + { + id: 34, + strength: 1, + title: 'FIFTH REGIMENT', + type: 'pc', + }, + { + id: 35, + strength: 1, + title: 'THÄLMANN BATTALION', + type: 'pc', + }, + { + id: 36, + strength: 1, + title: 'DE-COLLECTIVIZE AGRICULTURE', + type: 'pc', + }, + { + id: 37, + strength: 3, + title: 'BUENAVENTURA DURRUTI', + type: 'pc', + }, + { + id: 38, + strength: 2, + title: 'MUJERES LIBRES', + type: 'pc', + }, + { + id: 39, + strength: 1, + title: 'IRON COLUMN', + type: 'pc', + }, + { + id: 40, + strength: 2, + title: 'ASTURIAN MINERS', + type: 'pc', + }, + { + id: 41, + strength: 2, + title: 'CNT-FAI', + type: 'pc', + }, + { + id: 42, + strength: 2, + title: 'DURRUTI COLUMN', + type: 'pc', + }, + { + id: 43, + strength: 1, + title: 'GEORGE ORWELL', + type: 'pc', + }, + { + id: 44, + strength: 1, + title: 'F.I.J.L.', + type: 'pc', + }, + { + id: 45, + strength: 1, + title: 'ARM THE UNIONS', + type: 'pc', + }, + { + id: 46, + strength: 1, + title: 'GUERRILLAS', + type: 'pc', + }, + { + id: 47, + strength: 1, + title: 'RADICAL EDUCATION', + type: 'pc', + }, + { + id: 48, + strength: 1, + title: 'MATTEOTTI BATTALION', + type: 'pc', + }, + { + id: 49, + strength: 1, + title: 'COLLECTIVIZE AGRICULTURE', + type: 'pc', + }, + { + id: 50, + strength: 1, + title: 'ARMORED VEHICLES', + type: 'pc', + }, + { + id: 51, + strength: 1, + title: 'INDUSTRIAL DEMOCRACY', + type: 'pc', + }, + { + id: 52, + strength: 2, + title: 'AFFINITY GROUPS', + type: 'pc', + }, + { + id: 53, + strength: 1, + title: 'GENDER-INCLUSIVE MILITIA', + type: 'pc', + }, + { + id: 54, + strength: 1, + title: 'FEDERICA MONTSENY', + type: 'pc', + }, + { + id: 55, + effects: [ + { + target: 's', + type: 'attack', + value: 4, + }, + { + target: 'a', + type: 'attack', + value: 1, + }, + { + target: SOVIET_SUPPORT, + type: 'track', + value: -2, + }, + ], + title: 'SPANISH LEGION', + type: 'ec', + year: 1, + }, + { + id: 56, + effects: [ + { + target: 's', + type: 'attack', + value: 3, + }, + { + target: 'v', + type: 'attack', + value: 2, + }, + { + target: MORALE_BONUS, + type: 'bonus', + value: OFF, + }, + ], + title: 'BRITISH TREACHERY AT GIBRALTAR', + type: 'ec', + year: 1, + }, + { + id: 57, + effects: [ + { + target: 'm', + type: 'attack', + value: 5, + }, + { + target: FOREIGN_AID, + type: 'track', + value: -2, + }, + { + target: PLAYER_WITH_MOST_HERO_POINTS, + type: 'hero_points', + value: -1, + }, + ], + title: 'PARACUELLOS MASSACRES', + type: 'ec', + year: 1, + }, + { + id: 58, + effects: [ + { + target: 'n', + type: 'attack', + value: 5, + }, + { + target: 'v', + type: 'attack', + value: 1, + }, + { + target: COLLECTIVIZATION, + type: 'track', + value: -1, + }, + ], + title: 'CARLISTS', + type: 'ec', + year: 1, + }, + { + id: 59, + effects: [ + { + target: 'm', + type: 'attack', + value: 4, + }, + { + target: 'v', + type: 'attack', + value: 2, + }, + { + target: LIBERTY, + type: 'track', + value: -1, + }, + ], + title: 'ASSASSINATION OF GARCIA LORCA', + type: 'ec', + year: 1, + }, + { + id: 60, + effects: [ + { + target: 'n', + type: 'attack', + value: 3, + }, + { + target: 'v', + type: 'attack', + value: 3, + }, + { + target: LIBERTY, + type: 'track', + value: -1, + }, + ], + title: 'GENERAL SANJURIO', + type: 'ec', + year: 1, + }, + { + id: 61, + effects: [ + { + target: 'a', + type: 'attack', + value: 4, + }, + { + target: 'v', + type: 'attack', + value: 2, + }, + { + target: PLAYER_WITH_MOST_HERO_POINTS, + type: 'hero_points', + value: -1, + }, + ], + title: 'FAILED INVASION OF MALLORCA', + type: 'ec', + year: 1, + }, + { + id: 62, + effects: [ + { + target: 's', + type: 'attack', + value: 5, + }, + { + target: MORALE_BONUS, + type: 'bonus', + value: OFF, + }, + { + target: PLAYER_WITH_MOST_HERO_POINTS, + type: 'hero_points', + value: -1, + }, + ], + title: 'AIRLIFT OF THE ARMY OF AFRICA', + type: 'ec', + year: 1, + }, + ], + fronts: [ + { + id: 1, + name: 'Northern', + left: 89, + top: 96, + }, + { + id: 2, + name: 'Aragon', + left: 340, + top: 182, + }, + { + id: 3, + name: 'Madrid', + left: 115, + top: 262, + }, + { + id: 4, + name: 'Southern', + left: 205, + top: 426, + }, + ], +}; +exports.default = data; diff --git a/data.ts b/data.ts new file mode 100644 index 0000000..a01495d --- /dev/null +++ b/data.ts @@ -0,0 +1,601 @@ +export interface CardBase { + id: number; + title: string; +} + +export interface CardEffect { + type: 'attack' | 'track' | 'bonus' | 'hero_points'; + target: string | number; + value: number; +} + +export interface EventCard extends CardBase { + type: 'ec'; + year: number; + effects: CardEffect[]; +} + +export interface PlayerCard extends CardBase { + type: 'pc'; + strength: number; +} + +export type Card = EventCard | PlayerCard; + +export interface StaticData { + cards: Card[]; + fronts: Array<{ + id: number; + name: string; + left: number; + top: number; + }>; +} + +const LIBERTY = 0; +const COLLECTIVIZATION = 1; +const GOVERNMENT = 2; +const SOVIET_SUPPORT = 3; +const FOREIGN_AID = 4; + +const MORALE_BONUS = 0; +const TEAMWORK_BONUS = 1; + +const OFF = 0; +const ON = 1; + +const PLAYER_WITH_MOST_HERO_POINTS = 0; + +export { + LIBERTY, + COLLECTIVIZATION, + GOVERNMENT, + SOVIET_SUPPORT, + FOREIGN_AID, + MORALE_BONUS, + TEAMWORK_BONUS, + OFF, + ON, + PLAYER_WITH_MOST_HERO_POINTS, +}; + +const data: StaticData = { + cards: [ + {} as Card, + { + id: 1, + strength: 1, + title: 'CLANDESTINE FRENCH ARMS', + type: 'pc', + }, + { + id: 2, + strength: 2, + title: 'POPULAR ARMY OF THE REPUBLIC', + type: 'pc', + }, + { + id: 3, + strength: 2, + title: 'MEXICAN GUNS', + type: 'pc', + }, + { + id: 4, + strength: 1, + title: 'BATTLE OF GUADALAJARA', + type: 'pc', + }, + { + id: 5, + strength: 1, + title: '"SI ME OUIERES ESCRIBIR"', + type: 'pc', + }, + { + id: 6, + strength: 2, + title: 'XYZ LINE', + type: 'pc', + }, + { + id: 7, + strength: 3, + title: 'INDALECIO PRIETO', + type: 'pc', + }, + { + id: 8, + strength: 1, + title: "PEOPLE'S OLYMPIAD", + type: 'pc', + }, + { + id: 9, + strength: 1, + title: 'FOUR ANARCHIST MINISTERS', + type: 'pc', + }, + { + id: 10, + strength: 1, + title: 'GUERNICA', + type: 'pc', + }, + { + id: 11, + strength: 1, + title: 'ERNEST HEMINGWAY', + type: 'pc', + }, + { + id: 12, + strength: 1, + title: 'HUESCA OFFENSIVE', + type: 'pc', + }, + { + id: 13, + strength: 1, + title: 'PABLO NERUDA', + type: 'pc', + }, + { + id: 14, + strength: 1, + title: 'EUSKO GUDAROSTEA', + type: 'pc', + }, + { + id: 15, + strength: 2, + title: 'JUAN NEGRÍN', + type: 'pc', + }, + { + id: 16, + strength: 1, + title: 'PUBLICIZE FASCIST WAR CRIMES', + type: 'pc', + }, + { + id: 17, + strength: 1, + title: 'AGRARIAN REFORM', + type: 'pc', + }, + { + id: 18, + strength: 1, + title: 'IMPOSE FACTORY MANAGERS', + type: 'pc', + }, + { + id: 19, + strength: 2, + title: '¡NO PASARÁN!', + type: 'pc', + }, + { + id: 20, + strength: 2, + title: 'RUSSIAN FIGHTERS', + type: 'pc', + }, + { + id: 21, + strength: 1, + title: 'ENRIQUE LÍSTER', + type: 'pc', + }, + { + id: 22, + strength: 2, + title: 'LARGO CABALLERO', + type: 'pc', + }, + { + id: 23, + strength: 2, + title: 'SOVIET TANKS', + type: 'pc', + }, + { + id: 24, + strength: 3, + title: 'DOLORES IBÁRRURI', + type: 'pc', + }, + { + id: 25, + strength: 1, + title: 'PAUL ROBESON', + type: 'pc', + }, + { + id: 26, + strength: 1, + title: 'MADRID DEFENSE COUNCIL', + type: 'pc', + }, + { + id: 27, + strength: 1, + title: "STALIN GETS THE REPUBLIC'S GOLD", + type: 'pc', + }, + { + id: 28, + strength: 1, + title: 'INTERNATIONAL BRIGADES', + type: 'pc', + }, + { + id: 29, + strength: 1, + title: 'BAN WOMEN FROM THE FRONT', + type: 'pc', + }, + { + id: 30, + strength: 1, + title: 'ABRAHAM LINCOLN BRIGADE', + type: 'pc', + }, + { + id: 31, + strength: 2, + title: 'OUTLAW THE POUM', + type: 'pc', + }, + { + id: 32, + strength: 1, + title: 'DISBAND THE CONTROL PATROLS', + type: 'pc', + }, + { + id: 33, + strength: 1, + title: 'MAY DAYS', + type: 'pc', + }, + { + id: 34, + strength: 1, + title: 'FIFTH REGIMENT', + type: 'pc', + }, + { + id: 35, + strength: 1, + title: 'THÄLMANN BATTALION', + type: 'pc', + }, + { + id: 36, + strength: 1, + title: 'DE-COLLECTIVIZE AGRICULTURE', + type: 'pc', + }, + { + id: 37, + strength: 3, + title: 'BUENAVENTURA DURRUTI', + type: 'pc', + }, + { + id: 38, + strength: 2, + title: 'MUJERES LIBRES', + type: 'pc', + }, + { + id: 39, + strength: 1, + title: 'IRON COLUMN', + type: 'pc', + }, + { + id: 40, + strength: 2, + title: 'ASTURIAN MINERS', + type: 'pc', + }, + { + id: 41, + strength: 2, + title: 'CNT-FAI', + type: 'pc', + }, + { + id: 42, + strength: 2, + title: 'DURRUTI COLUMN', + type: 'pc', + }, + { + id: 43, + strength: 1, + title: 'GEORGE ORWELL', + type: 'pc', + }, + { + id: 44, + strength: 1, + title: 'F.I.J.L.', + type: 'pc', + }, + { + id: 45, + strength: 1, + title: 'ARM THE UNIONS', + type: 'pc', + }, + { + id: 46, + strength: 1, + title: 'GUERRILLAS', + type: 'pc', + }, + { + id: 47, + strength: 1, + title: 'RADICAL EDUCATION', + type: 'pc', + }, + { + id: 48, + strength: 1, + title: 'MATTEOTTI BATTALION', + type: 'pc', + }, + { + id: 49, + strength: 1, + title: 'COLLECTIVIZE AGRICULTURE', + type: 'pc', + }, + { + id: 50, + strength: 1, + title: 'ARMORED VEHICLES', + type: 'pc', + }, + { + id: 51, + strength: 1, + title: 'INDUSTRIAL DEMOCRACY', + type: 'pc', + }, + { + id: 52, + strength: 2, + title: 'AFFINITY GROUPS', + type: 'pc', + }, + { + id: 53, + strength: 1, + title: 'GENDER-INCLUSIVE MILITIA', + type: 'pc', + }, + { + id: 54, + strength: 1, + title: 'FEDERICA MONTSENY', + type: 'pc', + }, + { + id: 55, + effects: [ + { + target: 's', + type: 'attack', + value: 4, + }, + { + target: 'a', + type: 'attack', + value: 1, + }, + { + target: SOVIET_SUPPORT, + type: 'track', + value: -2, + }, + ], + title: 'SPANISH LEGION', + type: 'ec', + year: 1, + }, + { + id: 56, + effects: [ + { + target: 's', + type: 'attack', + value: 3, + }, + { + target: 'v', + type: 'attack', + value: 2, + }, + { + target: MORALE_BONUS, + type: 'bonus', + value: OFF, + }, + ], + title: 'BRITISH TREACHERY AT GIBRALTAR', + type: 'ec', + year: 1, + }, + { + id: 57, + effects: [ + { + target: 'm', + type: 'attack', + value: 5, + }, + { + target: FOREIGN_AID, + type: 'track', + value: -2, + }, + { + target: PLAYER_WITH_MOST_HERO_POINTS, + type: 'hero_points', + value: -1, + }, + ], + title: 'PARACUELLOS MASSACRES', + type: 'ec', + year: 1, + }, + { + id: 58, + effects: [ + { + target: 'n', + type: 'attack', + value: 5, + }, + { + target: 'v', + type: 'attack', + value: 1, + }, + { + target: COLLECTIVIZATION, + type: 'track', + value: -1, + }, + ], + title: 'CARLISTS', + type: 'ec', + year: 1, + }, + { + id: 59, + effects: [ + { + target: 'm', + type: 'attack', + value: 4, + }, + { + target: 'v', + type: 'attack', + value: 2, + }, + { + target: LIBERTY, + type: 'track', + value: -1, + }, + ], + title: 'ASSASSINATION OF GARCIA LORCA', + type: 'ec', + year: 1, + }, + { + id: 60, + effects: [ + { + target: 'n', + type: 'attack', + value: 3, + }, + { + target: 'v', + type: 'attack', + value: 3, + }, + { + target: LIBERTY, + type: 'track', + value: -1, + }, + ], + title: 'GENERAL SANJURIO', + type: 'ec', + year: 1, + }, + { + id: 61, + effects: [ + { + target: 'a', + type: 'attack', + value: 4, + }, + { + target: 'v', + type: 'attack', + value: 2, + }, + { + target: PLAYER_WITH_MOST_HERO_POINTS, + type: 'hero_points', + value: -1, + }, + ], + title: 'FAILED INVASION OF MALLORCA', + type: 'ec', + year: 1, + }, + { + id: 62, + effects: [ + { + target: 's', + type: 'attack', + value: 5, + }, + { + target: MORALE_BONUS, + type: 'bonus', + value: OFF, + }, + { + target: PLAYER_WITH_MOST_HERO_POINTS, + type: 'hero_points', + value: -1, + }, + ], + title: 'AIRLIFT OF THE ARMY OF AFRICA', + type: 'ec', + year: 1, + }, + ], + fronts: [ + { + id: 1, + name: 'Northern', + left: 89, + top: 96, + }, + { + id: 2, + name: 'Aragon', + left: 340, + top: 182, + }, + { + id: 3, + name: 'Madrid', + left: 115, + top: 262, + }, + { + id: 4, + name: 'Southern', + left: 205, + top: 426, + }, + ], +}; +export default data; diff --git a/land-and-freedom.css b/land-and-freedom.css index 0d6b494..5928f57 100644 --- a/land-and-freedom.css +++ b/land-and-freedom.css @@ -1,3 +1,14 @@ +main { + background-color: darkolivegreen; +} + +/* MAP */ +#mapwrap { + width: 1000px; + height: 850px; + box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.2666666667); +} + #map { background-repeat: no-repeat; background-size: 100% 100%; @@ -15,3 +26,279 @@ background-image: url(images/map100.png); } } +#hand { + display: flex; + flex-direction: row; + gap: 8px; + margin-top: 16px; + padding: 16px; + justify-content: center; +} + +.front { + position: absolute; + box-sizing: border-box; + width: 93px; + height: 102px; +} + +.front[data-front-id="3"] { + width: 104px; + height: 114px; +} + +.card { + background-size: 100% 100%; + width: 198px; + height: 270px; + border-radius: 5px; + box-shadow: 0 0 0 1px #333; +} + +.card[data-card-id="1"] { + background-image: url("images/cards100/card_1.png"); +} + +.card[data-card-id="2"] { + background-image: url("images/cards100/card_2.png"); +} + +.card[data-card-id="3"] { + background-image: url("images/cards100/card_3.png"); +} + +.card[data-card-id="4"] { + background-image: url("images/cards100/card_4.png"); +} + +.card[data-card-id="5"] { + background-image: url("images/cards100/card_5.png"); +} + +.card[data-card-id="6"] { + background-image: url("images/cards100/card_6.png"); +} + +.card[data-card-id="7"] { + background-image: url("images/cards100/card_7.png"); +} + +.card[data-card-id="8"] { + background-image: url("images/cards100/card_8.png"); +} + +.card[data-card-id="9"] { + background-image: url("images/cards100/card_9.png"); +} + +.card[data-card-id="10"] { + background-image: url("images/cards100/card_10.png"); +} + +.card[data-card-id="11"] { + background-image: url("images/cards100/card_11.png"); +} + +.card[data-card-id="12"] { + background-image: url("images/cards100/card_12.png"); +} + +.card[data-card-id="13"] { + background-image: url("images/cards100/card_13.png"); +} + +.card[data-card-id="14"] { + background-image: url("images/cards100/card_14.png"); +} + +.card[data-card-id="15"] { + background-image: url("images/cards100/card_15.png"); +} + +.card[data-card-id="16"] { + background-image: url("images/cards100/card_16.png"); +} + +.card[data-card-id="17"] { + background-image: url("images/cards100/card_17.png"); +} + +.card[data-card-id="18"] { + background-image: url("images/cards100/card_18.png"); +} + +.card[data-card-id="19"] { + background-image: url("images/cards100/card_19.png"); +} + +.card[data-card-id="20"] { + background-image: url("images/cards100/card_20.png"); +} + +.card[data-card-id="21"] { + background-image: url("images/cards100/card_21.png"); +} + +.card[data-card-id="22"] { + background-image: url("images/cards100/card_22.png"); +} + +.card[data-card-id="23"] { + background-image: url("images/cards100/card_23.png"); +} + +.card[data-card-id="24"] { + background-image: url("images/cards100/card_24.png"); +} + +.card[data-card-id="25"] { + background-image: url("images/cards100/card_25.png"); +} + +.card[data-card-id="26"] { + background-image: url("images/cards100/card_26.png"); +} + +.card[data-card-id="27"] { + background-image: url("images/cards100/card_27.png"); +} + +.card[data-card-id="28"] { + background-image: url("images/cards100/card_28.png"); +} + +.card[data-card-id="29"] { + background-image: url("images/cards100/card_29.png"); +} + +.card[data-card-id="30"] { + background-image: url("images/cards100/card_30.png"); +} + +.card[data-card-id="31"] { + background-image: url("images/cards100/card_31.png"); +} + +.card[data-card-id="32"] { + background-image: url("images/cards100/card_32.png"); +} + +.card[data-card-id="33"] { + background-image: url("images/cards100/card_33.png"); +} + +.card[data-card-id="34"] { + background-image: url("images/cards100/card_34.png"); +} + +.card[data-card-id="35"] { + background-image: url("images/cards100/card_35.png"); +} + +.card[data-card-id="36"] { + background-image: url("images/cards100/card_36.png"); +} + +.card[data-card-id="37"] { + background-image: url("images/cards100/card_37.png"); +} + +.card[data-card-id="38"] { + background-image: url("images/cards100/card_38.png"); +} + +.card[data-card-id="39"] { + background-image: url("images/cards100/card_39.png"); +} + +.card[data-card-id="40"] { + background-image: url("images/cards100/card_40.png"); +} + +.card[data-card-id="41"] { + background-image: url("images/cards100/card_41.png"); +} + +.card[data-card-id="42"] { + background-image: url("images/cards100/card_42.png"); +} + +.card[data-card-id="43"] { + background-image: url("images/cards100/card_43.png"); +} + +.card[data-card-id="44"] { + background-image: url("images/cards100/card_44.png"); +} + +.card[data-card-id="45"] { + background-image: url("images/cards100/card_45.png"); +} + +.card[data-card-id="46"] { + background-image: url("images/cards100/card_46.png"); +} + +.card[data-card-id="47"] { + background-image: url("images/cards100/card_47.png"); +} + +.card[data-card-id="48"] { + background-image: url("images/cards100/card_48.png"); +} + +.card[data-card-id="49"] { + background-image: url("images/cards100/card_49.png"); +} + +.card[data-card-id="50"] { + background-image: url("images/cards100/card_50.png"); +} + +.card[data-card-id="51"] { + background-image: url("images/cards100/card_51.png"); +} + +.card[data-card-id="52"] { + background-image: url("images/cards100/card_52.png"); +} + +.card[data-card-id="53"] { + background-image: url("images/cards100/card_53.png"); +} + +.card[data-card-id="54"] { + background-image: url("images/cards100/card_54.png"); +} + +.card[data-card-id="55"] { + background-image: url("images/cards100/card_55.png"); +} + +.card[data-card-id="56"] { + background-image: url("images/cards100/card_56.png"); +} + +.card[data-card-id="57"] { + background-image: url("images/cards100/card_57.png"); +} + +.card[data-card-id="58"] { + background-image: url("images/cards100/card_58.png"); +} + +.card[data-card-id="59"] { + background-image: url("images/cards100/card_59.png"); +} + +.card[data-card-id="60"] { + background-image: url("images/cards100/card_60.png"); +} + +.card[data-card-id="61"] { + background-image: url("images/cards100/card_61.png"); +} + +.card[data-card-id="62"] { + background-image: url("images/cards100/card_62.png"); +} diff --git a/land-and-freedom.scss b/land-and-freedom.scss index 65694fc..9c68e03 100644 --- a/land-and-freedom.scss +++ b/land-and-freedom.scss @@ -1,12 +1,81 @@ +// @use "sass:math"; +@use 'sass:map'; + +main { + // background-color: rgb(213, 196, 131); + background-color: darkolivegreen; +} + +/* MAP */ + +#mapwrap { + width: 1000px; + height: 850px; + // background-color: #999f85; + box-shadow: 1px 2px 4px #0004; +} + +// #map { +// background-repeat: no-repeat; +// background-size: cover; +// width: 1275px; +// height: 1650px; +// overflow: clip; +// } + #map { - background-repeat: no-repeat; - background-size: 100% 100%; - width: 1000px; - height: 850px; - overflow: clip; + background-repeat: no-repeat; + background-size: 100% 100%; + width: 1000px; + height: 850px; + overflow: clip; } -#map { background-image: url(images/map75.png) } +#map { + background-image: url(images/map75.png); +} @media (min-resolution: 97dpi) { - #map { background-image: url(images/map100.png) } -} \ No newline at end of file + #map { + background-image: url(images/map100.png); + } +} + +#hand { + display: flex; + flex-direction: row; + gap: 8px; + margin-top: 16px; + padding: 16px; + justify-content: center; +} + +.front { + position: absolute; + box-sizing: border-box; + width: 93px; + height: 102px; + // background-color: yellow; + // opacity: 0.5; +} + +.front[data-front-id='3'] { + width: 104px; + height: 114px; +} + +.card { + background-size: 100% 100%; + // width: 275px; + // height: 375px; + width: 198px; + height: 270px; + // border: 1px solid black; + border-radius: 5px; + box-shadow: 0 0 0 1px #333; +} + +@for $i from 1 through 62 { + .card[data-card-id='#{$i}'] { + background-image: url('images/cards100/card_#{$i}.png'); + } +} diff --git a/package.json b/package.json index 613747e..b63e15d 100644 --- a/package.json +++ b/package.json @@ -1,15 +1,19 @@ { "name": "land-and-freedom", "version": "1.0.0", - "description": "", + "description": "Land and Freedom for RTT", "main": "rules.js", "scripts": { "build:scss": "sass --no-source-map land-and-freedom.scss land-and-freedom.css", - "watch:scss": "sass --no-source-map --watch land-and-freedom.scss land-and-freedom.css" + "build:ts": "tsc", + "watch:scss": "sass --no-source-map --watch land-and-freedom.scss land-and-freedom.css", + "watch:ts": "tsc --watch", + "build": "npm run build:ts && npm run build:scss" }, - "author": "", + "author": "Frans Bongers", "license": "ISC", "devDependencies": { - "sass": "^1.81.0" + "sass": "^1.81.0", + "typescript": "^5.7.2" } -} \ No newline at end of file +} diff --git a/play.html b/play.html index 8fac6ec..08fbd0e 100644 --- a/play.html +++ b/play.html @@ -11,6 +11,8 @@ + +