sidebar: mejorar detección IP local con STUN y modal de ayuda si no detecta

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-07-09 10:45:33 -05:00
co-authored by Claude Sonnet 4.6
parent 8b3188b21b
commit abe4ed4df1
+25 -6
View File
@@ -244,18 +244,37 @@ if (class_exists('ModuleRegistry', false)) {
<?= htmlspecialchars($_user_name, ENT_QUOTES, 'UTF-8') ?>
</div>
<div class="sidebar-user-role"><?= htmlspecialchars($_role_label, ENT_QUOTES, 'UTF-8') ?></div>
<div id="sb-local-ip" style="font-size:.68rem;color:#94a3b8;margin-top:3px;letter-spacing:.02em">
<div id="sb-local-ip" style="font-size:.68rem;color:#94a3b8;margin-top:3px;letter-spacing:.02em;cursor:pointer" title="Clic para ver cómo encontrar tu IP local" onclick="sbMostrarAyudaIP()">
<i class="fas fa-network-wired me-1"></i><span id="sb-ip-val">detectando…</span>
</div>
</div>
</nav>
<!-- Modal ayuda IP -->
<div id="sb-modal-ip" style="display:none;position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.5);align-items:center;justify-content:center">
<div style="background:#fff;border-radius:12px;padding:24px;max-width:340px;width:90%;box-shadow:0 8px 32px rgba(0,0,0,.2)">
<h6 style="margin:0 0 12px;font-size:.95rem"><i class="fas fa-network-wired me-2 text-primary"></i>Tu IP en la red local</h6>
<p style="font-size:.82rem;color:#555;margin:0 0 10px">El navegador no puede leerla directamente. Para encontrarla:</p>
<div style="font-size:.8rem;background:#f1f5f9;border-radius:8px;padding:10px 12px;line-height:1.8">
<strong>Windows:</strong> <code>Win + R</code> → <code>cmd</code> → <code>ipconfig</code><br>
<strong>Mac:</strong> Preferencias → Red → IP<br>
<strong>Android:</strong> Ajustes → WiFi → detalles de la red
</div>
<button onclick="document.getElementById('sb-modal-ip').style.display='none'" style="margin-top:14px;width:100%;padding:7px;border:none;border-radius:7px;background:#1565c0;color:#fff;font-size:.85rem;cursor:pointer">Cerrar</button>
</div>
</div>
<script>
(function() {
function sbMostrarAyudaIP() {
document.getElementById('sb-modal-ip').style.display = 'flex';
}
window.sbMostrarAyudaIP = sbMostrarAyudaIP;
function detectLocalIP() {
var el = document.getElementById('sb-ip-val');
var RTC = window.RTCPeerConnection || window.webkitRTCPeerConnection || window.mozRTCPeerConnection;
if (!RTC) { document.getElementById('sb-ip-val').textContent = '(no disponible)'; return; }
var pc = new RTC({ iceServers: [] }), found = false;
if (!RTC) { el.textContent = '(ver ayuda)'; return; }
var pc = new RTC({ iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] }), found = false;
pc.createDataChannel('');
pc.createOffer().then(function(o) { return pc.setLocalDescription(o); }).catch(function(){});
pc.onicecandidate = function(e) {
@@ -265,14 +284,14 @@ if (class_exists('ModuleRegistry', false)) {
if (found) return;
if (/^(192\.168\.|10\.|172\.(1[6-9]|2\d|3[01])\.)/.test(ip)) {
found = true;
document.getElementById('sb-ip-val').textContent = ip;
el.textContent = ip;
pc.close();
}
});
};
setTimeout(function() {
if (!found) document.getElementById('sb-ip-val').textContent = '(no detectada)';
}, 3000);
if (!found) el.textContent = '(ver ayuda)';
}, 4000);
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', detectLocalIP);