168 lines
7.0 KiB
JavaScript
168 lines
7.0 KiB
JavaScript
let widgetsInitialized = new Set();
|
|
|
|
function initializeGitHubWidgets() {
|
|
const widgets = document.querySelectorAll('.github-widget');
|
|
|
|
widgets.forEach(widget => {
|
|
// Skip if already initialized
|
|
const widgetId = widget.dataset.repo + '-' + Math.random().toString(36).substr(2, 9);
|
|
if (widget.dataset.initialized) return;
|
|
|
|
widget.dataset.initialized = 'true';
|
|
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="github-widget-loading">
|
|
<div class="loading-spinner"></div>
|
|
<span>Loading ${repo}...</span>
|
|
</div>
|
|
`;
|
|
|
|
// Fetch repository data from pre-generated JSON file
|
|
fetch(dataFile)
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`Could not load data for ${repo}`);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
const lastUpdate = new Date(data.updated_at).toLocaleDateString();
|
|
const language = data.language || 'Not specified';
|
|
|
|
widget.innerHTML = `
|
|
<div class="github-widget-container">
|
|
<div class="github-widget-header">
|
|
<div class="github-widget-title">
|
|
<svg class="github-icon" viewBox="0 0 16 16" width="16" height="16">
|
|
<path fill="currentColor" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
|
|
</svg>
|
|
<a href="${data.html_url}" target="_blank" rel="noopener noreferrer" class="repo-link">
|
|
${data.full_name}
|
|
</a>
|
|
</div>
|
|
<div class="github-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>
|
|
${showDescription && data.description ? `
|
|
<div class="github-widget-description">
|
|
${data.description}
|
|
</div>
|
|
` : ''}
|
|
<div class="github-widget-footer">
|
|
${showLanguage ? `
|
|
<span class="language-info">
|
|
<span class="language-dot" style="background-color: ${getLanguageColor(language)}"></span>
|
|
${language}
|
|
</span>
|
|
` : ''}
|
|
${showLastUpdate ? `
|
|
<span class="last-update">Updated ${lastUpdate}</span>
|
|
` : ''}
|
|
${data.license ? `
|
|
<span class="license-info">${data.license.spdx_id || data.license.name}</span>
|
|
` : ''}
|
|
</div>
|
|
</div>
|
|
`;
|
|
})
|
|
.catch(error => {
|
|
console.error('Error loading repository data:', error);
|
|
widget.innerHTML = `
|
|
<div class="github-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.message}</small>
|
|
</div>
|
|
`;
|
|
});
|
|
});
|
|
}
|
|
|
|
// Initialize on DOM ready
|
|
document.addEventListener('DOMContentLoaded', initializeGitHubWidgets);
|
|
|
|
// Watch for DOM changes (MkDocs Material dynamic content)
|
|
const observer = new MutationObserver((mutations) => {
|
|
let shouldReinitialize = false;
|
|
|
|
mutations.forEach((mutation) => {
|
|
if (mutation.type === 'childList') {
|
|
// Check if any github-widget elements were added
|
|
mutation.addedNodes.forEach((node) => {
|
|
if (node.nodeType === 1 && // Element node
|
|
(node.classList?.contains('github-widget') ||
|
|
node.querySelector?.('.github-widget'))) {
|
|
shouldReinitialize = true;
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
if (shouldReinitialize) {
|
|
// Small delay to ensure DOM is stable
|
|
setTimeout(initializeGitHubWidgets, 100);
|
|
}
|
|
});
|
|
|
|
// Start observing
|
|
observer.observe(document.body, {
|
|
childList: true,
|
|
subtree: true
|
|
});
|
|
|
|
// Language color mapping (simplified version)
|
|
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'
|
|
};
|
|
return colors[language] || '#586069';
|
|
}
|