update docs

2026-05-06 11:51:43 -03:00
parent c8bb6c7581
commit 946234eb9e
16 changed files with 1723 additions and 502 deletions
--- a/docs/viewer.html
+++ b/docs/viewer.html
@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8">
+<title>Graph Viewer</title>
+<style>
+  * { margin: 0; padding: 0; }
+  body {
+    background: #1e1e2e;
+    overflow: hidden;
+    width: 100vw;
+    height: 100vh;
+  }
+  #container {
+    width: 100vw;
+    height: 100vh;
+    overflow: hidden;
+    cursor: grab;
+  }
+  #container.dragging { cursor: grabbing; }
+  img {
+    transform-origin: 0 0;
+    user-select: none;
+    -webkit-user-drag: none;
+  }
+</style>
+</head>
+<body>
+<div id="container">
+  <img id="img" />
+</div>
+<script>
+var src = new URLSearchParams(location.search).get('src');
+var img = document.getElementById('img');
+var container = document.getElementById('container');
+
+img.src = src;
+
+var scale = 1;
+var x = 0, y = 0;
+var dragging = false;
+var startX, startY, startPanX, startPanY;
+
+function apply() {
+  img.style.transform = 'translate(' + x + 'px,' + y + 'px) scale(' + scale + ')';
+}
+
+img.onload = function() {
+  var sw = window.innerWidth / img.naturalWidth;
+  var sh = window.innerHeight / img.naturalHeight;
+  scale = Math.min(sw, sh) * 0.95;
+  x = (window.innerWidth - img.naturalWidth * scale) / 2;
+  y = (window.innerHeight - img.naturalHeight * scale) / 2;
+  apply();
+};
+
+container.addEventListener('wheel', function(e) {
+  e.preventDefault();
+  var factor = e.deltaY < 0 ? 1.12 : 0.89;
+  var rect = container.getBoundingClientRect();
+  var mx = e.clientX - rect.left;
+  var my = e.clientY - rect.top;
+  x = mx - (mx - x) * factor;
+  y = my - (my - y) * factor;
+  scale *= factor;
+  apply();
+}, { passive: false });
+
+container.addEventListener('mousedown', function(e) {
+  if (e.button !== 0) return;
+  dragging = true;
+  startX = e.clientX;
+  startY = e.clientY;
+  startPanX = x;
+  startPanY = y;
+  container.classList.add('dragging');
+  e.preventDefault();
+});
+
+window.addEventListener('mousemove', function(e) {
+  if (!dragging) return;
+  x = startPanX + (e.clientX - startX);
+  y = startPanY + (e.clientY - startY);
+  apply();
+});
+
+window.addEventListener('mouseup', function() {
+  dragging = false;
+  container.classList.remove('dragging');
+});
+
+container.addEventListener('dblclick', function() {
+  img.onload();
+});
+</script>
+</body>
+</html>