hibak.txt feladatai

This commit is contained in:
2025-10-22 09:30:09 +02:00
parent ad5f13a8e1
commit 825e9d1a08
8 changed files with 293 additions and 139 deletions
@@ -7,6 +7,8 @@ import TaskCardEditor from "./TaskCardEditor.jsx"
import JokerCardEditor from "./JokerCardEditor.jsx"
import LuckCardEditor from "./LuckCardEditor.jsx"
import CardPreview from "./CardPreview.jsx"
import { notifySuccess, notifyError,notifyWarning } from "../../components/Toastify/toastifyServices"
export default function CardEditor({ card, isCreating, cardType, onSave, onCancel }) {
const [cardData, setCardData] = useState(null)
@@ -65,33 +67,24 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
}
}, [card, isCreating, cardType])
const handleSave = () => {
if (!cardData) return
// Validáció
if (!validateCard(cardData)) return
onSave(cardData)
}
const validateCard = (data) => {
if (data.type === 'task') {
if (!data.question && !data.statement) {
alert("Kérdés vagy állítás megadása kötelező!")
notifyError("Kérdés vagy állítás megadása kötelező!")
return false
}
if (data.subType === 'quiz' && data.options.some(opt => !opt.trim())) {
alert("Minden válaszlehetőséget ki kell tölteni!")
notifyError("Minden válaszlehetőséget ki kell tölteni!")
return false
}
} else if (data.type === 'joker') {
if (!data.text || !data.text.trim()) {
alert("Joker kártya szövege nem lehet üres!")
notifyError("Joker kártya szövege nem lehet üres!")
return false
}
} else if (data.type === 'luck') {
if (!data.text || !data.text.trim()) {
alert("Szerencse kártya szövege nem lehet üres!")
notifyError("Szerencse kártya szövege nem lehet üres!")
return false
}
}
@@ -103,6 +96,19 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
setCardData(prev => prev ? { ...prev, ...updates } : null)
}
const handleSave = () => {
if (!cardData) return
if (!validateCard(cardData)) return
try {
onSave(cardData)
notifySuccess('Kártya sikeresen mentve!')
} catch (error) {
notifyError('Hiba történt a kártya mentése során: ' + (error?.message || String(error)))
}
}
// Ha nincs kiválasztott kártya vagy új kártya létrehozás
if (!cardData) {
return (
@@ -134,7 +140,7 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
</div>
<div>
<h2 className="text-xl font-bold text-[color:var(--color-text)]">
{isCreating ? 'Új' : 'Szerkesztés'} {' '}
{isCreating ? 'Új' : 'Szerkesztés'}{' '}
{cardData.type === 'task' && 'Feladat kártya'}
{cardData.type === 'joker' && 'Joker kártya'}
{cardData.type === 'luck' && 'Szerencse kártya'}
@@ -157,8 +163,8 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
onClick={() => setShowPreview(!showPreview)}
className={`
flex items-center gap-2 px-4 py-2 rounded-xl font-medium transition-all duration-200
${showPreview
? 'bg-[color:var(--color-success)] text-[color:var(--color-text-inverse)]'
${showPreview
? 'bg-[color:var(--color-success)] text-[color:var(--color-text-inverse)]'
: 'bg-[color:var(--color-background)] text-[color:var(--color-text)] hover:bg-[color:var(--color-surface-selected)]'
}
`}
@@ -168,12 +174,15 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
</button>
<button
onClick={onCancel}
className="flex items-center gap-2 px-4 py-2 rounded-xl bg-[color:var(--color-background)] hover:bg-[color:var(--color-surface-selected)] text-[color:var(--color-text)] transition-all duration-200"
>
<FaTimes />
Mégse
</button>
onClick={() => {
notifyWarning('Kártya készítés megszakítva')
onCancel()
}}
className="flex items-center gap-2 px-4 py-2 rounded-xl bg-[color:var(--color-background)] hover:bg-[color:var(--color-surface-selected)] text-[color:var(--color-text)] transition-all duration-200"
>
<FaTimes />
Mégse
</button>
<button
onClick={handleSave}
@@ -189,12 +198,10 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
{/* Content */}
<div className="flex-1 overflow-hidden">
{showPreview ? (
/* Preview Mode */
<div className="h-full bg-[color:var(--color-background)] flex items-center justify-center p-6">
<CardPreview card={cardData} />
</div>
) : (
/* Edit Mode */
<div className="h-full overflow-y-auto p-6">
{cardData.type === 'task' && (
<TaskCardEditor
@@ -221,4 +228,4 @@ export default function CardEditor({ card, isCreating, cardType, onSave, onCance
</div>
</div>
)
}
}
@@ -63,7 +63,7 @@ const LandingPage = ({ onNavigateToPlay, onNavigateToAuth }) => {
{/* If not authenticated show Login/Register; if authenticated show Home button */}
{!auth ? (
<>
<ButtonGreen text="Bejelntekezés" onClick={onNavigateToPlay} width="w-60" />
<ButtonGreen text="Bejelentkezés" onClick={onNavigateToPlay} width="w-60" />
<ButtonGreen text="Regisztráció" onClick={onNavigateToAuth} width="w-60" />
</>
) : (
@@ -37,29 +37,29 @@ const Navbar = () => {
{isLoggedIn ? (
<>
<Link to="/home" className={navLinkClass}>
Home
Főoldal
</Link>
<Link to="/decks" className={navLinkClass}>
Decks
Paklik
</Link>
<Link to="/report" className={navLinkClass}>
Stats
Statisztika
</Link>
</>
) : (
<Link to="/" className={navLinkClass}>
Home
Főoldal
</Link>
)}
<Link to="/about" className={navLinkClass}>
About
Rólunk
</Link>
<Link to="/companies" className={navLinkClass}>
Contact
Kapcsolat
</Link>
{!isLoggedIn && (
<Link to="/home" className={navLinkClassPlay}>
Play
Játék
</Link>
)}
{isLoggedIn && (
@@ -120,21 +120,21 @@ const Navbar = () => {
<div className="md:hidden bg-emerald-600 px-2 pt-2 pb-3 space-y-1">
{isLoggedIn ? (
<Link to="/home" className={navLinkClass}>
Home
Főoldal
</Link>
) : (
<Link to="/" className={navLinkClass}>
Home
Főoldal
</Link>
)}
<Link to="/leaderboard" className={navLinkClass}>
Leaderboard
Ranglista
</Link>
<Link to="/about" className={navLinkClass}>
About
Rólunk
</Link>
<Link to="/companies" className={navLinkClass}>
Contact
Kapcsolat
</Link>
{!isLoggedIn && (
<div className="px-2">
@@ -0,0 +1,165 @@
import { toast, ToastContainer, Bounce } from "react-toastify";
import "react-toastify/dist/ReactToastify.css";
/**
* 🔧 Ezt csak egyszer kell betenni az App.jsx-be!
* <ToastConfig /> = az a komponens, ami kirendereli a toastokat
*/
export const ToastConfig = () => (
<ToastContainer
position="bottom-right"
autoClose={5000}
hideProgressBar={false}
newestOnTop={false}
closeOnClick={false}
rtl={false}
pauseOnFocusLoss
draggable
pauseOnHover
theme="light"
transition={Bounce}
/>
);
/**
* 🦄 Alapértelmezett toast üzenet (semleges)
* notify("Üzenet szövege")
*/
export const notify = (message) => {
toast(message, {
position: "bottom-right",
autoClose: 5000,
hideProgressBar: false,
closeOnClick: false,
pauseOnHover: true,
draggable: true,
theme: "light",
transition: Bounce,
});
};
/**
* ✅ Sikeres művelethez
* notifySuccess("Sikeres mentés!")
*/
export const notifySuccess = (message) => {
toast.success(message, {
position: "bottom-right",
autoClose: 4000,
theme: "light",
transition: Bounce,
});
};
/**
* ❌ Hibás művelethez
* notifyError("Hiba történt a mentés során!")
*/
export const notifyError = (message) => {
toast.error(message, {
position: "bottom-right",
autoClose: 5000,
theme: "light",
transition: Bounce,
});
};
/**
* ️ Információs üzenethez
* notifyInfo("Friss adatok betöltve!")
*/
export const notifyInfo = (message) => {
toast.info(message, {
position: "bottom-right",
autoClose: 4000,
theme: "light",
transition: Bounce,
});
};
/**
* ⚠️ Figyelmeztetéshez
* notifyWarning("Figyelem! Nem mentett módosítások vannak!")
*/
export const notifyWarning = (message) => {
toast.warn(message, {
position: "bottom-right",
autoClose: 4000,
theme: "light",
transition: Bounce,
});
};
// import React, { useState } from "react";
// import { notifyWarning } from "../../components/Toastify/toastifyServices";
// function AuthLogin() {
// const [email, setEmail] = useState("");
// const [password, setPassword] = useState("");
// const handleLogin = async (e) => {
// e.preventDefault();
// // Példa jelszó ellenőrzés logikára:
// if (password !== "titkosjelszo123") {
// notifyWarning("⚠️ Hibás jelszó! Kérlek próbáld újra.");
// return;
// }
// // Ha jó a jelszó:
// notifySuccess("✅ Sikeres bejelentkezés!");
// };
// return (
// <form onSubmit={handleLogin} className="login-form">
// <input
// type="email"
// placeholder="Email cím"
// value={email}
// onChange={(e) => setEmail(e.target.value)}
// />
// <input
// type="password"
// placeholder="Jelszó"
// value={password}
// onChange={(e) => setPassword(e.target.value)}
// />
// <button type="submit">Bejelentkezés</button>
// </form>
// );
// }
// export default AuthLogin;
// meghivas
// import { toast } from "react-toastify";
// // 🔔 Alap toast
// export const notify = (msg) => toast(msg);
// // ✅ Sikeres üzenet
// export const notifySuccess = (msg) => toast.success(msg);
// // ⚠️ Figyelmeztetés
// export const notifyWarning = (msg) => toast.warning(msg);
// // ❌ Hiba
// export const notifyError = (msg) => toast.error(msg);
// // ️ Információ
// export const notifyInfo = (msg) => toast.info(msg);
// hasznalat
// import { notifyWarning } from "../../components/Toastify/toastifyServices";
// if (password !== "titkos") {
// notifyWarning("⚠️ Hibás jelszó!");
// }