Upload 9 files

data-hf-images.js

@@ -6708,6 +6708,18 @@ const hfImages = {
         "framework": "Flux"
       }
     ],
+    "LTX": [
+      {
+        "url": "https://huggingface.co/datasets/malcolmrey/samples/resolve/main/ltx/ltx2_feliciaday_00001_.png",
+        "filename": "ltx2_feliciaday_00001_.png",
+        "framework": "LTX"
+      },
+      {
+        "url": "https://huggingface.co/datasets/malcolmrey/samples/resolve/main/ltx/ltx2_feliciaday_00002_.mp4",
+        "filename": "ltx2_feliciaday_00002_.mp4",
+        "framework": "LTX"
+      }
+    ],
     "WAN": [
       {
         "url": "https://huggingface.co/datasets/malcolmrey/samples/resolve/main/wan/wan_feliciaday_00001_.png",

data-hf-images.json

@@ -6708,6 +6708,18 @@
         "framework": "Flux"
       }
     ],
+    "LTX": [
+      {
+        "url": "https://huggingface.co/datasets/malcolmrey/samples/resolve/main/ltx/ltx2_feliciaday_00001_.png",
+        "filename": "ltx2_feliciaday_00001_.png",
+        "framework": "LTX"
+      },
+      {
+        "url": "https://huggingface.co/datasets/malcolmrey/samples/resolve/main/ltx/ltx2_feliciaday_00002_.mp4",
+        "filename": "ltx2_feliciaday_00002_.mp4",
+        "framework": "LTX"
+      }
+    ],
     "WAN": [
       {
         "url": "https://huggingface.co/datasets/malcolmrey/samples/resolve/main/wan/wan_feliciaday_00001_.png",

index.html

@@ -1421,6 +1421,15 @@
           <span>SDXL</span>
         </label>
 
+        <label class="checkbox-label">
+          <input
+            id="selectedLtx"
+            type="checkbox"
+            onclick="javascript:searchModels(getCurrentSearchValue());"
+          />
+          <span>LTX</span>
+        </label>
+
         <label class="checkbox-label">
           <input
             id="selectedZimage"
@@ -1491,6 +1500,7 @@
             <div class="image-viewer">
               <button id="prevImageBtn" class="image-nav-arrow image-nav-prev" onclick="previousImage()" aria-label="Previous image" style="display:none;">‹</button>
               <img id="modalImage" src="" alt="" class="modal-image" />
+              <video id="modalVideo" class="modal-image" style="display:none;" controls muted playsinline preload="metadata"></video>
               <button id="nextImageBtn" class="image-nav-arrow image-nav-next" onclick="nextImage()" aria-label="Next image" style="display:none;">›</button>
             </div>
             <div id="imageInfo" class="image-info" style="display:none;">
@@ -1761,6 +1771,7 @@
         flux: 'Flux',
         wan: 'WAN',
         sdxl: 'SDXL',
+        ltx: 'LTX',
         qwen: 'Qwen',
         zimage: 'ZImage'
       };
@@ -1926,6 +1937,7 @@
         flux: 'flux',
         wan: 'wan',
         sdxl: 'sdxl',
+        ltx: 'ltx',
         qwen: 'qwen',
         zimage: 'zimage'
       };
@@ -1997,6 +2009,7 @@
       const modalTitle = document.getElementById('modalTitle');
       const modalImage = document.getElementById('modalImage');
       const modalStats = document.getElementById('modalStats');
+      const modalVideo = document.getElementById('modalVideo');
 
       // Generate HuggingFace links using actual filenames from data-filenames.js
       const personName = element.key;
@@ -2006,6 +2019,12 @@
       modalTitle.textContent = element.key;
       modalImage.src = element.imageUrl ?? unknownImage;
       modalImage.alt = element.key;
