1
Fork 0
mirror of https://github.com/Steffo99/registro-fermi.git synced 2024-10-16 06:27:34 +00:00
registro-steffo/web/marks.htm
Stefano Pigozzi 728c61aee1 Nuovi commenti in tutto il codice (#2)
* Aggiunti commenti alla pagina di login

* Aggiunti commenti alla pagina della visualizzazione voti

* Aggiunti commenti alla dashboard del professore

* Aggiunti commenti alla pagina di aggiunta voti
2016-09-15 20:17:50 +02:00

248 lines
10 KiB
HTML

<html>
<!--Copyright © 2016 Stefano Pigozzi, Emiliano Maccaferri
Released under the GPL v3 license-->
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="/style/style.css">
<script src="https://use.fontawesome.com/0a710f5b18.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="/lib/cookie.js"></script>
<script>
//Elenco di tutti i voti ricevuto dal server
var voteList = [];
//Ordine attuale delle colonne, false è crescente e true è decrescente
var reverseme = false;
//Come si chiamano i periodi per i voti. (Per cambiare tra quadrimestre e trimestre)
var termname = "quadrimestre";
//Ordina una colonna.
function sortMe()
{
$(".fa").removeClass("fa-sort-asc fa-sort-desc");
if(!reverseme)
{
$(this).addClass("fa-sort-asc");
}
else
{
$(this).addClass("fa-sort-desc");
}
tableSort("mark", "number");
}
//Aggiungi lo 0 a un numero se ha meno di due cifre
function padNumber(string)
{
if(Number(string) < 10)
{
return "0" + string;
}
else
{
return string;
}
}
//Trasforma le date in una stringa nel formato AAAA-MM-DD
function stringifyDates()
{
for(var i = 0; i < voteList.length; i++)
{
var date = new Date(voteList[i].mark_date * 1000);
voteList[i].string_date = String(date.getFullYear()) + "-" + padNumber(String(date.getMonth() + 1)) + "-" + padNumber(String(date.getDate()));
}
}
//Ottieni l'elenco di tutti i numeri di periodi esistenti
function getTermList(list)
{
var termList = [];
for(var i = 0; i < list.length; i++)
{
if(termList.indexOf(list[i].term) === -1)
{
termList.push(list[i].term);
}
}
return termList;
}
//Ottieni l'elenco di tutte le materie con almeno un voto
function getSubjectList(list)
{
var subjectList = [];
for(var i = 0; i < list.length; i++)
{
if(subjectList.indexOf(list[i].subject) === -1)
{
subjectList.push(list[i].subject);
}
}
return subjectList;
}
//Disegna la tabella dei voti in base ai dati ricevuti dal server (voteList)
function drawTable(list)
{
$("#marks tbody").html("");
//Tabella dei voti
for(var i = 0; i < list.length; i++)
{
$("#marks tbody").append("<tr id=\"voto" + String(i) + "\"></tr>");
$("#voto" + String(i)).append("<td class=\"subject\">" + list[i].subject + "</td>");
$("#voto" + String(i)).append("<td class=\"date\">" + list[i].string_date + "</td>");
$("#voto" + String(i)).append("<td class=\"voto\">" + list[i].mark + "</td>");
$("#voto" + String(i)).append("<td class=\"description\">" + list[i].description + "</td>");
$("#voto" + String(i)).append("<td class=\"term\">" + list[i].term + "</td>");
};
//Colore dei voti
$(".voto").each(function(i)
{
if(Number($(this).text()) < 5)
{
$(this).parent().addClass("grave");
}
else if(Number($(this).text() < 6))
{
$(this).parent().addClass("insuff");
}
else if(Number($(this).text() >= 10))
{
$(this).parent().addClass("perfect");
}
});
}
//Calcola le medie per ogni materia e disegna le tabelle
function calcAndDrawAvg(list)
{
var subjectlist = getSubjectList(list);
var termlist = getTermList(list);
//Ho idea che si potrebbe ottimizzare un po'. Un po' molto. Magari con un oggetto. Ma non ora.
for(var t = 0; t < termlist.length; t++)
{
$(".container").append("<h1>Media " + termlist[t] + " " + termname + "</h1>");
//Date il benvenuto alla riga più lunga del secolo!
$(".container").append("<table id=\"medie-" + termlist[t] + "\" class=\"table table-responsive\"><thead><tr><th>Materia</th><th>Media</th></tr></thead><tbody></tbody></table>");
for(var i = 0; i < subjectlist.length; i++)
{
var total = 0;
var marks = 0;
for(var j = 0; j < list.length; j++)
{
if(list[j].subject === subjectlist[i] && list[j].term == termlist[t])
{
total += list[j].mark;
marks++;
}
}
$("#medie-" + termlist[t] + " tbody").append("<tr id=\"media-" + subjectlist[i] + "\"></tr>");
$("#medie-" + termlist[t] + " #media-" + subjectlist[i]).append("<td class=\"subject\">" + subjectlist[i] + "</td>");
$("#medie-" + termlist[t] + " #media-" + subjectlist[i]).append("<td class=\"average\">" + (total / marks).toFixed(2) + "</td>");
if(Number($("#medie-" + termlist[t] + " #media-" + subjectlist[i] + " .average").text()) < 5)
{
$("#medie-" + termlist[t] + " #media-" + subjectlist[i]).addClass("grave");
}
else if(Number($("#medie-" + termlist[t] + " #media-" + subjectlist[i] + " .average").text()) < 6)
{
$("#medie-" + termlist[t] + " #media-" + subjectlist[i]).addClass("insuff");
}
else if(Number($("#medie-" + termlist[t] + " #media-" + subjectlist[i] + " .average").text()) === 10)
{
$("#medie-" + termlist[t] + " #media-" + subjectlist[i]).addClass("perfect");
}
}
}
}
//Ordina una tabella in base alla riga
function tableSort(index, type)
{
//Questo codice è un tantino hackeroso... Ma funziona!
if(type === "string")
{
voteList.sort(function(a, b) {
return a[index].localeCompare(b[index]);
});
}
else if(type === "number")
{
voteList.sort(function(a, b) {
return a[index]-b[index];
});
}
if(reverseme)
{
reverseme = false;
voteList.reverse();
}
else
{
reverseme = true;
}
drawTable(voteList);
}
//Aggiungi le freccine per l'ordinamento alla tabella dei voti
function enableSort()
{
$("#sort-subject").click(sortMe);
$("#sort-date").click(sortMe);
$("#sort-mark").click(sortMe);
$("#sort-term").click(sortMe);
}
//Ricevi i voti dal server.
$.post("https://api.emilianomaccaferri.me/getMarks",
{
"sessionid": Cookies.get("sessionid")
},
function(data){
if(data.success)
{
voteList = data.list;
stringifyDates();
drawTable(voteList);
calcAndDrawAvg(voteList);
}
else
{
console.log("Failure!");
console.log(data.error);
}
}, "json");
window.onload = enableSort;
</script>
</head>
<body id="marklist">
<div class="container">
<h1>
Voti
</h1>
<table id="marks" class="table table-responsive">
<thead>
<tr>
<th><span class="fa fa-sort clickme" id="sort-subject"></span> Materia</th>
<th><span class="fa fa-sort clickme" id="sort-date"></span> Data</th>
<th><span class="fa fa-sort clickme" id="sort-mark"></span> Voto</th>
<th>Descrizione</th>
<th><span class="fa fa-sort clickme" id="sort-term"></span> Quadrimestre</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</body>
</html>