feat(tapops): add css modules, js scripts, and viewer page

2026-06-04 14:40:40 +07:00
parent 0ebc25809b
commit c9d96eabe4
16 changed files with 4379 additions and 302 deletions
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html lang="id">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Pratinjau Dokumen — TAPOPS | Informatika UNTAN</title>
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link rel="preconnect" href="https://api.ifuntanhub.dev" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
+          integrity="sha384-iw3OoTErCYJJB9mCa8LNS2hbsQ7M3C0EpIsO/H5+EGAkPGc6rk+V8i04oW/K5xq0"
+          crossorigin="anonymous">
+
+    <link rel="stylesheet" href="css/variables.css">
+    <link rel="stylesheet" href="css/viewer.css">
+
+    <!--
+      Early asset prefetch: start downloading the file immediately while the
+      rest of the page (CSS, fonts, scripts) loads in parallel. This shaves
+      off the entire page-load time from the perceived wait.
+    -->
+    <script>
+    (function() {
+        var params = new URLSearchParams(window.location.search);
+        var id = params.get('id');
+        if (id) {
+            var link = document.createElement('link');
+            link.rel = 'prefetch';
+            link.as = 'fetch';
+            link.crossOrigin = 'anonymous';
+            link.href = 'https://api.ifuntanhub.dev/assets/' + id;
+            document.head.appendChild(link);
+        }
+    })();
+    </script>
+</head>
+
+<body class="viewer-body">
+    <header class="viewer-header">
+        <div class="viewer-header-left">
+            <a href="index.html#repository" class="btn-back">
+                <i class="fas fa-arrow-left"></i> Kembali ke Repositori
+            </a>
+            <div class="viewer-title-group">
+                <h1 id="viewer-title" class="viewer-title">Memuat dokumen…</h1>
+                <span id="viewer-type" class="viewer-type-badge"></span>
+            </div>
+        </div>
+        <div class="viewer-header-right">
+            <a id="viewer-download" class="btn-download" href="#" download>
+                <i class="fas fa-download"></i> Unduh Berkas
+            </a>
+        </div>
+    </header>
+
+    <main id="viewer-content" class="viewer-content">
+        <div class="viewer-loading">
+            <i class="fas fa-circle-notch fa-spin"></i>
+            <span>Memuat pratinjau berkas…</span>
+        </div>
+    </main>
+
+    <!--
+      DOCX libraries are now lazy-loaded by viewer.js ONLY when type=docx.
+      PDFs no longer wait for ~350KB of unused scripts to download.
+    -->
+    <script src="js/viewer.js"></script>
+</body>
+
+</html>