From 199127843b018a1f024c007633cbe9949d8d6805 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?B=C3=A1lint=20M=C3=B3r=C3=A1sz?= <balint@morasz.hu>
Date: Tue, 10 Oct 2023 19:08:55 +0000
Subject: [PATCH] wip: add pancel ui

---
 src/components/Felszereles.tsx   | 32 ++++++++++++++++++
 src/domain-models/felszereles.ts | 58 ++++++++++++++++++++++++++++++++
 src/domain-models/karakter.ts    |  3 ++
 src/domain-models/pajzs.json     | 32 ++++++++++++++++++
 src/domain-models/pancel.json    | 30 -----------------
 src/pages/CreateCharacter.tsx    |  8 ++++-
 6 files changed, 132 insertions(+), 31 deletions(-)
 create mode 100644 src/components/Felszereles.tsx
 create mode 100644 src/domain-models/felszereles.ts
 create mode 100644 src/domain-models/pajzs.json

diff --git a/src/components/Felszereles.tsx b/src/components/Felszereles.tsx
new file mode 100644
index 0000000..80ec2e1
--- /dev/null
+++ b/src/components/Felszereles.tsx
@@ -0,0 +1,32 @@
+import React from "react";
+import { KarakterFelszereles, PancelTypes, PancelTypeLabel } from "../domain-models/felszereles";
+import pancelok from '../domain-models/pancel.json'
+import pajzsok from '../domain-models/pajzs.json'
+
+function Felszereles(props: {felszereles: KarakterFelszereles, changeFelszereles: (felszereles: KarakterFelszereles) => void}) {
+    const { felszereles, changeFelszereles } = props;
+    return <>
+        <div className='row m-2'>
+            <label className='col-md-2 col-sm-3 col-form-label'>Viselt páncél</label>
+            <select className='col form-select' value={felszereles.pancelID} onChange={e => changeFelszereles({...felszereles, pancelID: e.target.value === 'nincs' ? undefined : e.target.value})}>
+                <option key={'nincs'} value={'nincs'}>Nincs</option>
+                {
+                    PancelTypes.map(pancelType => (
+                        <optgroup label={PancelTypeLabel(pancelType)}>
+                            {pancelok[pancelType].map(p => <option key={p.ID} value={p.ID}>{`${p.Name} (+${p.VO} VO) - ${p.Price} at`}</option>)}
+                        </optgroup>
+                    ))
+                }
+            </select>
+        </div>
+        <div className='row m-2'>
+            <label className='col-md-2 col-sm-3 col-form-label'>Hordott pajzs</label>
+            <select className='col form-select' value={felszereles.pajzsID} onChange={e => changeFelszereles({...felszereles, pajzsID: e.target.value === 'nincs' ? undefined : e.target.value})}>
+                <option key={'nincs'} value={'nincs'}>Nincs</option>
+                {pajzsok['pajzs'].map(p => <option key={p.ID} value={p.ID}>{`${p.Name} (+${p.VO} VO) - ${p.Price} at`}</option>)}
+            </select>
+        </div>
+    </>
+}
+
+export default Felszereles
\ No newline at end of file
diff --git a/src/domain-models/felszereles.ts b/src/domain-models/felszereles.ts
new file mode 100644
index 0000000..d98d90f
--- /dev/null
+++ b/src/domain-models/felszereles.ts
@@ -0,0 +1,58 @@
+import pancel from "./pancel.json"
+
+export type PancelType = keyof typeof pancel
+
+export const PancelTypes: PancelType[] = ['konnyu', 'kozepes', 'nehez']
+
+export interface Pancel {
+    ID: string,
+    Name: string,
+    Type: 'konnyu' | 'kozepes' | 'nehez'
+    VO: number,
+    Price: number,
+}
+
+export interface Pajzs {
+    ID: string,
+    Name: string,
+    Type: 'pajzs'
+    VO: number,
+    Price: number,
+}
+
+export interface Fegyver {
+    ID: string,
+    Name: string,
+    Range: 'kozelharci' | 'tavolsagi'
+    Ketkezes: boolean,
+    Egzotikus: boolean,
+    Rohamtoro: boolean, 
+}
+
+export interface KarakterFelszereles {
+    pancelID?: string
+    pajzsID?: string
+    FegyverIDk: string[]
+}
+
+export const DefaultFelszereles: KarakterFelszereles = {
+    FegyverIDk: [],
+}
+
+export function PancelTypeLabel(type: PancelType): string {
+    let result = ''
+    switch(type) {
+        case 'konnyu': 
+            result = 'Könnyű'
+            break
+        case 'kozepes':
+            result = 'Közepes'
+            break
+        case 'nehez':
+            result = 'Nehéz'
+            break
+        default:
+            result = 'Egyéb páncél'
+    }
+    return result
+}
\ No newline at end of file
diff --git a/src/domain-models/karakter.ts b/src/domain-models/karakter.ts
index e688cea..bba9518 100644
--- a/src/domain-models/karakter.ts
+++ b/src/domain-models/karakter.ts
@@ -3,6 +3,7 @@ import {Osztaly} from "./osztaly";
 import {KarakterTulajdonsagok, Tulajdonsag, TulajdonsagDefaults} from "./tulajdonsag";
 import {KepzettsegId} from "./kepzettsegek";
 import {JellemID} from "./jellem";
