Add reverses and new quests

src/Data.js

@@ -7,6 +7,7 @@ import presets_ from './data/presets.json'
 import effects_ from './data/effects.json'
 import items_ from './data/items.json'
 import quests_ from './data/quests.json'
+import reverses_ from './data/reverses.json'
 
 import tokens_ from './data/tokens.json'
 import placements_ from './data/placements.json'
@@ -22,6 +23,7 @@ export const presets = presets_
 export const effects = effects_
 export const items = items_
 export const quests = quests_
+export const reverses = reverses_
 
 export const categories = {
     "effects": effects,

src/Utils.js

@@ -7,7 +7,9 @@ export function roll(min, max) {
 const parser = new DOMParser();
 
 export function parseHTML(str) {
-    return parser.parseFromString(str, "text/html").body;
+    let el = document.createElement('div');
+    el.innerHTML = parser.parseFromString(str, "text/html").body.innerHTML;
+    return el;
 }
 
 export function shuffle(array) {

src/data/items.json

@@ -1 +1 @@
-{"I01":{"name":"Bracelet of Lesser Pain","description":"Gives a lesser resistance towards incoming damage.","behaviour":"Adds <b>+1</b> to <b>DP</b>","onAdd":[["modAttr","dp",1]],"onRemove":[["modAttr","dp",-1]],"quantity":3},"I02":{"name":"Bracelet of Reduced Pain","description":"Makes you more resistant towards incoming damage.","behaviour":"Adds <b>+2</b> to <b>DP</b>","onAdd":[["modAttr","dp",2]],"onRemove":[["modAttr","dp",-2]],"quantity":2},"I03":{"name":"Bracelet of No Pain","description":"Greatly increases resistance towards incoming damage.","behaviour":"Adds <b>+3</b> to <b>DP</b>","onAdd":[["modAttr","dp",3]],"onRemove":[["modAttr","dp",-3]],"quantity":1},"I04":{"name":"Necklace of Lesser Life","description":"Gives a lesser boost to your health.","behaviour":"Adds <b>+1</b> to <b>HP</b>","onAdd":[["modAttr","hp",1]],"onRemove":[["modAttr","hp",-1]],"quantity":3},"I05":{"name":"Necklace of Life","description":"Boosts your health.","behaviour":"Adds <b>+2</b> to <b>HP</b>","onAdd":[["modAttr","hp",2]],"onRemove":[["modAttr","hp",-2]],"quantity":2},"I06":{"name":"Necklace of Greater Life","description":"Greatly increases your health.","behaviour":"Adds <b>+3</b> to <b>HP</b>","onAdd":[["modAttr","hp",3]],"onRemove":[["modAttr","hp",-3]],"quantity":1},"I07":{"name":"Ring of Lesser Power","description":"Gives a lesser boost to your attacks.","behaviour":"Adds <b>+1</b> to <b>AP</b>","onAdd":[["modAttr","ap",1]],"onRemove":[["modAttr","ap",-1]],"quantity":3},"I08":{"name":"Ring of Power","description":"Makes your attacks stronger.","behaviour":"Adds <b>+2</b> to <b>AP</b>","onAdd":[["modAttr","ap",2]],"onRemove":[["modAttr","ap",-2]],"quantity":2},"I09":{"name":"Ring of Great Power","description":"Greatly increases your attack power.","behaviour":"Adds <b>+3</b> to <b>AP</b>","onAdd":[["modAttr","ap",3]],"onRemove":[["modAttr","ap",-3]],"quantity":1},"I10":{"name":"Jagged Sword","description":"A mighty sword from legends. A <b>mage</b> cannot wield it.","behaviour":"Adds <b>+4</b> to <b>AP</b>","onAdd":[["modAttr","ap",4]],"onRemove":[["modAttr","ap",-4]],"quantity":1},"I11":{"name":"Stormcaller","description":"A magnificent staff of archmages. A <b>warrior</b> cannot use it.","behaviour":"Adds <b>+4</b> to <b>AP</b>","onAdd":[["modAttr","ap",4]],"onRemove":[["modAttr","ap",-4]],"quantity":1},"I12":{"name":"Steelbreaker","description":"A formidable shield of protectors. A <b>rogue</b> cannot wield it.","behaviour":"Adds <b>+4</b> to <b>AP</b>","onAdd":[["modAttr","dp",4]],"onRemove":[["modAttr","dp",-4]],"quantity":1}}
+{"I.01":{"name":"Bracelet of Lesser Pain","description":"Gives a lesser resistance towards incoming damage.","behaviour":"Adds <b>+1</b> to <b>DP</b>","onAdd":[["modAttr","dp",1]],"onRemove":[["modAttr","dp",-1]],"quantity":3},"I.02":{"name":"Bracelet of Reduced Pain","description":"Makes you more resistant towards incoming damage.","behaviour":"Adds <b>+2</b> to <b>DP</b>","onAdd":[["modAttr","dp",2]],"onRemove":[["modAttr","dp",-2]],"quantity":2},"I.03":{"name":"Bracelet of No Pain","description":"Greatly increases resistance towards incoming damage.","behaviour":"Adds <b>+3</b> to <b>DP</b>","onAdd":[["modAttr","dp",3]],"onRemove":[["modAttr","dp",-3]],"quantity":1},"I.04":{"name":"Necklace of Lesser Life","description":"Gives a lesser boost to your health.","behaviour":"Adds <b>+1</b> to <b>HP</b>","onAdd":[["modAttr","hp",1]],"onRemove":[["modAttr","hp",-1]],"quantity":3},"I.05":{"name":"Necklace of Life","description":"Boosts your health.","behaviour":"Adds <b>+2</b> to <b>HP</b>","onAdd":[["modAttr","hp",2]],"onRemove":[["modAttr","hp",-2]],"quantity":2},"I.06":{"name":"Necklace of Greater Life","description":"Greatly increases your health.","behaviour":"Adds <b>+3</b> to <b>HP</b>","onAdd":[["modAttr","hp",3]],"onRemove":[["modAttr","hp",-3]],"quantity":1},"I.07":{"name":"Ring of Lesser Power","description":"Gives a lesser boost to your attacks.","behaviour":"Adds <b>+1</b> to <b>AP</b>","onAdd":[["modAttr","ap",1]],"onRemove":[["modAttr","ap",-1]],"quantity":3},"I.08":{"name":"Ring of Power","description":"Makes your attacks stronger.","behaviour":"Adds <b>+2</b> to <b>AP</b>","onAdd":[["modAttr","ap",2]],"onRemove":[["modAttr","ap",-2]],"quantity":2},"I.09":{"name":"Ring of Great Power","description":"Greatly increases your attack power.","behaviour":"Adds <b>+3</b> to <b>AP</b>","onAdd":[["modAttr","ap",3]],"onRemove":[["modAttr","ap",-3]],"quantity":1},"I.10":{"name":"Jagged Sword","description":"A mighty sword from legends. A <b>mage</b> cannot wield it.","behaviour":"Adds <b>+4</b> to <b>AP</b>","onAdd":[["modAttr","ap",4]],"onRemove":[["modAttr","ap",-4]],"quantity":1},"I.11":{"name":"Stormcaller","description":"A magnificent staff of archmages. A <b>warrior</b> cannot use it.","behaviour":"Adds <b>+4</b> to <b>AP</b>","onAdd":[["modAttr","ap",4]],"onRemove":[["modAttr","ap",-4]],"quantity":1},"I.12":{"name":"Steelbreaker","description":"A formidable shield of protectors. A <b>rogue</b> cannot wield it.","behaviour":"Adds <b>+4</b> to <b>AP</b>","onAdd":[["modAttr","dp",4]],"onRemove":[["modAttr","dp",-4]],"quantity":1}}

src/data/quests.json

@@ -1 +1 @@
-{"Q01":{"name":"Rightful Owner","description":"Steal an item from a player.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":3},"Q02":{"name":"Mischievous creatures!","description":"Take the mischievous gnome out of a town and lead him 10 hexes away from the town.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":1},"Q03":{"name":"Breaking the Ice","description":"Win a fight with another player.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":3},"Q04":{"name":"Finding Nemo","description":"Escort the goldfish from the lake to the sea in the north. Move only through hexes along the longest river!","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"Q05":{"name":"Parley?","description":"Find pirates and offer them an item.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"Q06":{"name":"Wanted!","description":"Find these criminal pirates and defeat them!","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":1},"Q07":{"name":"Self-sacrifice","description":"Sacrifice your life for eternal glory!","behaviour":"Removes <b>2 HP</b></br>Adds <b>1 MP</b> on complete","onComplete":[["modAttr","hp",-2],["modAttr","mp",1]],"quantity":1},"Q08":{"name":"Your Lucky Day","description":"Leprechaun appeared! Pick 3 item cards and choose one. Then the next player in line chooses from remaining cards.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":1},"Q09":{"name":"Kiss of Love","description":"Go to the marshes and kiss the princess who was turned into a poisonous frog.","behaviour":"Removes <b>1 HP</b></br>Adds <b>1 MP</b> on complete","onComplete":[["modAttr","hp",-1],["modAttr","mp",1]],"quantity":1},"Q10":{"name":"Find the Drunk Master","description":"Roll the dice when you're in town. If you have rolled 6, you will see the drunk master.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":2},"WQ1":{"name":"Tough One","description":"Hunt down the stone giant in the highlands.","behaviour":"Adds <b>2 MP</b> on complete","onComplete":[["modAttr","mp",2]],"quantity":1},"WQ2":{"name":"Waidmanns Heil","description":"Hunt the centaur in the forest.","behaviour":"Adds <b>2 MP</b> on complete","onComplete":[["modAttr","mp",2]],"quantity":1},"WQ3":{"name":"Venomous Foe","description":"Hunt down the Great Manticore in the desert.","behaviour":"Adds <b>3 MP</b> on complete","onComplete":[["modAttr","mp",3]],"quantity":1}}
+{"Q.01":{"name":"Rightful Owner","description":"Hey! That belonges to me NOW. Defeat any player and steal one of their items.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":3},"Q.02":{"name":"The Catcher in the Rye","description":"Take the mischievous gnome out of the farmland and lead him 10 hexes away from the crops.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":1},"Q.03":{"name":"Breaking the Ice","description":"There is always a good time for a fight. Win a duel with another player.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":3},"Q.04":{"name":"Finding Nemo","description":"Escort the goldfish from the lake to the sea in the north. Move only through hexes along the longest river!","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"Q.05":{"name":"Parley?","description":"A hidee hidee hidee ho! Find pirates and offer them an item.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"Q.06":{"name":"Wanted!","description":"Find these pirates and send them straight to the Davy Jones' Locker! For defeating them you'll be awarded.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":1},"Q.07":{"name":"Self-sacrifice","description":"You're a madman. Sacrifice your life for eternal glory!","behaviour":"Removes <b>2 HP</b></br>Adds <b>1 MP</b> on complete","onComplete":[["modAttr","hp",-2],["modAttr","mp",1]],"quantity":1},"Q.08":{"name":"Your Lucky Day","description":"Leprechaun has appeared! Pick 3 item cards and choose one. Then the next player in line chooses from remaining cards.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":1},"Q.09":{"name":"Kiss of Love","description":"Go to the marshes and kiss the princess who was turned into a poisonous frog. Be a man and break her curse.","behaviour":"Removes <b>1 HP</b></br>Adds <b>1 MP</b> on complete","onComplete":[["modAttr","hp",-1],["modAttr","mp",1]],"quantity":1},"Q.10":{"name":"Find the Drunk Master","description":"Psst! There is a rumor that the Drunk Master is back in town. Always roll the dice when you step into the town. If you roll 6, he'll give you a present.","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":2},"Q.11":{"name":"Smells like Seafood","description":"The old hermit crab has left its treasures for you. Find and search his shell (U07).","behaviour":"<em>Draw <b>2 </b> item cards on complete</em>","onComplete":"","quantity":1},"Q.12":{"name":"Sailor's Repose","description":"The lighthouse keeper took an arrow in the knee! He asks you to be the one to light the northern lighthouse today (B14).","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"Q.13":{"name":"Hey Kappa Kappa","description":"The vicious Kappa is attacking innocent residents of the nearby town. Defeat the creature and gain the citizens' favour!","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"Q.14":{"name":"The Olympic Cruise","description":"Hold your horses and find yourself a ship. This is a time to sink into the real adventure! Swim through five ice rocks.","behaviour":"Adds <b>2 MP</b> on complete","onComplete":[["modAttr","mp",2]],"quantity":2},"Q.15":{"name":"You've Got a Friend in Me","description":"Little Yeti is lonely and would like to have someone to play with. Stay with him on his mountain for two turns.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":2},"WQ.1":{"name":"Tough One","description":"Hunt down the stone giant in the highlands. But be ready for some tough fight.","behaviour":"Adds <b>2 MP</b> on complete","onComplete":[["modAttr","mp",2]],"quantity":1},"WQ.2":{"name":"Waidmanns Heil","description":"The hunters' song has risen. The hunt for the centaur in the forest has started!","behaviour":"Adds <b>2 MP</b> on complete","onComplete":[["modAttr","mp",2]],"quantity":1},"WQ.3":{"name":"Venomous Foe","description":"Beware of the Great Manticore! The monster lies in the desert. Hunt it down if you can...","behaviour":"Adds <b>3 MP</b> on complete","onComplete":[["modAttr","mp",3]],"quantity":1},"WQ.4":{"name":"Aquatic Noodle","description":"The sea serpent is sinking ships. Kill it and restore a peace to the seas.","behaviour":"Adds <b>1 MP</b> on complete","onComplete":[["modAttr","mp",1]],"quantity":1},"WQ.5":{"name":"Friends with nature","description":"Generous Leshy will give the items he found in his forest to the first person who finds him!","behaviour":"<em>Draw an item card on complete</em>","onComplete":"","quantity":2},"WQ.6":{"name":"A Song of Ice and Fire","description":"Seek one stone cold and the other hot-blooded. Stand once on both vulcanos (G33 & I31).","behaviour":"Adds <b>2 MP</b> on complete","onComplete":[["modAttr","mp",2]],"quantity":1},"WQ.7":{"name":"Time for Castling","description":"Stand on the castle field and defend it for 3 turns. Be careful! The sands are hot and the countdown resets if you leave the castle grounds.","behaviour":"Adds <b>3 MP</b> on complete","onComplete":[["modAttr","mp",3]],"quantity":1}}

src/data/reverses.json

@@ -0,0 +1 @@
+{"I":{"url":"https://www.freeiconspng.com/uploads/swap-bag-icon-18.png"},"Q":{"url":"https://icon-library.com/images/scroll-icon/scroll-icon-26.jpg"},"WQ":{"url":"https://cdn.icon-icons.com/icons2/390/PNG/512/scroll-unfurled_38914.png"}}

src/index.css

@@ -90,6 +90,9 @@
 .playing-card {
     width: 70mm; 
     height: 97mm;
+    box-shadow: inset 0 0 1em gray;
+    border-radius: 0.5em;
+    border-width: 0.15em;
 }
 
 @media print

src/pages/Deck.jsx

@@ -57,7 +57,7 @@ function Deck() {
             <div class="row">
                 <For each={props.batch}> 
                 {(card)=>
-                    <Reverse category={keys[card.key]}/>
+                    <Reverse id={card.id} category={keys[card.key]}/>
                 }
                 </For> 
             </div>
@@ -66,6 +66,9 @@ function Deck() {
 
 	return (
 		<div class="container py-4 center a4">
+            <style>
+                @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600&family=Della+Respira&display=swap');
+            </style> 
             <div class="row no-print">
                 <div class="col-auto my-auto">
                     <BackButton href="/" />
@@ -85,8 +88,8 @@ function Deck() {
                     <>
                         <Faces batch={batch} />
                         <br />
-                        {/*<Reverses batch={batch} />
-                        <br />*/}
+                        <Reverses batch={batch} />
+                        <br />
                     </>
                 }
                 </For>
@@ -96,23 +99,3 @@ function Deck() {
 }
 
 export default Deck;
-
-/*
-<div class="row">
-                <Face />
-                <Face />
-                <Face />
-                <Face />
-                <Face />
-                <Face />
-                <Face />
-                <Face />
-                </div>
-                <br />
-                <div class="row">
-                <Face />
-                <Face />
-                <Face />
-                <Face />
-                </div>
-*/

src/pages/components/Cards.jsx

@@ -1,4 +1,4 @@
-import { categories } from "../../Data";
+import { categories, reverses } from "../../Data";
 import { parseHTML } from "../../Utils";
 
 export function Face(props) {
@@ -7,19 +7,24 @@ export function Face(props) {
         <div class="card border-secondary playing-card ms-1 my-1">
             <h5 class="my-2">{props.id}</h5>
             <div class="pe-2 ps-2">
-                <h5 class="card-title text-center mb-2">{card.name}</h5>
-                <p class="card-text justify-text">{parseHTML(card.description)}</p>
-                <p class="card-text text-center my-2">{parseHTML(card.behaviour)}</p>
+                <h5 class="card-title text-center mb-2 my-2" style="font-family: 'Cinzel', serif;">{card.name}</h5>
+                <div class="my-4" style="font-family: 'Della Respira', serif;">
+                    <p class="card-text justify-text">{parseHTML(card.description)}</p>
+                    <p class="card-text text-center my-2">{parseHTML(card.behaviour)}</p>
+                </div>
             </div>
-            <h6 class="card-subtitle text-muted text-center my-auto mb-3">{props.category.toUpperCase()}</h6>
+            <h6 class="card-subtitle text-muted text-center my-auto mb-3" style="font-family: 'Cinzel', serif;">{props.category.toUpperCase()}</h6>
         </div>
     );
 }
 
-export function Reverse() {
+export function Reverse(props) {
+    const id = props.id.substring(0, props.id.indexOf('.'));
     return(
         <div class="card border-secondary playing-card ms-1 my-1">
-
+            <div class="text-center my-auto" style="filter: invert(71%) sepia(3%) saturate(22%) hue-rotate(328deg) brightness(101%) contrast(86%);">
+                <img src={reverses[id]?.url} width="100" height="100" />
+            </div>
         </div>
     );
 }