Change sample to demo

main.js

@@ -53,7 +53,7 @@ const pageCategories = [
   {
     title: `MediaPipe and TFLite`,
     description: `MediaPipe and TFLite`,
-    samples: {
+    demos: {
       gemma: {
         name: 'Gemma',
         description: `Gemma with MediaPipe and TFLite by Google, <a href=https://github.com/googlesamples/mediapipe/tree/main/examples/llm_inference/js>original code</a>, <a href=https://developers.googleblog.com/2024/03/running-large-language-models-on-device-with-mediapipe-andtensorflow-lite.html>more info.</a>`,
@@ -64,7 +64,7 @@ const pageCategories = [
   {
     title: 'Transformers.js',
     description: 'Transformers.js',
-    samples: {
+    demos: {
       benchmark: {
         name: 'Benchmark',
         description: `Benchmark by Transformers.js`,
@@ -88,7 +88,7 @@ const pageCategories = [
   {
     title: `TODO`,
     description: `TODO`,
-    samples: {
+    demos: {
       gemma: {
         name: 'Stable Diffusion Turbo',
         description: `Stable Diffusion Turbo`,
@@ -32353,7 +32353,7 @@ function switchToRelativeTab(offsetFromCurrentTab) {
   return tab;
 }
 
-// The current sample so we don't reload an iframe if the user picks the same sample.
+// The current demo so we don't reload an iframe if the user picks the same demo.
 let currentdemoInfo;
 // The current set of codeMirrorEditors
 const codeMirrorEditors = [];
@@ -32369,7 +32369,7 @@ darkMatcher.addEventListener('change', () => {
   }
 });
 /**
- * Change the iframe (and source editors) to the given sample or none
+ * Change the iframe (and source editors) to the given demo or none
  */
 function setSampleIFrame(demoInfo, search = '') {
   menuToggleElem.checked = false;
@@ -32393,34 +32393,34 @@ function setSampleIFrame(demoInfo, search = '') {
     const src = url || `${filename}${search}`;
     demoContainerElem.appendChild(createElem('iframe', { src }));
     demoContainerElem.style.height = '100%';
-    // hide intro and show sample
+    // hide intro and show demo
     introElem.style.display = 'none';
     demoElem.style.display = '';
   }
   else {
-    // hide intro and show sample
+    // hide intro and show demo
     introElem.style.display = '';
     demoElem.style.display = 'none';
   }
 }
 /**
- * Respond to the user clicking sample link.
+ * Respond to the user clicking demo link.
  */
 function setSampleIFrameURL(e, demoInfo) {
   e.preventDefault();
   const { filename } = demoInfo;
   const url = new URL(location.toString());
   url.hash = '';
-  url.searchParams.set('sample', basename(filename));
+  url.searchParams.set('demo', basename(filename));
   setURL(url.toString());
   setSampleIFrame(demoInfo);
 }
-// Samples are looked up by `?sample=key` so this is a map
-// from those keys to each sample.
+// Samples are looked up by `?demo=key` so this is a map
+// from those keys to each demo.
 const samplesByKey = new Map();
-// Generate the list of samples
-for (const { title, description, samples } of pageCategories) {
-  for (const [key, demoInfo] of Object.entries(samples)) {
+// Generate the list of demos
+for (const { title, description, demos } of pageCategories) {
+  for (const [key, demoInfo] of Object.entries(demos)) {
     samplesByKey.set(key, demoInfo);
   }
   demoListElem.appendChild(createElem('ul', { className: 'exampleList' }, [
@@ -32432,7 +32432,7 @@ for (const { title, description, samples } of pageCategories) {
           dataset: { tooltip: description },
         }),
       ]),
-      ...Object.entries(samples).map(([key, demoInfo]) => createElem('li', {}, [
+      ...Object.entries(demos).map(([key, demoInfo]) => createElem('li', {}, [
         createElem('a', {
           href: demoInfo.filename,
           ...(!demoInfo.openInNewTab && {
@@ -32469,8 +32469,8 @@ const registerResizeCallback = (() => {
  */
 function parseURL() {
   const url = new URL(location.toString());
-  const sample = url.searchParams.get('sample') || '';
-  const sampleUrl = new URL(sample, location.href);
+  const demo = url.searchParams.get('demo') || '';
+  const sampleUrl = new URL(demo, location.href);
   const demoInfo = samplesByKey.get(basename(sampleUrl.pathname));
   setSampleIFrame(demoInfo, sampleUrl.search);
   if (demoInfo) {