4a8b6d1cf8
- Refonte complète du design avec système de panneaux latéraux rétractables - Ajout de templates de projets par domaine (recherche, informatique, mathématiques, etc.) - Implémentation système d'export PDF avec Puppeteer - Amélioration de l'API REST avec nouvelles routes d'export et templates - Ajout de JavaScript client pour interactions dynamiques - Configuration environnement étendue pour futures fonctionnalités IA - Amélioration responsive design et expérience utilisateur 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
119 lines
3.8 KiB
JavaScript
119 lines
3.8 KiB
JavaScript
function getHeader() {
|
|
return `
|
|
<header>
|
|
<div>
|
|
<h1>Mon Journal de Conception</h1>
|
|
</div>
|
|
</header>
|
|
`;
|
|
}
|
|
|
|
function getLeftPanel() {
|
|
return `
|
|
<div class="side-panel left-panel" id="left-panel">
|
|
<div class="panel-toggle" onclick="togglePanel('left')">
|
|
<span class="arrow">▶</span>
|
|
</div>
|
|
<div class="panel-content">
|
|
<h3 class="panel-header">⚙️ Templates de Projet</h3>
|
|
|
|
<div class="template-form">
|
|
<div class="form-group">
|
|
<label for="domain-select">Domaine :</label>
|
|
<select id="domain-select" title="Choisir le domaine">
|
|
<option value="">-- Sélectionner un domaine --</option>
|
|
<option value="recherche">🔬 Recherche</option>
|
|
<option value="math">📐 Mathématiques</option>
|
|
<option value="informatique">💻 Informatique</option>
|
|
<option value="ingenierie">⚙️ Ingénierie</option>
|
|
<option value="business">💼 Business</option>
|
|
<option value="design">🎨 Design</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="level-select">Niveau de détail :</label>
|
|
<select id="level-select" title="Niveau de détail" disabled>
|
|
<option value="">-- Choisir d'abord un domaine --</option>
|
|
<option value="simple">📄 Simple</option>
|
|
<option value="detaille">📋 Détaillé</option>
|
|
<option value="complet">📚 Complet</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="template-preview" id="template-preview" style="display: none;">
|
|
<h4>Aperçu :</h4>
|
|
<div class="preview-content" id="preview-content">
|
|
<!-- Aperçu du template sélectionné -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-actions">
|
|
<button id="load-template" class="btn success" title="Charger le template" disabled>
|
|
✨ Charger le template
|
|
</button>
|
|
<button id="reset-template" class="btn secondary" title="Réinitialiser">
|
|
🔄 Reset
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
function getRightPanel() {
|
|
return `
|
|
<div class="side-panel right-panel" id="right-panel">
|
|
<div class="panel-toggle" onclick="togglePanel('right')">
|
|
<span class="arrow">◀</span>
|
|
</div>
|
|
<div class="panel-content">
|
|
<h3 class="panel-header">🛠️ Outils</h3>
|
|
|
|
<div class="nav-section">
|
|
<h4>Apparence</h4>
|
|
<div class="nav-buttons">
|
|
<button class="nav-btn" id="theme-toggle" title="Basculer mode sombre">
|
|
<span class="icon">🌓</span>
|
|
<span>Basculer le thème</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-section">
|
|
<h4>Export</h4>
|
|
<div class="nav-buttons">
|
|
<button class="nav-btn" id="export-pdf" title="Exporter en PDF">
|
|
<span class="icon">📄</span>
|
|
<span>Exporter en PDF</span>
|
|
</button>
|
|
<button class="nav-btn" id="export-md" title="Exporter en Markdown">
|
|
<span class="icon">📝</span>
|
|
<span>Exporter en Markdown</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="nav-section">
|
|
<h4>Import</h4>
|
|
<div class="nav-buttons">
|
|
<label class="panel-file-input" for="import-md" title="Importer Markdown">
|
|
<input id="import-md" type="file" accept=".md" style="display:none;">
|
|
<span class="icon">⬆️</span>
|
|
<span>Importer Markdown</span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
function getPanelOverlay() {
|
|
return `
|
|
<div class="panel-overlay" id="panel-overlay" onclick="closeAllPanels()"></div>
|
|
`;
|
|
}
|
|
|
|
module.exports = { getHeader, getLeftPanel, getRightPanel, getPanelOverlay }; |