daviszhen's picture
在选项栏下面增加file filter ,template
132e3bc verified
document.addEventListener('DOMContentLoaded', function() {
const fetchBtn = document.getElementById('fetch-btn');
const fileFilterSelect = document.getElementById('file-filter');
const customFilterSection = document.getElementById('custom-filter-section');
// Show/hide custom file types input based on selection
fileFilterSelect.addEventListener('change', function() {
if (this.value === 'custom') {
customFilterSection.classList.remove('hidden');
} else {
customFilterSection.classList.add('hidden');
}
});
const repoUrlInput = document.getElementById('repo-url');
const fileFilterSelect = document.getElementById('file-filter');
const templateSelect = document.getElementById('template');
const themeSelect = document.getElementById('theme');
const previewSection = document.getElementById('preview-section');
const previewContent = document.getElementById('preview-content');
const downloadBtn = document.getElementById('download-btn');
const deployBtn = document.getElementById('deploy-btn');
fetchBtn.addEventListener('click', async function() {
const repoUrl = repoUrlInput.value.trim();
const fileFilter = fileFilterSelect.value;
if (!repoUrl) {
showAlert('Please enter a GitHub repository URL', 'error');
return;
}
// Validate GitHub URL
if (!isValidGitHubUrl(repoUrl)) {
showAlert('Please enter a valid GitHub repository URL', 'error');
return;
}
// Show supported extensions for code filter
if (fileFilter === 'code') {
showAlert('Filtering for code files only: .js, .ts, .py, .java, .cpp, .h, .c, .cs, .go, .rb, .php, .swift, .kt, .rs, .sh', 'info');
}
// Show loading state
fetchBtn.disabled = true;
fetchBtn.innerHTML = '<span class="loading-spinner"></span> Processing...';
try {
// Simulate API call (in a real app, you would call your backend here)
await simulateApiCall();
// Show preview section
previewSection.classList.remove('hidden');
// Generate sample preview (in a real app, this would be the actual rendered content)
generateSamplePreview();
showAlert('Repository fetched successfully!', 'success');
} catch (error) {
showAlert('Error fetching repository: ' + error.message, 'error');
} finally {
// Reset button state
fetchBtn.disabled = false;
fetchBtn.innerHTML = '<i data-feather="download" class="mr-2"></i> Fetch';
feather.replace();
}
});
downloadBtn.addEventListener('click', function() {
showAlert('Download started!', 'success');
// In a real app, this would trigger the download
});
deployBtn.addEventListener('click', function() {
showAlert('Deployment initiated!', 'success');
// In a real app, this would trigger the deployment
});
function isValidGitHubUrl(url) {
const pattern = /^https:\/\/github\.com\/[a-zA-Z0-9_-]+\/[a-zA-Z0-9_-]+(\/)?$/;
return pattern.test(url);
}
function simulateApiCall() {
return new Promise((resolve) => {
setTimeout(resolve, 1500);
});
}
function generateSamplePreview() {
const template = templateSelect.value;
const theme = themeSelect.value;
const fileFilter = fileFilterSelect.value;
// Apply theme class to preview
previewContent.className = 'border border-gray-200 rounded-lg p-6 min-h-[400px]';
if (theme === 'dark') {
previewContent.classList.add('bg-gray-800', 'text-gray-100');
} else if (theme === 'solarized') {
previewContent.classList.add('bg-[#fdf6e3]', 'text-[#657b83]');
} else if (theme === 'monokai') {
previewContent.classList.add('bg-[#272822]', 'text-[#f8f8f2]');
}
// Generate sample content based on template
let content = '';
if (template === 'default') {
content = `
<h1 class="text-2xl font-bold mb-4">Sample Repository</h1>
<p class="mb-4">This is a sample preview of how your