Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat/show register on dom #43

Open
wants to merge 16 commits into
base: main
Choose a base branch
from
Open

Feat/show register on dom #43

Show file tree
Hide file tree
Changes from 15 commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
12e0665
chore:formattazione prettier registri.html
Dec 18, 2023
bb8f052
refactor: remove style-inline
Dec 18, 2023
0a43255
refactor:aside with two buttons
Dec 18, 2023
ee95f85
refactor:view register and menu edit sections
Dec 18, 2023
f225db0
refactor: preliminary registri.css
Dec 18, 2023
4909bd4
refactor: define a custom default and color palette
Aierbote Dec 18, 2023
8ec370e
feat: saved the colors from the logo in vars
Aierbote Dec 18, 2023
aaae9b6
Merge branch 'main' of https://github.com/Aierbote/registro-di-classe…
Jan 17, 2024
9a0ca2f
diff --git a/.vscode/settings.json b/.vscode/settings.json
Jan 17, 2024
706db55
Added function to display registers in the DOM
Jan 17, 2024
9e6c6f9
Added function to display registers in the DOM
Jan 17, 2024
bb7c2f9
Revert "Merge branch 'main' of https://github.com/Aierbote/registro-d…
Jan 18, 2024
1084f09
fix: quick fix of previous commit
Jan 18, 2024
00e4176
Resolved conflicts and merged changes from remote repository
Jan 21, 2024
43c6d52
Resolved conflicts and merged changes from remote repository
Jan 21, 2024
28fdc8c
Rimuovi .vscode dal repository
Jan 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions .vscode/settings.json
View file
Open in desktop
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Credo che queste siano i settaggi di vscode, e non dovrebbero stare in un commit. Credo sia sufficiente rimuovere il file dal commit per ora, ma evidentemente c'è un problema con il .gitignore?

Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
"workbench.colorCustomizations": {
"activityBar.background": "#243210",
"titleBar.activeBackground": "#324617",
"titleBar.activeForeground": "#F7FBF2"
}
}
21 changes: 14 additions & 7 deletions registri.html
View file
Open in desktop
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Il problema è che il container per i registri esisteva già:
riga 72: <div class="Registro flex-grow-1"></div>

Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,9 @@

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

qui c'è un tag head sdoppiato, qualcosa sarà andato storto nel merge

<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
Expand All @@ -24,7 +27,7 @@
crossorigin="anonymous"
></script>
<script src="script.js"></script>
<script type="module" src="view.js" defer></script>
<script src="view.js" defer></script>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Perchè è stata rimossa la dichiarazione module?

</head>
<body>
<header>
Expand Down Expand Up @@ -61,12 +64,12 @@ <h4 class="aggiungi">+</h4>
<section class="VisualeLezione d-flex flex-column flex-grow-1">
<h2 class="TitoloMateria">Chimica</h2>
<div class="OpzioniMateria">
<button class="btn btn-primary BottoneElencaStudenti">
Elenco studenti
<button class="BottoneElencaStudenti">
<a href="elenco.html">Elenco studenti</a>
</button>

<button class="btn btn-primary BottoneMostraLezioni">
Lezioni
<button class="BottoneMostraLezioni">
<a class="Lezioni">Lezioni</a>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

merge errati da 67 a 72, andavano lasciati i bottoni

</button>
</div>

Expand All @@ -89,8 +92,12 @@ <h3 class="Edita">edita</h3>
</div>
</main>
</div>
</div>
</div>

<!-- Aggiunta della sezione per mostrare i registri -->
<div id="registro-container" class="RegistroContainer">
<!-- Qui verranno aggiunti dinamicamente i registri -->
</div>
</section>

<div class="container-fluid">
<div class="row">
Expand Down
212 changes: 120 additions & 92 deletions script.js
View file
Open in desktop
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Va bene, ma va lasciata la parte della CRUD degli studenti che utilizza il localstorage

Original file line number Diff line number Diff line change
@@ -1,31 +1,36 @@
/** @format */

// Array di registri e studenti
const registers = [];

// ultimo id per gli elementi di Registers
let lastRegId = "0";
let lastRegId = '0';
// ultimo id per gli elementi di Students
let lastStudId = '0';
// ultimo id per gli le attendances dentro ogni Register (univoco)
let lastAttId = "0";
let lastAttId = '0';

// Funzione per rimuovere whitespace prima & dopo la stringa e per farne il Title Case
const normalizeName = (string_) => {
const normalizeName = string_ => {
string_ = string_.trim();
string_ = string_.charAt(0).toUpperCase() + string_.substr(1).toLowerCase();
return string_;
}
};

// Funzione per ottenere la lista dei registri
const getRegisterList = () => {
return registers;
};

// Funzione per ottenere uno specifico registro
const getRegister = (id) => {
const getRegister = id => {
for (let i = 0; i < registers.length; i++) {
//fixare questo e metterlo come non strict comparison?
if (registers[i].id === id) { return registers[i] };
if (registers[i].id === id) {
return registers[i];
}
}
return null;
}
};

// Funzione per creare un registro
const createRegister = ({ name, students, votes, attendances }) => {
Expand All @@ -40,20 +45,21 @@ const createRegister = ({ name, students, votes, attendances }) => {
name: name,
students: [],
votes: [],
attendances: []
attendances: [],
};

sampleRegister.students.push(...students);
sampleRegister.votes.push(...votes);
sampleRegister.attendances.push(...attendances);



registers.push(sampleRegister);

// Chiamata alla funzione per mostrare il registro nel DOM
showRegisterInDOM(sampleRegister);
};

// Funzione per eliminare un registro
const deleteRegister = (id) => {
const deleteRegister = id => {
for (let i = 0; i < registers.length; i++) {
if (registers[i].id == id) {
console.log(`register ${registers[i].id} deleted.`);
Expand All @@ -62,11 +68,10 @@ const deleteRegister = (id) => {
}
}
console.log(`id ${id} not found in registers`);
}
};

// Funzione per aggiornare un registro
const updateRegister = ({ id, name, students, votes, attendances }) => {

const register = getRegister(id);
if (register === null) {
console.log(`no register with id: ${id} found.`);
Expand All @@ -81,7 +86,44 @@ const updateRegister = ({ id, name, students, votes, attendances }) => {
register.attendances = attendances || register.attendances;

console.log(`updated register with id ${id} : ${register}`);
}
};

// Funzione per mostrare un registro nel DOM
const showRegisterInDOM = register => {
// Ottieni il riferimento all'elemento del DOM in cui vuoi mostrare il registro
const containerElement = document.getElementById('registro-container');

// Assicurati che l'elemento esista prima di procedere
if (!containerElement) {
console.error('Elemento del DOM non trovato.');
return;
}

// Crea un elemento div per rappresentare il registro
const registerElement = document.createElement('div');
registerElement.className = 'registro'; // Aggiungi eventuali classi CSS necessarie

// Aggiungi il contenuto del registro all'elemento
registerElement.innerHTML = `
<h2>${register.name}</h2>
<p>Numero di studenti: ${register.students.length}</p>
<!-- Aggiungi altri dettagli del registro secondo le tue esigenze -->
`;

// Aggiungi l'elemento del registro al contenitore nel DOM
containerElement.appendChild(registerElement);
};

// Funzione per aggiungere un registro al DOM
const addRegisterToDOM = registerId => {
const register = getRegister(registerId);

if (register) {
showRegisterInDOM(register);
} else {
console.error(`Registro con ID ${registerId} non trovato.`);
}
};

// Controllare se l'arrivo non deve superare un certo valore
// che sarebbe l'orario di uscita?
Expand All @@ -95,12 +137,12 @@ const createAttendance = ({ registerId, date, argument, attendants }) => {
date: new Date(date), //"yyyy-MM-ddTh:m:s" This is standardized and will work reliably
id: '' + lastAttId,
argument: argument,
attendants: [] //array<{nome, arrivo, uscita}>
attendants: [], //array<{nome, arrivo, uscita}>
};

Attendance.attendants.push(...attendants);
getRegister(registerId).attendances.push(Attendance);
}
};

const deleteAttendance = ({ registerId, attendanceId }) => {
const lessons = getRegister(registerId).attendances;
Expand All @@ -112,87 +154,27 @@ const deleteAttendance = ({ registerId, attendanceId }) => {
}
}
console.log(`lesson with id: ${attendanceId} not found.`);
}

// Funzione per ottenere la lista degli studenti
const getStudentList = () => {
return JSON.parse(localStorage.getItem("students"));
};

// Funzione per ottenere uno specifico studente
const getStudent = (id) => {
const students = getStudentList();
const studentFound = students.find((student) => student.id === "" + id);

return studentFound;
}

// Funzione per creare uno studente
const createStudent = ({ name, lastName, email, lectures }) => {
const prevStudents = getStudentList() || [];

const lastStudId = JSON.parse(localStorage.getItem("lastStudId")) || "0";
const newStudId = parseInt(lastStudId) + 1;

const newStudents = [...prevStudents, {
id: '' + newStudId,
name: normalizeName(name),
lastName: normalizeName(lastName),
email,
lectures,
}];

console.log(`student ${JSON.stringify(newStudents.slice(-1)[0])} created successfully.`);

localStorage.setItem("students", JSON.stringify(newStudents));
localStorage.setItem("lastStudId", JSON.stringify(newStudId));
};

// Funzione per eliminare uno studente
const deleteStudent = (id) => {
const foundStudent = getStudent(id);
lastStudId = parseInt(lastStudId);
lastStudId++;

if (!!foundStudent) {
const prevStudents = getStudentList();
const newStudents = prevStudents.filter(({ id: idStudent }) =>
idStudent !== "" + id
);
name = normalizeName(name);
lastName = normalizeName(lastName);

console.log(`student ${JSON.stringify(foundStudent)} deleted.`);
localStorage.setItem("students", JSON.stringify(newStudents));
return;
}
console.log(`id ${id} not found in students`);
};
const sampleStudent = {
id: '' + lastStudId,
name: name,
lastName: lastName,
email: email,
lectures: [],
};

// Funzione per aggiornare uno studente
const updateStudent = ({ id, name: newName, lastName: newLastName, email: newEmail, lectures: newLectures }) => {
const oldStudent = getStudent(id);

if (!!oldStudent) {
const prevStudents = getStudentList();

console.log(`updating student with id ${id} : ${JSON.stringify(oldStudent)}`);

const newStudents = prevStudents.map((stud) => {
return (stud.id === "" + id)
? {
id: "" + id,
name: normalizeName(newName) || stud.name,
lastName: normalizeName(newLastName) || stud.lastName,
email: newEmail || stud.email,
lectures: newLectures || stud.lectures
}
: { ...stud };
});

const updatedStudent = newStudents.find((stud) => stud.id === "" + id)
console.log(`updated student with id ${id} : ${JSON.stringify(updatedStudent)}`);
localStorage.setItem("students", JSON.stringify(newStudents));
return;
}
sampleStudent.lectures.push(...lectures);

console.log(`id ${id} not found in students`);;
students.push(sampleStudent);
};

// Funzione per collegare uno studente a un registro
Expand All @@ -211,12 +193,58 @@ const connectStudentToRegister = (studentId, classId) => {

register.students.push(student);
console.log(`student assigned to ${register.name} successfully.`);
}
};

// Funzione per eliminare uno studente
const deleteStudent = id => {
for (let i = 0; i < students.length; i++) {
if (students[i].id == id) {
console.log(`student ${students[i].id} deleted.`);
students.splice(i, 1);
return;
}
}
console.log(`id ${id} not found in students`);
};

// Funzione per aggiornare uno studente
const updateStudent = ({ id, name, lastName, email, lectures }) => {
const student_ = getStudent(id);

name = normalizeName(name);
lastName = normalizeName(lastName);

if (student_ == undefined) {
console.log(`id ${id} not found in students`);
return;
}

console.log(`updating student with id ${id} : ${student_}`);

student_.name = name || student_.name;
student_.lastName = lastName || student_.lastName;
student_.email = email || student_.email;
student_.lectures = lectures || student_.lectures;

console.log(`updated student with id ${id} : ${student_}`);
};

// Funzione per ottenere la lista degli studenti
const getStudentList = () => {
return students;
};

// Funzione per ottenere uno specifico studente
const getStudent = id => {
for (let i = 0; i < students.length; i++) {
if (students[i].id == id) {
console.log(`student with id ${id} found in students.`);
return students[i];
}
}
console.log(`id ${id} not found in students`);
return null;
};

// // Export delle funzioni
// module.exports = {
Expand All @@ -234,4 +262,4 @@ const connectStudentToRegister = (studentId, classId) => {
// getStudent
// };

export { registers };
export { registers };