Files
html/wtp.html
2026-04-19 22:10:02 +02:00

210 lines
8.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WEVAL Technology Platform — Pleine largeur</title>
<style>
* { margin:0; padding:0; box-sizing:border-box }
html, body { width:100%; height:100vh; overflow:hidden; background:#0a0e1a; color:#e2e8f0; font-family:-apple-system,system-ui,sans-serif }
.wtp-container { width:100%; height:100vh; position:relative }
.wtp-iframe { width:100%; height:100%; border:0; display:block }
/* Floating action button for WEVIA chat */
.wevia-fab {
position:fixed; bottom:24px; right:24px;
width:64px; height:64px; border-radius:50%;
background:linear-gradient(135deg,#6366f1,#818cf8);
color:#fff; font-size:28px;
display:flex; align-items:center; justify-content:center;
cursor:pointer; box-shadow:0 8px 24px rgba(99,102,241,.4);
z-index:9999; transition:transform .2s, box-shadow .2s;
border:none;
}
.wevia-fab:hover { transform:scale(1.08); box-shadow:0 12px 32px rgba(99,102,241,.6) }
.wevia-fab .pulse {
position:absolute; inset:-4px; border-radius:50%; border:2px solid #818cf8;
animation:pulse 2s infinite; pointer-events:none;
}
@keyframes pulse { 0% { transform:scale(1); opacity:1 } 100% { transform:scale(1.3); opacity:0 } }
/* Chat panel slide from right */
.wevia-panel {
position:fixed; top:0; right:-100%; width:min(420px, 100vw);
height:100vh; background:#0f172a; border-left:1px solid rgba(99,102,241,.2);
transition:right .3s ease; z-index:9998; display:flex; flex-direction:column;
box-shadow:-12px 0 40px rgba(0,0,0,.5);
}
.wevia-panel.open { right:0 }
.wevia-head {
padding:14px 18px; background:#1e293b; border-bottom:1px solid rgba(99,102,241,.15);
display:flex; align-items:center; justify-content:space-between;
}
.wevia-head-title { display:flex; align-items:center; gap:10px; font-weight:600; font-size:14px }
.wevia-head-title .dot { width:8px; height:8px; border-radius:50%; background:#4ade80; box-shadow:0 0 8px #4ade80; animation:pulse-dot 2s infinite }
@keyframes pulse-dot { 50% { opacity:.5 } }
.wevia-close {
background:rgba(248,113,113,.1); border:1px solid rgba(248,113,113,.3);
color:#f87171; width:32px; height:32px; border-radius:8px; cursor:pointer; font-size:18px;
display:flex; align-items:center; justify-content:center;
}
.wevia-close:hover { background:rgba(248,113,113,.2) }
.wevia-iframe { flex:1; width:100%; border:0; background:#0a0e1a }
/* Overlay backdrop */
.wevia-backdrop {
position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:9997;
opacity:0; pointer-events:none; transition:opacity .3s;
}
.wevia-backdrop.show { opacity:1; pointer-events:auto }
/* Banner si pas connecté */
.auth-banner {
position:fixed; top:0; left:0; right:0; padding:12px 20px;
background:linear-gradient(90deg,#6366f1,#818cf8); color:#fff;
text-align:center; z-index:10000; display:none; font-size:14px; font-weight:500;
}
.auth-banner a { color:#fff; text-decoration:underline; margin-left:8px; font-weight:600 }
.auth-banner.show { display:block }
.auth-banner.show + .wtp-container { padding-top:44px }
</style>
</head>
<body>
<div id="auth-banner" class="auth-banner">
🔐 Session non authentifiée · <a href="/wtp-login.html">Se connecter</a>
</div>
<div class="wtp-container">
<iframe class="wtp-iframe" src="/weval-technology-platform.html?embed=1" title="WEVAL Technology Platform"></iframe>
</div>
<!-- Floating WEVIA button -->
<button class="wevia-fab" id="weviaFab" title="Ouvrir chat WEVIA Master">
<span class="pulse"></span>
💬
</button>
<!-- WEVIA chat panel -->
<div class="wevia-backdrop" id="weviaBackdrop"></div>
<div class="wevia-panel" id="weviaPanel">
<div class="wevia-head">
<div class="wevia-head-title"><span class="dot"></span>WEVIA Master · multi-agents</div>
<button class="wevia-close" id="weviaClose">×</button>
</div>
<iframe class="wevia-iframe" id="weviaFrame" src="about:blank" title="WEVIA chat"></iframe>
</div>
<script>
// Check auth
(async function() {
try {
const r = await fetch('/api/weval-auth-session.php?action=status', { credentials:'include' });
const d = await r.json();
if (!d.authenticated) {
document.getElementById('auth-banner').classList.add('show');
}
} catch(e) {}
})();
// Toggle chat panel
const fab = document.getElementById('weviaFab');
const panel = document.getElementById('weviaPanel');
const backdrop = document.getElementById('weviaBackdrop');
const closeBtn = document.getElementById('weviaClose');
const frame = document.getElementById('weviaFrame');
let chatLoaded = false;
function openChat() {
if (!chatLoaded) {
frame.src = '/wevia-widget.html';
chatLoaded = true;
}
panel.classList.add('open');
backdrop.classList.add('show');
}
function closeChat() {
panel.classList.remove('open');
backdrop.classList.remove('show');
}
fab.addEventListener('click', openChat);
closeBtn.addEventListener('click', closeChat);
backdrop.addEventListener('click', closeChat);
// ESC to close
document.addEventListener('keydown', e => {
if (e.key === 'Escape') closeChat();
});
// Keyboard shortcut Ctrl+/ or Ctrl+K to open chat
document.addEventListener('keydown', e => {
if ((e.ctrlKey || e.metaKey) && (e.key === '/' || e.key === 'k')) {
e.preventDefault();
openChat();
}
});
</script>
<!-- === 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) {
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 (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);} });
}
}
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 === -->
</body>
</html>