Safak/SWE
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Editoren erweitert

Browse Source
This commit is contained in:
Matthias Grief
2024-12-23 15:00:06 +01:00
parent 41346e9fdb
commit f9e4066352
3 changed files with 71 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

67
webseite/subjectEditor.php
View File

@@ -28,6 +28,7 @@ if (isset($_GET['subjectId'])) {
</head>
<body class="min-h-screen bg-gray-50">
<form id="subjectForm" onsubmit="handleSubjectSubmit(event)">
<div class="space-y-6">
<div>
@@ -38,7 +39,7 @@ if (isset($_GET['subjectId'])) {
class="w-full px-4 py-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 text-lg enabled:hover:border-gray-400"
placeholder="z.B. Mathematik"
value="<?php
if(isset($editingSubject)) {
if (isset($editingSubject)) {
echo $editingSubject->getDisplayName();
}
?>">
@@ -51,7 +52,7 @@ if (isset($_GET['subjectId'])) {
class="w-full px-4 py-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500 text-lg enabled:hover:border-gray-400"
rows="4"
placeholder="Kurze Beschreibung des Fachs"><?php
if(isset($editingSubject)) {
if (isset($editingSubject)) {
echo $editingSubject->getDescription();
}
?></textarea>
@@ -62,7 +63,7 @@ if (isset($_GET['subjectId'])) {
<input type="color" name="color" required
class="w-full h-14 px-1 py-1 rounded-lg"
value="<?php
if(isset($editingSubject)) {
if (isset($editingSubject)) {
echo $editingSubject->getColor();
} else {
echo "#3b82f6";
@@ -75,31 +76,29 @@ if (isset($_GET['subjectId'])) {
<div class="grid grid-cols-6 gap-4 p-4 border rounded-lg bg-gray-50">
<?php
$icons = [
['fa-book', 'Buch'],
['fa-square-root-alt', 'Mathematik'],
['fa-flask', 'Naturwissenschaften'],
['fa-language', 'Sprachen'],
['fa-music', 'Musik'],
['fa-palette', 'Kunst'],
['fa-dumbbell', 'Sport'],
['fa-globe', 'Erdkunde'],
['fa-clock', 'Geschichte'],
['fa-microscope', 'Biologie'],
['fa-atom', 'Physik'],
['fa-vial', 'Chemie'],
['fa-computer', 'Informatik'],
['fa-calculator', 'Rechnen'],
['fa-pen', 'Schreiben'],
['fa-theater-masks', 'Theater'],
['fa-draw-polygon', 'Geometrie'],
['fa-tablets', 'Medizin']
'fa-book',
'fa-square-root-alt',
'fa-flask',
'fa-language',
'fa-music',
'fa-palette',
'fa-dumbbell',
'fa-globe',
'fa-clock',
'fa-microscope',
'fa-atom',
'fa-vial',
'fa-calculator',
'fa-pen',
'fa-theater-masks',
'fa-draw-polygon',
'fa-tablets',
];
foreach ($icons as $index => [$icon, $label]) {
foreach ($icons as $icon) {
echo "<div class='icon-option cursor-pointer p-4 rounded-lg hover:bg-white hover:shadow transition-all text-center'
onclick='selectIcon(this, \"$icon\")' data-icon='$icon'>
<i class='fas $icon text-2xl mb-2'></i>
<div class='text-xs text-gray-600'>$label</div>
</div>";
}
?>
@@ -120,5 +119,27 @@ if (isset($_GET['subjectId'])) {
</div>
</form>
<script>
function selectIcon(element, iconName) {
// Remove active class from all icons
document.querySelectorAll('.icon-option').forEach(el => {
el.classList.remove('bg-blue-50', 'ring-2', 'ring-blue-500');
});
// Add active class to selected icon
element.classList.add('bg-blue-50', 'ring-2', 'ring-blue-500');
// Set the hidden input value and log it
const iconInput = document.getElementById('selectedIcon');
iconInput.value = iconName;
// Visual feedback
element.classList.add('scale-105');
setTimeout(() => {
element.classList.remove('scale-105');
}, 200);
}
</script>
</body>
</html>