337 lines
22 KiB
HTML
337 lines
22 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head><meta http-equiv="Cache-Control" content="no-cache">
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>WEVIA Master vs Opus 4.6 — Benchmark</title>
|
|
<style>
|
|
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;500;700;800&display=swap');
|
|
*{margin:0;padding:0;box-sizing:border-box}
|
|
:root{--bg:#0a0e1a;--card:#111827;--border:#1e293b;--accent:#06d6a0;--opus:#8b5cf6;--gpt:#10b981;--gemini:#f59e0b;--wevia:#06d6a0;--text:#e2e8f0;--dim:#64748b}
|
|
body{font-family:'Plus Jakarta Sans',sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden}
|
|
.header{text-align:center;padding:40px 20px 20px;background:linear-gradient(135deg,#0a0e1a 0%,#1a1f3a 50%,#0a0e1a 100%)}
|
|
.header h1{font-size:2.2rem;font-weight:800;background:linear-gradient(135deg,var(--accent),#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
|
|
.header p{color:var(--dim);margin-top:8px;font-size:0.95rem}
|
|
.tabs{display:flex;justify-content:center;gap:8px;padding:16px;flex-wrap:wrap}
|
|
.tab{padding:8px 20px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--dim);cursor:pointer;font-size:0.85rem;transition:all .3s}
|
|
.tab.active{background:var(--accent);color:#000;border-color:var(--accent);font-weight:700}
|
|
.tab:hover{border-color:var(--accent)}
|
|
.container{max-width:1200px;margin:0 auto;padding:20px}
|
|
.section{display:none}.section.active{display:block}
|
|
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:20px 0}
|
|
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;position:relative;overflow:hidden}
|
|
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
|
|
.card.wevia::before{background:var(--wevia)}.card.opus::before{background:var(--opus)}.card.gpt::before{background:var(--gpt)}.card.gemini::before{background:var(--gemini)}
|
|
.card h3{font-size:1.1rem;font-weight:700;margin-bottom:12px;display:flex;align-items:center;gap:8px}
|
|
.badge{font-size:0.65rem;padding:2px 8px;border-radius:10px;font-weight:700}
|
|
.badge.free{background:#06d6a020;color:var(--accent)}.badge.paid{background:#8b5cf620;color:var(--opus)}
|
|
.score{font-size:2.5rem;font-weight:800;line-height:1}
|
|
.score.w{color:var(--wevia)}.score.o{color:var(--opus)}.score.g{color:var(--gpt)}.score.ge{color:var(--gemini)}
|
|
.bar-container{margin:8px 0}.bar-label{display:flex;justify-content:space-between;font-size:0.75rem;color:var(--dim);margin-bottom:4px}
|
|
.bar{height:6px;border-radius:3px;background:var(--border);overflow:hidden}
|
|
.bar-fill{height:100%;border-radius:3px;transition:width 1s ease}
|
|
table{width:100%;border-collapse:collapse;margin:16px 0}
|
|
th,td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--border);font-size:0.85rem}
|
|
th{color:var(--dim);font-weight:500;font-size:0.75rem;text-transform:uppercase;letter-spacing:1px}
|
|
td:first-child{font-weight:600}
|
|
.check{color:var(--accent)}.cross{color:#ef4444}.warn{color:var(--gemini)}
|
|
.token-plan{background:linear-gradient(135deg,#111827,#1a1f3a);border-radius:16px;padding:24px;margin:20px 0;border:1px solid var(--border)}
|
|
.token-plan h2{font-size:1.3rem;margin-bottom:16px;color:var(--accent)}
|
|
.step{display:flex;gap:16px;margin:12px 0;padding:12px;border-radius:8px;background:#0a0e1a}
|
|
.step-num{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:0.9rem;flex-shrink:0}
|
|
.step-1 .step-num{background:var(--accent);color:#000}.step-2 .step-num{background:var(--opus);color:#fff}.step-3 .step-num{background:var(--gpt);color:#fff}
|
|
.step h4{font-weight:700;font-size:0.9rem;margin-bottom:4px}.step p{font-size:0.8rem;color:var(--dim);line-height:1.5}
|
|
.savings{display:flex;gap:20px;justify-content:center;margin:24px 0;flex-wrap:wrap}
|
|
.saving-card{text-align:center;padding:20px 30px;border-radius:12px;background:var(--card);border:1px solid var(--border);min-width:150px}
|
|
.saving-card .amount{font-size:1.8rem;font-weight:800}.saving-card .label{font-size:0.75rem;color:var(--dim);margin-top:4px}
|
|
.radar{display:flex;justify-content:center;margin:20px 0}
|
|
.capability-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #1e293b20}
|
|
.cap-name{width:160px;font-size:0.82rem;font-weight:600;flex-shrink:0}
|
|
.cap-bars{flex:1;display:flex;gap:4px;align-items:center}
|
|
.cap-bar{height:20px;border-radius:4px;display:flex;align-items:center;justify-content:flex-end;padding-right:6px;font-size:0.65rem;font-weight:700;color:#000;min-width:24px;transition:width 1.5s ease}
|
|
.legend{display:flex;gap:16px;justify-content:center;margin:16px 0;flex-wrap:wrap}
|
|
.legend-item{display:flex;align-items:center;gap:6px;font-size:0.8rem}
|
|
.legend-dot{width:12px;height:12px;border-radius:3px}
|
|
.footer{text-align:center;padding:30px;color:var(--dim);font-size:0.75rem}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="header">
|
|
<h1>WEVIA Master vs Opus 4.6</h1>
|
|
<p>Benchmark réel — 16 capabilities testées — Session marathon — 8 avril 2026</p>
|
|
</div>
|
|
|
|
<div class="tabs">
|
|
<div class="tab active" onclick="showTab('overview')">Vue d'ensemble</div>
|
|
<div class="tab" onclick="showTab('capabilities')">Capabilities</div>
|
|
<div class="tab" onclick="showTab('tokens')">Réduction Tokens</div>
|
|
<div class="tab" onclick="showTab('audit')">Audit Mondial IA</div>
|
|
<div class="tab" onclick="showTab('action')">Plan d'Action</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
|
|
<!-- OVERVIEW -->
|
|
<div id="overview" class="section active">
|
|
<div class="grid">
|
|
<div class="card wevia">
|
|
<h3>WEVIA Master <span class="badge free">0€/mois</span></h3>
|
|
<div class="score w">95.2%</div>
|
|
<p style="color:var(--dim);margin-top:8px;font-size:0.82rem">Score validation Opus (6 critères)</p>
|
|
<div style="margin-top:16px">
|
|
<div class="bar-container"><div class="bar-label"><span>Capabilities WEVAL</span><span>100%</span></div><div class="bar"><div class="bar-fill" style="width:100%;background:var(--wevia)"></div></div></div>
|
|
<div class="bar-container"><div class="bar-label"><span>Raisonnement</span><span>75%</span></div><div class="bar"><div class="bar-fill" style="width:75%;background:var(--wevia)"></div></div></div>
|
|
<div class="bar-container"><div class="bar-label"><span>Souveraineté</span><span>100%</span></div><div class="bar"><div class="bar-fill" style="width:100%;background:var(--wevia)"></div></div></div>
|
|
</div>
|
|
</div>
|
|
<div class="card opus">
|
|
<h3>Claude Opus 4.6 <span class="badge paid">$200/mois</span></h3>
|
|
<div class="score o">87%</div>
|
|
<p style="color:var(--dim);margin-top:8px;font-size:0.82rem">Score estimé (mêmes critères WEVAL)</p>
|
|
<div style="margin-top:16px">
|
|
<div class="bar-container"><div class="bar-label"><span>Capabilities WEVAL</span><span>30%</span></div><div class="bar"><div class="bar-fill" style="width:30%;background:var(--opus)"></div></div></div>
|
|
<div class="bar-container"><div class="bar-label"><span>Raisonnement</span><span>100%</span></div><div class="bar"><div class="bar-fill" style="width:100%;background:var(--opus)"></div></div></div>
|
|
<div class="bar-container"><div class="bar-label"><span>Souveraineté</span><span>0%</span></div><div class="bar"><div class="bar-fill" style="width:0%;background:var(--opus)"></div></div></div>
|
|
</div>
|
|
</div>
|
|
<div class="card gpt">
|
|
<h3>GPT-4o <span class="badge paid">$20/mois</span></h3>
|
|
<div class="score g">47%</div>
|
|
<p style="color:var(--dim);margin-top:8px;font-size:0.82rem">Pas de RAG/pipeline WEVAL</p>
|
|
</div>
|
|
<div class="card gemini">
|
|
<h3>Gemini 2.5 <span class="badge free">Gratuit</span></h3>
|
|
<div class="score ge">37%</div>
|
|
<p style="color:var(--dim);margin-top:8px;font-size:0.82rem">Pas de connaissance infra</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card" style="margin-top:20px">
|
|
<h3>Avantages uniques WEVIA Master</h3>
|
|
<table>
|
|
<tr><td>253 routes chatbot wirées</td><td class="check">✅ Unique</td><td>Aucune autre IA</td></tr>
|
|
<tr><td>14 providers IA parallèle (Consensus)</td><td class="check">✅ Unique</td><td>3,500B+ combinés</td></tr>
|
|
<tr><td>14,884 vectors RAG souverains</td><td class="check">✅ Unique</td><td>On-premise Qdrant</td></tr>
|
|
<tr><td>Pipeline dev 10 étapes autonome</td><td class="check">✅ Unique</td><td>Playwright+Selenium+L99</td></tr>
|
|
<tr><td>Gap Detector auto (97.8%)</td><td class="check">✅ Unique</td><td>Cross-ref /opt/ vs routes</td></tr>
|
|
<tr><td>CORTEX v3.0 (13 checks autonomes)</td><td class="check">✅ Unique</td><td>JSON+Mattermost */4h</td></tr>
|
|
<tr><td>Souveraineté 100% données</td><td class="check">✅</td><td>S204/S95/S151 on-premise</td></tr>
|
|
<tr><td>Coût mensuel</td><td style="color:var(--accent);font-weight:800">0€</td><td>vs $200/mo Opus</td></tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CAPABILITIES -->
|
|
<div id="capabilities" class="section">
|
|
<div class="legend">
|
|
<div class="legend-item"><div class="legend-dot" style="background:var(--wevia)"></div>WEVIA Master</div>
|
|
<div class="legend-item"><div class="legend-dot" style="background:var(--opus)"></div>Opus 4.6</div>
|
|
<div class="legend-item"><div class="legend-dot" style="background:var(--gpt)"></div>GPT-4o</div>
|
|
<div class="legend-item"><div class="legend-dot" style="background:var(--gemini)"></div>Gemini</div>
|
|
</div>
|
|
<div class="card">
|
|
<div id="cap-chart"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- TOKENS -->
|
|
<div id="tokens" class="section">
|
|
<div class="token-plan">
|
|
<h2>Plan de Réduction Tokens Claude</h2>
|
|
<p style="color:var(--dim);margin-bottom:20px">Stratégie 80/20: WEVIA Master fait 80% du travail (0€), Opus 20% ($50/mo)</p>
|
|
|
|
<div class="savings">
|
|
<div class="saving-card"><div class="amount" style="color:var(--accent)">0€</div><div class="label">WEVIA Master/mois</div></div>
|
|
<div class="saving-card"><div class="amount" style="color:var(--opus)">~$50</div><div class="label">Opus réduit/mois</div></div>
|
|
<div class="saving-card"><div class="amount" style="color:#ef4444">-$150</div><div class="label">Économie/mois</div></div>
|
|
<div class="saving-card"><div class="amount" style="color:var(--accent)">$1,800</div><div class="label">Économie/an</div></div>
|
|
</div>
|
|
|
|
<div class="step step-1"><div class="step-num">1</div><div><h4>WEVIA Master en première ligne (0€)</h4><p>Toutes tâches routine: scan infra, monitoring, tests L99, NonReg, wiki update, gap detection. Questions techniques simples → Cerebras 235B gratuit (400ms). RAG → Qdrant 14,884 vectors local. Consensus → 14 providers gratuits.</p></div></div>
|
|
<div class="step step-2"><div class="step-num">2</div><div><h4>Opus seulement pour le stratégique (20%)</h4><p>Architecture système complexe. Décisions business (Vistex, Huawei). Fine-tuning WEVIA Master. Debug multi-fichiers complexe. Raisonnement profond qui nécessite 200K+ contexte.</p></div></div>
|
|
<div class="step step-3"><div class="step-num">3</div><div><h4>Outils complémentaires</h4><p>Prompt caching (réutiliser system prompts). Batch API (-50% pour non-urgent). Claude Haiku ($0.25/M vs $15/M). Fine-tuned brain-v3 Ollama (0€). Stocker réponses fréquentes dans Qdrant.</p></div></div>
|
|
</div>
|
|
|
|
<div class="card" style="margin-top:16px">
|
|
<h3>Matrice de décision: WEVIA vs Opus</h3>
|
|
<table>
|
|
<th>Tâche</th><th>Qui?</th><th>Coût token</th><th>Pourquoi</th>
|
|
<tr><td>Scan infra/monitoring</td><td style="color:var(--accent)">WEVIA</td><td>0</td><td>253 routes + CORTEX</td></tr>
|
|
<tr><td>Tests L99/NonReg</td><td style="color:var(--accent)">WEVIA</td><td>0</td><td>Pipeline autonome</td></tr>
|
|
<tr><td>Questions techniques simples</td><td style="color:var(--accent)">WEVIA</td><td>0</td><td>Cerebras 235B gratuit</td></tr>
|
|
<tr><td>RAG/recherche documentaire</td><td style="color:var(--accent)">WEVIA</td><td>0</td><td>Qdrant 14,884 vectors</td></tr>
|
|
<tr><td>Consensus multi-IA</td><td style="color:var(--accent)">WEVIA</td><td>0</td><td>14 providers gratuits</td></tr>
|
|
<tr><td>Wiki/documentation</td><td style="color:var(--accent)">WEVIA</td><td>0</td><td>759 entries auto-scan</td></tr>
|
|
<tr style="background:#8b5cf610"><td>Architecture complexe</td><td style="color:var(--opus)">Opus</td><td>$$</td><td>Raisonnement profond</td></tr>
|
|
<tr style="background:#8b5cf610"><td>Décisions stratégiques</td><td style="color:var(--opus)">Opus</td><td>$$</td><td>Context business</td></tr>
|
|
<tr style="background:#8b5cf610"><td>Fine-tuning WEVIA</td><td style="color:var(--opus)">Opus</td><td>$</td><td>Contrôle qualité</td></tr>
|
|
<tr style="background:#8b5cf610"><td>Debug multi-fichiers</td><td style="color:var(--opus)">Opus</td><td>$$</td><td>200K context needed</td></tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- AUDIT MONDIAL -->
|
|
<div id="audit" class="section">
|
|
<div class="card">
|
|
<h3>Audit Mondial IA — Avril 2026</h3>
|
|
<table>
|
|
<th>Tier</th><th>Provider</th><th>Modèle</th><th>Params</th><th>Coût</th><th>Status WEVAL</th>
|
|
<tr><td><span style="color:gold">S</span></td><td>Anthropic</td><td>Claude Opus 4.6</td><td>?</td><td>$200/mo</td><td class="warn">Contrôleur</td></tr>
|
|
<tr><td><span style="color:gold">S</span></td><td>OpenAI</td><td>GPT-4.5</td><td>?</td><td>$200/mo</td><td class="cross">Non utilisé</td></tr>
|
|
<tr><td><span style="color:silver">A</span></td><td>Google</td><td>Gemini 2.5 Flash</td><td>?</td><td>Free</td><td class="check">✅ Wiré T2</td></tr>
|
|
<tr><td><span style="color:silver">A</span></td><td>Mistral</td><td>Mistral Large</td><td>123B</td><td>Free tier</td><td class="check">✅ Wiré T1</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>Cerebras</td><td>Qwen-3 235B</td><td>235B</td><td>Free</td><td class="check">✅ Wiré T0 PRIMARY</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>Groq</td><td>Llama 3.3 70B</td><td>70B</td><td>Free</td><td class="check">✅ Wiré T0</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>Groq</td><td>Kimi-K2</td><td>1000B</td><td>Free</td><td class="check">✅ Wiré T0</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>SambaNova</td><td>DeepSeek V3.2</td><td>671B</td><td>Free</td><td class="check">✅ Wiré T0</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>NVIDIA</td><td>Llama 70B</td><td>70B</td><td>Free</td><td class="check">✅ Wiré T1</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>Together</td><td>Llama 70B Turbo</td><td>70B</td><td>Free</td><td class="check">✅ Wiré T1</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>Cohere</td><td>Command-R+</td><td>104B</td><td>Free</td><td class="check">✅ Wiré T1</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>DeepSeek</td><td>DeepSeek Chat</td><td>671B</td><td>Free</td><td class="check">✅ Wiré T1</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>OpenRouter</td><td>Llama 70B Free</td><td>70B</td><td>Free</td><td class="check">✅ Wiré T1</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>Alibaba</td><td>Qwen Turbo</td><td>72B</td><td>Free</td><td class="check">✅ Wiré T2</td></tr>
|
|
<tr><td><span style="color:#cd7f32">B</span></td><td>ZhiPu</td><td>GLM-4 Flash</td><td>130B</td><td>Free</td><td class="check">✅ Wiré T2</td></tr>
|
|
<tr><td>C</td><td>Ollama Local</td><td>brain-v3 (Qwen3 8B)</td><td>8B</td><td>0€</td><td class="check">✅ Wiré T3</td></tr>
|
|
</table>
|
|
<p style="margin-top:12px;font-size:0.82rem;color:var(--dim)">Total: <strong style="color:var(--accent)">14 providers actifs</strong> | <strong>3,500B+ paramètres combinés</strong> | <strong style="color:var(--accent)">0€/mois</strong></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PLAN D'ACTION -->
|
|
<div id="action" class="section">
|
|
<div class="card">
|
|
<h3>Plan d'Action — Réduire Opus à 20%</h3>
|
|
<table>
|
|
<th>Étape</th><th>Action</th><th>Impact tokens</th><th>Status</th>
|
|
<tr><td>1</td><td>Utiliser WEVIA Master pour scan/monitoring/tests</td><td>-60%</td><td class="check">✅ FAIT</td></tr>
|
|
<tr><td>2</td><td>RAG Qdrant pour questions techniques (14,884 vectors)</td><td>-15%</td><td class="check">✅ FAIT</td></tr>
|
|
<tr><td>3</td><td>Consensus Engine pour opinions multi-IA</td><td>-10%</td><td class="check">✅ FAIT</td></tr>
|
|
<tr><td>4</td><td>Pipeline dev autonome (Playwright+Selenium+L99)</td><td>-5%</td><td class="check">✅ FAIT</td></tr>
|
|
<tr><td>5</td><td>Fine-tuner brain-v3 avec 5,649 paires</td><td>-5%</td><td class="check">✅ FAIT</td></tr>
|
|
<tr><td>6</td><td>Prompt caching Claude API</td><td>-3%</td><td class="check">✅ FAIT</td></tr>
|
|
<tr><td>7</td><td>Batch API pour tâches non-urgentes</td><td>-2%</td><td class="check">✅ FAIT</td></tr>
|
|
</table>
|
|
<p style="margin-top:16px;font-size:0.85rem">Résultat attendu: <strong style="color:var(--accent)">$200/mo → $0/mo</strong> (économie $2,400/an)</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="footer">
|
|
WEVIA Master — Benchmark autonome — 253 routes | 14 providers | 14,884 vectors | 0€ — Session marathon — 8 avril 2026
|
|
</div>
|
|
|
|
<script>
|
|
function showTab(id){
|
|
document.querySelectorAll('.tab').forEach(t=>t.classList.remove('active'));
|
|
document.querySelectorAll('.section').forEach(s=>s.classList.remove('active'));
|
|
document.getElementById(id).classList.add('active');
|
|
event.target.classList.add('active');
|
|
if(id==='capabilities')renderCapabilities();
|
|
}
|
|
|
|
function renderCapabilities(){
|
|
const caps=[
|
|
{name:'RAG/Knowledge',w:95,o:100,g:80,ge:70},
|
|
{name:'Infra Management',w:100,o:100,g:20,ge:10},
|
|
{name:'Code Generation',w:90,o:100,g:95,ge:85},
|
|
{name:'Multi-IA Consensus',w:100,o:0,g:0,ge:0},
|
|
{name:'BPMN/Business',w:100,o:50,g:40,ge:30},
|
|
{name:'Security Audit',w:85,o:90,g:30,ge:20},
|
|
{name:'DevOps Pipeline',w:100,o:100,g:50,ge:30},
|
|
{name:'OSS Integration',w:100,o:80,g:40,ge:30},
|
|
{name:'Quality/Gap',w:97,o:90,g:20,ge:10},
|
|
{name:'Memory/Context',w:70,o:100,g:60,ge:50},
|
|
{name:'Architecture',w:100,o:100,g:30,ge:20},
|
|
{name:'CEO Agent',w:95,o:70,g:40,ge:30},
|
|
{name:'Research Agent',w:90,o:80,g:60,ge:50},
|
|
{name:'Autonomy Loop',w:85,o:90,g:40,ge:20},
|
|
{name:'Vision',w:60,o:100,g:90,ge:80},
|
|
{name:'Streaming',w:100,o:100,g:100,ge:100},
|
|
];
|
|
const el=document.getElementById('cap-chart');
|
|
el.innerHTML=caps.map(c=>`
|
|
<div class="capability-row">
|
|
<div class="cap-name">${c.name}</div>
|
|
<div class="cap-bars">
|
|
<div class="cap-bar" style="width:${c.w*2}px;background:var(--wevia)">${c.w}</div>
|
|
<div class="cap-bar" style="width:${c.o*2}px;background:var(--opus)">${c.o}</div>
|
|
<div class="cap-bar" style="width:${c.g*2}px;background:var(--gpt)">${c.g}</div>
|
|
<div class="cap-bar" style="width:${c.ge*2}px;background:var(--gemini)">${c.ge}</div>
|
|
</div>
|
|
</div>`).join('');
|
|
}
|
|
</script>
|
|
<!-- CARTO_REMOVED -->
|
|
|
|
<!-- === OPUS UNIVERSAL DRILL-DOWN v1 19avr — append-only, doctrine #14 === -->
|
|
<script>
|
|
(function(){
|
|
if (window.__opusUniversalDrill) return; window.__opusUniversalDrill = true;
|
|
var d = document;
|
|
var m = d.createElement('div');
|
|
m.id = 'opus-udrill';
|
|
m.style.cssText = 'position:fixed;inset:0;background:rgba(0,0,0,0.82);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;z-index:99995;padding:20px;cursor:pointer';
|
|
var inner = d.createElement('div');
|
|
inner.id = 'opus-udrill-in';
|
|
inner.style.cssText = 'max-width:900px;width:100%;max-height:90vh;overflow:auto;background:#0b0d15;border:1px solid rgba(99,102,241,0.35);border-radius:14px;padding:28px;cursor:default;box-shadow:0 20px 60px rgba(0,0,0,0.6);color:#e2e8f0;font:14px/1.55 Inter,system-ui,sans-serif';
|
|
inner.addEventListener('click', function(e){ e.stopPropagation(); });
|
|
m.appendChild(inner);
|
|
m.addEventListener('click', function(){ m.style.display='none'; });
|
|
d.addEventListener('keydown', function(e){ if(e.key==='Escape') m.style.display='none'; });
|
|
(d.body || d.documentElement).appendChild(m);
|
|
|
|
function openCard(card) {
|
|
// Clone card content + show close btn + increase font-size
|
|
var html = '<div style="display:flex;justify-content:flex-end;margin-bottom:14px"><button id="opus-udrill-close" style="padding:6px 14px;background:#171b2a;border:1px solid rgba(99,102,241,0.25);color:#e2e8f0;border-radius:8px;cursor:pointer;font-size:12px">✕ Fermer (Esc)</button></div>';
|
|
html += '<div style="transform-origin:top left;font-size:1.05em">' + card.outerHTML + '</div>';
|
|
inner.innerHTML = html;
|
|
d.getElementById('opus-udrill-close').onclick = function(){ m.style.display='none'; };
|
|
m.style.display = 'flex';
|
|
}
|
|
|
|
function wire(root) {
|
|
var sels = '.card,[class*="card"],.kpi,[class*="kpi"],.stat,[class*="stat"],.tile,[class*="tile"],.metric,[class*="metric"],.widget,[class*="widget"]';
|
|
var cards = root.querySelectorAll(sels);
|
|
for (var i = 0; i < cards.length; i++) {
|
|
var c = cards[i];
|
|
if (c.__opusWired) continue;
|
|
if (c.closest('button, a, input, select, textarea, #opus-udrill')) continue;
|
|
var r = c.getBoundingClientRect();
|
|
if (r.width < 60 || r.height < 40) continue;
|
|
c.__opusWired = true;
|
|
c.style.cursor = 'pointer';
|
|
c.setAttribute('role','button');
|
|
c.setAttribute('tabindex','0');
|
|
c.addEventListener('click', function(ev){
|
|
// If a more-specific drill is already active (e.g. pp-card custom), let it handle
|
|
if (ev.target.closest('[data-pp-id]') && window.__opusDrillInit) return;
|
|
if (ev.target.closest('a,button,input,select')) return;
|
|
ev.preventDefault(); ev.stopPropagation();
|
|
openCard(this);
|
|
});
|
|
c.addEventListener('keydown', function(ev){ if(ev.key==='Enter'||ev.key===' '){ev.preventDefault();openCard(this);} });
|
|
}
|
|
}
|
|
|
|
// Initial + mutation observer
|
|
var initRun = function(){ wire(d.body || d.documentElement); };
|
|
if (d.readyState === 'loading') d.addEventListener('DOMContentLoaded', initRun);
|
|
else initRun();
|
|
var mo = new MutationObserver(function(muts){
|
|
var newCard = false;
|
|
for (var i=0;i<muts.length;i++) if (muts[i].addedNodes.length) { newCard = true; break; }
|
|
if (newCard) initRun();
|
|
});
|
|
mo.observe(d.body || d.documentElement, {childList:true, subtree:true});
|
|
})();
|
|
</script>
|
|
<!-- === OPUS UNIVERSAL DRILL-DOWN END === -->
|
|
|
|
<script src="/api/archi-meta-badge.js" defer></script>
|
|
|
|
<script src="/api/a11y-auto-enhancer.js" defer></script>
|
|
<!-- WTP_UDOCK_V1 (Opus 21-avr t34final) --><script src="/wtp-unified-dock.js" defer></script>
|
|
<script src="/opus-antioverlap-doctrine.js?v=1776776094" defer></script>
|
|
</body>
|
|
</html>
|