- openPreview(e.detail)}
- {compactMode}
- />
- {/if}
-
- {#if viewMode === "grid"}
- openPreview(e.detail)}
- {compactMode}
- />
- {:else}
-
-
-
+
{#each logos as logo}
@@ -179,6 +171,7 @@
class="brand-filter-btn common-btn"
title="Filter by brand"
on:click={() => {
+ console.log("List: Filtering by brand:", logo.brand);
setSearchQuery(logo.brand);
// Update URL with search param
const params = new URLSearchParams(window.location.search);
diff --git a/src/components/Preview.svelte b/src/components/Preview.svelte
index b01e22f..ef4603d 100644
--- a/src/components/Preview.svelte
+++ b/src/components/Preview.svelte
@@ -1,5 +1,5 @@
{#if logo}
+
{logo.name}
- +
+ import { onMount } from "svelte";
+ import Grid from "../components/Grid.svelte";
+ import List from "../components/List.svelte";
+ import Header from "../components/Header.svelte";
+
+ // Use the app's global data without reloading
+ let appData = {};
+ let initialized = false;
+
+ // Simple function to get data from the global app object
+ function getAppData() {
+ if (typeof window !== "undefined" && window.appData) {
+ console.log("Home: Using app data with",
+ window.appData.logos ? window.appData.logos.length : 0, "logos",
+ "displayLogos:", window.appData.displayLogos ? window.appData.displayLogos.length : 0);
+
+ // Create a fresh copy to trigger reactivity
+ appData = {
+ ...window.appData,
+ logos: [...(window.appData.logos || [])],
+ displayLogos: [...(window.appData.displayLogos || [])],
+ filteredLogos: [...(window.appData.filteredLogos || [])]
+ };
+
+ initialized = true;
+ } else {
+ console.log("Home: window.appData not available yet");
+ }
+ }
+
+ // Consolidate the onMount functions into a single one
+ onMount(() => {
+ getAppData();
+
+ // If not initialized yet, set up an interval to check for data
+ if (!initialized) {
+ console.log("Home: Setting up retry interval for logos data");
+ const interval = setInterval(() => {
+ if (window.appData && window.appData.logos && window.appData.logos.length > 0) {
+ console.log("Home: Data now available:",
+ window.appData.logos.length, "logos");
+ getAppData();
+ initialized = true;
+ clearInterval(interval);
+ } else {
+ console.log("Home: Waiting for logo data, current status:",
+ window.appData ? `${window.appData.logos?.length || 0} logos` : "no window.appData");
+ }
+ }, 200); // Increased interval for better logging
+
+ // No cleanup here - we'll handle in the second part
+ }
+
+ // Also watch for changes to window.appData
+ let logoCheckInterval;
+ let lastViewMode = '';
+ let lastCompactMode = false;
+ let lastSearchQuery = '';
+ let lastSelectedTags = [];
+ let lastTagDropdownOpen = false;
+ let lastDisplayLogosCount = 0;
+
+ // Set up the interval for watching changes
+ logoCheckInterval = setInterval(() => {
+ if (window.appData) {
+ // Check for logo updates
+ if (window.appData.logos &&
+ window.appData.logos.length > 0 &&
+ (!appData.logos || appData.logos.length === 0)) {
+ console.log("Home: Detected logos update in window.appData:", window.appData.logos.length);
+ getAppData();
+ initialized = true;
+ }
+
+ // Check for view mode changes
+ if (window.appData.viewMode !== lastViewMode) {
+ console.log("Home: Detected viewMode change:",
+ lastViewMode, "→", window.appData.viewMode);
+ lastViewMode = window.appData.viewMode;
+ getAppData();
+ }
+
+ // Check for compact mode changes
+ if (window.appData.compactMode !== lastCompactMode) {
+ console.log("Home: Detected compactMode change:",
+ lastCompactMode, "→", window.appData.compactMode);
+ lastCompactMode = window.appData.compactMode;
+ getAppData();
+ }
+
+ // Check for search query changes
+ if (window.appData.searchQuery !== lastSearchQuery) {
+ console.log("Home: Detected searchQuery change:",
+ lastSearchQuery, "→", window.appData.searchQuery);
+ lastSearchQuery = window.appData.searchQuery;
+ getAppData();
+ }
+
+ // Check for display logos count changes
+ if (window.appData.displayLogos &&
+ window.appData.displayLogos.length !== lastDisplayLogosCount) {
+ console.log("Home: Detected displayLogos count change:",
+ lastDisplayLogosCount, "→", window.appData.displayLogos.length);
+ lastDisplayLogosCount = window.appData.displayLogos.length;
+ getAppData();
+ }
+
+ // Check for tag selection changes
+ const currentSelectedTags = window.appData.selectedTags || [];
+ if (JSON.stringify(currentSelectedTags) !== JSON.stringify(lastSelectedTags)) {
+ console.log("Home: Detected selectedTags change, now:",
+ currentSelectedTags.length, "tags");
+ lastSelectedTags = [...currentSelectedTags];
+ getAppData();
+ }
+
+ // Check for tag dropdown state changes
+ if (window.appData.tagDropdownOpen !== lastTagDropdownOpen) {
+ console.log("Home: Detected tagDropdownOpen change:",
+ lastTagDropdownOpen, "→", window.appData.tagDropdownOpen);
+ lastTagDropdownOpen = window.appData.tagDropdownOpen;
+ getAppData();
+ }
+ }
+ }, 100); // Faster interval for UI responsiveness
+
+ // Cleanup function to clear the interval when component is destroyed
+ return () => clearInterval(logoCheckInterval);
+});
+
+
+{#if initialized}
+
+ {})}
+ viewMode={appData.viewMode || "grid"}
+ setGridView={appData.setGridView || (() => {})}
+ setListView={appData.setListView || (() => {})}
+ searchQuery={appData.searchQuery || ""}
+ setSearchQuery={appData.setSearchQuery || ((q) => {})}
+ allTags={appData.allTags || []}
+ selectedTags={appData.selectedTags || []}
+ tagDropdownOpen={appData.tagDropdownOpen || false}
+ toggleDropdown={appData.toggleDropdown || (() => {})}
+ addTag={appData.addTag || (() => {})}
+ removeTag={appData.removeTag || (() => {})}
+ getTagObj={appData.getTagObj || ((t) => ({text: t}))}
+ compactMode={appData.compactMode || false}
+ setCompactMode={appData.setCompactMode || ((val) => {})}
+ />
+
+
+{:else}
+
+ {#if appData.viewMode === "grid"}
+ {})}
+ onDownload={appData.onDownload || ((p, n) => {})}
+ setSearchQuery={appData.setSearchQuery || ((q) => {})}
+ theme={appData.effectiveTheme || "light"}
+ />
+ {:else}
+
+
+
+
+ - {})}
+ onDownload={appData.onDownload || ((p, n) => {})}
+ setSearchQuery={appData.setSearchQuery || ((q) => {})}
+ />
+ {/if}
+
+
+{/if}
+
+
diff --git a/src/pages/Preview.svelte b/src/pages/Preview.svelte
new file mode 100644
index 0000000..84e55e1
--- /dev/null
+++ b/src/pages/Preview.svelte
@@ -0,0 +1,191 @@
+
+
+{#if logo}
+ Loading...
+
+
+{:else}
+
+
+
+
+
+
+{/if}
+
+
Loading logo...
+