⚛️ Animal Activities of Kingston 🌐

\n\n \n\n {view === \"students\" && (\n <>\n

🎓 Student Records

\n \n \n \n \n \n \n \n \n \n \n \n {students.map((student) => (\n \n \n \n \n \n \n \n ))}\n \n

Name	Grade	Age	Email	Actions
{student.name}	{student.grade}	{student.age}	{student.email}	\n deleteStudent(student.id)}\n className=\"delete-btn\"\n >\n 🗑️ Delete\n \n

\n \n )}\n\n {view === \"attendance\" && (\n

📊 Attendance Tracker

\n \n \n \n \n \n \n \n \n \n \n \n {students.map((student) => {\n const studentAttendance = attendance.find(a => a.studentId === student.id);\n return (\n \n \n \n \n \n \n \n );\n })}\n \n

Student	Date	Status	Details	Actions
{student.name}	{new Date().toLocaleDateString()}	\n {studentAttendance?.status \|\| \"Not Marked\"}\n	\n {studentAttendance?.time && studentAttendance.status === \"Late\"\n ? `Late at ${studentAttendance.time}`\n : \"-\"}\n	\n markAttendance(student.id, \"Present\")}\n className=\"present-btn\"\n >\n ✅ Present\n \n markAttendance(student.id, \"Late\")}\n className=\"late-btn\"\n >\n ⏰ Late\n \n markAttendance(student.id, \"Absent\")}\n className=\"absent-btn\"\n >\n ❌ Absent\n \n markAttendance(student.id, \"Unexcused\")}\n className=\"unexcused-btn\"\n >\n 🚫 Unexcused\n \n

\n )}\n\n {view === \"criminal-records\" && (\n

⚖️ Student Incident Records

\n \n setNewCriminalRecord(prev => ({\n ...prev,\n studentId: parseInt(e.target.value),\n }))}\n required\n >\n \n {students.map(student => (\n \n ))}\n \n \n setNewCriminalRecord(prev => ({\n ...prev,\n incident: e.target.value,\n }))}\n required\n />\n \n setNewCriminalRecord(prev => ({\n ...prev,\n date: e.target.value,\n }))}\n required\n />\n \n setNewCriminalRecord(prev => ({\n ...prev,\n severity: e.target.value,\n }))}\n required\n >\n \n \n \n \n \n \n \n

\n \n \n \n \n \n \n \n \n \n \n {criminalRecords.map((record, index) => {\n const student = students.find(s => s.id === record.studentId);\n return (\n \n \n \n \n \n \n );\n })}\n \n

