EuskadiTech/Axia4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add diario.php for student diary management and update images

Browse Source 
- Created a new file `diario.php` to manage and display student diaries.
- Implemented user permission checks to restrict access to docentes.
- Added functionality to list students and their diary entries based on selected aulario.
- Included validation for directory paths and error handling for missing data.
- Updated images `alumnos.png` and `yo.png` in the static assets.
This commit is contained in:
Naiel
2026-02-18 11:38:48 +00:00
parent 51fd926065
commit 1e6f6be18f
5 changed files with 919 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
public_html/entreaulas/alumnos.php
View File

@@ -282,6 +282,16 @@ switch ($_GET["action"] ?? '') {
});
}
?>
<style>
.btn-info {
background: #0dcaf0;
color: white;
}
.btn-info:hover {
background: #0bb5d9;
}
</style>
<div class="card pad">
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
<h1 class="card-title" style="margin: 0;">Gestión de Alumnos</h1>
@@ -301,6 +311,7 @@ switch ($_GET["action"] ?? '') {
<tr>
<th>Foto</th>
<th>Nombre</th>
<th>Diario</th>
<th>Acciones</th>
</tr>
</thead>
@@ -308,6 +319,8 @@ switch ($_GET["action"] ?? '') {
<?php foreach ($alumnos as $alumno_path):
$nombre = basename($alumno_path);
$photo_exists = file_exists("$alumno_path/photo.jpg");
$diario_path = "$alumno_path/Diario/" . date("Y-m-d");
$has_diary_today = file_exists("$diario_path/Panel.json");
?>
<tr>
<td>
@@ -323,8 +336,16 @@ switch ($_GET["action"] ?? '') {
</td>
<td><strong><?= htmlspecialchars($nombre) ?></strong></td>
<td>
<a href="?aulario=<?= urlencode($aulario_id) ?>&action=edit&alumno=<?= urlencode($nombre) ?>" class="btn btn-sm btn-primary">Editar</a>
<a href="?aulario=<?= urlencode($aulario_id) ?>&action=delete&alumno=<?= urlencode($nombre) ?>" class="btn btn-sm btn-danger">Eliminar</a>
<?php if ($has_diary_today): ?>
<span style="display: inline-block; background: #28a745; color: white; padding: 4px 8px; border-radius: 3px; font-size: 0.85rem; margin-right: 5px;">✓ Hoy</span>
<?php else: ?>
<span style="display: inline-block; background: #6c757d; color: white; padding: 4px 8px; border-radius: 3px; font-size: 0.85rem;">Sin diario</span>
<?php endif; ?>
</td>
<td style="display: flex; gap: 5px; flex-wrap: wrap;">
<a href="diario.php?aulario=<?= urlencode($aulario_id) ?>&alumno=<?= urlencode($nombre) ?>" class="btn btn-sm btn-info" title="Ver Diario">📖 Diario</a>
<a href="?aulario=<?= urlencode($aulario_id) ?>&action=edit&alumno=<?= urlencode($nombre) ?>" class="btn btn-sm btn-primary">✏️ Editar</a>
<a href="?aulario=<?= urlencode($aulario_id) ?>&action=delete&alumno=<?= urlencode($nombre) ?>" class="btn btn-sm btn-danger">🗑️ Eliminar</a>
</td>
</tr>
<?php endforeach; ?>

350
public_html/entreaulas/diario.php Normal file
View File

@@ -0,0 +1,350 @@
<?php
require_once "_incl/auth_redir.php";
// Check if user has docente permission
if (!in_array("entreaulas:docente", $_SESSION["auth_data"]["permissions"] ?? [])) {
header("HTTP/1.1 403 Forbidden");
die("Acceso denegado");
}
$aulario_id = $_GET["aulario"] ?? "";
$centro_id = $_SESSION["auth_data"]["entreaulas"]["centro"] ?? "";
$alumno = $_GET["alumno"] ?? "";
if (empty($aulario_id) || empty($centro_id)) {
require_once "_incl/pre-body.php";
?>
<div class="card pad">
<h1>Diario del Alumno</h1>
<p>No se ha indicado un aulario válido.</p>
</div>
<?php
require_once "_incl/post-body.php";
exit;
}
$aulario_id = basename($aulario_id);
$centro_id = basename($centro_id);
// Validate paths with realpath
$base_path = "/DATA/entreaulas/Centros";
$real_base = realpath($base_path);
if ($real_base === false) {
require_once "_incl/pre-body.php";
?>
<div class="card pad">
<h1>Diario del Alumno</h1>
<p>Error: Directorio base no encontrado.</p>
</div>
<?php
require_once "_incl/post-body.php";
exit;
}
// Get list of alumnos if not specified
$alumnos_base_path = "$base_path/$centro_id/Aularios/$aulario_id/Alumnos";
$alumnos = [];
if (is_dir($alumnos_base_path)) {
$alumnos = glob($alumnos_base_path . "/*", GLOB_ONLYDIR);
usort($alumnos, function($a, $b) {
return strcasecmp(basename($a), basename($b));
});
}
// If no alumno specified, show list
if (empty($alumno)) {
require_once "_incl/pre-body.php";
?>
<div class="card pad">
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
<h1 class="card-title" style="margin: 0;">Diarios de Alumnos</h1>
</div>
<?php if (empty($alumnos)): ?>
<p>No hay alumnos registrados en este aulario.</p>
<?php else: ?>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px;">
<?php foreach ($alumnos as $alumno_path):
$alumno_name = basename($alumno_path);
$photo_exists = file_exists("$alumno_path/photo.jpg");
$diario_path = "$alumno_path/Diario/" . date("Y-m-d");
$has_diary = file_exists("$diario_path/Panel.json");
?>
<div class="card" style="padding: 0; overflow: hidden;">
<div style="background: #f8f9fa; padding: 15px; text-align: center;">
<?php if ($photo_exists): ?>
<img src="_filefetch.php?type=alumno_photo&alumno=<?= urlencode($alumno_name) ?>&centro=<?= urlencode($centro_id) ?>&aulario=<?= urlencode($aulario_id) ?>"
alt="Foto de <?= htmlspecialchars($alumno_name) ?>"
style="width: 120px; height: 120px; object-fit: cover; border-radius: 10px; border: 3px solid #ddd;">
<?php else: ?>
<div style="width: 120px; height: 120px; background: #e0e0e0; display: flex; align-items: center; justify-content: center; border-radius: 10px; border: 3px dashed #999; margin: 0 auto; font-size: 3rem; color: #999;">
?
</div>
<?php endif; ?>
</div>
<div style="padding: 15px;">
<h3 style="margin: 0 0 10px 0; text-align: center;"><?= htmlspecialchars($alumno_name) ?></h3>
<div style="text-align: center; margin-bottom: 10px;">
<?php if ($has_diary): ?>
<span class="badge" style="background: #28a745; color: white; padding: 5px 10px; border-radius: 3px;">Diario disponible</span>
<?php else: ?>
<span class="badge" style="background: #6c757d; color: white; padding: 5px 10px; border-radius: 3px;">Sin diario</span>
<?php endif; ?>
</div>
<div style="text-align: center;">
<a href="?aulario=<?= urlencode($aulario_id) ?>&alumno=<?= urlencode($alumno_name) ?>" class="btn btn-primary" style="display: inline-block;">
Ver Diario
</a>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
<div style="margin-top: 30px;">
<a href="alumnos.php?aulario=<?= urlencode($aulario_id) ?>" class="btn btn-secondary">← Volver a Alumnos</a>
</div>
</div>
<?php
require_once "_incl/post-body.php";
exit;
}
// If alumno is specified, validate and show their diary
$alumno = basename($alumno);
$alumno_path = "$alumnos_base_path/$alumno";
// Validate path with realpath
if (!is_dir($alumno_path)) {
require_once "_incl/pre-body.php";
?>
<div class="card pad">
<h1>Diario del Alumno</h1>
<p>Alumno no encontrado.</p>
</div>
<?php
require_once "_incl/post-body.php";
exit;
}
// Get diario types and data
$diario_types = [
'Panel' => [
'label' => 'Panel Diario',
'icon' => '📋',
'description' => 'Registro de actividades diarias del panel'
]
];
require_once "_incl/pre-body.php";
?>
<div class="card pad">
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem;">
<h1 class="card-title" style="margin: 0;">Diario de <?= htmlspecialchars($alumno) ?></h1>
</div>
<div style="background: #f0f0f0; padding: 15px; border-radius: 10px; margin-bottom: 20px;">
<p style="margin: 0;">
<strong>Aulario:</strong> <?= htmlspecialchars($aulario_id) ?><br>
<strong>Fecha actual:</strong> <?= date('d/m/Y'); ?>
</p>
</div>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 15px;">
<?php foreach ($diario_types as $type_key => $type_info):
$type_path = "$alumno_path/Diario";
$type_file = "$type_path/" . date("Y-m-d") . "/$type_key.json";
$has_data = file_exists($type_file);
// Get all diary dates for this type
$diary_dates = [];
if (is_dir($type_path)) {
$dates = glob($type_path . "/*/", GLOB_ONLYDIR);
foreach ($dates as $date_dir) {
$date = basename($date_dir);
if (file_exists("$date_dir/$type_key.json")) {
$diary_dates[] = $date;
}
}
rsort($diary_dates);
}
?>
<div class="card" style="background: white; border: 2px solid #ddd;">
<div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 20px; text-align: center;">
<div style="font-size: 2rem; margin-bottom: 10px;"><?= $type_info['icon']; ?></div>
<h3 style="margin: 0 0 5px 0;"><?= $type_info['label']; ?></h3>
<p style="margin: 5px 0 0 0; font-size: 0.9rem; opacity: 0.9;"><?= $type_info['description']; ?></p>
</div>
<div style="padding: 20px;">
<?php if (!empty($diary_dates)): ?>
<div style="margin-bottom: 15px;">
<p style="margin-bottom: 10px; font-weight: bold;">Registros disponibles:</p>
<div style="max-height: 300px; overflow-y: auto;">
<ul style="list-style: none; padding: 0; margin: 0;">
<?php foreach ($diary_dates as $date): ?>
<li style="padding: 8px; border-bottom: 1px solid #eee;">
<a href="?aulario=<?= urlencode($aulario_id) ?>&alumno=<?= urlencode($alumno) ?>&type=<?= urlencode($type_key) ?>&date=<?= urlencode($date) ?>"
style="color: #667eea; text-decoration: none; display: block;">
📅 <?= date('d/m/Y', strtotime($date)); ?>
</a>
</li>
<?php endforeach; ?>
</ul>
</div>
</div>
<?php endif; ?>
<a href="?aulario=<?= urlencode($aulario_id) ?>&alumno=<?= urlencode($alumno) ?>&type=<?= urlencode($type_key) ?>&date=<?= date('Y-m-d'); ?>"
class="btn btn-<?= $has_data ? 'primary' : 'secondary'; ?>" style="width: 100%; text-align: center; display: block;">
<?= $has_data ? '📖 Ver Registro de Hoy' : '📖 Ver Detalles'; ?>
</a>
</div>
</div>
<?php endforeach; ?>
</div>
<div style="margin-top: 30px; display: flex; gap: 10px;">
<a href="?aulario=<?= urlencode($aulario_id) ?>" class="btn btn-secondary">← Volver a Lista de Diarios</a>
<a href="alumnos.php?aulario=<?= urlencode($aulario_id) ?>" class="btn btn-secondary">← Volver a Alumnos</a>
</div>
</div>
<?php
// Show specific diary entry if requested
$type = $_GET["type"] ?? "Panel";
$date = $_GET["date"] ?? date("Y-m-d");
if (!empty($type) && !empty($date)) {
$date = preg_replace('/[^0-9-]/', '', $date); // Sanitize date
$type_file = "$alumno_path/Diario/$date/$type.json";
if (file_exists($type_file)):
$diary_data = json_decode(file_get_contents($type_file), true);
// For Panel type, show the data
if ($type === "Panel" && is_array($diary_data)):
?>
<div style="margin-top: 30px; border-top: 2px solid #ddd; padding-top: 20px;">
<h2>Detalles del Registro - <?= htmlspecialchars($type) ?> (<?= date('d/m/Y', strtotime($date)); ?>)</h2>
<div style="background: #f9f9f9; padding: 20px; border-radius: 10px; margin-bottom: 20px;">
<p style="margin: 0;">
<strong>Registro creado:</strong> <?= htmlspecialchars($diary_data['date'] ?? 'N/A'); ?><br>
<strong>Alumno:</strong> <?= htmlspecialchars($diary_data['alumno'] ?? 'N/A'); ?>
</p>
</div>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px;">
<?php
$panel_labels = [
'quien_soy' => '¿Quién soy?',
'calendar' => '¿Qué día es?',
'calendario_diasemana' => 'Día de la semana',
'calendario_mes' => 'Mes',
'actividades' => '¿Qué vamos a hacer?',
'menu' => '¿Qué vamos a comer?'
];
foreach ($diary_data['panels'] ?? [] as $panel_name => $panel_info):
$label = $panel_labels[$panel_name] ?? $panel_name;
$completed = !is_null($panel_info) && isset($panel_info['completed']);
$timestamp = $completed ? $panel_info['timestamp'] : 'No completado';
$panel_data = $completed && isset($panel_info['data']) ? $panel_info['data'] : [];
?>
<div class="card" style="border: 2px solid <?= $completed ? '#28a745' : '#dc3545'; ?>; padding: 15px;">
<div style="display: flex; align-items: flex-start; gap: 10px;">
<div style="font-size: 1.5rem;">
<?= $completed ? '✓' : '✗'; ?>
</div>
<div style="flex: 1;">
<h4 style="margin: 0 0 5px 0; color: #333;"><?= htmlspecialchars($label); ?></h4>
<p style="margin: 0 0 10px 0; font-size: 0.85rem; color: #666;">
<?= $timestamp; ?>
</p>
<?php if ($completed && !empty($panel_data)): ?>
<div style="border-top: 1px solid #eee; padding-top: 10px; margin-top: 10px;">
<?php if ($panel_name === 'quien_soy' && !empty($panel_data['alumno'])): ?>
<p style="margin: 5px 0;"><strong>Alumno:</strong> <?= htmlspecialchars($panel_data['alumno']); ?></p>
<?php if (!empty($panel_data['photoUrl'])): ?>
<img src="<?= htmlspecialchars($panel_data['photoUrl']); ?>" alt="Foto" style="max-height: 60px; max-width: 100px; margin-top: 5px; border-radius: 5px;">
<?php endif; ?>
<?php elseif ($panel_name === 'calendar' && !empty($panel_data['dia'])): ?>
<p style="margin: 5px 0;"><strong>Día:</strong> <?= htmlspecialchars($panel_data['dia'] . '/' . $panel_data['mes'] . '/' . $panel_data['year']); ?></p>
<?php elseif ($panel_name === 'calendario_diasemana' && !empty($panel_data['nombre'])): ?>
<p style="margin: 5px 0;"><strong>Día:</strong> <?= htmlspecialchars($panel_data['nombre']); ?></p>
<?php if (!empty($panel_data['pictogram'])): ?>
<img src="<?= htmlspecialchars($panel_data['pictogram']); ?>" alt="Pictograma" style="max-height: 60px; margin-top: 5px;">
<?php endif; ?>
<?php elseif ($panel_name === 'calendario_mes' && !empty($panel_data['nombre'])): ?>
<p style="margin: 5px 0;"><strong>Mes:</strong> <?= htmlspecialchars($panel_data['nombre']); ?></p>
<?php if (!empty($panel_data['pictogram'])): ?>
<img src="<?= htmlspecialchars($panel_data['pictogram']); ?>" alt="Pictograma" style="max-height: 60px; margin-top: 5px;">
<?php endif; ?>
<?php elseif ($panel_name === 'actividades' && !empty($panel_data['actividad'])): ?>
<p style="margin: 5px 0;"><strong>Actividad:</strong> <?= htmlspecialchars($panel_data['actividad']); ?></p>
<?php if (!empty($panel_data['pictogram'])): ?>
<img src="<?= htmlspecialchars($panel_data['pictogram']); ?>" alt="Pictograma" style="max-height: 60px; margin-top: 5px;">
<?php endif; ?>
<?php elseif ($panel_name === 'menu' && !empty($panel_data['menuType'])): ?>
<p style="margin: 5px 0;"><strong>Menú:</strong> <?= htmlspecialchars($panel_data['menuType']); ?></p>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<div style="margin-top: 20px; padding: 15px; background: #e7f3ff; border-radius: 5px; border-left: 4px solid #667eea;">
<p style="margin: 0; font-size: 0.9rem; color: #333;">
<strong>💡 Nota:</strong> Este diario se genera automáticamente cuando el alumno completa los paneles en la aplicación del Panel Diario.
</p>
</div>
</div>
<?php
endif;
endif;
}
?>
<style>
.badge {
display: inline-block;
}
.btn {
padding: 10px 15px;
border: none;
border-radius: 5px;
cursor: pointer;
text-decoration: none;
font-size: 0.95rem;
transition: all 0.3s;
}
.btn-primary {
background: #667eea;
color: white;
}
.btn-primary:hover {
background: #5568d3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #5a6268;
}
</style>
<?php
require_once "_incl/post-body.php";

597
public_html/entreaulas/paneldiario.php
View File

@@ -1,24 +1,115 @@
<?php
require_once "_incl/auth_redir.php";
ini_set("display_errors", "0");
// Funciones auxiliares para el diario
function getDiarioPath($alumno, $centro_id, $aulario_id) {
$base_path = "/DATA/entreaulas/Centros/$centro_id/Aularios/$aulario_id/Alumnos/$alumno";
return $base_path . "/Diario/" . date("Y-m-d");
}
function initDiario($alumno, $centro_id, $aulario_id) {
$diario_path = getDiarioPath($alumno, $centro_id, $aulario_id);
if ($diario_path) {
@mkdir($diario_path, 0755, true);
$panel_file = $diario_path . "/Panel.json";
if (!file_exists($panel_file)) {
$data = [
"date" => date("Y-m-d H:i:s"),
"alumno" => $alumno,
"panels" => [
"quien_soy" => null,
"calendar" => null,
"calendario_diasemana" => null,
"calendario_mes" => null,
"actividades" => null,
"menu" => null
]
];
file_put_contents($panel_file, json_encode($data, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE));
}
}
}
function guardarPanelDiario($panel_name, $data, $alumno, $centro_id, $aulario_id) {
$diario_path = getDiarioPath($alumno, $centro_id, $aulario_id);
if ($diario_path) {
$panel_file = $diario_path . "/Panel.json";
if (file_exists($panel_file)) {
$existing = json_decode(file_get_contents($panel_file), true);
if (is_array($existing)) {
$existing["panels"][$panel_name] = [
"completed" => true,
"timestamp" => date("Y-m-d H:i:s"),
"data" => $data
];
file_put_contents($panel_file, json_encode($existing, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE));
}
}
}
}
// Manejo de AJAX para guardar paneles
if ($_SERVER['REQUEST_METHOD'] === 'POST' && !empty($_GET['api'])) {
header('Content-Type: application/json');
$api_action = $_GET['api'];
$alumno = $_SESSION["entreaulas_selected_alumno"] ?? '';
$centro_id = $_SESSION["auth_data"]["entreaulas"]["centro"] ?? '';
if ($api_action === 'guardar_panel' && $alumno && $centro_id) {
$input = json_decode(file_get_contents('php://input'), true);
$panel_name = $input['panel'] ?? '';
$panel_data = $input['data'] ?? [];
$aulario_id = $_SESSION["entreaulas_selected_aulario"] ?? '';
guardarPanelDiario($panel_name, $panel_data, $alumno, $centro_id, $aulario_id);
echo json_encode(['success' => true]);
die();
}
}
switch ($_GET["form"]) {
case "alumno_selected":
$alumno = $_GET["alumno"] ?? "";
if ($alumno !== "") {
$centro_id = $_SESSION["auth_data"]["entreaulas"]["centro"] ?? "";
$aulario_id = $_GET["aulario"] ?? '';
$photo_url = $_GET["photo"] ?? '';
if ($alumno !== "" && $centro_id !== "" && $aulario_id !== "") {
$_SESSION["entreaulas_selected_alumno"] = $alumno;
$_SESSION["entreaulas_selected_aulario"] = $aulario_id;
initDiario($alumno, $centro_id, $aulario_id);
// Guardar el panel "quien_soy" como completado con foto URL si existe
$who_am_i_data = ["alumno" => $alumno];
if ($photo_url !== '') {
$who_am_i_data["photoUrl"] = $photo_url;
}
guardarPanelDiario("quien_soy", $who_am_i_data, $alumno, $centro_id, $aulario_id);
header("Location: paneldiario.php?aulario=" . urlencode($_GET["aulario"] ?? ''));
die();
}
break;
}
require_once "_incl/pre-body.php";
ini_set("display_errors", "0");
?>
<audio id="win-sound" src="/static/sounds/win.mp3" preload="auto"></audio>
<audio id="lose-sound" src="/static/sounds/lose.mp3" preload="auto"></audio>
<audio id="click-sound" src="/static/sounds/click.mp3" preload="auto"></audio>
<script>
function announceAndMaybeRedirect(message, redirectUrl, success) {
const fallbackId = success ? 'win-sound' : 'lose-sound';
const fallbackAudio = document.getElementById(fallbackId);
// Get references to both audio elements
const winAudio = document.getElementById('win-sound');
const loseAudio = document.getElementById('lose-sound');
const selectedAudio = success ? winAudio : loseAudio;
const otherAudio = success ? loseAudio : winAudio;
// Pause both audios to ensure clean state
if (winAudio) {
winAudio.pause();
winAudio.currentTime = 0;
}
if (loseAudio) {
loseAudio.pause();
loseAudio.currentTime = 0;
}
const doRedirect = () => {
if (redirectUrl) {
@@ -28,18 +119,17 @@ require_once "_incl/pre-body.php";
const playFallback = () => {
try {
if (!fallbackAudio) {
console.warn("Fallback audio element not found");
if (!selectedAudio) {
console.warn("Audio element not found");
doRedirect();
return;
}
fallbackAudio.pause();
fallbackAudio.currentTime = 0;
fallbackAudio.onended = () => {
fallbackAudio.onended = null;
selectedAudio.currentTime = 0;
selectedAudio.onended = () => {
selectedAudio.onended = null;
doRedirect();
};
fallbackAudio.play().catch(doRedirect);
selectedAudio.play().catch(doRedirect);
} catch (e) {
console.warn("Error playing fallback audio:", e);
doRedirect();
@@ -96,37 +186,86 @@ require_once "_incl/pre-body.php";
}
</script>
<?php
// Verificar si hay un alumno seleccionado y cargar su progreso
$alumno_actual = $_SESSION["entreaulas_selected_alumno"] ?? '';
$centro_id = $_SESSION["auth_data"]["entreaulas"]["centro"] ?? '';
$aulario_id = $_GET["aulario"] ?? '';
$diario_data = null;
$progress = [];
if ($alumno_actual && $centro_id) {
$diario_path = getDiarioPath($alumno_actual, $centro_id, $aulario_id);
if ($diario_path) {
$panel_file = $diario_path . "/Panel.json";
if (file_exists($panel_file)) {
$diario_data = json_decode(file_get_contents($panel_file), true);
if (is_array($diario_data) && isset($diario_data['panels'])) {
foreach ($diario_data['panels'] as $panel_name => $panel_value) {
$progress[$panel_name] = !is_null($panel_value) && isset($panel_value['completed']);
}
}
}
}
}
// Contar paneles completados
$paneles_totales = 6; // quien_soy, calendar, calendario_diasemana, calendario_mes, actividades, menu
$paneles_completados = count(array_filter($progress));
$porcentaje = ($paneles_completados / $paneles_totales) * 100;
$todos_completados = ($paneles_completados === $paneles_totales);
switch ($_GET["action"]) {
default:
case "index":
if ($alumno_actual):
?>
<div class="card pad">
<h2>Panel de Diario - <?php echo htmlspecialchars($alumno_actual); ?></h2>
<div class="progress-bar">
<div class="progress-fill" style="width: <?php echo $porcentaje; ?>%"></div>
</div>
<p style="text-align: center; margin-top: 10px;">
<?php echo $paneles_completados; ?> de <?php echo $paneles_totales; ?> paneles completados
</p>
</div>
<?php
endif;
?>
<div class="grid">
<!-- ¿Quién soy? -->
<a onclick="document.getElementById('click-sound').play()" href="?action=quien_soy&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-primary grid-item">
<a onclick="document.getElementById('click-sound').play()" href="?action=quien_soy&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-<?= $progress['quien_soy'] ?? false ? 'success' : 'primary'; ?> grid-item <?php echo $progress['quien_soy'] ?? false ? 'completed' : ''; ?>">
<img src="/static/arasaac/yo.png" height="125" class="bg-white">
<br>
¿Quién soy?
</a>
<!-- Calendario -->
<a onclick="document.getElementById('click-sound').play()" href="?action=calendar&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-primary grid-item">
<a onclick="document.getElementById('click-sound').play()" href="?action=calendar&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-<?= $progress['calendar'] ?? false ? 'success' : 'primary'; ?> grid-item <?php echo $progress['calendar'] ?? false ? 'completed' : ''; ?>">
<img src="/static/arasaac/calendario.png" height="125" class="bg-white">
<br>
¿Que dia es?
</a>
<!-- Actividades -->
<a onclick="document.getElementById('click-sound').play()" href="?action=actividades&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-primary grid-item">
<a onclick="document.getElementById('click-sound').play()" href="?action=actividades&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-<?= $progress['actividades'] ?? false ? 'success' : 'primary'; ?> grid-item <?php echo $progress['actividades'] ?? false ? 'completed' : ''; ?>">
<img src="/static/arasaac/actividad.png" height="125" class="bg-white">
<br>
¿Que vamos a hacer?
</a>
<!-- Menú del comedor -->
<a onclick="document.getElementById('click-sound').play()" href="?action=menu&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-primary grid-item">
<a onclick="document.getElementById('click-sound').play()" href="?action=menu&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-<?= $progress['menu'] ?? false ? 'success' : 'primary'; ?> grid-item <?php echo $progress['menu'] ?? false ? 'completed' : ''; ?>">
<img src="/static/arasaac/comedor.png" height="125" class="bg-white">
<br>
¿Que vamos a comer?
</a>
</div>
<?php if ($todos_completados && $alumno_actual): ?>
<div style="margin-top: 20px;">
<a onclick="document.getElementById('click-sound').play()" href="?action=resumen&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>" class="btn btn-success" style="width: 100%; padding: 20px; font-size: 1.2rem; text-align: center;">
📋 Ver Resumen Imprimible
</a>
</div>
<?php endif; ?>
<style>
.grid {
display: grid;
@@ -140,16 +279,305 @@ switch ($_GET["action"]) {
padding: 15px;
width: 100%;
text-align: center;
position: relative;
}
.grid-item.completed {
border: 3px solid #28a745;
box-shadow: 0 0 10px rgba(40, 167, 69, 0.3);
}
.badge {
position: absolute;
top: 10px;
right: 10px;
background: #28a745;
color: white;
border-radius: 50%;
width: 35px;
height: 35px;
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
font-size: 1.2rem;
}
.grid-item img {
margin: 0 auto;
height: 125px;
}
.progress-bar {
width: 100%;
height: 30px;
background: #e9ecef;
border-radius: 15px;
overflow: hidden;
margin: 10px 0;
}
.progress-fill {
height: 100%;
background: linear-gradient(90deg, #0d6efd, #0d6efd);
transition: width 0.3s ease;
}
</style>
<?php
break;
case "resumen":
// Mostrar resumen imprimible
if ($alumno_actual && $centro_id && $diario_data):
?>
<div class="resumen-container">
<div class="resumen-header">
<h1>Resumen del Diario</h1>
<p class="resumen-info">
<strong>Alumno:</strong> <?php echo htmlspecialchars($alumno_actual); ?><br>
<strong>Fecha:</strong> <?php echo date('d/m/Y'); ?><br>
<strong>Hora de registro:</strong> <?php echo date('H:i:s'); ?>
</p>
</div>
<div class="resumen-content">
<h2>Paneles Completados</h2>
<?php
$panel_labels = [
'quien_soy' => '¿Quién soy?',
'calendar' => '¿Qué día es?',
'calendario_diasemana' => 'Día de la semana',
'calendario_mes' => 'Mes',
'actividades' => '¿Qué vamos a hacer?',
'menu' => '¿Qué vamos a comer?'
];
foreach ($diario_data['panels'] as $panel_name => $panel_info):
$label = $panel_labels[$panel_name] ?? $panel_name;
$completed = !is_null($panel_info) && isset($panel_info['completed']);
$timestamp = $completed ? $panel_info['timestamp'] : 'No completado';
$panel_data = $completed && isset($panel_info['data']) ? $panel_info['data'] : [];
?>
<div class="resumen-item <?php echo $completed ? 'completado' : 'pendiente'; ?>">
<div class="resumen-item-status">
<?php echo $completed ? '✓' : '✗'; ?>
</div>
<div class="resumen-item-content">
<h3><?php echo htmlspecialchars($label); ?></h3>
<p class="timestamp"><?php echo $timestamp; ?></p>
<?php if ($completed && !empty($panel_data)): ?>
<div class="resumen-item-data">
<?php if ($panel_name === 'quien_soy' && !empty($panel_data['alumno'])): ?>
<p><strong>Alumno seleccionado:</strong> <?php echo htmlspecialchars($panel_data['alumno']); ?></p>
<?php if (!empty($panel_data['photoUrl'])): ?>
<img class="resumen-thumb" src="<?php echo htmlspecialchars($panel_data['photoUrl']); ?>" alt="Foto del alumno">
<?php endif; ?>
<?php elseif ($panel_name === 'calendar' && !empty($panel_data['dia'])): ?>
<p><strong>Día seleccionado:</strong> <?php echo htmlspecialchars($panel_data['dia'] . '/' . $panel_data['mes'] . '/' . $panel_data['year']); ?></p>
<?php elseif ($panel_name === 'calendario_diasemana' && !empty($panel_data['nombre'])): ?>
<p><strong>Día de la semana:</strong> <?php echo htmlspecialchars($panel_data['nombre']); ?></p>
<?php if (!empty($panel_data['pictogram'])): ?>
<img class="resumen-thumb" src="<?php echo htmlspecialchars($panel_data['pictogram']); ?>" alt="<?php echo htmlspecialchars($panel_data['nombre']); ?>">
<?php endif; ?>
<?php elseif ($panel_name === 'calendario_mes' && !empty($panel_data['nombre'])): ?>
<p><strong>Mes seleccionado:</strong> <?php echo htmlspecialchars($panel_data['nombre']); ?></p>
<?php if (!empty($panel_data['pictogram'])): ?>
<img class="resumen-thumb" src="<?php echo htmlspecialchars($panel_data['pictogram']); ?>" alt="<?php echo htmlspecialchars($panel_data['nombre']); ?>">
<?php endif; ?>
<?php elseif ($panel_name === 'actividades' && !empty($panel_data['actividad'])): ?>
<p><strong>Actividad:</strong> <?php echo htmlspecialchars($panel_data['actividad']); ?></p>
<?php if (!empty($panel_data['pictogram'])): ?>
<img class="resumen-thumb" src="<?php echo htmlspecialchars($panel_data['pictogram']); ?>" alt="<?php echo htmlspecialchars($panel_data['actividad']); ?>">
<?php endif; ?>
<?php elseif ($panel_name === 'menu' && !empty($panel_data['menuType'])): ?>
<p><strong>Tipo de menú:</strong> <?php echo htmlspecialchars($panel_data['menuType']); ?></p>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
</div>
<?php endforeach; ?>
</div>
<div class="resumen-footer">
<button onclick="window.print();" class="btn btn-primary" style="margin-right: 10px;">
🖨️ Imprimir Resumen
</button>
<a href="?action=index&aulario=<?php echo urlencode($aulario_id); ?>" class="btn btn-secondary">
← Volver
</a>
</div>
</div>
<style>
@media print {
body {
background: white;
margin: 0;
padding: 0;
}
.resumen-footer {
display: none;
}
.grid, .card, .btn {
page-break-inside: avoid;
}
}
.resumen-container {
max-width: 800px;
margin: 0 auto;
}
.resumen-header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 30px;
border-radius: 10px;
margin-bottom: 30px;
text-align: center;
}
.resumen-header h1 {
margin: 0 0 15px 0;
font-size: 2.5rem;
}
.resumen-info {
margin: 0;
font-size: 1.1rem;
line-height: 1.8;
}
.resumen-content {
margin-bottom: 30px;
}
.resumen-content h2 {
color: #333;
border-bottom: 3px solid #667eea;
padding-bottom: 10px;
margin-bottom: 20px;
}
.resumen-item {
display: flex;
align-items: flex-start;
background: white;
border: 2px solid #ddd;
border-radius: 10px;
padding: 15px;
margin-bottom: 15px;
transition: all 0.3s ease;
}
.resumen-item.completado {
border-color: #28a745;
background: #f0f8f4;
}
.resumen-item.pendiente {
border-color: #dc3545;
background: #f8f0f0;
}
.resumen-item-status {
font-size: 1.8rem;
font-weight: bold;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
margin-right: 15px;
flex-shrink: 0;
}
.resumen-item.completado .resumen-item-status {
background: #28a745;
color: white;
}
.resumen-item.pendiente .resumen-item-status {
background: #dc3545;
color: white;
}
.resumen-item-content h3 {
margin: 0 0 5px 0;
color: #333;
}
.resumen-item-content .timestamp {
margin: 0;
color: #666;
font-size: 0.9rem;
}
.resumen-item-data {
margin-top: 10px;
padding-top: 10px;
border-top: 1px solid rgba(0,0,0,0.1);
}
.resumen-item-data p {
margin: 5px 0;
font-size: 0.95rem;
}
.resumen-thumb {
max-height: 100px;
max-width: 150px;
margin-top: 10px;
border-radius: 5px;
border: 1px solid #ddd;
display: inline-block;
}
.resumen-footer {
display: flex;
gap: 10px;
justify-content: center;
margin-top: 30px;
}
.resumen-footer .btn {
padding: 12px 30px;
font-size: 1rem;
text-decoration: none;
border-radius: 5px;
cursor: pointer;
border: none;
}
.btn-primary {
background: #667eea;
color: white;
}
.btn-primary:hover {
background: #5568d3;
}
.btn-secondary {
background: #6c757d;
color: white;
}
.btn-secondary:hover {
background: #5a6268;
}
</style>
<?php
else:
echo '<div class="card pad"><p>Error: No hay datos de diario disponibles.</p></div>';
endif;
break;
case "quien_soy":
// ¿Quién soy? - Identificación del alumno
$aulario_id = basename($_GET["aulario"] ?? '');
@@ -174,11 +602,17 @@ switch ($_GET["action"]) {
}
?>
<script>
function seleccionarAlumno(element, nombre) {
function seleccionarAlumno(element, nombre, hasPhoto, centro, aulario) {
element.style.backgroundColor = "#9cff9f"; // Verde
let photoUrl = '';
if (hasPhoto) {
photoUrl = '/entreaulas/_filefetch.php?type=alumno_photo&alumno=' + encodeURIComponent(nombre) +
'&centro=' + encodeURIComponent(centro) + '&aulario=' + encodeURIComponent(aulario);
}
announceAndMaybeRedirect(
"¡Hola " + nombre + "!",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>&form=alumno_selected&alumno=" + encodeURIComponent(nombre),
"/entreaulas/paneldiario.php?aulario=" + encodeURIComponent(aulario) + "&form=alumno_selected&alumno=" + encodeURIComponent(nombre) +
(photoUrl ? "&photo=" + encodeURIComponent(photoUrl) : ''),
true
);
}
@@ -203,7 +637,7 @@ switch ($_GET["action"]) {
$photo_path = $alumno_path . "/photo.jpg";
$photo_exists = file_exists($photo_path);
?>
<a href="#" class="card grid-item" style="color: black;" onclick='seleccionarAlumno(this, "<?php echo htmlspecialchars($alumno_name, ENT_QUOTES); ?>");' aria-label="Seleccionar alumno <?php echo htmlspecialchars($alumno_name); ?>">
<a href="#" class="card grid-item" style="color: black;" onclick='seleccionarAlumno(this, "<?php echo htmlspecialchars($alumno_name, ENT_QUOTES); ?>", <?php echo $photo_exists ? 'true' : 'false'; ?>, "<?php echo htmlspecialchars($centro_id, ENT_QUOTES); ?>", "<?php echo htmlspecialchars($aulario_id, ENT_QUOTES); ?>");' aria-label="Seleccionar alumno <?php echo htmlspecialchars($alumno_name); ?>">
<?php if ($photo_exists): ?>
<img src="_filefetch.php?type=alumno_photo&alumno=<?php echo urlencode($alumno_name); ?>&centro=<?php echo urlencode($centro_id); ?>&aulario=<?php echo urlencode($aulario_id); ?>" height="150" class="bg-white" alt="Foto de <?php echo htmlspecialchars($alumno_name); ?>">
<?php else: ?>
@@ -251,13 +685,27 @@ switch ($_GET["action"]) {
$actividades = glob("/DATA/entreaulas/Centros/" . $_SESSION["auth_data"]["entreaulas"]["centro"] . "/Panel/Actividades/*", GLOB_ONLYDIR);
?>
<script>
function seleccionarActividad(element, actividad) {
function seleccionarActividad(element, actividad, pictogramUrl) {
element.style.backgroundColor = "#9cff9f"; // Verde
announceAndMaybeRedirect(
actividad + ", Actividad seleccionada",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
// Guardar al diario antes de redirigir
fetch('/entreaulas/paneldiario.php?api=guardar_panel', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
panel: 'actividades',
data: {
actividad: actividad,
pictogram: pictogramUrl
}
})
}).finally(() => {
announceAndMaybeRedirect(
actividad + ", Actividad seleccionada",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
});
}
</script>
<div class="card pad">
@@ -268,9 +716,10 @@ switch ($_GET["action"]) {
<div class="grid">
<?php foreach ($actividades as $actividad_path) {
$actividad_name = basename($actividad_path);
$pictogram_url = '/entreaulas/_filefetch.php?type=panel_actividades&activity=' . urlencode($actividad_name) . '&centro=' . urlencode($_SESSION["auth_data"]["entreaulas"]["centro"]);
?>
<a class="card grid-item" style="color: black;" onclick="seleccionarActividad(this, '<?php echo htmlspecialchars($actividad_name); ?>');">
<img src="_filefetch.php?type=panel_actividades&activity=<?php echo urlencode($actividad_name); ?>&centro=<?php echo urlencode($_SESSION["auth_data"]["entreaulas"]["centro"]); ?>" height="125" class="bg-white">
<a class="card grid-item" style="color: black;" onclick="seleccionarActividad(this, '<?php echo htmlspecialchars($actividad_name); ?>', '<?php echo htmlspecialchars($pictogram_url); ?>');">
<img src="<?php echo htmlspecialchars($pictogram_url); ?>" height="125" class="bg-white">
<?php echo htmlspecialchars($actividad_name); ?>
</a>
<?php } ?>
@@ -371,11 +820,22 @@ switch ($_GET["action"]) {
<script>
function seleccionarMenuTipo(element, hasData, menu_ty) {
element.style.backgroundColor = "#9cff9f"; // Verde
announceAndMaybeRedirect(
menu_ty + ", Menú seleccionado",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
// Guardar al diario antes de redirigir
fetch('/entreaulas/paneldiario.php?api=guardar_panel', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
panel: 'menu',
data: { menuType: menu_ty }
})
}).finally(() => {
announceAndMaybeRedirect(
menu_ty + ", Menú seleccionado",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
});
}
</script>
<div class="card pad">
@@ -543,11 +1003,22 @@ switch ($_GET["action"]) {
// Si es dia correcto
if (dia == <?php echo $dia_correcto; ?> && mes == <?php echo $mes_correcto; ?> && ds == <?php echo $ds_correcto; ?>) {
element.style.backgroundColor = "#9cff9f"; // Verde
announceAndMaybeRedirect(
dia + ", Correcto",
"?action=calendario_diasemana&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
// Guardar al diario antes de redirigir
fetch('/entreaulas/paneldiario.php?api=guardar_panel', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
panel: 'calendar',
data: { dia: dia, mes: mes, year: year, diaSemana: ds }
})
}).finally(() => {
announceAndMaybeRedirect(
dia + ", Correcto",
"?action=calendario_diasemana&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
});
} else {
element.style.backgroundColor = "#ff9088"; // Rojo
announceAndMaybeRedirect(dia + ", No es correcto", null, false);
@@ -635,16 +1106,27 @@ switch ($_GET["action"]) {
</div>
<div class="grid">
<script>
function seleccionarDiaSemana(element, ds) {
function seleccionarDiaSemana(element, ds, pictogramUrl) {
var dow = ["", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];
// Si es dia de la semana correcto
if (ds == <?php echo $dia_de_la_semana; ?>) {
element.style.backgroundColor = "#9cff9f"; // Verde
announceAndMaybeRedirect(
dow[ds] + ", Correcto",
"/entreaulas/paneldiario.php?action=calendario_mes&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
// Guardar al diario antes de redirigir
fetch('/entreaulas/paneldiario.php?api=guardar_panel', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
panel: 'calendario_diasemana',
data: { diaSemana: ds, nombre: dow[ds], pictogram: pictogramUrl }
})
}).finally(() => {
announceAndMaybeRedirect(
dow[ds] + ", Correcto",
"/entreaulas/paneldiario.php?action=calendario_mes&aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
});
} else {
element.style.backgroundColor = "#ff9088"; // Rojo
announceAndMaybeRedirect(dow[ds] + ", No es correcto", null, false);
@@ -670,11 +1152,12 @@ switch ($_GET["action"]) {
5 => "Ostirala"
];
foreach ($days_of_week as $ds => $day_name) {
$pictogram_url = '/static/arasaac/diadelasemana/' . strtolower($day_name) . '.png';
?>
<a class="card grid-item" style="width: 225px; height: 225px; color: black;"
onclick="seleccionarDiaSemana(this, <?php echo $ds; ?>);">
onclick="seleccionarDiaSemana(this, <?php echo $ds; ?>, '<?php echo htmlspecialchars($pictogram_url); ?>');">
<span style="font-size: 30px;"><?php echo $day_name; ?></span>
<img src="/static/arasaac/diadelasemana/<?php echo strtolower($day_name); ?>.png" alt=""
<img src="<?php echo htmlspecialchars($pictogram_url); ?>" alt=""
style="width: 100px; height: 100px;">
<span style="font-size: 30px; color: blue;"><?php echo $dow_euskara[$ds]; ?></span>
</a>
@@ -741,16 +1224,27 @@ switch ($_GET["action"]) {
</div>
<div class="grid">
<script>
function seleccionarMes(element, mes) {
function seleccionarMes(element, mes, pictogramUrl) {
// Si es mes correcto
var meses = ["", "Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"];
if (mes == <?php echo $mes_correcto; ?>) {
element.style.backgroundColor = "#9cff9f"; // Verde
announceAndMaybeRedirect(
meses[mes] + ", Correcto",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
// Guardar al diario antes de redirigir
fetch('/entreaulas/paneldiario.php?api=guardar_panel', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
panel: 'calendario_mes',
data: { mes: mes, nombre: meses[mes], pictogram: pictogramUrl }
})
}).finally(() => {
announceAndMaybeRedirect(
meses[mes] + ", Correcto",
"/entreaulas/paneldiario.php?aulario=<?php echo urlencode($_GET['aulario'] ?? ''); ?>",
true
);
});
} else {
element.style.backgroundColor = "#ff9088"; // Rojo
announceAndMaybeRedirect(meses[mes] + ", No es correcto", null, false);
@@ -761,11 +1255,12 @@ switch ($_GET["action"]) {
}
</script>
<?php foreach ($meses_esp as $mes => $mes_name) {
$pictogram_url = '/static/arasaac/mesesdelano/' . strtolower($mes_name) . '.png';
?>
<a class="card grid-item" style="width: 180px; height: 180px; color: black;"
onclick="seleccionarMes(this, <?php echo $mes; ?>);">
onclick="seleccionarMes(this, <?php echo $mes; ?>, '<?php echo htmlspecialchars($pictogram_url); ?>');">
<span style="font-size: 24px;"><?php echo $mes_name; ?></span>
<img src="/static/arasaac/mesesdelano/<?php echo strtolower($mes_name); ?>.png" alt=""
<img src="<?php echo htmlspecialchars($pictogram_url); ?>" alt=""
style="width: 80px; height: 80px;">
<span style="font-size: 24px; color: blue;"><?php echo $meses_eus[$mes]; ?></span>
</a>

BIN
public_html/static/arasaac/alumnos.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 36 KiB

After

Width:  |  Height:  |  Size: 11 KiB

BIN
public_html/static/arasaac/yo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 14 KiB