Initial commit
This commit is contained in:
@@ -0,0 +1,347 @@
|
||||
const dayMap = {
|
||||
"Lundi": 0,
|
||||
"Mardi": 1,
|
||||
"Mercredi": 2,
|
||||
"Jeudi": 3,
|
||||
"Vendredi": 4,
|
||||
"Samedi": 5,
|
||||
"Dimanche": 6
|
||||
};
|
||||
|
||||
|
||||
// ======================================================
|
||||
// Cours ajoutés manuellement
|
||||
// ======================================================
|
||||
|
||||
function addCourse(course = {}) {
|
||||
const tbody = document.getElementById("courses");
|
||||
|
||||
const row = document.createElement("tr");
|
||||
|
||||
row.innerHTML = `
|
||||
<td>
|
||||
<input type="checkbox" class="select-row" checked>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<select class="day">
|
||||
<option value="0">Lundi</option>
|
||||
<option value="1">Mardi</option>
|
||||
<option value="2">Mercredi</option>
|
||||
<option value="3">Jeudi</option>
|
||||
<option value="4">Vendredi</option>
|
||||
</select>
|
||||
</td>
|
||||
|
||||
<td><input class="start" type="time"></td>
|
||||
<td><input class="end" type="time"></td>
|
||||
<td><input class="name"></td>
|
||||
<td><input class="prof"></td>
|
||||
<td><input class="room"></td>
|
||||
<td><input class="color" type="color"></td>
|
||||
|
||||
<td>
|
||||
<button type="button" class="remove">
|
||||
❌
|
||||
</button>
|
||||
</td>
|
||||
`;
|
||||
|
||||
tbody.appendChild(row);
|
||||
|
||||
|
||||
row.querySelector(".day").value = course.day ?? 0;
|
||||
row.querySelector(".start").value = course.start ?? "";
|
||||
row.querySelector(".end").value = course.end ?? "";
|
||||
row.querySelector(".name").value = course.name ?? "";
|
||||
row.querySelector(".prof").value = course.prof ?? "";
|
||||
row.querySelector(".room").value = course.room ?? "";
|
||||
row.querySelector(".color").value =
|
||||
course.color ?? "#80b3ff";
|
||||
|
||||
|
||||
row.querySelector(".remove").onclick = () => {
|
||||
row.remove();
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// ======================================================
|
||||
// Gestion des UE fondamentales
|
||||
// ======================================================
|
||||
|
||||
const fonda =
|
||||
[...document.querySelectorAll(
|
||||
"#courses-base .ue-selector"
|
||||
)];
|
||||
|
||||
|
||||
fonda.forEach(cb => {
|
||||
|
||||
cb.addEventListener("change", () => {
|
||||
|
||||
const selected =
|
||||
fonda.filter(x => x.checked);
|
||||
|
||||
/*
|
||||
if (selected.length > 2) {
|
||||
cb.checked = false;
|
||||
alert("Choisissez seulement 2 UE parmi les 3.");
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
updateTD();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
function updateTD() {
|
||||
|
||||
document
|
||||
.querySelectorAll(
|
||||
"#courses-base input[type=radio]"
|
||||
)
|
||||
.forEach(radio => {
|
||||
|
||||
const ue =
|
||||
radio.dataset.ue;
|
||||
|
||||
|
||||
const selected =
|
||||
document.querySelector(
|
||||
`.ue-selector[data-ue="${ue}"]`
|
||||
)?.checked;
|
||||
|
||||
|
||||
radio.disabled = !selected;
|
||||
|
||||
|
||||
if (!selected)
|
||||
radio.checked = false;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// ======================================================
|
||||
// Conversion d'une ligne HTML en cours JSON
|
||||
// ======================================================
|
||||
|
||||
function rowToCourse(row) {
|
||||
return {
|
||||
|
||||
day:
|
||||
Number(row.dataset.day),
|
||||
|
||||
start:
|
||||
row.dataset.start,
|
||||
|
||||
end:
|
||||
row.dataset.end,
|
||||
|
||||
name:
|
||||
row.dataset.name ?? "",
|
||||
|
||||
prof:
|
||||
row.dataset.prof ?? "",
|
||||
|
||||
room:
|
||||
row.dataset.room ?? "",
|
||||
|
||||
color:
|
||||
row.dataset.color ?? "#ffffff"
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
|
||||
// ======================================================
|
||||
// Extraction des cours fixes
|
||||
// ======================================================
|
||||
|
||||
function extractFixedCourses(container) {
|
||||
|
||||
const courses = [];
|
||||
|
||||
|
||||
container
|
||||
.querySelectorAll("tr")
|
||||
.forEach(row => {
|
||||
//console.log(row);
|
||||
|
||||
const checkbox =
|
||||
document.getElementById(row.getAttribute("checkbox-id"))
|
||||
|
||||
enabled = checkbox.checked;
|
||||
|
||||
if (!enabled)
|
||||
return;
|
||||
|
||||
const course =
|
||||
rowToCourse(row);
|
||||
console.log(course);
|
||||
|
||||
|
||||
if (course)
|
||||
courses.push(course);
|
||||
|
||||
});
|
||||
|
||||
|
||||
return courses;
|
||||
}
|
||||
|
||||
|
||||
// ======================================================
|
||||
// Submit PDF
|
||||
// ======================================================
|
||||
|
||||
document
|
||||
.getElementById("courseForm")
|
||||
.addEventListener(
|
||||
"submit",
|
||||
async e => {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
|
||||
let cours = [];
|
||||
|
||||
|
||||
cours.push(
|
||||
...extractFixedCourses(
|
||||
document.getElementById(
|
||||
"courses-base"
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
|
||||
cours.push(
|
||||
...extractFixedCourses(
|
||||
document.getElementById(
|
||||
"courses-autre"
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
|
||||
|
||||
// Cours ajoutés manuellement
|
||||
|
||||
document
|
||||
.querySelectorAll(
|
||||
"#courses tr"
|
||||
)
|
||||
.forEach(row => {
|
||||
|
||||
|
||||
if (
|
||||
!row.querySelector(
|
||||
".select-row"
|
||||
).checked
|
||||
)
|
||||
return;
|
||||
|
||||
|
||||
cours.push({
|
||||
|
||||
day:
|
||||
Number(
|
||||
row.querySelector(
|
||||
".day"
|
||||
).value
|
||||
),
|
||||
|
||||
start:
|
||||
row.querySelector(
|
||||
".start"
|
||||
).value,
|
||||
|
||||
end:
|
||||
row.querySelector(
|
||||
".end"
|
||||
).value,
|
||||
|
||||
name:
|
||||
row.querySelector(
|
||||
".name"
|
||||
).value,
|
||||
|
||||
prof:
|
||||
row.querySelector(
|
||||
".prof"
|
||||
).value,
|
||||
|
||||
room:
|
||||
row.querySelector(
|
||||
".room"
|
||||
).value,
|
||||
|
||||
color:
|
||||
row.querySelector(
|
||||
".color"
|
||||
).value
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
const response =
|
||||
await fetch(
|
||||
"/edt.pdf",
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type":
|
||||
"application/json"
|
||||
},
|
||||
body:
|
||||
JSON.stringify({
|
||||
cours
|
||||
})
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
const blob =
|
||||
await response.blob();
|
||||
|
||||
|
||||
window.open(
|
||||
URL.createObjectURL(blob)
|
||||
);
|
||||
|
||||
}
|
||||
);
|
||||
|
||||
|
||||
|
||||
// ======================================================
|
||||
// Select all cours ajoutés
|
||||
// ======================================================
|
||||
|
||||
const selectAll =
|
||||
document.getElementById(
|
||||
"select-all"
|
||||
);
|
||||
|
||||
|
||||
if (selectAll) {
|
||||
|
||||
selectAll.onchange = () => {
|
||||
|
||||
document
|
||||
.querySelectorAll(
|
||||
".select-row"
|
||||
)
|
||||
.forEach(cb => {
|
||||
cb.checked =
|
||||
selectAll.checked;
|
||||
});
|
||||
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,139 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
background: #f5f6fa;
|
||||
padding: 30px;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
form {
|
||||
background: white;
|
||||
padding: 25px;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,0.08);
|
||||
max-width: 1200px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
overflow: hidden;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
thead {
|
||||
background: #333;
|
||||
color: white;
|
||||
}
|
||||
|
||||
tbody tbody:nth-child(even) td {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
th {
|
||||
padding: 12px;
|
||||
text-align: center;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
|
||||
tbody tr:hover {
|
||||
background: #f1f5ff;
|
||||
}
|
||||
|
||||
input,
|
||||
select {
|
||||
width: 100%;
|
||||
padding: 6px 8px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 6px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type="color"] {
|
||||
height: 35px;
|
||||
padding: 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input:focus,
|
||||
select:focus {
|
||||
outline: none;
|
||||
border-color: #4a90e2;
|
||||
box-shadow: 0 0 0 2px rgba(74,144,226,0.2);
|
||||
}
|
||||
|
||||
|
||||
button {
|
||||
margin-top: 15px;
|
||||
padding: 10px 18px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
transition: 0.15s;
|
||||
}
|
||||
|
||||
button:hover {
|
||||
transform: translateY(-1px);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
|
||||
button[type="submit"] {
|
||||
background: #2563eb;
|
||||
color: white;
|
||||
}
|
||||
|
||||
button[type="button"] {
|
||||
background: #e5e7eb;
|
||||
color: #111;
|
||||
}
|
||||
|
||||
|
||||
.remove {
|
||||
background: #333 !important;
|
||||
color: white;
|
||||
padding: 6px 10px;
|
||||
font-size: 13px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
#courses tr {
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
|
||||
/* Better mobile display */
|
||||
@media (max-width: 900px) {
|
||||
|
||||
body {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
form {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
table {
|
||||
display: block;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user