- {/* Header */}
-
-
-
- Joker Kártya Szerkesztő
-
-
-
- {/* Info box */}
-
+
@@ -86,28 +120,33 @@ export default function JokerCardEditor({ card, onChange }) {
+
- {/* Card text input */}
-
-
-
-
-
-
- Maximális hossz: 150 karakter
-
-
- {cardData.text.length}/150
-
-
+ {/* Kártya szövege */}
+
+
+
+ Kártya szövege
+
+
+
+
+
+
+
+ Maximális hossz: 150 karakter
+
+
+ {cardData.text.length}/150
+
@@ -147,6 +186,100 @@ export default function JokerCardEditor({ card, onChange }) {
)}
+
+ {/* Következmények (teljesítés esetén) */}
+
+
+ 🎯 Következmények (teljesítés esetén)
+
+
+
+ {/* Consequence Type */}
+
+
+
+
+ {consequenceTypes.find(t => t.value === (cardData.consequence?.type ?? 0))?.description}
+
+
+
+ {/* Consequence Value - csak ha előre/hátra lépés */}
+ {(cardData.consequence?.type === 0 || cardData.consequence?.type === 1) && (
+
+
+ updateConsequence('value', parseInt(e.target.value) || 1)}
+ className="w-full px-4 py-2 rounded-xl bg-[color:var(--color-background)] border border-[color:var(--color-surface-selected)] text-[color:var(--color-text)] focus:ring-2 focus:ring-[color:var(--color-success)] focus:border-transparent outline-none transition-all duration-200"
+ min="1"
+ max="10"
+ />
+
+ )}
+
+
+
+ {/* Következmények (nem teljesítés esetén) */}
+
+
+ ❌ Következmények (nem teljesítés esetén)
+
+
+
+ {/* Wrong Consequence Type */}
+
+
+
+
+ {consequenceTypes.find(t => t.value === (cardData.wrongConsequence?.type ?? 1))?.description}
+
+
+
+ {/* Wrong Consequence Value - csak ha előre/hátra lépés */}
+ {(cardData.wrongConsequence?.type === 0 || cardData.wrongConsequence?.type === 1) && (
+
+
+ updateWrongConsequence('value', parseInt(e.target.value) || 1)}
+ className="w-full px-4 py-2 rounded-xl bg-[color:var(--color-background)] border border-[color:var(--color-surface-selected)] text-[color:var(--color-text)] focus:ring-2 focus:ring-[color:var(--color-danger)] focus:border-transparent outline-none transition-all duration-200"
+ min="1"
+ max="10"
+ />
+
+ )}
+
+
)
}
\ No newline at end of file
diff --git a/SerpentRace_Frontend/src/components/DeckCreator/LuckCardEditor.jsx b/SerpentRace_Frontend/src/components/DeckCreator/LuckCardEditor.jsx
index f0dbb093..f59fcb76 100644
--- a/SerpentRace_Frontend/src/components/DeckCreator/LuckCardEditor.jsx
+++ b/SerpentRace_Frontend/src/components/DeckCreator/LuckCardEditor.jsx
@@ -4,17 +4,27 @@
import React, { useState, useEffect } from 'react'
import { FaDice, FaInfoCircle } from 'react-icons/fa'
+const consequenceTypes = [
+ { value: 0, label: '⬆️ Előre lépés', description: 'A játékos előre lép X mezőt' },
+ { value: 1, label: '⬇️ Hátra lépés', description: 'A játékos hátra lép X mezőt' },
+ { value: 2, label: '⏸️ Kör kihagyás', description: 'A játékos kihagy egy kört' },
+ { value: 3, label: '⏩ Extra kör', description: 'A játékos kap egy extra kört' },
+ { value: 5, label: '🏁 Vissza a starthoz', description: 'A játékos visszakerül a starthoz' }
+]
+
export default function LuckCardEditor({ card, onChange }) {
const [cardData, setCardData] = useState({
type: 'LUCK',
- text: ''
+ text: '',
+ consequence: { type: 0, value: 1 }
})
useEffect(() => {
if (card) {
setCardData({
type: 'LUCK',
- text: card.text || ''
+ text: card.text || '',
+ consequence: card.consequence || { type: 0, value: 1 }
})
}
}, [card])
@@ -31,19 +41,26 @@ export default function LuckCardEditor({ card, onChange }) {
}
}
- return (
-
-
- {/* Header */}
-
-
-
- Szerencse Kártya Szerkesztő
-
-
+ const updateConsequence = (field, value) => {
+ const newCardData = {
+ ...cardData,
+ consequence: {
+ ...cardData.consequence,
+ [field]: value
+ }
+ }
+ setCardData(newCardData)
+
+ if (onChange) {
+ onChange(newCardData)
+ }
+ }
- {/* Info box */}
-
+ return (
+
+ {/* Info box */}
+
+
@@ -60,28 +77,32 @@ export default function LuckCardEditor({ card, onChange }) {
+
- {/* Card text input */}
-
-
-
-
-
-
- Maximális hossz: 200 karakter
-
-
- {cardData.text.length}/200
-
-
+ {/* Kártya szövege */}
+
+
+
+ Kártya szövege
+
+
+
+
+
+
+ Maximális hossz: 200 karakter
+
+
+ {cardData.text.length}/200
+
@@ -100,6 +121,53 @@ export default function LuckCardEditor({ card, onChange }) {
)}
+
+ {/* Következmények */}
+
+
+ 🎯 Következmények
+
+
+
+ {/* Consequence Type */}
+
+
+
+
+ {consequenceTypes.find(t => t.value === (cardData.consequence?.type ?? 0))?.description}
+
+
+
+ {/* Consequence Value - csak ha előre/hátra lépés */}
+ {(cardData.consequence?.type === 0 || cardData.consequence?.type === 1) && (
+
+
+ updateConsequence('value', parseInt(e.target.value) || 1)}
+ className="w-full px-4 py-2 rounded-xl bg-[color:var(--color-background)] border border-[color:var(--color-surface-selected)] text-[color:var(--color-text)] focus:ring-2 focus:ring-[color:var(--color-luck)] focus:border-transparent outline-none transition-all duration-200"
+ />
+
+ )}
+
+
)
}
\ No newline at end of file
diff --git a/SerpentRace_Frontend/src/components/DeckCreator/TaskCardEditor.jsx b/SerpentRace_Frontend/src/components/DeckCreator/TaskCardEditor.jsx
index 0bbd0a16..cace7ed8 100644
--- a/SerpentRace_Frontend/src/components/DeckCreator/TaskCardEditor.jsx
+++ b/SerpentRace_Frontend/src/components/DeckCreator/TaskCardEditor.jsx
@@ -20,6 +20,14 @@ const timeLimits = [
{ value: 120, label: '2 perc' }
]
+const consequenceTypes = [
+ { value: 0, label: '⬆️ Előre lépés', description: 'A játékos előre lép X mezőt' },
+ { value: 1, label: '⬇️ Hátra lépés', description: 'A játékos hátra lép X mezőt' },
+ { value: 2, label: '⏸️ Kör kihagyás', description: 'A játékos kihagy egy kört' },
+ { value: 3, label: '⏩ Extra kör', description: 'A játékos kap egy extra kört' },
+ { value: 5, label: '🏁 Vissza a starthoz', description: 'A játékos visszakerül a starthoz' }
+]
+
export default function TaskCardEditor({ card, onChange }) {
const updateField = (field, value) => {
@@ -81,6 +89,26 @@ export default function TaskCardEditor({ card, onChange }) {
onChange({ acceptedAnswers: newAnswers })
}
+ const updateConsequence = (field, value) => {
+ const currentConsequence = card.consequence || { type: 0, value: 1 }
+ onChange({
+ consequence: {
+ ...currentConsequence,
+ [field]: value
+ }
+ })
+ }
+
+ const updateWrongConsequence = (field, value) => {
+ const currentWrongConsequence = card.wrongConsequence || { type: 1, value: 1 }
+ onChange({
+ wrongConsequence: {
+ ...currentWrongConsequence,
+ [field]: value
+ }
+ })
+ }
+
return (
{/* Feladat típus választó */}
@@ -513,6 +541,100 @@ export default function TaskCardEditor({ card, onChange }) {
+
+ {/* Következmények (helyes válasz esetén) */}
+
+
+ 🎯 Következmények (helyes válasz esetén)
+
+
+
+ {/* Consequence Type */}
+
+
+
+
+ {consequenceTypes.find(t => t.value === (card.consequence?.type ?? 0))?.description}
+
+
+
+ {/* Consequence Value - csak ha előre/hátra lépés */}
+ {(card.consequence?.type === 0 || card.consequence?.type === 1) && (
+
+
+ updateConsequence('value', parseInt(e.target.value) || 1)}
+ className="w-full px-4 py-2 rounded-xl bg-[color:var(--color-background)] border border-[color:var(--color-surface-selected)] text-[color:var(--color-text)] focus:ring-2 focus:ring-[color:var(--color-success)] focus:border-transparent outline-none transition-all duration-200"
+ min="1"
+ max="10"
+ />
+
+ )}
+
+
+
+ {/* Következmények (rossz válasz esetén) */}
+
+
+ ❌ Következmények (rossz válasz esetén)
+
+
+
+ {/* Wrong Consequence Type */}
+
+
+
+
+ {consequenceTypes.find(t => t.value === (card.wrongConsequence?.type ?? 1))?.description}
+
+
+
+ {/* Wrong Consequence Value - csak ha előre/hátra lépés */}
+ {(card.wrongConsequence?.type === 0 || card.wrongConsequence?.type === 1) && (
+
+
+ updateWrongConsequence('value', parseInt(e.target.value) || 1)}
+ className="w-full px-4 py-2 rounded-xl bg-[color:var(--color-background)] border border-[color:var(--color-surface-selected)] text-[color:var(--color-text)] focus:ring-2 focus:ring-[color:var(--color-danger)] focus:border-transparent outline-none transition-all duration-200"
+ min="1"
+ max="10"
+ />
+
+ )}
+
+
)
}
\ No newline at end of file
diff --git a/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx b/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx
index f3d382b3..5226cc2e 100644
--- a/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx
+++ b/SerpentRace_Frontend/src/pages/DeckCreator/DeckCreator.jsx
@@ -51,9 +51,16 @@ export default function DeckCreator() {
const handleSaveDeck = async () => {
try {
+ // Konvertálás: Frontend string -> Backend enum number
+ const typeMapping = {
+ 'LUCK': 0,
+ 'JOKER': 1,
+ 'QUESTION': 2
+ }
+
const payload = {
name: deck.name,
- type: deck.type,
+ type: typeMapping[deck.type] ?? 2, // Alapértelmezett: QUESTION
ctype: deck.privacy === 'public' ? 'PUBLIC' : 'PRIVATE',
description: deck.description || '',
cards: deck.cards
@@ -95,18 +102,30 @@ export default function DeckCreator() {
const handleSaveCard = (cardData) => {
try {
+ // Biztosítjuk az alapértelmezett consequence értékeket
+ const defaultConsequence = { type: 0, value: 1 }
+ const defaultWrongConsequence = { type: 1, value: 1 }
+
const updatedCard = {
...cardData,
- id: isCreatingCard ? Date.now() : cardData.id
+ id: isCreatingCard ? Date.now() : cardData.id,
+ consequence: cardData.consequence || defaultConsequence,
+ // wrongConsequence csak QUESTION és JOKER típusoknál
+ ...(cardData.type === 'QUESTION' || cardData.type === 'JOKER'
+ ? { wrongConsequence: cardData.wrongConsequence || defaultWrongConsequence }
+ : {}
+ )
}
+ let wasInvalidCardDeleted = false
+
setDeck(prev => {
// Ellenőrizzük, vannak-e nem megfelelő típusú kártyák
const invalidCards = prev.cards.filter(card => card.type !== prev.type)
// Ha új kártyát mentünk megfelelő típussal és vannak nem megfelelők
if (isCreatingCard && cardData.type === prev.type && invalidCards.length > 0) {
- notifyWarning(`${invalidCards.length} db nem megfelelő típusú kártya törlésre került`)
+ wasInvalidCardDeleted = true
return {
...prev,
@@ -130,7 +149,13 @@ export default function DeckCreator() {
setIsCreatingCard(false)
setNewCardType(null)
- notifySuccess('Kártya sikeresen mentve!')
+ // Csak egy értesítés
+ if (wasInvalidCardDeleted) {
+ const invalidCount = deck.cards.filter(card => card.type !== deck.type).length
+ notifyWarning(`Kártya mentve! ${invalidCount} db nem megfelelő típusú kártya törlésre került.`)
+ } else {
+ notifySuccess('Kártya sikeresen mentve!')
+ }
} catch (error) {
console.error('Kártya mentési hiba:', error)
notifyError('Hiba történt a kártya mentése során')