+      if (modalVideo) {
+        modalVideo.pause?.();
+        modalVideo.removeAttribute('src');
+        modalVideo.load?.();
+        modalVideo.style.display = 'none';
+      }
 
       modalStats.innerHTML = `
         <div class="modal-stat-row">
@@ -2044,6 +2063,12 @@
             ${formatModalHFLinks(element.sdxl, 'sdxl', personFilenames.sdxl)}
           </span>
         </div>
+        <div class="modal-stat-row">
+          <span class="modal-stat-label">${yesNo(element.ltx)} LTX</span>
+          <span class="modal-stat-value">
+            ${formatModalHFLinks(element.ltx, 'ltx', personFilenames.ltx)}
+          </span>
+        </div>
         <div class="modal-stat-row">
           <span class="modal-stat-label">${yesNo(element.zimage)} ZImage</span>
           <span class="modal-stat-value">
@@ -2088,6 +2113,7 @@
       flux: [],
       wan: [],
       sdxl: [],
+      ltx: [],
       qwen: [],
     };
 
@@ -2157,6 +2183,22 @@
       }
     });
 
+    if (models.ltxes) {
+      models.ltxes.forEach((ltx) => {
+        const key = prepareKey(ltx.name);
+        if (presence[key] !== undefined) {
+          presence[key].ltxCivitai = true;
+          setImageUrl(key, ltx.imageUrl);
+          presence[key].ltxCivitaiLink = ltx.url;
+        } else if (!isKnownSkippableKey(key)) {
+          if (!notMatched.ltx) {
+            notMatched.ltx = [];
+          }
+          notMatched.ltx.push(key);
+        }
+      });
+    }
+
     models.qwens.forEach((qwen) => {
       const key = prepareKey(qwen.name);
       if (presence[key] !== undefined) {
@@ -2189,6 +2231,7 @@
         flux: presence[property].flux,
         wan: presence[property].wan,
         sdxl: presence[property].sdxl,
+        ltx: presence[property].ltx,
         zimage: presence[property].zimage,
         qwen: presence[property].qwen,
         mega: undefined,
@@ -2199,12 +2242,48 @@
         fluxHFLink: presence[property]?.fluxHFLink,
         wanHFLink: presence[property]?.wanHFLink,
         sdxlHFLink: presence[property]?.sdxlHFLink,
+        ltxHFLink: presence[property]?.ltxHFLink,
         zimageHFLink: presence[property]?.zimageHFLink,
         qwenHFLink: presence[property]?.qwenHFLink,
       };
       presenceModels.push(element);
     }
 
+    function filterByType(element) {
+      const mode = document.getElementById('searchMode').value;
+      const filters = [
+        { selected: document.getElementById('selectedLocon').checked, property: element.locon },
+        { selected: document.getElementById('selectedLora').checked, property: element.lora },
+        { selected: document.getElementById('selectedEmbedding').checked, property: element.embedding },
+        { selected: document.getElementById('selectedFlux').checked, property: element.flux },
+        { selected: document.getElementById('selectedWan').checked, property: element.wan },
+        { selected: document.getElementById('selectedSdxl').checked, property: element.sdxl },
+        { selected: document.getElementById('selectedLtx').checked, property: element.ltx },
+        { selected: document.getElementById('selectedQwen').checked, property: element.qwen },
+        { selected: document.getElementById('selectedZimage').checked, property: element.zimage },
+      ];
+
+      // If no filters are selected, show all
+      const anySelected = filters.some((f) => f.selected);
+      if (!anySelected) {
+        return true;
+      }
+
+      // Check each selected filter
+      for (const filter of filters) {
+        if (filter.selected) {
+          if (mode === 'available' && !filter.property) {
+            return false;
+          }
+          if (mode === 'missing' && filter.property) {
+            return false;
+          }
+        }
+      }
+
+      return true;
+    }
+
     function searchModelsModern(value) {
       const lowerCaseValue = value.toLowerCase();
       const sortBy = getSortBy();
@@ -2323,7 +2402,12 @@
         images.push(...personHFImages.WAN);
       }
 
-      // 3. Add Civitai images by type
+      // 3. Add LTX samples third (from HF samples data)
+      if (personHFImages.LTX) {
+        images.push(...personHFImages.LTX);
+      }
+
+      // 4. Add Civitai images by type
       // Check each framework in personData for Civitai models
       const checkCivitaiImage = (framework, civitaiModels) => {
         if (!civitaiModels) return;
@@ -2345,9 +2429,12 @@
       checkCivitaiImage('Flux', models.fluxes);
       checkCivitaiImage('WAN', models.wans);
       checkCivitaiImage('SDXL', models.sdxls);
+      if (models.ltxes) {
+        checkCivitaiImage('LTX', models.ltxes);
+      }
       checkCivitaiImage('Qwen', models.qwens);
 
-      // 4. Add other HF samples (excluding ZImage and WAN which are already added)
+      // 5. Add other HF samples (excluding ZImage, WAN and LTX which are already added)
       const frameworkOrder = ['LyCORIS', 'Lora', 'Embedding', 'Flux', 'SDXL', 'Qwen'];
       for (const fw of frameworkOrder) {
         if (personHFImages[fw]) {
@@ -2360,6 +2447,7 @@
 
     function updateImageDisplay() {
       const modalImage = document.getElementById('modalImage');
+      const modalVideo = document.getElementById('modalVideo');
       const imageCounter = document.getElementById('imageCounter');
       const frameworkLabel = document.getElementById('frameworkLabel');
       const imageInfo = document.getElementById('imageInfo');
@@ -2368,7 +2456,23 @@
 
       if (currentImages.length > 0) {
         const currentImage = currentImages[currentImageIndex];
-        modalImage.src = currentImage.url;
+        const isVideo = currentImage.url.toLowerCase().endsWith('.mp4');
+        if (isVideo) {
+          if (modalVideo) {
+            modalVideo.src = currentImage.url;
+            modalVideo.style.display = 'block';
+          }
+          modalImage.style.display = 'none';
+        } else {
+          modalImage.src = currentImage.url;
+          modalImage.style.display = 'block';
+          if (modalVideo) {
+            modalVideo.pause?.();
+            modalVideo.removeAttribute('src');
+            modalVideo.load?.();
+            modalVideo.style.display = 'none';
+          }
+        }
         
         if (currentImages.length > 1) {
           imageCounter.textContent = `${currentImageIndex + 1} / ${currentImages.length}`;