Finally fixed the reason the sorting didn't work properly. Also changed font-family back to standard monospacing, formatted timefields and name.

This commit is contained in:
maste9 2022-02-15 13:48:19 +01:00
parent 70166ac86c
commit 9779fd7489
1 changed files with 23 additions and 12 deletions

View File

@ -13,11 +13,8 @@
</header> </header>
<main id="comments"> <main id="comments">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="fontawesome/css/all.css"> <link rel="stylesheet" href="fontawesome/css/all.css">
<link rel="stylesheet" href="style.css?v=1.11"> <link rel="stylesheet" href="style.css?v=1.18">
</main> </main>
@ -30,7 +27,7 @@
function buildCommentTree(statusID){ function buildCommentTree(statusID){
const target = document.querySelector('#comments'); const target = document.querySelector('#comments');
buildArticle(target, statusID); buildStatus(target, statusID);
buildDescendants(target, statusID); buildDescendants(target, statusID);
} }
@ -42,9 +39,8 @@
} }
async function buildArticle(target, statusID) { async function buildArticle(target, mastopost) {
const url = buildStatusURL(statusID);
const mastopost = await getJSONObject(url);
const link = document.createElement('a'); const link = document.createElement('a');
link.href = mastopost.url; link.href = mastopost.url;
const article = document.createElement('article'); const article = document.createElement('article');
@ -58,17 +54,28 @@
} }
async function buildStatus(target, statusID) {
const url = buildStatusURL(statusID);
const mastopost = await getJSONObject(url);
buildArticle(target, mastopost);
}
async function buildDescendants(target, statusID){ async function buildDescendants(target, statusID){
const url = buildStatusURL(statusID); const url = buildStatusURL(statusID);
const contextURL = url+'/context'; const contextURL = url+'/context';
const context = await getJSONObject(contextURL); const context = await getJSONObject(contextURL);
const sorted_descendants = context.descendants.sort( const sorted_descendants = context.descendants.sort(
function (a, b) { function (a, b) {
return a.created_at - b.created_at; aDate = new Date(a.created_at).getTime();
bDate = new Date(b.created_at).getTime();
diff = aDate - bDate;
return diff;
}); });
for (const descendant of sorted_descendants) { for (const descendant of sorted_descendants) {
buildArticle(target, descendant.id); buildArticle(target, descendant);
} }
} }
@ -103,8 +110,12 @@
myDate = new Date(obj.account['created_at']); myDate = new Date(obj.account['created_at']);
aside.appendChild(myImg); aside.appendChild(myImg);
const myP = document.createElement('hgroup'); const myH = document.createElement('hgroup');
myP.innerHTML = `<h1>${obj.account['display_name']}</h1> <h2>(<a href="${obj.account.url}">${obj.account['username']}</a>)</h2><div class="fa-regular fa-clock"></div> <time datetime="${obj.account['created_at']}">${myDate.toLocaleDateString()}</time>`; const myP = document.createElement('div');
myH.innerHTML = `<h1>${obj.account['display_name']}</h1> <h2>(<a href="${obj.account.url}">${obj.account['username']}</a>)</h2>`;
myP.innerHTML = `<time datetime="${obj.account['created_at']}">since ${myDate.toLocaleDateString()}</time>`;
aside.appendChild(myH);
aside.appendChild(myP); aside.appendChild(myP);
item.appendChild(aside); item.appendChild(aside);