This commit is contained in:
overcuriousity
2025-07-14 15:15:57 +02:00
parent 921abfb5b9
commit 47eb5ad72a
7 changed files with 99 additions and 21 deletions

View File

@@ -54,12 +54,19 @@ const tools = data.tools;
const matrixContainer = document.getElementById('matrix-container');
const noResults = document.getElementById('no-results');
// Guard against null elements
if (!toolsContainer || !toolsGrid || !matrixContainer || !noResults) {
console.error('Required DOM elements not found');
return;
}
// Initial tools HTML
const initialToolsHTML = toolsContainer.innerHTML;
// Handle filtered results
window.addEventListener('toolsFiltered', (event) => {
const filtered = event.detail;
window.addEventListener('toolsFiltered', (event: Event) => {
const customEvent = event as CustomEvent;
const filtered = customEvent.detail;
const currentView = document.querySelector('.view-toggle.active')?.getAttribute('data-view');
if (currentView === 'matrix') {
@@ -76,7 +83,7 @@ const tools = data.tools;
noResults.style.display = 'none';
// Render filtered tools
filtered.forEach(tool => {
filtered.forEach((tool: any) => {
const toolCard = createToolCard(tool);
toolsContainer.appendChild(toolCard);
});
@@ -84,8 +91,9 @@ const tools = data.tools;
});
// Handle view changes
window.addEventListener('viewChanged', (event) => {
const view = event.detail;
window.addEventListener('viewChanged', (event: Event) => {
const customEvent = event as CustomEvent;
const view = customEvent.detail;
if (view === 'matrix') {
toolsGrid.style.display = 'none';
@@ -97,7 +105,7 @@ const tools = data.tools;
});
// Create tool card element
function createToolCard(tool) {
function createToolCard(tool: any): HTMLElement {
const cardDiv = document.createElement('div');
const cardClass = tool.isHosted ? 'card card-hosted' : (tool.license !== 'Proprietary' ? 'card card-oss' : 'card');
cardDiv.className = cardClass;
@@ -149,7 +157,7 @@ const tools = data.tools;
</div>
<div style="display: flex; flex-wrap: wrap; gap: 0.25rem; margin-bottom: 1rem;">
${tool.tags.map(tag => `<span class="tag">${tag}</span>`).join('')}
${tool.tags.map((tag: string) => `<span class="tag">${tag}</span>`).join('')}
</div>
<a href="${tool.url}" target="_blank" rel="noopener noreferrer" class="btn btn-primary" style="width: 100%;">