build

dist/main.bundle.js

@@ -5544,14 +5544,100 @@ function _loadFragments() {
   return _loadFragments.apply(this, arguments);
 }
 
+;// ./src/syncHFSpacesURLHash.js
+var queryArg = "section";
+function syncHFSpacesURLHash() {
+  // Check for section parameter in URL
+  var urlParams = new URLSearchParams(window.location.search);
+  var sectionId = urlParams.get(queryArg);
+  if (sectionId) {
+    // Find the element with the specified ID
+    var targetElement = document.getElementById(sectionId);
+
+    // scroll if the element exists
+    if (targetElement) {
+      targetElement.scrollIntoView();
+      history.replaceState(null, null, "#".concat(sectionId));
+    }
+  }
+  updateHashBasedOnHashChange();
+
+  // Variables to manage throttling
+  var isScrolling = false;
+  var lastKnownScrollPosition = 0;
+
+  // Add the scroll event listener here
+  window.addEventListener('scroll', function () {
+    lastKnownScrollPosition = window.scrollY;
+    if (!isScrolling) {
+      window.requestAnimationFrame(function () {
+        updateHashBasedOnScroll(lastKnownScrollPosition);
+        isScrolling = false;
+      });
+    }
+    isScrolling = true;
+  });
+
+  // Initial hash update on page load
+  updateHashBasedOnScroll(window.scrollY);
+}
+
+// Function to update the URL hash based on scroll position
+function updateHashBasedOnScroll(scrollPosition) {
+  // Get only heading elements with IDs that we want to track
+  var elementsWithIds = Array.from(document.querySelectorAll('h1[id], h2[id], h3[id], h4[id], h5[id], h6[id]'));
+
+  // Skip updating if there are no elements with IDs
+  if (elementsWithIds.length === 0) return;
+
+  // Find the element closest to the top of the viewport
+  var closestElement = null;
+  var closestDistance = Infinity;
+  var viewportMiddle = scrollPosition + window.innerHeight / 2;
+
+  // Iterate through all elements with IDs to find the closest one
+  elementsWithIds.forEach(function (element) {
+    var elementTop = element.getBoundingClientRect().top + scrollPosition;
+    var distance = Math.abs(elementTop - viewportMiddle);
+    if (distance < closestDistance) {
+      closestDistance = distance;
+      closestElement = element;
+    }
+  });
+
+  // Update the URL hash if we found a closest element
+  if (closestElement && closestElement.id) {
+    // Only update if the hash is different to avoid unnecessary history entries
+    if (window.location.hash !== "#".concat(closestElement.id)) {
+      // Update the URL without adding a new history entry
+      history.replaceState(null, null, "#".concat(closestElement.id));
+      postMessageToHFSpaces(closestElement.id);
+    }
+  }
+}
+function updateHashBasedOnHashChange() {
+  window.addEventListener('hashchange', function () {
+    var elementId = window.location.hash.slice(1);
+    postMessageToHFSpaces(elementId);
+  });
+}
+function postMessageToHFSpaces(elementId) {
+  var parentOrigin = "https://huggingface.co";
+  window.parent.postMessage({
+    queryString: "".concat(queryArg, "=").concat(elementId)
+  }, parentOrigin);
+}
+
 ;// ./src/index.js
 // import { plotClusters } from './clusters'
 
 
+
 document.addEventListener("DOMContentLoaded", function () {
   console.log("DOMContentLoaded");
   loadFragments();
   init_memory_plot();
+  syncHFSpacesURLHash();
 }, {
   once: true
 });