Student	Incident	Date	Severity
{student?.name \|\| \"Unknown\"}	{record.incident}	{record.date}	\n {record.severity === \"Low\" && \"🟢\"}\n {record.severity === \"Medium\" && \"🟠\"}\n {record.severity === \"High\" && \"🔴\"}\n {record.severity}\n

\n )}\n\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\nif (typeof document !== \"undefined\") { client(); }\n\nexport default async function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const KEY = \"eschooldataClone\";\n const SCHEMA_VERSION = 3;\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_students_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL,\n grade TEXT NOT NULL,\n age INTEGER NOT NULL,\n email TEXT NOT NULL,\n parent_name TEXT,\n parent_phone TEXT,\n parent_email TEXT\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_attendance_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n studentId INTEGER NOT NULL,\n status TEXT NOT NULL,\n date TEXT NOT NULL,\n time TEXT,\n FOREIGN KEY(studentId) REFERENCES ${KEY}_students_${SCHEMA_VERSION}(id)\n )\n `);\n\n await sqlite.execute(`\n CREATE TABLE IF NOT EXISTS ${KEY}_criminal_records_${SCHEMA_VERSION} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n studentId INTEGER NOT NULL,\n incident TEXT NOT NULL,\n date TEXT NOT NULL,\n severity TEXT NOT NULL,\n FOREIGN KEY(studentId) REFERENCES ${KEY}_students_${SCHEMA_VERSION}(id)\n )\n `);\n\n // Students Routes\n if (request.method === \"GET\" && new URL(request.url).pathname === \"/students\") {\n const result = await sqlite.execute(`SELECT * FROM ${KEY}_students_${SCHEMA_VERSION}`);\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/students\") {\n const student = await request.json();\n await sqlite.execute(\n `\n INSERT INTO ${KEY}_students_${SCHEMA_VERSION} \n (name, grade, age, email, parent_name, parent_phone, parent_email) \n VALUES (?, ?, ?, ?, ?, ?, ?)\n `,\n [\n student.name,\n student.grade,\n student.age,\n student.email,\n student.parent?.name || null,\n student.parent?.phone || null,\n student.parent?.email || null,\n ],\n );\n return new Response(JSON.stringify({ message: \"Student added successfully\" }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (request.method === \"DELETE\" && /^\\/students\\/\\d+$/.test(new URL(request.url).pathname)) {\n const studentId = new URL(request.url).pathname.split(\"/\").pop();\n await sqlite.execute(\n `\n DELETE FROM ${KEY}_students_${SCHEMA_VERSION} WHERE id = ?\n `,\n [studentId],\n );\n return new Response(JSON.stringify({ message: \"Student deleted successfully\" }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Attendance Routes\n if (request.method === \"GET\" && new URL(request.url).pathname === \"/attendance\") {\n const result = await sqlite.execute(`\n SELECT * FROM ${KEY}_attendance_${SCHEMA_VERSION} \n WHERE date = date('now')\n `);\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/attendance\") {\n const { studentId, status, date, time } = await request.json();\n await sqlite.execute(\n `\n INSERT OR REPLACE INTO ${KEY}_attendance_${SCHEMA_VERSION} \n (studentId, status, date, time) VALUES (?, ?, ?, ?)\n `,\n [studentId, status, date, time],\n );\n return new Response(JSON.stringify({ message: \"Attendance marked successfully\" }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n // Criminal Records Routes\n if (request.method === \"GET\" && new URL(request.url).pathname === \"/criminal-records\") {\n const result = await sqlite.execute(`SELECT * FROM ${KEY}_criminal_records_${SCHEMA_VERSION}`);\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (request.method === \"POST\" && new URL(request.url).pathname === \"/criminal-records\") {\n const record = await request.json();\n await sqlite.execute(\n `\n INSERT INTO ${KEY}_criminal_records_${SCHEMA_VERSION} \n (studentId, incident, date, severity) VALUES (?, ?, ?, ?)\n `,\n [record.studentId, record.incident, record.date, record.severity],\n );\n return new Response(JSON.stringify({ message: \"Criminal record added successfully\" }), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n return new Response(\n `\n \n \n ⚛️ Quantum Learning Academy\n \n \n \n \n

\n \n \n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n}\n\nconst css = `\n:root {\n --primary-color: #4a90e2;\n --secondary-color: #50c878;\n --background-color: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);\n}\n\nbody {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 20px;\n background: var(--background-color);\n color: #333;\n}\n\n.container {\n max-width: 1200px;\n margin: auto;\n background: white;\n padding: 30px;\n border-radius: 15px;\n box-shadow: \n 0 15px 25px rgba(0,0,0,0.1), \n 0 10px 10px rgba(0,0,0,0.05);\n perspective: 1000px;\n transform-style: preserve-3d;\n}\n\nh1 {\n text-align: center;\n color: var(--primary-color);\n text-shadow: 2px 2px 4px rgba(0,0,0,0.1);\n transform: translateZ(50px);\n}\n\n.nav-menu {\n display: flex;\n justify-content: center;\n margin-bottom: 20px;\n gap: 15px;\n}\n\n.nav-menu button {\n padding: 10px 20px;\n background-color: #f0f0f0;\n border: none;\n border-radius: 25px;\n cursor: pointer;\n transition: all 0.3s ease;\n transform: translateZ(20px);\n}\n\n.nav-menu button.active, .nav-menu button:hover {\n background-color: var(--primary-color);\n color: white;\n transform: translateZ(30px) scale(1.05);\n box-shadow: 0 5px 15px rgba(74,144,226,0.4);\n}\n\n.student-form, .criminal-record-form {\n background-color: #f9f9f9;\n padding: 20px;\n border-radius: 10px;\n margin-bottom: 20px;\n transform: translateZ(40px);\n}\n\nform {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 15px;\n}\n\n.parent-section {\n grid-column: span 2;\n}\n\ninput, select {\n padding: 12px;\n border: 2px solid #e0e0e0;\n border-radius: 8px;\n transition: all 0.3s ease;\n}\n\ninput:focus, select:focus {\n border-color: var(--primary-color);\n box-shadow: 0 0 10px rgba(74,144,226,0.2);\n}\n\nbutton {\n padding: 12px;\n background-color: var(--secondary-color);\n color: white;\n border: none;\n border-radius: 8px;\n cursor: pointer;\n transition: all 0.3s ease;\n}\n\n.delete-btn {\n background-color: #f44336;\n}\n\nbutton:hover {\n transform: scale(1.05);\n opacity: 0.9;\n}\n\ntable {\n width: 100%;\n border-collapse: separate;\n border-spacing: 0;\n border-radius: 10px;\n overflow: hidden;\n box-shadow: 0 5px 15px rgba(0,0,0,0.1);\n}\n\nth, td {\n padding: 15px;\n text-align: left;\n border-bottom: 1px solid #f0f0f0;\n}\n\nth {\n background-color: var(--primary-color);\n color: white;\n}\n\n.present-btn { background-color: #4CAF50; }\n.late-btn { background-color: #FFC107; }\n.absent-btn { background-color: #f44336; }\n.unexcused-btn { background-color: #9C27B0; }\n\nfooter {\n text-align: center;\n margin-top: 20px;\n font-size: 0.9em;\n padding: 10px;\n background-color: #f4f4f4;\n border-radius: 8px;\n}\n\n@media (max-width: 600px) {\n .container {\n padding: 15px;\n }\n \n form {\n grid-template-columns: 1fr;\n }\n}\n`;","deleted","label",[99],"permalink","https://www.val.town/x/AnimalActivitiesOfUlster/eschooldataClone/code/main.tsx","extension","actionData","errors"]

⚛️ Animal Activities of Kingston 🌐

👨‍👩‍👧 Parent Information (Optional)

🎓 Student Records

📊 Attendance Tracker

⚖️ Student Incident Records