Spaces:
Sleeping
Sleeping
| console.log("✅ script.js chargé"); | |
| // ===================================================== | |
| // Données apprenant (exemple) | |
| // ===================================================== | |
| const learnerData = { | |
| intention: "Améliorer mon écriture académique", | |
| difficulty: "Je me sens parfois bloqué pour structurer mes idées", | |
| profile: { engagement: "moyen", risk: "modéré" }, | |
| domains: { discours: 65, texte: 52, phrase: 78, mot: 82 }, | |
| activity: { errorsRate: 35 } | |
| }; | |
| // ===================================================== | |
| // Radar professionnel – Indicateurs décideur | |
| // ===================================================== | |
| const radarMetrics = [ | |
| { label: "Démarrage des activités", value: 85 }, | |
| { label: "Éléments de connaissance validés", value: 72 }, | |
| { label: "Niveau moyen de compétence", value: 68 }, | |
| { label: "Taux d’erreur (inversé)", value: 65 }, | |
| { label: "Achèvement des activités", value: 74 }, | |
| { label: "Interactions avec les ressources", value: 80 }, | |
| { label: "Score PIX (performance)", value: 70 }, | |
| { label: "Domaines de compétence", value: 78 } | |
| ]; | |
| // ===================================================== | |
| // Trust metrics | |
| // ===================================================== | |
| const trustMetrics = { RA: 0, EA: 0, RE: 0, MCS: 0, MS: 0 }; | |
| const trustWeights = { RA: 0.30, EA: 0.20, RE: 0.20, MCS: 0.10, MS: 0.20 }; | |
| // ===================================================== | |
| // Initialisation | |
| // ===================================================== | |
| document.addEventListener("DOMContentLoaded", () => { | |
| document.getElementById("intent").textContent = learnerData.intention; | |
| document.getElementById("difficulty").textContent = learnerData.difficulty; | |
| setBar("discours", learnerData.domains.discours); | |
| setBar("texte", learnerData.domains.texte); | |
| setBar("phrase", learnerData.domains.phrase); | |
| setBar("mot", learnerData.domains.mot); | |
| const riskValue = learnerData.profile.risk === "élevé" ? 80 : | |
| learnerData.profile.risk === "modéré" ? 50 : 20; | |
| setBar("risk", riskValue, true); | |
| drawRadar(); | |
| generateEmpathicFeedback(); | |
| initTrustStars(); | |
| }); | |
| // ===================================================== | |
| // UI helpers | |
| // ===================================================== | |
| function setBar(id, value, isRisk = false) { | |
| const el = document.getElementById(id); | |
| el.style.width = value + "%"; | |
| el.textContent = value + "%"; | |
| if (isRisk) el.style.background = value > 70 ? "#E53935" : value > 40 ? "#FB8C00" : "#43A047"; | |
| } | |
| // ===================================================== | |
| // Radar professionnel | |
| // ===================================================== | |
| function drawRadar() { | |
| const canvas = document.getElementById("radar"); | |
| const ctx = canvas.getContext("2d"); | |
| const cx = canvas.width / 2, cy = canvas.height / 2; | |
| const radius = 200, levels = 5, count = radarMetrics.length; | |
| ctx.clearRect(0, 0, canvas.width, canvas.height); | |
| ctx.font = "12px Arial"; | |
| for (let l = 1; l <= levels; l++) { | |
| ctx.beginPath(); | |
| ctx.arc(cx, cy, (radius / levels) * l, 0, 2 * Math.PI); | |
| ctx.strokeStyle = "#e0e0e0"; | |
| ctx.stroke(); | |
| } | |
| radarMetrics.forEach((m, i) => { | |
| const angle = (2 * Math.PI / count) * i - Math.PI / 2; | |
| ctx.beginPath(); | |
| ctx.moveTo(cx, cy); | |
| ctx.lineTo(cx + radius * Math.cos(angle), cy + radius * Math.sin(angle)); | |
| ctx.strokeStyle = "#cfd8dc"; | |
| ctx.stroke(); | |
| ctx.fillText(m.label, | |
| cx + (radius + 18) * Math.cos(angle) - 50, | |
| cy + (radius + 18) * Math.sin(angle) | |
| ); | |
| }); | |
| ctx.beginPath(); | |
| radarMetrics.forEach((m, i) => { | |
| const angle = (2 * Math.PI / count) * i - Math.PI / 2; | |
| const r = radius * (m.value / 100); | |
| const x = cx + r * Math.cos(angle); | |
| const y = cy + r * Math.sin(angle); | |
| i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y); | |
| }); | |
| ctx.closePath(); | |
| ctx.fillStyle = "rgba(25,118,210,0.25)"; | |
| ctx.strokeStyle = "#1976D2"; | |
| ctx.lineWidth = 2; | |
| ctx.fill(); | |
| ctx.stroke(); | |
| } | |
| // ===================================================== | |
| // Feedback empathique | |
| // ===================================================== | |
| function generateEmpathicFeedback() { | |
| let msg = "Il est normal de rencontrer des difficultés dans l’écriture académique. "; | |
| if (learnerData.domains.texte < 60) | |
| msg += "Les indicateurs montrent que la structuration du texte reste un défi important. "; | |
| if (learnerData.activity.errorsRate > 30) | |
| msg += "Un taux d’erreurs élevé peut provoquer frustration et doute, ce qui est compréhensible. "; | |
| msg += "Vos compétences linguistiques constituent cependant une base solide. "; | |
| msg += "En planifiant vos activités et en progressant étape par étape, vous pouvez renforcer votre confiance."; | |
| document.getElementById("feedback").textContent = msg; | |
| } | |
| // ===================================================== | |
| // Trust metrics UI | |
| // ===================================================== | |
| function initTrustStars() { | |
| document.querySelectorAll(".stars").forEach(container => { | |
| const metric = container.dataset.metric; | |
| for (let i = 1; i <= 5; i++) { | |
| const star = document.createElement("span"); | |
| star.textContent = "★"; | |
| star.classList.add("inactive"); | |
| star.onclick = () => { | |
| trustMetrics[metric] = i; | |
| [...container.children].forEach((s, idx) => s.classList.toggle("inactive", idx >= i)); | |
| updateTrustScore(); | |
| }; | |
| container.appendChild(star); | |
| } | |
| }); | |
| } | |
| function updateTrustScore() { | |
| let T = 0, max = 0; | |
| for (const m in trustMetrics) { | |
| T += trustMetrics[m] * trustWeights[m]; | |
| max += 5 * trustWeights[m]; | |
| } | |
| const score = Math.round((T / max) * 100); | |
| const bar = document.getElementById("trust-bar"); | |
| bar.style.width = score + "%"; | |
| bar.textContent = score + "%"; | |
| bar.style.background = score < 40 ? "#E53935" : score < 70 ? "#FB8C00" : "#43A047"; | |
| } | |