<script><![CDATA[
// ==================== DYNAMIC TOOLS STORAGE ====================
let toolsData = [];
// Default tools (used for reset)
const defaultTools = [
{ id:1, title:"Email Subject Line Optimizer", category:"Content", desc:"Instantly improve your email open rates", icon:"📧", pageUrl:"/p/email-subject-optimizer" },
{ id:2, title:"LinkedIn Post Generator", category:"Content", desc:"Create professional LinkedIn posts", icon:"🔗", pageUrl:"/p/linkedin-post" },
{ id:3, title:"Readability Scorer", category:"Text", desc:"Flesch-Kincaid score with suggestions", icon:"📊", pageUrl:"/p/readability-scorer" },
{ id:4, title:"Regex Generator & Tester", category:"Code", desc:"Create and test regular expressions", icon:"🔍", pageUrl:"/p/regex-generator" },
{ id:5, title:"SWOT Analysis Generator", category:"Business", desc:"Generate complete SWOT analysis", icon:"📈", pageUrl:"/p/swot-analysis" },
{ id:6, title:"Resume Bullet Enhancer", category:"Personal", desc:"Make your achievements sound powerful", icon:"📝", pageUrl:"/p/resume-enhancer" },
{ id:7, title:"Git Commit Message Generator", category:"Code", desc:"Write professional commit messages", icon:"📦", pageUrl:"/p/git-commit" },
{ id:8, title:"Meal Plan Generator", category:"Lifestyle", desc:"Personalized weekly meal plans", icon:"🍽️", pageUrl:"/p/meal-plan" },
{ id:9, title:"Elevator Pitch Generator", category:"Business", desc:"Create 30-second perfect pitch", icon:"🎤", pageUrl:"/p/elevator-pitch" },
{ id:10, title:"Dream Journal Analyzer", category:"Creative", desc:"Find patterns in your dreams", icon:"🌙", pageUrl:"/p/dream-analyzer" }
];
// Load from localStorage or use defaults
function loadTools() {
const stored = localStorage.getItem('aiToolsHubData');
if (stored) {
toolsData = JSON.parse(stored);
} else {
toolsData = JSON.parse(JSON.stringify(defaultTools)); // clone
}
}
// Save to localStorage
function saveTools() {
localStorage.setItem('aiToolsHubData', JSON.stringify(toolsData));
}
// Reset to default tools (admin feature)
function resetToDefault() {
if (confirm('⚠️ Reset all tools to default? Any added tools will be lost.')) {
toolsData = JSON.parse(JSON.stringify(defaultTools));
saveTools();
refreshUI();
}
}
// Render tools grid
function renderTools(filtered) {
const grid = document.getElementById("toolsGrid");
if (!grid) return;
grid.innerHTML = "";
filtered.forEach(tool => {
const card = document.createElement('div');
card.className = "tool-card block bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-3xl p-6 hover:border-blue-500 relative group";
card.innerHTML = `
<a href="${tool.pageUrl}" class="block">
<div class="text-5xl mb-4">${tool.icon}</div>
<span class="inline-block px-4 py-1 text-xs font-medium bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300 rounded-3xl mb-3">${escapeHtml(tool.category)}</span>
<h3 class="font-semibold text-xl mb-2">${escapeHtml(tool.title)}</h3>
<p class="text-slate-600 dark:text-slate-400 text-[15px]">${escapeHtml(tool.desc)}</p>
<div class="mt-5 text-blue-600 font-medium text-sm">Try now →</div>
</a>
<button onclick="editTool(${tool.id})" class="absolute top-4 right-4 text-slate-400 hover:text-blue-600 text-sm bg-white dark:bg-slate-800 rounded-full w-7 h-7 flex items-center justify-center opacity-0 group-hover:opacity-100 transition">
<i class="fas fa-edit"></i>
</button>
`;
grid.appendChild(card);
});
const countSpan = document.getElementById("count");
if (countSpan) countSpan.textContent = filtered.length;
}
function escapeHtml(str) {
if (!str) return '';
return str.replace(/[&<>]/g, function(m) {
if (m === '&') return '&';
if (m === '<') return '<';
if (m === '>') return '>';
return m;
});
}
function filterTools() {
const query = document.getElementById("searchInput").value.toLowerCase();
const filtered = toolsData.filter(tool =>
tool.title.toLowerCase().includes(query) ||
(tool.desc && tool.desc.toLowerCase().includes(query)) ||
tool.category.toLowerCase().includes(query)
);
renderTools(filtered);
}
function createCategoryFilters() {
const container = document.getElementById("categoryFilters");
if (!container) return;
container.innerHTML = "";
const allBtn = document.createElement("button");
allBtn.className = "px-6 py-2.5 rounded-3xl text-sm font-medium bg-slate-900 text-white";
allBtn.textContent = "All Tools";
allBtn.onclick = () => renderTools(toolsData);
container.appendChild(allBtn);
// Reset button for admins
const resetBtn = document.createElement("button");
resetBtn.className = "px-6 py-2.5 rounded-3xl text-sm font-medium border border-red-300 text-red-700 hover:bg-red-50";
resetBtn.innerHTML = '<i class="fas fa-undo-alt"></i> Reset';
resetBtn.onclick = () => resetToDefault();
container.appendChild(resetBtn);
const categories = [...new Set(toolsData.map(t => t.category))];
categories.forEach(cat => {
const btn = document.createElement("button");
btn.className = "px-6 py-2.5 rounded-3xl text-sm font-medium border border-slate-300 dark:border-slate-700 hover:bg-slate-100 dark:hover:bg-slate-800";
btn.textContent = cat;
btn.onclick = () => {
const filtered = toolsData.filter(t => t.category === cat);
renderTools(filtered);
};
container.appendChild(btn);
});
}
// Admin modal functions
let currentEditId = null;
function openAddModal() {
currentEditId = null;
document.getElementById("modalTitle").innerText = "Add New Tool";
document.getElementById("toolForm").reset();
document.getElementById("toolId").value = "";
document.getElementById("toolIcon").value = "🤖";
document.getElementById("deleteBtnContainer").classList.add("hidden");
document.getElementById("toolModal").classList.add("active");
}
function editTool(id) {
const tool = toolsData.find(t => t.id === id);
if (!tool) return;
currentEditId = id;
document.getElementById("modalTitle").innerText = "Edit Tool";
document.getElementById("toolId").value = tool.id;
document.getElementById("toolTitle").value = tool.title;
document.getElementById("toolCategory").value = tool.category;
document.getElementById("toolDesc").value = tool.desc || "";
document.getElementById("toolIcon").value = tool.icon;
document.getElementById("toolUrl").value = tool.pageUrl;
document.getElementById("deleteBtnContainer").classList.remove("hidden");
document.getElementById("toolModal").classList.add("active");
}
function closeModal() {
document.getElementById("toolModal").classList.remove("active");
currentEditId = null;
}
function deleteCurrentTool() {
if (!currentEditId) return;
if (confirm("Delete this tool permanently?")) {
toolsData = toolsData.filter(t => t.id !== currentEditId);
saveTools();
refreshUI();
closeModal();
}
}
document.getElementById("toolForm").addEventListener("submit", function(e) {
e.preventDefault();
const id = document.getElementById("toolId").value;
const title = document.getElementById("toolTitle").value.trim();
const category = document.getElementById("toolCategory").value.trim();
const desc = document.getElementById("toolDesc").value.trim();
const icon = document.getElementById("toolIcon").value.trim() || "🔧";
const pageUrl = document.getElementById("toolUrl").value.trim();
if (!title || !category || !pageUrl) {
alert("Please fill title, category and URL");
return;
}
if (id) {
// Edit existing
const index = toolsData.findIndex(t => t.id == id);
if (index !== -1) {
toolsData[index] = { ...toolsData[index], title, category, desc, icon, pageUrl };
}
} else {
// Add new
const newId = Date.now();
toolsData.push({ id: newId, title, category, desc, icon, pageUrl });
}
saveTools();
refreshUI();
closeModal();
});
function refreshUI() {
renderTools(toolsData);
createCategoryFilters();
}
function toggleDarkMode() {
document.documentElement.classList.toggle("dark");
}
window.onload = function() {
loadTools();
refreshUI();
const searchInput = document.getElementById("searchInput");
if (searchInput) {
searchInput.addEventListener("keyup", filterTools);
}
};
]]></script>