+import { DefaultFelszereles, KarakterFelszereles } from './felszereles'
 
 export interface KarakterInputs {
     name: string,
@@ -20,6 +21,7 @@ export interface KarakterInputs {
     tulajdonsagNovelesek: Tulajdonsag[],
     harcosSpecializaciok: string[],
     kalozKritikus: string[],
+    felszereles: KarakterFelszereles,
 }
 
 export const KarakterDefaults: KarakterInputs = {
@@ -35,4 +37,5 @@ export const KarakterDefaults: KarakterInputs = {
     tulajdonsagNovelesek: [],
     harcosSpecializaciok: [],
     kalozKritikus: [],
+    felszereles: DefaultFelszereles,
 }
diff --git a/src/domain-models/pajzs.json b/src/domain-models/pajzs.json
new file mode 100644
index 0000000..bd4c55c
--- /dev/null
+++ b/src/domain-models/pajzs.json
@@ -0,0 +1,32 @@
+{
+    "pajzs": [
+        {
+            "ID": "kis_fa",
+            "Name": "Kis fapajzs ",
+            "Type": "pajzs",
+            "VO": 1,
+            "Price": 3
+        },
+        {
+            "ID": "kis_fem",
+            "Name": "Kis fémpajzs ",
+            "Type": "pajzs",
+            "VO": 1,
+            "Price": 9
+        },
+        {
+            "ID": "nagy_fa",
+            "Name": "Nagy fapajzs ",
+            "Type": "pajzs",
+            "VO": 2,
+            "Price": 7
+        },
+        {
+            "ID": "nagy_fem",
+            "Name": "Nagy fémpajzs ",
+            "Type": "pajzs",
+            "VO": 2,
+            "Price": 20
+        }
+    ]
+}
\ No newline at end of file
diff --git a/src/domain-models/pancel.json b/src/domain-models/pancel.json
index 54fb7be..c79e195 100644
--- a/src/domain-models/pancel.json
+++ b/src/domain-models/pancel.json
@@ -88,35 +88,5 @@
             "VO": 8,
             "Price": 800
         }
-    ],
-    "pajzs": [
-        {
-            "ID": "kis_fa",
-            "Name": "Kis fapajzs ",
-            "Type": "pajzs",
-            "VO": 1,
-            "Price": 3
-        },
-        {
-            "ID": "kis_fem",
-            "Name": "Kis fémpajzs ",
-            "Type": "pajzs",
-            "VO": 1,
-            "Price": 9
-        },
-        {
-            "ID": "nagy_fa",
-            "Name": "Nagy fapajzs ",
-            "Type": "pajzs",
-            "VO": 2,
-            "Price": 7
-        },
-        {
-            "ID": "nagy_fem",
-            "Name": "Nagy fémpajzs ",
-            "Type": "pajzs",
-            "VO": 2,
-            "Price": 20
-        }
     ]
 }
\ No newline at end of file
diff --git a/src/pages/CreateCharacter.tsx b/src/pages/CreateCharacter.tsx
index 9993723..31512eb 100644
--- a/src/pages/CreateCharacter.tsx
+++ b/src/pages/CreateCharacter.tsx
@@ -25,6 +25,7 @@ import {CanLevelUp, LevelDown, LevelUp} from "../domain-models/level";
 import {Card} from "react-bootstrap";
 import LevelUps from "../components/LevelUps";
 import HarcosFegyverSpecializacio from "../components/HarcosFegyverSpecializacio";
+import Felszereles from '../components/Felszereles';
 
 function CreateCharacterPage() {
 
@@ -126,9 +127,14 @@ function CreateCharacterPage() {
                     <MasodlagosErtekek {...CalculateMasodlagosErtekek({...karakter, tulajdonsagok: tulajdonsagokFajjal, szint: 1, hpRolls: []})} />
 
                     <hr />
-                    <LevelUps key={'level-ups'} karakter={karakter} changeKarakter={changeKarakter} />
+
+                    <Felszereles felszereles={karakter.felszereles} changeFelszereles={(f) => changeKarakter({...karakter, felszereles: f})} />
 
                     <hr />
+
+                    <LevelUps key={'level-ups'} karakter={karakter} changeKarakter={changeKarakter} />
+
+                    {karakter.szint > 1 &&  <hr />}
                     <div className='d-grid gap-2 m-5'>
                         {canLevelUp && <button className='btn btn-dark btn-lg' type='button' onClick={levelUp}>Szintlépés! ⇧</button> }
                         {!canLevelUp && karakter.szint < 10 &&