Add pending apps and frontend components
- apps/captain-mobile: Mobile API service - apps/flow-ui: Flow UI application - apps/mindlink: Mindlink application - apps/storage: Storage API and workers - apps/tzzr-cli: TZZR CLI tool - deck-frontend/backups: Historical TypeScript versions - hst-frontend: Standalone HST frontend Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
ARCHITECT
139
hst-frontend/index.html
Normal file
139
hst-frontend/index.html
Normal file
@@ -0,0 +1,139 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<title>DECK</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<!-- External -->
|
||||
<script src="https://d3js.org/d3.v7.min.js"></script>
|
||||
|
||||
<!-- CSS -->
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
<link rel="stylesheet" href="css/grid.css">
|
||||
<link rel="stylesheet" href="css/tree.css">
|
||||
<link rel="stylesheet" href="css/graph.css">
|
||||
<link rel="stylesheet" href="css/detail.css">
|
||||
<link rel="stylesheet" href="css/components.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- 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>
|
||||
<button class="btn btn-sm" id="btn-sel">SEL</button>
|
||||
<button class="btn btn-sm" id="btn-get">GET<span class="sel-count" id="sel-count"></span></button>
|
||||
</div>
|
||||
<div class="topbar-center">
|
||||
<input type="text" class="search-box" id="search" placeholder="Buscar tags...">
|
||||
</div>
|
||||
<div class="topbar-right">
|
||||
<div class="base-selector">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- GROUPS BAR -->
|
||||
<div class="groups-bar" id="groups-bar">
|
||||
<button class="group-btn active" data-group="all">Todos</button>
|
||||
</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 class="view-tabs">
|
||||
<button class="view-tab active" data-view="grid">Biblioteca</button>
|
||||
<button class="view-tab" data-view="tree">Arbol</button>
|
||||
<button class="view-tab" data-view="graph">Grafo</button>
|
||||
</div>
|
||||
<div class="view-container">
|
||||
<div class="grid-view" id="grid-view"></div>
|
||||
<div class="tree-view" id="tree-view"></div>
|
||||
<div class="graph-view" id="graph-view">
|
||||
<div class="graph-sidebar" id="graph-sidebar"></div>
|
||||
<svg id="graph-svg"></svg>
|
||||
<div class="graph-controls">
|
||||
<button class="btn btn-sm" id="graph-fit">Ajustar</button>
|
||||
<button class="btn btn-sm" id="graph-zin">+</button>
|
||||
<button class="btn btn-sm" id="graph-zout">-</button>
|
||||
</div>
|
||||
<div class="graph-legend" id="graph-legend"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- RIGHT PANEL - Detail -->
|
||||
<div class="right-panel" id="right-panel">
|
||||
<div class="detail-header" id="detail-header">
|
||||
<div class="detail-placeholder" id="detail-placeholder"></div>
|
||||
<button class="detail-close" id="detail-close">x</button>
|
||||
</div>
|
||||
<div class="detail-body">
|
||||
<div class="detail-ref" id="detail-ref"></div>
|
||||
<div class="detail-mrf" id="detail-mrf" title="Click para copiar"></div>
|
||||
<div class="detail-name" id="detail-name"></div>
|
||||
<div class="detail-desc" id="detail-desc"></div>
|
||||
<div class="detail-section" id="children-section" style="display:none">
|
||||
<div class="detail-section-title">Hijos</div>
|
||||
<div class="tag-list" id="children-list"></div>
|
||||
</div>
|
||||
<div class="detail-section" id="related-section" style="display:none">
|
||||
<div class="detail-section-title">Relacionados</div>
|
||||
<div class="tag-list" id="related-list"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TOAST -->
|
||||
<div class="toast" id="toast"></div>
|
||||
|
||||
<!-- API MODAL -->
|
||||
<div class="modal-overlay" id="api-modal">
|
||||
<div class="modal">
|
||||
<div class="modal-header">
|
||||
<span class="modal-title">API Endpoints</span>
|
||||
<button class="modal-close" id="api-modal-close">x</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">GET /api/api_groups</div><div class="api-desc">Lista grupos disponibles</div></div>
|
||||
<div class="api-item"><div class="api-endpoint">GET /api/api_library_list</div><div class="api-desc">Lista bibliotecas</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 class="api-item"><div class="api-endpoint">POST /api/rpc/api_children</div><div class="api-desc">{"parent_mrf": "xxx"}</div></div>
|
||||
<div class="api-item"><div class="api-endpoint">POST /api/rpc/api_related</div><div class="api-desc">{"tag_mrf": "xxx"}</div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- JavaScript Modules (order matters) -->
|
||||
<script src="js/config.js"></script>
|
||||
<script src="js/state.js"></script>
|
||||
<script src="js/api.js"></script>
|
||||
<script src="js/helpers.js"></script>
|
||||
<script src="js/views/grid.js"></script>
|
||||
<script src="js/views/tree.js"></script>
|
||||
<script src="js/views/graph.js"></script>
|
||||
<script src="js/views/detail.js"></script>
|
||||
<script src="js/ui.js"></script>
|
||||
<script src="js/app.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user