fegyver specializations should use fegyver DB

src/components/Felszereles.tsx

@@ -1,21 +1,30 @@
 import React from "react";
 import {Fegyver, KarakterFelszereles, PancelTypeLabel} from "../domain-models/felszereles";
-import {Osztaly, OsztalyAllowedFegyver, OsztalyAllowedPancelTypes} from '../domain-models/osztaly'
+import {Osztaly, OsztalyAllowedFegyver} from '../domain-models/osztaly'
+import {AllowedPancelTypes} from '../domain-models/allowed-pancel-types'
 import pancelok from '../domain-models/pancel.json'
 import pajzsok from '../domain-models/pajzs.json'
 import fegyverek from '../domain-models/fegyver.json'
 import {arraySetN} from "../util";
 
+export function FegyverLabel(fegyver: Fegyver): string {
+    return `${fegyver.Name}${fegyver.Ketkezes ? '+' : ''}${fegyver.Egzotikus ? '(E)' : ''} | ${
+        fegyver.NumberOfDamageDice}d${fegyver.DamageDice} ${
+        fegyver.CritRangeStart < 20 ? `${fegyver.CritRangeStart}-20` : ''}x${fegyver.CritMultiplier}${
+        fegyver.Price > 0 ? ` | ár: ${fegyver.Price} at ` : ''}${
+        fegyver.Range > 0 ? ` | táv: ${fegyver.Range}` : ''}`
+}
+
 function Felszereles(props: {felszereles: KarakterFelszereles, changeFelszereles: (felszereles: KarakterFelszereles) => void, osztaly: Osztaly}) {
     const { felszereles, changeFelszereles, osztaly } = props;
-    const allowedPancelTypes = OsztalyAllowedPancelTypes(osztaly)
+    const allowedPancelTypes = AllowedPancelTypes([osztaly])
     const valasztottFegyverek = felszereles.fegyverIDk
-            .map((id, idx) => ({idx, fegyver: fegyverek.fegyverek.find(f => f.ID === id)})).filter((x) => x.fegyver != null).map(({idx, fegyver}) => ({idx, fegyver: fegyver as Fegyver}))
+            .map((id, idx) => ({idx, fegyver: fegyverek.data.find(f => f.ID === id)})).filter((x) => x.fegyver != null).map(({idx, fegyver}) => ({idx, fegyver: fegyver as Fegyver}))
 
     const osztalyAllowedFegyverek = OsztalyAllowedFegyver(osztaly)
     const allowedFegyverek = [...osztalyAllowedFegyverek, ...valasztottFegyverek.filter(({idx, fegyver}) => !osztalyAllowedFegyverek.map(f => f.ID).includes(fegyver.ID)).map(({fegyver}) => fegyver)]
     const changeFegyver = (idx: number, newID: string) => {
-        const found = fegyverek.fegyverek.find(x => x.ID === newID)
+        const found = fegyverek.data.find(x => x.ID === newID)
         if (!found) {
             console.log('Nem létező fegyver ID: ', newID)
             return
@@ -49,10 +58,10 @@ function Felszereles(props: {felszereles: KarakterFelszereles, changeFelszereles
                 <label className='col-md-2 col-sm-3 col-form-label'>Fegyver</label>
                 <select className='col form-select' value={fegyver.ID} onChange={e => changeFegyver(idx, e.target.value)}>
                     <optgroup label="Közelharci">
-                        {allowedFegyverek.filter(f => f.Type === 'kozelharci').map(f => <option key={f.ID} value={f.ID}>{`${f.Name}`}</option>)}
+                        {allowedFegyverek.filter(f => f.Type === 'kozelharci').map(f => <option key={f.ID} value={f.ID}>{FegyverLabel(f)}</option>)}
                     </optgroup>
                     <optgroup label="Távolsági">
-                        {allowedFegyverek.filter(f => f.Type === 'lofegyver').map(f => <option key={f.ID} value={f.ID}>{`${f.Name}`}</option>)}
+                        {allowedFegyverek.filter(f => f.Type === 'lofegyver').map(f => <option key={f.ID} value={f.ID}>{FegyverLabel(f)}</option>)}
                     </optgroup>
                 </select>
                 <button className='col-md-2 col-sm-3 btn btn-outline-dark btn-lg ms-2' type='button' onClick={() => changeFelszereles({...felszereles, fegyverIDk: [...felszereles.fegyverIDk.slice(0, idx), ...felszereles.fegyverIDk.slice(idx+1)]})}>Elvesz</button>

src/components/HarcosFegyverSpecializacio.tsx

@@ -1,4 +1,6 @@
 import React from "react";
+import fegyverek from "../domain-models/fegyver.json"
+import {defaultFegyverID, GetFegyver} from "../domain-models/felszereles";
 
 function HarcosFegyverSpecializacio(props: {
     specialization: string,
@@ -12,16 +14,23 @@ function HarcosFegyverSpecializacio(props: {
         changeSpecialization,
         szint
     } = props
-    const hasError =  existingSpecializations.filter(x => x === specialization).length > (szint < 9 ? 1 : 2)
+    const fegyver = GetFegyver(specialization)
+    const hasError = existingSpecializations.filter(x => x === specialization).length > (szint < 9 ? 1 : 2)
     return <>
         <div className='row m-2'>
             <label className='col-md-2 col-sm-3 col-form-label' >Fegyver specializáció</label>
-            <input className='col form-control'
-                   value={specialization}
-                   onChange={(e) => changeSpecialization(e.target.value)}/>
+            <select className='col form-select' value={fegyver?.ID || defaultFegyverID} onChange={e => changeSpecialization(e.target.value)}>
+                <optgroup label="Közelharci">
+                    {fegyverek.data.filter(f => f.Type === 'kozelharci').map(f => <option key={f.ID} value={f.ID}>{f.Name}</option>)}
+                </optgroup>
+                <optgroup label="Távolsági">
+                    {fegyverek.data.filter(f => f.Type === 'lofegyver').map(f => <option key={f.ID} value={f.ID}>{f.Name}</option>)}
+                </optgroup>
+            </select>
+            {fegyver == null && <span className='form-field-error'>Ismeretlen fegyver: {specialization}</span>}
             {hasError && <span className='form-field-error'>Már {szint < 9 ? '' : 'kétszer is'} választottad ezt a fegyvert!</span>}
         </div>
     </>
 }
 
-export default HarcosFegyverSpecializacio
+export default HarcosFegyverSpecializacio

src/components/KalozKritikus.tsx

@@ -1,9 +1,10 @@
 import React from "react";
+import fegyverek from "../domain-models/fegyver.json"
 
 function KalozKritikus(props: {
     krit: string,
     existingKrits: string[],
-    changeKrit: (specialization: string) => void,
+    changeKrit: (krit: string) => void,
     szint: number
 }) {
     const {
@@ -16,9 +17,14 @@ function KalozKritikus(props: {
     return <>
         <div className='row m-2'>
             <label className='col-md-2 col-sm-3 col-form-label'>Kritikus</label>
-            <input className='col form-control'
-                   value={krit}
-                   onChange={(e) => changeKrit(e.target.value)}/>
+            <select className='col form-select' value={krit} onChange={e => changeKrit(e.target.value)}>
+            <optgroup label="Közelharci">
+                {fegyverek.data.filter(f => f.Type === 'kozelharci').map(f => <option key={f.ID} value={f.ID}>{f.Name}</option>)}
+            </optgroup>
+            <optgroup label="Távolsági">
+                {fegyverek.data.filter(f => f.Type === 'lofegyver').map(f => <option key={f.ID} value={f.ID}>{f.Name}</option>)}
+            </optgroup>
+        </select>
             {hasError && <span className='form-field-error'>Már {szint < 9 ? '' : 'kétszer is'} választottad ezt a fegyvert!</span>}
         </div>
     </>

src/components/LevelUps.tsx

@@ -29,7 +29,9 @@ function LevelUp(props: {
     console.log('Specialization index: ' + specializationIndex.toString())
     const specialization = karakter.harcosSpecializaciok[specializationIndex]
     console.log(specialization)
-    const krit = karakter.kalozKritikus[Math.floor(szint/3)-1]
+    const kritIndex = Math.floor(szint/3)-1
+    const krit = karakter.kalozKritikus[kritIndex]
+    console.log(`kaloz krit @${szint}: ${krit}`)
 
     return <div key={`level-up-${szint}`}>
         <div className='row mt-3'>
@@ -54,7 +56,7 @@ function LevelUp(props: {
                 szint={szint}
             />
         }
-        {karakter.osztaly === Osztaly.Kaloz && szint % 3 === 0 &&
+        {karakter.osztaly === Osztaly.Kaloz && szint % 3 === 0 && !!krit &&
             <KalozKritikus
                 krit={krit}
                 existingKrits={karakter.kalozKritikus}

src/domain-models/allowed-pancel-types.ts

@@ -0,0 +1,20 @@
+import {PancelType} from "./felszereles";
+import {Osztaly} from "./osztaly";
+
+export function AllowedPancelTypes(osztalyok: Osztaly[]): PancelType[] {
+    return [...new Set(osztalyok.flatMap(osztalyAllowedPancelTypes))]
+}
+
+function osztalyAllowedPancelTypes(o: Osztaly): PancelType[] {
+    switch (o) {
+        case Osztaly.Amazon: return ['konnyu'];
+        case Osztaly.Barbar: return ['konnyu', 'kozepes', 'nehez'];
+        case Osztaly.Pap: return ['konnyu', 'kozepes', 'nehez'];
+        case Osztaly.Illuzionista: return [];
+        case Osztaly.Varazslo: return [];
+        case Osztaly.Harcos: return ['konnyu', 'kozepes', 'nehez'];
+        case Osztaly.Ijasz: return ['konnyu', 'kozepes'];
+        case Osztaly.Kaloz: return ['konnyu', 'kozepes'];
+        case Osztaly.Tolvaj: return ['konnyu']
+    }
+}

src/domain-models/fegyver.json

@@ -1,5 +1,5 @@
 {
-  "fegyverek": [
+  "data": [
     {
       "ID": "alabard",
       "Name": "Alabárd és más szálfegyverek",

src/domain-models/felszereles.ts

@@ -91,9 +91,11 @@ export function GetPajzs(id?: string): Pajzs | undefined {
 }
 
 export function GetFegyver(id: string): Fegyver | undefined {
-    return fegyverek.fegyverek.find(f => f.ID === id) as Fegyver | undefined
+    return fegyverek.data.find(f => f.ID === id) as Fegyver | undefined
 }
 
 export function GetFegyverek(ids: string[]): Fegyver[] {
     return ids.map(GetFegyver).filter(x => x != null).map(x => x as Fegyver)
-}
+}
+export const defaultFegyverID = 'okol'
+export const defaultFegyver = GetFegyver('okol')!

src/domain-models/level.ts

@@ -24,11 +24,11 @@ export function LevelUp(karakter: KarakterInputs, changeKarakter: (input: Karakt
     }
     let harcosSpecializaciok = karakter.harcosSpecializaciok
     if(karakter.osztaly === Osztaly.Harcos && szint % 2 === 1) {
-        harcosSpecializaciok = [...harcosSpecializaciok, "Csatabárd"]
+        harcosSpecializaciok = [...harcosSpecializaciok, "csatabard"]
     }
     let kalozKritikus = karakter.kalozKritikus
     if(karakter.osztaly === Osztaly.Kaloz && szint % 3 === 0) {
-        kalozKritikus = [...kalozKritikus, "Szablya"]
+        kalozKritikus = [...kalozKritikus, "szablya"]
     }
     changeKarakter({...karakter, szint, hpRolls, tulajdonsagNovelesek, harcosSpecializaciok, kalozKritikus})
 }

src/domain-models/osztaly.ts

@@ -1,5 +1,6 @@
-import {Fegyver, GetPancel, KarakterFelszereles, PancelType} from "./felszereles";
+import {Fegyver, GetPancel, KarakterFelszereles} from "./felszereles";
 import fegyverDB from './fegyver.json'
+import {AllowedPancelTypes} from "./allowed-pancel-types";
 
 export enum Osztaly {
     Harcos = 'o_harcos',
@@ -13,22 +14,8 @@ export enum Osztaly {
     Illuzionista = 'o_illuzionista',
 }
 
-export function OsztalyAllowedPancelTypes(o: Osztaly): PancelType[] {
-    switch (o) {
-        case Osztaly.Amazon: return ['konnyu'];
-        case Osztaly.Barbar: return ['konnyu', 'kozepes', 'nehez'];
-        case Osztaly.Pap: return ['konnyu', 'kozepes', 'nehez'];
-        case Osztaly.Illuzionista: return [];
-        case Osztaly.Varazslo: return [];
-        case Osztaly.Harcos: return ['konnyu', 'kozepes', 'nehez'];
-        case Osztaly.Ijasz: return ['konnyu', 'kozepes'];
-        case Osztaly.Kaloz: return ['konnyu', 'kozepes'];
-        case Osztaly.Tolvaj: return ['konnyu']
-    }
-}
-
 export function OsztalyAllowedFegyver(o: Osztaly): Fegyver[] {
-    const fegyverek = fegyverDB.fegyverek.map(x => x as Fegyver)
+    const fegyverek = fegyverDB.data.map(x => x as Fegyver)
     const nemEgzotikus = fegyverek.filter(f => !f.Egzotikus)
     const varazslo = fegyverek.filter(f => ['okol', 'bot', 'bunko', 'tor', 'parittya', 'dobotu'].includes(f.ID))
     const tolvaj = fegyverek.filter(f => ['okol', 'tor', 'parittya', 'rovid_ij', 'dobotu', 'konnyu_szamszerij', 'nehez_szamszerij', 'szablya', 'hosszu_kard', 'rovid_kard' ].includes(f.ID))
@@ -37,7 +24,7 @@ export function OsztalyAllowedFegyver(o: Osztaly): Fegyver[] {
         case Osztaly.Harcos:
         case Osztaly.Barbar:
         case Osztaly.Kaloz: return nemEgzotikus;
-        case Osztaly.Ijasz: return [...nemEgzotikus, fegyverDB.fegyverek.find(f => f.ID === 'visszacsapo_ij') as Fegyver]
+        case Osztaly.Ijasz: return [...nemEgzotikus, fegyverDB.data.find(f => f.ID === 'visszacsapo_ij') as Fegyver]
         // Note: Isteni fegyver barmi lehet istentol foggoen
         case Osztaly.Pap: return fegyverek;
         case Osztaly.Tolvaj: return tolvaj;
@@ -47,7 +34,7 @@ export function OsztalyAllowedFegyver(o: Osztaly): Fegyver[] {
 }
 
 export function SetFelszerelesForChangedOsztaly(o: Osztaly, felszereles: KarakterFelszereles, changeFelszereles: (f: KarakterFelszereles) => void) {
-    const allowedPancelTypes = OsztalyAllowedPancelTypes(o)
+    const allowedPancelTypes = AllowedPancelTypes([o])
     const pancel = GetPancel(felszereles.pancelID)
     if (pancel && !allowedPancelTypes.includes(pancel.Type)) {
         changeFelszereles({...felszereles, pancelID: undefined})

src/pages/CreateCharacter.tsx

@@ -105,7 +105,7 @@ function CreateCharacterPage() {
                             changeKarakter({
                                 ...karakter,
                                 osztaly: o,
-                                harcosSpecializaciok: (o === Osztaly.Harcos && karakter.harcosSpecializaciok.length === 0) ? ['Kard'] : karakter.harcosSpecializaciok,
+                                harcosSpecializaciok: (o === Osztaly.Harcos && karakter.harcosSpecializaciok.length === 0) ? ['hosszu_kard'] : karakter.harcosSpecializaciok,
                             })}
                     />
                     {karakter.osztaly === Osztaly.Harcos &&

tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2015",
     "lib": [
       "dom",
       "dom.iterable",