mirror of
https://github.com/techgaun/active-forks.git
synced 2024-12-22 05:22:14 +01:00
prettify
This commit is contained in:
parent
df86f8e92c
commit
ccea7c3df7
2 changed files with 112 additions and 92 deletions
5
.prettierrc
Normal file
5
.prettierrc
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
{
|
||||||
|
"trailingComma": "es5",
|
||||||
|
"singleQuote": true,
|
||||||
|
"semi": true
|
||||||
|
}
|
199
js/main.js
199
js/main.js
|
@ -1,122 +1,137 @@
|
||||||
window.addEventListener('load', () => {
|
window.addEventListener('load', () => {
|
||||||
initDT() // Initialize the DatatTable and window.columnNames variables
|
initDT(); // Initialize the DatatTable and window.columnNames variables
|
||||||
|
|
||||||
const repo = getRepoFromUrl();
|
const repo = getRepoFromUrl();
|
||||||
|
|
||||||
if (repo) {
|
if (repo) {
|
||||||
document.getElementById('q').value = repo;
|
document.getElementById('q').value = repo;
|
||||||
fetchData();
|
fetchData();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
document.getElementById('form').addEventListener('submit', (e) => {
|
document.getElementById('form').addEventListener('submit', e => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
fetchData();
|
fetchData();
|
||||||
});
|
});
|
||||||
|
|
||||||
function fetchData() {
|
function fetchData() {
|
||||||
const repo = document.getElementById('q').value;
|
const repo = document.getElementById('q').value;
|
||||||
const re = /[-_\w]+\/[-_.\w]+/;
|
const re = /[-_\w]+\/[-_.\w]+/;
|
||||||
|
|
||||||
const urlRepo = getRepoFromUrl();
|
const urlRepo = getRepoFromUrl();
|
||||||
|
|
||||||
if (!urlRepo || urlRepo !== repo) {
|
if (!urlRepo || urlRepo !== repo) {
|
||||||
window.history.pushState('', '', `#${repo}`);
|
window.history.pushState('', '', `#${repo}`);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (re.test(repo)) {
|
if (re.test(repo)) {
|
||||||
fetchAndShow(repo);
|
fetchAndShow(repo);
|
||||||
} else {
|
} else {
|
||||||
showMsg('Invalid GitHub repository! Format is <username>/<repo>', 'danger');
|
showMsg(
|
||||||
}
|
'Invalid GitHub repository! Format is <username>/<repo>',
|
||||||
|
'danger'
|
||||||
|
);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateDT( data ) {
|
function updateDT(data) {
|
||||||
// Remove any alerts, if any:
|
// Remove any alerts, if any:
|
||||||
if ( $( '.alert' ) )
|
if ($('.alert')) $('.alert').remove();
|
||||||
$( '.alert' ).remove()
|
|
||||||
|
|
||||||
// Format dataset and redraw DataTable. Use second index for key name
|
// Format dataset and redraw DataTable. Use second index for key name
|
||||||
const forks = []
|
const forks = [];
|
||||||
for ( let fork of data ) {
|
for (let fork of data) {
|
||||||
fork.repoLink = `<a href="https://github.com/${fork.full_name}">Link</a>`
|
fork.repoLink = `<a href="https://github.com/${fork.full_name}">Link</a>`;
|
||||||
fork.ownerName = fork.owner.login
|
fork.ownerName = fork.owner.login;
|
||||||
forks.push( fork )
|
forks.push(fork);
|
||||||
}
|
}
|
||||||
const dataSet = forks.map( fork => window.columnNamesMap.map( colNM => fork[colNM[1]] ) )
|
const dataSet = forks.map(fork =>
|
||||||
window.forkTable.clear().rows.add( dataSet ).draw()
|
window.columnNamesMap.map(colNM => fork[colNM[1]])
|
||||||
|
);
|
||||||
|
window.forkTable
|
||||||
|
.clear()
|
||||||
|
.rows.add(dataSet)
|
||||||
|
.draw();
|
||||||
}
|
}
|
||||||
|
|
||||||
function initDT() {
|
function initDT() {
|
||||||
// Create ordered Object with column name and mapped display name
|
// Create ordered Object with column name and mapped display name
|
||||||
window.columnNamesMap = [
|
window.columnNamesMap = [
|
||||||
// [ 'Repository', 'full_name' ],
|
// [ 'Repository', 'full_name' ],
|
||||||
['Link', 'repoLink'], // custom key
|
['Link', 'repoLink'], // custom key
|
||||||
['Owner', 'ownerName'], // custom key
|
['Owner', 'ownerName'], // custom key
|
||||||
['Name', 'name'],
|
['Name', 'name'],
|
||||||
['Branch', 'default_branch'],
|
['Branch', 'default_branch'],
|
||||||
['Stars', 'stargazers_count'],
|
['Stars', 'stargazers_count'],
|
||||||
['Forks', 'forks'],
|
['Forks', 'forks'],
|
||||||
['Open Issues', 'open_issues_count'],
|
['Open Issues', 'open_issues_count'],
|
||||||
['Size', 'size'],
|
['Size', 'size'],
|
||||||
['Last Push', 'pushed_at'],
|
['Last Push', 'pushed_at'],
|
||||||
]
|
];
|
||||||
|
|
||||||
// Sort by stars:
|
// Sort by stars:
|
||||||
const sortColName = 'Stars'
|
const sortColName = 'Stars';
|
||||||
const sortColumnIdx = window.columnNamesMap.map( pair => pair[0] ).indexOf( sortColName )
|
const sortColumnIdx = window.columnNamesMap
|
||||||
|
.map(pair => pair[0])
|
||||||
|
.indexOf(sortColName);
|
||||||
|
|
||||||
// Use first index for readable column name
|
// Use first index for readable column name
|
||||||
// we use moment's fromNow() if we are rendering for `pushed_at`; better solution welcome
|
// we use moment's fromNow() if we are rendering for `pushed_at`; better solution welcome
|
||||||
window.forkTable = $( '#forkTable' ).DataTable( {
|
window.forkTable = $('#forkTable').DataTable({
|
||||||
columns: window.columnNamesMap.map( colNM => {
|
columns: window.columnNamesMap.map(colNM => {
|
||||||
return {
|
return {
|
||||||
title: colNM[0],
|
title: colNM[0],
|
||||||
render: colNM[1] === 'pushed_at' ? (data, type, _row) => {
|
render:
|
||||||
if (type === 'display') {
|
colNM[1] === 'pushed_at'
|
||||||
return moment(data).fromNow()
|
? (data, type, _row) => {
|
||||||
|
if (type === 'display') {
|
||||||
|
return moment(data).fromNow();
|
||||||
|
}
|
||||||
|
return data;
|
||||||
}
|
}
|
||||||
return data
|
: null,
|
||||||
} : null
|
};
|
||||||
}
|
}),
|
||||||
}),
|
order: [[sortColumnIdx, 'desc']],
|
||||||
'order': [[sortColumnIdx, 'desc']],
|
});
|
||||||
} )
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function fetchAndShow( repo ) {
|
function fetchAndShow(repo) {
|
||||||
|
repo = repo.replace('https://github.com/', '');
|
||||||
repo = repo.replace('https://github.com/', '');
|
repo = repo.replace('http://github.com/', '');
|
||||||
repo = repo.replace('http://github.com/', '');
|
repo = repo.replace('.git', '');
|
||||||
repo = repo.replace('.git', '');
|
|
||||||
|
|
||||||
fetch( `https://api.github.com/repos/${repo}/forks?sort=stargazers&per_page=100` )
|
fetch(
|
||||||
.then( ( response ) => {
|
`https://api.github.com/repos/${repo}/forks?sort=stargazers&per_page=100`
|
||||||
if ( !response.ok )
|
)
|
||||||
throw Error( response.statusText )
|
.then(response => {
|
||||||
return response.json()
|
if (!response.ok) throw Error(response.statusText);
|
||||||
} )
|
return response.json();
|
||||||
.then( ( data ) => {
|
})
|
||||||
console.log( data )
|
.then(data => {
|
||||||
updateDT( data )
|
console.log(data);
|
||||||
} )
|
updateDT(data);
|
||||||
.catch( ( error ) => {
|
})
|
||||||
const msg = error.toString().indexOf( 'Forbidden' ) >= 0 ? 'Error: API Rate Limit Exceeded' : error
|
.catch(error => {
|
||||||
showMsg( `${msg}. Additional info in console`, 'danger' )
|
const msg =
|
||||||
console.error( error )
|
error.toString().indexOf('Forbidden') >= 0
|
||||||
} )
|
? 'Error: API Rate Limit Exceeded'
|
||||||
|
: error;
|
||||||
|
showMsg(`${msg}. Additional info in console`, 'danger');
|
||||||
|
console.error(error);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function showMsg(msg, type) {
|
function showMsg(msg, type) {
|
||||||
let alert_type = 'alert-info';
|
let alert_type = 'alert-info';
|
||||||
|
|
||||||
if (type === 'danger') {
|
if (type === 'danger') {
|
||||||
alert_type = 'alert-danger';
|
alert_type = 'alert-danger';
|
||||||
}
|
}
|
||||||
|
|
||||||
document.getElementById('footer').innerHTML = '';
|
document.getElementById('footer').innerHTML = '';
|
||||||
|
|
||||||
document.getElementById('data-body').innerHTML = `
|
document.getElementById('data-body').innerHTML = `
|
||||||
<div class="alert ${alert_type} alert-dismissible fade show" role="alert">
|
<div class="alert ${alert_type} alert-dismissible fade show" role="alert">
|
||||||
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
|
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
|
||||||
<span aria-hidden="true">×</span>
|
<span aria-hidden="true">×</span>
|
||||||
|
@ -127,7 +142,7 @@ function showMsg(msg, type) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function getRepoFromUrl() {
|
function getRepoFromUrl() {
|
||||||
const urlRepo = location.hash && location.hash.slice(1);
|
const urlRepo = location.hash && location.hash.slice(1);
|
||||||
|
|
||||||
return urlRepo && decodeURIComponent(urlRepo);
|
return urlRepo && decodeURIComponent(urlRepo);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue