6d6e4e1bdf
- Change view-tabs from delegateEvent to direct onclick like hst-frontend - Remove hardcoded 'active' class from grid tab in HTML - Update active class immediately on click before state update - Update proxy target to tzrtech.org Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
130 lines
4.4 KiB
HTML
130 lines
4.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<title>DECK</title>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
</head>
|
|
<body>
|
|
<div class="app">
|
|
<!-- TOPBAR -->
|
|
<div class="topbar">
|
|
<div class="topbar-left">
|
|
<span class="logo">DECK</span>
|
|
<select id="lang-select" class="btn btn-sm">
|
|
<option value="es">ES</option>
|
|
<option value="en">EN</option>
|
|
<option value="ch">CH</option>
|
|
</select>
|
|
<button class="btn btn-sm" id="btn-api">API</button>
|
|
</div>
|
|
<div class="topbar-center">
|
|
<!-- Taxonomía -->
|
|
<div class="base-buttons">
|
|
<button class="base-btn active" data-base="hst">HST</button>
|
|
<button class="base-btn" data-base="flg">FLG</button>
|
|
<button class="base-btn" data-base="itm">ITM</button>
|
|
<button class="base-btn" data-base="loc">LOC</button>
|
|
<button class="base-btn" data-base="ply">PLY</button>
|
|
</div>
|
|
<!-- Maestros -->
|
|
<div class="base-buttons">
|
|
<button class="base-btn" data-base="mst">MST</button>
|
|
<button class="base-btn" data-base="bck">BCK</button>
|
|
</div>
|
|
<!-- Registro -->
|
|
<div class="base-buttons">
|
|
<button class="base-btn" data-base="mth">MTH</button>
|
|
<button class="base-btn" data-base="atc">ATC</button>
|
|
</div>
|
|
<!-- Comunicación -->
|
|
<div class="base-buttons">
|
|
<button class="base-btn" data-base="mail">MAIL</button>
|
|
<button class="base-btn" data-base="chat">CHAT</button>
|
|
</div>
|
|
<!-- Servicios -->
|
|
<div class="base-buttons">
|
|
<button class="base-btn" data-base="key">KEY</button>
|
|
<button class="base-btn" data-base="mindlink">MIND</button>
|
|
</div>
|
|
</div>
|
|
<div class="topbar-right">
|
|
<div class="search-box">
|
|
<input type="text" id="search" class="search-input" placeholder="Buscar...">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- VIEW BAR -->
|
|
<div class="view-bar">
|
|
<div class="sel-group">
|
|
<button class="sel-btn" id="btn-sel">SEL</button>
|
|
<button class="sel-btn" id="btn-get">GET</button>
|
|
<span id="sel-count"></span>
|
|
</div>
|
|
<div class="view-tabs">
|
|
<button class="view-tab" data-view="grid">Grid</button>
|
|
<button class="view-tab" data-view="tree">Tree</button>
|
|
<button class="view-tab" data-view="graph">Graph</button>
|
|
</div>
|
|
<div class="view-bar-spacer"></div>
|
|
</div>
|
|
|
|
<!-- GROUPS BAR -->
|
|
<div id="groups-bar" class="groups-bar"></div>
|
|
|
|
<!-- MAIN LAYOUT -->
|
|
<div class="main-layout">
|
|
<!-- LEFT PANEL - Libraries -->
|
|
<div class="left-panel" id="left-panel">
|
|
<div class="lib-icon active" data-lib="all" title="Todos"><span>ALL</span></div>
|
|
</div>
|
|
|
|
<!-- CENTER PANEL -->
|
|
<div class="center-panel">
|
|
<div id="content-area" class="content-area grid-view">
|
|
<div class="loading">Cargando...</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- RIGHT PANEL - Detail -->
|
|
<div id="detail-panel" class="detail-panel"></div>
|
|
</div>
|
|
|
|
<!-- API MODAL -->
|
|
<div id="api-modal" class="modal">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h3>API Reference</h3>
|
|
<button class="modal-close">×</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="api-item">
|
|
<div class="api-endpoint">GET /api/{base}</div>
|
|
<div class="api-desc">Lista tags (base: hst, flg, itm, loc, ply)</div>
|
|
</div>
|
|
<div class="api-item">
|
|
<div class="api-endpoint">POST /api/rpc/api_children</div>
|
|
<div class="api-desc">Obtener hijos de un tag</div>
|
|
</div>
|
|
<div class="api-item">
|
|
<div class="api-endpoint">POST /api/rpc/api_related</div>
|
|
<div class="api-desc">Obtener tags relacionados</div>
|
|
</div>
|
|
<div class="api-item">
|
|
<div class="api-endpoint">GET /api/graph_hst</div>
|
|
<div class="api-desc">Relaciones del grafo</div>
|
|
</div>
|
|
<div class="api-item">
|
|
<div class="api-endpoint">GET /api/tree_hst</div>
|
|
<div class="api-desc">Jerarquias</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="module" src="/src/main.ts"></script>
|
|
</body>
|
|
</html>
|