refactor: improve code structure and readability in scripts.js

refactor the code structure - use a loop to iterate through the folderPaths fetched from the folders.json, this way if there are new generators you just need to add them to the folders.json, and make sure the orders are same as the one in html
This commit is contained in:
lifeadventurer
2023-11-24 23:35:57 +08:00
parent 6f5b58ecfa
commit 66d4c7c1fd

View File

@@ -1,56 +1,60 @@
// fetch all folder paths of the generators from `folders.json`
let folderPaths = []
async function fetch_folders(){
await fetch('./folders.json')
.then(response => response.json())
.then(data => {
folderPaths = data.folder_paths;
// console.log(folderPaths);
})
}
const repoOwner = 'LifeAdventurer';
const repoName = 'generators';
const folderPath_1 = 'fortune_generator';
const folderPath_2 = 'quote_generator';
const apiUrl_1 = `https://api.github.com/repos/${repoOwner}/${repoName}/commits?path=${folderPath_1}`;
const apiUrl_2 = `https://api.github.com/repos/${repoOwner}/${repoName}/commits?path=${folderPath_2}`;
let timeSinceLastUpdate_1;
fetch(apiUrl_1)
.then(response => response.json())
.then(data => {
let lastCommit = data[0].commit.author.date;
const commitTimeStamp = new Date(lastCommit).getTime() / 1000;
const currentTimeStamp = Math.floor(new Date().getTime() / 1000);
const timeDifference = currentTimeStamp - commitTimeStamp;
timeSinceLastUpdate_1 = formatTimeDifference(timeDifference);
$('#last-update-1').html(`Last updated ${timeSinceLastUpdate_1} ago`)
})
.catch(error => console.error('Error fetching data:', error));
async function generator_card_footer(){
await fetch_folders()
// console.log(folderPaths);
for(let i = 0; i < folderPaths.length; i++){
let folderPath = folderPaths[i];
const apiUrl = `https://api.github.com/repos/${repoOwner}/${repoName}/commits?path=${folderPath}`;
console.log(apiUrl);
fetch(apiUrl)
.then(response => response.json())
.then(data => {
// the latest commit will be at the top of the list
let lastCommit = data[0].commit.author.date;
const commitTimeStamp = new Date(lastCommit).getTime() / 1000;
const currentTimeStamp = Math.floor(new Date().getTime() / 1000);
const timeDifference = currentTimeStamp - commitTimeStamp;
// console.log(timeSinceLastUpdate);
$(`#last-update-${i + 1}`).html(`Last updated ${formatTimeDifference(timeDifference)} ago`)
})
.catch(error => console.error('Error fetching data:', error));
}
}
let timeSinceLastUpdate_2;
fetch(apiUrl_2)
.then(response => response.json())
.then(data => {
let lastCommit = data[0].commit.author.date;
const commitTimeStamp = new Date(lastCommit).getTime() / 1000;
const currentTimeStamp = Math.floor(new Date().getTime() / 1000);
const timeDifference = currentTimeStamp - commitTimeStamp;
timeSinceLastUpdate_2 = formatTimeDifference(timeDifference);
$('#last-update-2').html(`Last updated ${timeSinceLastUpdate_2} ago`)
})
.catch(error => console.error('Error fetching data:', error));
function formatTimeDifference(seconds){
// determine whether it is seconds, minutes, hours, or days ago
function formatTimeDifference(seconds) {
const minutes = Math.floor(seconds / 60);
const hours = Math.floor(minutes / 60);
const days = Math.floor(hours / 24);
if(days > 0){
return `${days} day${days > 1 ? 's' : ''}`;
}
}
else if(hours > 0){
return `${hours} hour${hours > 1 ? 's' : ''}`;
}
}
else if(minutes > 0){
return `${minutes} minute${minutes > 1 ? 's' : ''}`;
}
}
else{
return `${seconds} second${seconds > 1 ? 's' : ''}`;
}
}
// $('#last-update-2').html(`Last updated ${timeSinceLastUpdate} ago`)
generator_card_footer()