File size: 4,044 Bytes
1ea59f1 6350fb6 1ea59f1 6350fb6 5c8a3c4 f479d42 5c8a3c4 607c338 5c8a3c4 6350fb6 5c8a3c4 1ea59f1 5c8a3c4 6350fb6 1ea59f1 6350fb6 5c971ad 027e14a 5c8a3c4 027e14a 5c8a3c4 607c338 5c8a3c4 607c338 5c8a3c4 027e14a 1ea59f1 5c8a3c4 6350fb6 607c338 1ea59f1 6350fb6 607c338 027e14a 5c8a3c4 607c338 5c8a3c4 607c338 5c971ad 1ea59f1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 |
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Résolution de Problèmes Mathématiques</title>
<!-- Tailwind CSS -->
<script src="https://cdn.tailwindcss.com"></script>
<!-- Marked.js pour le Markdown -->
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/marked/9.1.6/marked.min.js"></script>
<!-- MathJax -->
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
</script>
<script>
window.MathJax = {
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']],
displayMath: [['$$', '$$'], ['\\[', '\\]']],
processEscapes: true,
macros: {
R: "{\\mathbb{R}}",
N: "{\\mathbb{N}}",
Z: "{\\mathbb{Z}}"
}
},
svg: {
fontCache: 'global'
},
options: {
renderActions: {
addMenu: []
}
}
};
</script>
<!-- Font Awesome pour les icônes -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
<style>
/* Styles personnalisés */
.dropzone {
border: 2px dashed #4F46E5;
transition: all 0.3s ease;
}
.dropzone:hover {
border-color: #312E81;
background-color: rgba(79, 70, 229, 0.1);
}
.loading {
display: none;
}
.loading.active {
display: flex;
}
.math-content {
font-size: 1.1em;
line-height: 1.6;
overflow-x: auto;
}
.math-content p {
margin-bottom: 1rem;
white-space: pre-wrap;
}
.math-content .MathJax {
overflow-x: auto;
overflow-y: hidden;
padding: 0.5rem 0;
}
@media (max-width: 640px) {
.math-content .MathJax {
font-size: 0.9em;
}
}
</style>
</head>
<body class="min-h-screen bg-gradient-to-br from-blue-50 to-white">
<!-- Le reste du HTML reste identique -->
<script>
document.addEventListener('DOMContentLoaded', function() {
// Les variables DOM restent identiques
// Fonction pour rendre le contenu mathématique
async function renderMathContent(text) {
try {
// Nettoyer le contenu précédent
latexContent.innerHTML = '';
// Convertir le Markdown en HTML
const htmlContent = marked.parse(text);
latexContent.innerHTML = htmlContent;
// Rendre les formules mathématiques avec MathJax
MathJax.typesetPromise([latexContent]).then(() => {
response.classList.remove('hidden');
}).catch((err) => {
console.error('Erreur MathJax:', err);
showError('Erreur lors du rendu de la formule mathématique');
});
} catch (error) {
console.error('Erreur lors du rendu:', error);
showError('Erreur lors du rendu de la formule mathématique');
latexContent.innerHTML = `
<div class="text-red-600 mb-4">Une erreur s'est produite lors du rendu. Voici le texte brut :</div>
<pre class="bg-gray-100 p-4 rounded-lg overflow-x-auto">${text}</pre>
`;
}
}
// Le reste du JavaScript reste identique
});
</script>
</body>
</html> |