123 lines
4.4 KiB
HTML
123 lines
4.4 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Home - {{ app_name }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<!-- Public Lists Section -->
|
|
<div class="py-12 md:py-16 mt-8">
|
|
<h2 class="text-3xl md:text-4xl font-bold text-center mb-8">Browse Public Lists</h2>
|
|
|
|
<!-- Search Public Lists -->
|
|
<div class="max-w-2xl mx-auto mb-8">
|
|
<div class="relative">
|
|
<input
|
|
type="text"
|
|
id="publicSearch"
|
|
placeholder="Search public lists by domain (e.g., github.com)..."
|
|
class="w-full bg-slate-900 border border-slate-700 rounded px-4 py-3 text-slate-100 placeholder-slate-500 focus:outline-none focus:border-sky-500 focus:ring-1 focus:ring-sky-500 transition text-sm"
|
|
>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Recent Public Lists -->
|
|
<div id="publicListsContainer" class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
|
|
<div class="col-span-full text-center text-slate-400">Loading public lists...</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CTA Section -->
|
|
{% if not current_user %}
|
|
<div class="py-12 md:py-16 mt-8">
|
|
<div class="card p-8 md:p-12 text-center bg-gradient-to-r from-slate-800 to-slate-700">
|
|
<h2 class="text-3xl font-bold mb-4">Ready to Get Started?</h2>
|
|
<p class="text-slate-400 mb-6 max-w-xl mx-auto">
|
|
Create your first URL list in seconds. It's free, fast, and secure.
|
|
</p>
|
|
<a href="{{ url_for('register') }}" class="btn-primary inline-block">
|
|
Create Your Free Account
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<script>
|
|
// Load and display public lists on page load
|
|
let allPublicLists = [];
|
|
|
|
async function loadPublicLists() {
|
|
try {
|
|
const response = await fetch('/api/public-lists/');
|
|
allPublicLists = await response.json();
|
|
renderPublicLists(allPublicLists);
|
|
} catch (error) {
|
|
console.error('Error loading public lists:', error);
|
|
document.getElementById('publicListsContainer').innerHTML = '<div class="col-span-full text-center text-red-400">Failed to load public lists</div>';
|
|
}
|
|
}
|
|
|
|
function renderPublicLists(lists) {
|
|
const container = document.getElementById('publicListsContainer');
|
|
|
|
if (!lists || lists.length === 0) {
|
|
container.innerHTML = '<div class="col-span-full text-center text-slate-400">No public lists yet. Create one to share!</div>';
|
|
return;
|
|
}
|
|
|
|
let html = '';
|
|
lists.forEach(list => {
|
|
const urlCount = list.urls.split('\n').filter(u => u.trim()).length;
|
|
const updatedDate = new Date(list.updated_at).toLocaleDateString();
|
|
|
|
html += `
|
|
<div class="card p-6 hover:border-sky-500 transition">
|
|
<h3 class="text-lg font-semibold text-sky-400 mb-2 truncate" title="${escapeHtml(list.name)}">${escapeHtml(list.name)}</h3>
|
|
<p class="text-sm text-slate-400 mb-4">${urlCount} URL${urlCount !== 1 ? 's' : ''}</p>
|
|
<p class="text-xs text-slate-500 mb-4">Updated: ${updatedDate}</p>
|
|
<a href="{{ url_for('list_read', slug='') }}${encodeURIComponent(list.unique_slug)}" class="inline-block bg-sky-600 hover:bg-sky-700 text-white text-sm font-semibold py-2 px-4 rounded transition duration-200">
|
|
View List →
|
|
</a>
|
|
</div>
|
|
`;
|
|
});
|
|
|
|
container.innerHTML = html;
|
|
}
|
|
|
|
function escapeHtml(text) {
|
|
const map = {
|
|
'&': '&',
|
|
'<': '<',
|
|
'>': '>',
|
|
'"': '"',
|
|
"'": '''
|
|
};
|
|
return text.replace(/[&<>"']/g, m => map[m]);
|
|
}
|
|
|
|
// Search public lists
|
|
document.getElementById('publicSearch').addEventListener('input', async (e) => {
|
|
const query = e.target.value.trim();
|
|
const container = document.getElementById('publicListsContainer');
|
|
|
|
if (!query) {
|
|
renderPublicLists(allPublicLists);
|
|
return;
|
|
}
|
|
|
|
container.innerHTML = '<div class="col-span-full text-center text-slate-400">Searching...</div>';
|
|
|
|
try {
|
|
const response = await fetch(`/api/public-lists/search?domain=${encodeURIComponent(query)}`);
|
|
const results = await response.json();
|
|
renderPublicLists(results);
|
|
} catch (error) {
|
|
console.error('Error searching public lists:', error);
|
|
container.innerHTML = '<div class="col-span-full text-center text-red-400">Error searching public lists</div>';
|
|
}
|
|
});
|
|
|
|
// Load public lists on page load
|
|
document.addEventListener('DOMContentLoaded', loadPublicLists);
|
|
</script>
|
|
{% endblock %}
|