132 lines
5.3 KiB
JavaScript
132 lines
5.3 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
const widgets = document.querySelectorAll('.gitea-widget');
|
|
|
|
widgets.forEach(widget => {
|
|
const repo = widget.dataset.repo;
|
|
|
|
// Auto-generate data file path from repo name
|
|
const dataFile = `/assets/repo-data/${repo.replace('/', '-')}.json`;
|
|
const showDescription = widget.dataset.showDescription !== 'false';
|
|
const showLanguage = widget.dataset.showLanguage !== 'false';
|
|
const showLastUpdate = widget.dataset.showLastUpdate !== 'false';
|
|
|
|
// Show loading state
|
|
widget.innerHTML = `
|
|
<div class="gitea-widget-loading">
|
|
<div class="loading-spinner"></div>
|
|
<span>Loading ${repo}...</span>
|
|
</div>
|
|
`;
|
|
|
|
// Fetch repository data
|
|
fetch(dataFile)
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`Could not load data for ${repo}`);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
renderWidget(widget, data, { showDescription, showLanguage, showLastUpdate });
|
|
})
|
|
.catch(error => {
|
|
renderError(widget, repo, error.message);
|
|
});
|
|
});
|
|
});
|
|
|
|
function renderWidget(widget, data, options) {
|
|
const lastUpdate = new Date(data.updated_at).toLocaleDateString();
|
|
const language = data.language || 'Not specified';
|
|
|
|
widget.innerHTML = `
|
|
<div class="gitea-widget-container">
|
|
<div class="gitea-widget-header">
|
|
<div class="gitea-widget-title">
|
|
<svg class="gitea-icon" viewBox="0 0 16 16" width="16" height="16">
|
|
<path fill="currentColor" d="M2 2.5A2.5 2.5 0 014.5 0h8.75a.75.75 0 01.75.75v12.5a.75.75 0 01-.75.75h-2.5a.75.75 0 110-1.5h1.75v-2h-8a1 1 0 00-.714 1.7.75.75 0 01-1.072 1.05A2.495 2.495 0 012 11.5v-9zm10.5-1V9h-8c-.356 0-.694.074-1 .208V2.5a1 1 0 011-1h8zM5 12.25v3.25a.25.25 0 00.4.2l1.45-1.087a.25.25 0 01.3 0L8.6 15.7a.25.25 0 00.4-.2v-3.25a.25.25 0 00-.25-.25h-3.5a.25.25 0 00-.25.25z"/>
|
|
</svg>
|
|
<a href="${data.html_url}" target="_blank" rel="noopener noreferrer" class="repo-link">
|
|
${data.full_name}
|
|
</a>
|
|
</div>
|
|
<div class="gitea-widget-stats">
|
|
<span class="stat-item" title="Stars">
|
|
<svg viewBox="0 0 16 16" width="14" height="14">
|
|
<path fill="currentColor" d="M8 .25a.75.75 0 01.673.418l1.882 3.815 4.21.612a.75.75 0 01.416 1.279l-3.046 2.97.719 4.192a.75.75 0 01-1.088.791L8 12.347l-3.766 1.98a.75.75 0 01-1.088-.79l.72-4.194L.818 6.374a.75.75 0 01.416-1.28l4.21-.611L7.327.668A.75.75 0 018 .25z"/>
|
|
</svg>
|
|
${data.stars_count.toLocaleString()}
|
|
</span>
|
|
<span class="stat-item" title="Forks">
|
|
<svg viewBox="0 0 16 16" width="14" height="14">
|
|
<path fill="currentColor" d="M5 3.25a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm0 2.122a2.25 2.25 0 10-1.5 0v.878A2.25 2.25 0 005.75 8.5h1.5v2.128a2.251 2.251 0 101.5 0V8.5h1.5a2.25 2.25 0 002.25-2.25V5.372a2.25 2.25 0 10-1.5 0v.878A.75.75 0 0110.25 7H5.75A.75.75 0 015 6.25v-.878zm3.75 7.378a.75.75 0 11-1.5 0 .75.75 0 011.5 0zm3-8.75a.75.75 0 100-1.5.75.75 0 000 1.5z"/>
|
|
</svg>
|
|
${data.forks_count.toLocaleString()}
|
|
</span>
|
|
<span class="stat-item" title="Open Issues">
|
|
<svg viewBox="0 0 16 16" width="14" height="14">
|
|
<path fill="currentColor" d="M8 9.5a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"/>
|
|
<path fill="currentColor" fill-rule="evenodd" d="M8 0a8 8 0 100 16A8 8 0 008 0zM1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0z"/>
|
|
</svg>
|
|
${data.open_issues_count.toLocaleString()}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
${options.showDescription && data.description ? `
|
|
<div class="gitea-widget-description">
|
|
${data.description}
|
|
</div>
|
|
` : ''}
|
|
<div class="gitea-widget-footer">
|
|
${options.showLanguage ? `
|
|
<span class="language-info">
|
|
<span class="language-dot" style="background-color: ${getLanguageColor(language)}"></span>
|
|
${language}
|
|
</span>
|
|
` : ''}
|
|
${options.showLastUpdate ? `
|
|
<span class="last-update">Updated ${lastUpdate}</span>
|
|
` : ''}
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
function renderError(widget, repo, error) {
|
|
widget.innerHTML = `
|
|
<div class="gitea-widget-error">
|
|
<svg viewBox="0 0 16 16" width="16" height="16">
|
|
<path fill="currentColor" d="M2.343 13.657A8 8 0 1113.657 2.343 8 8 0 012.343 13.657zM6.03 4.97a.75.75 0 00-1.06 1.06L6.94 8 4.97 9.97a.75.75 0 101.06 1.06L8 9.06l1.97 1.97a.75.75 0 101.06-1.06L9.06 8l1.97-1.97a.75.75 0 10-1.06-1.06L8 6.94 6.03 4.97z"/>
|
|
</svg>
|
|
<span>Failed to load ${repo}</span>
|
|
<small>${error}</small>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
function getLanguageColor(language) {
|
|
const colors = {
|
|
'JavaScript': '#f1e05a',
|
|
'TypeScript': '#2b7489',
|
|
'Python': '#3572A5',
|
|
'Java': '#b07219',
|
|
'C++': '#f34b7d',
|
|
'C': '#555555',
|
|
'C#': '#239120',
|
|
'PHP': '#4F5D95',
|
|
'Ruby': '#701516',
|
|
'Go': '#00ADD8',
|
|
'Rust': '#dea584',
|
|
'Swift': '#ffac45',
|
|
'Kotlin': '#F18E33',
|
|
'Scala': '#c22d40',
|
|
'Shell': '#89e051',
|
|
'HTML': '#e34c26',
|
|
'CSS': '#563d7c',
|
|
'Vue': '#2c3e50',
|
|
'React': '#61dafb',
|
|
'Dockerfile': '#384d54',
|
|
'Markdown': '#083fa1'
|
|
};
|
|
return colors[language] || '#586069';
|
|
} |