update

2025-09-09 15:38:44 +00:00 · 2025-01-08 22:06:26 -05:00
parent a6b66f9ca3
commit 71e95c395e
8 changed files with 1222 additions and 766 deletions
--- a/src/about.html
+++ b/src/about.html
@@ -69,6 +69,7 @@
        </div>
      </main>

+      <!-- Footer -->
      <!-- Footer -->
      <footer class="mt-auto pb-8 text-center px-4">
        <a
@@ -79,6 +80,24 @@
        >
          bitvid.btc.us
        </a>
+        |
+        <a
+          href="https://bitvid.eth.limo"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.eth.limo
+        </a>
+        |
+        <a
+          href="https://bitvid.netlify.app"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.netlify.app
+        </a>
        <div class="mt-2 space-x-4">
          <a
            href="https://github.com/PR0M3TH3AN/bitvid"
@@ -132,7 +151,10 @@
        <p
          class="mt-2 text-xs text-gray-600 font-mono break-all max-w-full overflow-hidden"
        >
-          IPNS: k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          IPNS:
+          <a href="ipns.html" class="text-blue-600 underline">
+            k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          </a>
        </p>
      </footer>
    </div>
--- a/src/content/about.md
+++ b/src/content/about.md
@@ -1,11 +1,5 @@
 ![](https://bitvid.netlify.app/assets/jpg/bitvid.jpg)

-BTC DNS: [bitvid.btc.us](https://bitvid.btc.us)
-
-ETH DNS: [bitvid.eth.limo](https://bitvid.eth.limo)
-
-**_IPNS: k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1_**
-
 # About bitvid

 Welcome to bitvid, a new kind of video platform that puts you in control. Unlike traditional video sites that keep your content on their servers, bitvid lets videos flow directly between creators and viewers. Think of it like a digital potluck where everyone brings and shares content directly with each other!
--- a/src/content/ipns.md
+++ b/src/content/ipns.md
@@ -0,0 +1,19 @@
+# IPNS Gateways
+
+Below is a list of available IPNS gateways you can use with the hash `k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1`:
+
+1. **[FLK IPFS Gateway](https://k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1.ipns.flk-ipfs.xyz/)**  
+   A public gateway that resolves the provided IPNS hash.
+
+2. **[Aragon IPFS Gateway](https://ipfs.eth.aragon.network/ipfs/bafybeih2ebj55ki3wvasj5i3rhwgjn6e72f6vxsrlrjfqvzezot2eoeqz4/)**  
+   A gateway hosted by Aragon for IPFS content resolution.
+
+3. **[Dweb.link Gateway](https://dweb.link/ipns/k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1)**  
+   A subdomain resolution gateway provided by Protocol Labs.
+
+4. **[IPFS.io Gateway](https://ipfs.io/ipns/k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1)**  
+   A public gateway operated by Protocol Labs.
+
+---
+
+**Note:** The availability and performance of these gateways may vary.
--- a/src/getting-started.html
+++ b/src/getting-started.html
@@ -69,6 +69,7 @@
        </div>
      </main>

+      <!-- Footer -->
      <!-- Footer -->
      <footer class="mt-auto pb-8 text-center px-4">
        <a
@@ -79,6 +80,24 @@
        >
          bitvid.btc.us
        </a>
+        |
+        <a
+          href="https://bitvid.eth.limo"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.eth.limo
+        </a>
+        |
+        <a
+          href="https://bitvid.netlify.app"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.netlify.app
+        </a>
        <div class="mt-2 space-x-4">
          <a
            href="https://github.com/PR0M3TH3AN/bitvid"
@@ -132,7 +151,10 @@
        <p
          class="mt-2 text-xs text-gray-600 font-mono break-all max-w-full overflow-hidden"
        >
-          IPNS: k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          IPNS:
+          <a href="ipns.html" class="text-blue-600 underline">
+            k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          </a>
        </p>
      </footer>
    </div>
--- a/src/index.html
+++ b/src/index.html
@@ -198,7 +198,9 @@
        <video id="video" controls class="w-full rounded-lg shadow-md"></video>
        <!-- Status and Stats -->
        <div class="mt-4">
-          <div id="status" class="text-gray-700 mb-2">Initializing...</div>
+          <div id="status" class="text-gray-700 mb-2">
+            Initializing... Just give it a sec.
+          </div>
          <div class="w-full bg-gray-300 rounded-full h-2 mb-2">
            <div
              class="bg-blue-500 h-2 rounded-full"
@@ -232,27 +234,6 @@
        <div
          class="bg-gray-900 rounded-lg max-w-4xl w-full relative overflow-hidden"
        >
-          <!-- Close button -->
-          <button
-            id="closePlayer"
-            class="absolute top-4 right-4 z-50 text-white bg-gray-800 hover:bg-gray-700 rounded-full p-2"
-          >
-            <svg
-              xmlns="http://www.w3.org/2000/svg"
-              class="h-6 w-6"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke="currentColor"
-            >
-              <path
-                stroke-linecap="round"
-                stroke-linejoin="round"
-                stroke-width="2"
-                d="M6 18L18 6M6 6l12 12"
-              />
-            </svg>
-          </button>
-
          <!-- Video container -->
          <div class="aspect-w-16 aspect-h-9">
            <video id="modalVideo" controls class="w-full rounded-t-lg"></video>
@@ -268,7 +249,9 @@
              class="flex items-center justify-between text-sm text-gray-400 mb-4"
            >
              <span id="videoTimestamp">just now</span>
-              <div id="modalStatus" class="text-gray-300">Initializing...</div>
+              <div id="modalStatus" class="text-gray-300">
+                Initializing... Just give it a sec.
+              </div>
            </div>

            <!-- Creator info -->
@@ -320,6 +303,108 @@
          seed. zap. subscribe.
        </h2>
      </div>
+
+      <!-- Disclaimer Modal -->
+      <div
+        id="disclaimerModal"
+        class="fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50 p-4"
+      >
+        <div
+          class="bg-gray-900 rounded-lg max-w-2xl w-full relative overflow-hidden"
+        >
+          <!-- Content -->
+          <div class="p-6 text-white">
+            <!-- Logo -->
+            <div class="flex justify-center mb-8">
+              <img
+                src="assets/svg/bitvid-logo-dark-mode.svg"
+                alt="BitVid Logo"
+                class="h-16"
+              />
+            </div>
+
+            <h2 class="text-2xl font-bold mb-4 text-center">
+              Welcome to bitvid
+            </h2>
+
+            <!-- Warning Alert -->
+            <div
+              class="bg-yellow-900/20 border border-yellow-700/50 rounded-lg p-4 mb-6 flex items-start"
+            >
+              <svg
+                class="h-5 w-5 text-yellow-500 mt-0.5 mr-3 flex-shrink-0"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+              >
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
+                />
+              </svg>
+              <p class="text-yellow-200">
+                This platform is still in development. You may encounter bugs or
+                missing features.
+              </p>
+            </div>
+
+            <!-- Main Content -->
+            <div class="space-y-6 text-gray-300">
+              <p>
+                bitvid is a decentralized video platform where content is shared
+                directly between users. We want you to understand a few
+                important points before you continue:
+              </p>
+
+              <div class="space-y-4">
+                <div class="bg-gray-800 rounded-lg p-4">
+                  <h3 class="text-white font-semibold mb-2">
+                    Content Responsibility
+                  </h3>
+                  <p class="text-gray-400">
+                    We don't host or control any videos shared on bitvid. All
+                    content is the responsibility of the creators who share it.
+                    Please follow your local laws and use the platform
+                    responsibly.
+                  </p>
+                </div>
+
+                <div class="bg-gray-800 rounded-lg p-4">
+                  <h3 class="text-white font-semibold mb-2">Platform Status</h3>
+                  <p class="text-gray-400">
+                    bitvid is a work in progress. Features may change or break,
+                    and security improvements are ongoing. Your feedback and
+                    patience help us build a better platform.
+                  </p>
+                </div>
+
+                <div class="bg-gray-800 rounded-lg p-4">
+                  <h3 class="text-white font-semibold mb-2">Get Involved</h3>
+                  <p class="text-gray-400">
+                    Are you a developer? We'd love your help! Visit our GitHub
+                    repository to contribute to building the future of
+                    decentralized video sharing.
+                  </p>
+                </div>
+              </div>
+            </div>
+
+            <!-- Action Button -->
+            <div class="mt-6">
+              <button
+                id="acceptDisclaimer"
+                class="w-full bg-blue-500 text-white px-4 py-2 rounded-md hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-gray-900 transition-colors duration-200"
+              >
+                I Understand
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- Footer -->
      <footer class="mt-auto pb-8 text-center px-4">
        <a
          href="https://bitvid.btc.us"
@@ -329,6 +414,24 @@
        >
          bitvid.btc.us
        </a>
+        |
+        <a
+          href="https://bitvid.eth.limo"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.eth.limo
+        </a>
+        |
+        <a
+          href="https://bitvid.netlify.app"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.netlify.app
+        </a>
        <div class="mt-2 space-x-4">
          <a
            href="https://github.com/PR0M3TH3AN/bitvid"
@@ -382,7 +485,10 @@
        <p
          class="mt-2 text-xs text-gray-600 font-mono break-all max-w-full overflow-hidden"
        >
-          IPNS: k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          IPNS:
+          <a href="ipns.html" class="text-blue-600 underline">
+            k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          </a>
        </p>
      </footer>

--- a/src/ipns.html
+++ b/src/ipns.html
@@ -0,0 +1,192 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>bitvid | About</title>
+
+    <!-- Open Graph Meta Tags -->
+    <meta property="og:title" content="BitVid - Markdown Viewer" />
+    <meta
+      property="og:description"
+      content="View and render markdown content dynamically."
+    />
+    <meta
+      property="og:image"
+      content="https://bitvid.netlify.app/assets/jpg/bitvid.jpg"
+    />
+    <meta property="og:url" content="https://bitvid.btc.us" />
+    <meta property="og:type" content="website" />
+    <meta property="og:locale" content="en_US" />
+
+    <!-- App Icons -->
+    <link rel="icon" href="/favicon.ico" sizes="any" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
+    <link rel="manifest" href="/site.webmanifest" />
+    <meta name="theme-color" content="#0f172a" />
+
+    <!-- Tailwind CSS -->
+    <link
+      href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css"
+      rel="stylesheet"
+    />
+
+    <!-- Main Layout Styles -->
+    <link href="css/style.css" rel="stylesheet" />
+
+    <!-- Markdown-Specific Styles -->
+    <link href="css/markdown.css" rel="stylesheet" />
+  </head>
+  <body class="bg-gray-100">
+    <div
+      id="app"
+      class="container mx-auto px-4 py-8 min-h-screen flex flex-col"
+    >
+      <!-- Header -->
+      <header class="mb-8">
+        <div class="flex items-start">
+          <!-- Logo links back to index.html (or "/") -->
+          <a href="index.html">
+            <img
+              src="assets/svg/bitvid-logo-light-mode.svg"
+              alt="BitVid Logo"
+              class="h-16"
+            />
+          </a>
+        </div>
+      </header>
+
+      <!-- Markdown Content Section -->
+      <main>
+        <!-- 
+          We give this section a white background and a shadow 
+          just like you originally had for other cards.
+        -->
+        <div id="markdown-container" class="bg-white p-6 rounded-lg shadow-md">
+          <h2 class="text-2xl font-bold mb-4">Loading Content...</h2>
+        </div>
+      </main>
+
+      <!-- Footer -->
+      <footer class="mt-auto pb-8 text-center px-4">
+        <a
+          href="https://bitvid.btc.us"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.btc.us
+        </a>
+        |
+        <a
+          href="https://bitvid.eth.limo"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.eth.limo
+        </a>
+        |
+        <a
+          href="https://bitvid.netlify.app"
+          class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+          target="_blank"
+          rel="noopener noreferrer"
+        >
+          bitvid.netlify.app
+        </a>
+        <div class="mt-2 space-x-4">
+          <a
+            href="https://github.com/PR0M3TH3AN/bitvid"
+            class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            GitHub
+          </a>
+          <a
+            href="https://primal.net/p/npub13yarr7j6vjqjjkahd63dmr27curypehx45ucue286ac7sft27y0srnpmpe"
+            class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Nostr
+          </a>
+          <a
+            href="https://habla.news/p/nprofile1qyv8wumn8ghj7un9d3shjtnndehhyapwwdhkx6tpdsq3gamnwvaz7tmjv4kxz7fwv3sk6atn9e5k7qgdwaehxw309ahx7uewd3hkcqgswaehxw309ahx7um5wgh8w6twv5q3yamnwvaz7tm0venxx6rpd9hzuur4vgqzpzf6x8a95eyp99dmwm4zmkx4a3cxgrnwdtfe3ej504m3aqjk4ugldyww3a"
+            class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            Blog
+          </a>
+          <a
+            href="getting-started.html"
+            class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+            target="_self"
+            rel="noopener noreferrer"
+          >
+            Getting Started
+          </a>
+          <a
+            href="about.html"
+            class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+            target="_self"
+            rel="noopener noreferrer"
+          >
+            About
+          </a>
+          <a
+            href="roadmap.html"
+            class="text-gray-500 hover:text-gray-400 transition-colors duration-200"
+            target="_self"
+            rel="noopener noreferrer"
+          >
+            Roadmap
+          </a>
+        </div>
+        <p
+          class="mt-2 text-xs text-gray-600 font-mono break-all max-w-full overflow-hidden"
+        >
+          IPNS:
+          <a href="ipns.html" class="text-blue-600 underline">
+            k51qzi5uqu5dgwr4oejq9rk41aoe9zcupenby6iqecsk5byc7rx48uecd133a1
+          </a>
+        </p>
+      </footer>
+    </div>
+
+    <!-- Marked.js (for converting markdown to HTML) -->
+    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
+    <!-- Highlight.js (optional for code block highlighting) -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
+
+    <script>
+      async function loadMarkdown() {
+        const response = await fetch("content/ipns.md");
+        if (response.ok) {
+          const markdown = await response.text();
+          const container = document.getElementById("markdown-container");
+
+          // Convert markdown to HTML
+          const html = marked.parse(markdown);
+
+          // Insert the HTML into the container
+          container.innerHTML = html;
+
+          // (Optional) Highlight code blocks
+          document.querySelectorAll("pre code").forEach((block) => {
+            hljs.highlightBlock(block);
+          });
+        } else {
+          document.getElementById("markdown-container").innerHTML =
+            '<p class="text-red-500">Error loading content. Please try again later.</p>';
+        }
+      }
+
+      loadMarkdown();
+    </script>
+  </body>
+</html>
--- a/src/js/app.js
+++ b/src/js/app.js
--- a/src/js/disclaimer.js
+++ b/src/js/disclaimer.js
@@ -0,0 +1,29 @@
+class DisclaimerModal {
+  constructor() {
+    this.modal = document.getElementById("disclaimerModal");
+    this.acceptButton = document.getElementById("acceptDisclaimer");
+    this.hasSeenDisclaimer = localStorage.getItem("hasSeenDisclaimer");
+
+    this.setupEventListeners();
+  }
+
+  setupEventListeners() {
+    const closeModal = () => {
+      this.modal.style.display = "none";
+      document.body.style.overflow = "unset";
+      localStorage.setItem("hasSeenDisclaimer", "true");
+    };
+
+    // Only keep the accept button event listener
+    this.acceptButton.addEventListener("click", closeModal);
+  }
+
+  show() {
+    if (!this.hasSeenDisclaimer) {
+      this.modal.style.display = "flex";
+      document.body.style.overflow = "hidden";
+    }
+  }
+}
+
+export const disclaimerModal = new DisclaimerModal();