first commit

index.html

@@ -208,7 +208,7 @@ <h2 class="title is-4"><a href="https://2025.ieee-icra.org">ICRA 2025 (Under Rev
 </section>
 
 <!-- Teaser. -->
-<!-- <section class="hero teaser">
+<section class="hero teaser">
   <div class="container is-max-desktop">
     <div class="columns is-centered has-text-centered">
       <div class="column is-full-width teaser no-margin">
@@ -220,12 +220,12 @@ <h2 class="title is-3">Snapshot</h2>
           localization.
         </p>
         <!-- insert video here -->
-        <!-- <video muted autoplay loop controls id="videoPlayer">
+        <video muted autoplay loop controls id="videoPlayer">
           <source src="static/videos/RAP.mp4" type="video/mp4">
         </video>
         <video muted autoplay loop controls id="videoPlayer2">
           <source src="static/videos/RAP_ref_Post_Refinement.mp4" type="video/mp4">
-        </video> -->
+        </video> 
 
 
         <!--        <br>-->
@@ -319,152 +319,10 @@ <h2 class="title is-3">Snapshot</h2>
         <!--          // Initialize sliders-->
         <!--          initializeSliders(sliders);-->
         <!--        </script>-->
-      <!-- </div>
-    </div>
-  </div>
-</section> --> -->
-
-
-<section class="hero teaser">
-    <div class="container">
-      <div class="columns is-centered has-text-centered">
-        <div class="column is-full-width teaser no-margin">
-
-          <h2 class="title is-3">Snapshot</h2>
-          <p style="font-size: 20px; background-color: #8b00e13b;">
-            <b>TLDR:</b> We make camera localization more generalizable by addressing the <b>data gap</b> via
-            3DGS and <b>learning gap</b> via a two-branch joint learning with adversarial loss, achieving SOTA in visual
-            localization.
-          </p>
-
-          <!-- Video container -->
-          <div id="videoContainer" style="position: relative; max-width: 800px; margin: 20px auto;">
-            <video class="teaser-video" muted autoplay loop controls id="teaser_1">
-              <source src="static/videos/teaser_church.mp4" type="video/mp4">
-            </video>
-            <video class="teaser-video" muted autoplay loop controls id="teaser_2" style="display: none;">
-              <source src="static/videos/teaser_college.mp4" type="video/mp4">
-            </video>
-            <video class="teaser-video" muted autoplay loop controls id="teaser_3" style="display: none;">
-              <source src="static/videos/teaser_hopital.mp4" type="video/mp4">
-            </video>
-            <video class="teaser-video" muted autoplay loop controls id="teaser_4" style="display: none;">
-              <source src="static/videos/teaser_shop.mp4" type="video/mp4">
-            </video>
-
-            <!-- Left button -->
-            <button id="prevButton" class="nav-button left">
-              &#8249;
-            </button>
-            <!-- Right button -->
-            <button id="nextButton" class="nav-button right">
-              &#8250;
-            </button>
-          </div>
-
-        </div>
       </div>
     </div>
-  </section>
-
-  <style>
-    /* Video Container */
-    #videoContainer {
-      position: relative;
-      max-width: 100%;
-      height: 500px; /* Adjust the height as needed */
-      overflow: hidden;
-    }
-
-    /* Video Styling */
-    .teaser-video {
-      width: 100%;
-      height: 100%;
-      object-fit: cover; /* Ensures video covers the container */
-      transition: opacity 0.5s ease-in-out;
-    }
-
-    /* Navigation Buttons */
-    .nav-button {
-      position: absolute;
-      top: 50%;
-      transform: translateY(-50%);
-      background-color: rgba(0, 0, 0, 0.5);
-      color: white;
-      border: none;
-      font-size: 2rem;
-      padding: 10px 20px;
-      cursor: pointer;
-      border-radius: 50%;
-      z-index: 10;
-      transition: background-color 0.3s ease;
-    }
-
-    .nav-button:hover {
-      background-color: rgba(0, 0, 0, 0.8);
-    }
-
-    .nav-button.left {
-      left: 20px;
-    }
-
-    .nav-button.right {
-      right: 20px;
-    }
-
-    /* Responsive Design */
-    @media (max-width: 768px) {
-      #videoContainer {
-        height: 300px;
-      }
-      .nav-button {
-        font-size: 1.5rem;
-        padding: 5px 15px;
-      }
-    }
-  </style>
-
-  <script>
-    // JavaScript for Switching Videos
-    const videos = [
-      document.getElementById("teaser_1"),
-      document.getElementById("teaser_2"),
-      document.getElementById("teaser_3"),
-      document.getElementById("teaser_4")
-    ];
-    let currentVideoIndex = 0;
-
-    function updateVideos(index) {
-      videos.forEach((video, i) => {
-        if (i === index) {
-          video.style.display = "block";
-        } else {
-          video.style.display = "none";
-        }
-      });
-    }
-
-    document.getElementById("prevButton").addEventListener("click", () => {
-      currentVideoIndex = (currentVideoIndex - 1 + videos.length) % videos.length;
-      updateVideos(currentVideoIndex);
-    });
-
-    document.getElementById("nextButton").addEventListener("click", () => {
-      currentVideoIndex = (currentVideoIndex + 1) % videos.length;
-      updateVideos(currentVideoIndex);
-    });
-
-    // Initialize the first video
-    updateVideos(currentVideoIndex);
-  </script>
-
-
-
-
-
-
-
-
+  </div>
+</section> 
 <hr>
 
 <!-- How it works -->