Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Timeago helper function #780

Merged
merged 9 commits into from
Jul 5, 2023
Merged

Timeago helper function #780

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
b8e8522
Create timeago element helper
eritbh Jul 4, 2023
e87d106
Use relative time helper in modnotes
eritbh Jul 4, 2023
d85bd91
Use relative time helper in usernotes
eritbh Jul 4, 2023
617a301
Use helper in queue tools
eritbh Jul 4, 2023
3b017c9
Use helper in modbutton
eritbh Jul 4, 2023
7f7aae4
Use helper in profile
eritbh Jul 4, 2023
74e6566
Use helper in tbui submission/comment display
eritbh Jul 4, 2023
bce2a18
Re-add whitespace in comment taglines
eritbh Jul 4, 2023
7120eb0
Don't call timeago manually when using UI builders
eritbh Jul 4, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 0 additions & 2 deletions extension/data/modules/comment.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -450,7 +450,6 @@ function init ({
const msg = `Building comment ${count}/${idListing.length}`;
TBui.textFeedback(msg, TBui.FEEDBACK_NEUTRAL);
const $comment = TBui.makeSingleComment(flatListing[value], commentOptions);
$comment.find('time.timeago').timeago();
$htmlCommentView.append($comment);
}).then(() => {
$flatSearchCount.text(count);
Expand Down Expand Up @@ -549,7 +548,6 @@ function init ({
display: 'block',
});
TBui.tbRedditEvent($comments);
$('time.timeago').timeago();
$comments.find(`.tb-thing[data-comment-id="${commentID}"] > .tb-comment-entry`).css('background-color', '#fff8d5');
});
});
Expand Down
3 changes: 0 additions & 3 deletions extension/data/modules/devtools.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,12 +153,10 @@ export default new Module({
const $comments = TBui.makeCommentThread(data[1].data.children, commentOptions);
$siteTable.append($comments);
TBui.tbRedditEvent($comments);
$('time.timeago').timeago();
} else {
const $comment = TBui.makeSingleComment(data[1].data.children[0], commentOptions);
$siteTable.append($comment);
TBui.tbRedditEvent($comment);
$('time.timeago').timeago();
}
});

Expand All @@ -172,7 +170,6 @@ export default new Module({
if (entry.kind === 't3') {
const $submission = TBui.makeSubmissionEntry(entry);
$siteTable.append($submission);
$('time.timeago').timeago();
}
}).then(() => {
setTimeout(() => {
Expand Down
2 changes: 1 addition & 1 deletion extension/data/modules/modbutton.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -348,7 +348,7 @@ function init ({savedSubs, rememberLastAction, globalButton, excludeGlobal}) {
const timestamp = new Date(banInfo.date * 1000); // seconds to milliseconds

$popup.find('.current-sub').append($('<div class="already-banned">banned by <a href="#"></a> </div>'));
$popup.find('.current-sub .already-banned').append($('<time>').attr('datetime', timestamp.toISOString()).timeago());
$popup.find('.current-sub .already-banned').append(TBui.relativeTime(timestamp));

$popup.find('select.mod-action option[data-api=unfriend][data-action=banned]').attr('selected', 'selected');
$popup.find('.ban-note').val(banInfo.note);
Expand Down
16 changes: 5 additions & 11 deletions extension/data/modules/modnotes.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
icons,
pagerForItems,
popup,
relativeTime,
textFeedback,
} from '../tbui.js';
import TBListener from '../tblistener.js';
Expand Down Expand Up @@ -445,18 +446,17 @@ function generateNoteTableRow (note) {
/u/${escapeHTML(mod)}
</a>
<br>
<small>
<time datetime="${escapeHTML(createdAt.toISOString())}">
${escapeHTML(createdAt.toLocaleString())}
</time>
</small>
<small></small>
</td>
<td>
${typeNames[note.type]}
</td>
</tr>
`);

// Add relative timestamp element
$noteRow.find('small').append(relativeTime(createdAt));

// Build the note details based on what sort of information is present
const $noteDetails = $('<td>');

Expand Down Expand Up @@ -511,12 +511,6 @@ function generateNoteTableRow (note) {
$noteRow.find('time').wrap(`<a href="${escapeHTML(contextURL)}">`);
});

// HACK: timeago only works on elements added to the DOM, so we run it after
// a tick, when the caller has added the constructed row to the page
Promise.resolve().then(() => {
$noteRow.find('time').timeago();
});

return $noteRow;
}

Expand Down
9 changes: 3 additions & 6 deletions extension/data/modules/profile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -164,7 +164,6 @@ export default new Module({
$comment.find('.md').highlight(entry.highlight, '', true);
}
$siteTable.append($comment);
$('time.timeago').timeago();
}

// Submission
Expand All @@ -174,7 +173,6 @@ export default new Module({
$submission.find('.tb-title, .md').highlight(entry.highlight, '', true);
}
$siteTable.append($submission);
$('time.timeago').timeago();
}
}).then(() => {
// More items available on a next page. Add load more element
Expand Down Expand Up @@ -326,8 +324,7 @@ export default new Module({
commentKarma = data.data.comment_karma,
displayName = data.data.subreddit.title,
publicDescription = data.data.subreddit.public_description;
const readableCreatedUTC = TBHelpers.timeConverterRead(userCreated),
createdTimeAgo = new Date(userCreated * 1000).toISOString();
const createdAt = new Date(userCreated * 1000).toISOString();

const $sidebar = $(`<div class="tb-profile-sidebar">
${userThumbnail ? `<img src="${userThumbnail}" class="tb-user-thumbnail">` : ''}
Expand All @@ -336,7 +333,7 @@ export default new Module({
${displayName ? `<li>Display name: ${displayName}</li>` : ''}
<li>Link karma: ${linkKarma}</li>
<li>Comment karma: ${commentKarma}</li>
<li>Joined <time title="${readableCreatedUTC}" datetime="${createdTimeAgo}" class="tb-live-timestamp timeago">${createdTimeAgo}</time></li>
<li class="tb-user-detail-join-date">Joined </li>
<li>${verifiedMail ? 'Verified mail' : 'No verified mail'}</li>
</ul>
${publicDescription ? `
Expand All @@ -345,8 +342,8 @@ export default new Module({
</div>
` : ''}
</div>`);
$sidebar.find('tb-user-detail-join-date').append(TBui.relativeTime(createdAt));
$tabWrapper.after($sidebar);
$sidebar.find('time.timeago').timeago();

addModSubsToSidebar(user, $sidebar);
}).catch(error => {
Expand Down
17 changes: 10 additions & 7 deletions extension/data/modules/queuetools.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1350,23 +1350,26 @@ function init (options) {
const action = value.action;
const details = value.details;
const description = value.description ? ` : ${value.description}` : '';
const createdUTC = TBHelpers.timeConverterRead(value.created_utc);
const createdTimeAgo = new Date(value.created_utc * 1000).toISOString();
const createdAt = new Date(value.created_utc * 1000);

const actionHTML = `
const $actionRow = $(`
<tr>
<td>${mod}</td>
<td>${action}</td>
<td>${details}${description}</td>
<td><time title="${createdUTC}" datetime="${createdTimeAgo}" class="live-timestamp timeago">${createdTimeAgo}</time></td>
<td></td>
</tr>
`;
$actionTable.find('.tb-action-table').append(actionHTML);
`);

const $actionTime = TBui.relativeTime(createdAt);
$actionTime.addClass('live-timestamp');
$actionRow.find('td:last-child').append($actionTime);

$actionTable.find('.tb-action-table').append($actionRow);
});

requestAnimationFrame(() => {
$target.append($actionTable);
$actionTable.find('time.timeago').timeago();
});
}
});
Expand Down
35 changes: 11 additions & 24 deletions extension/data/modules/usernotes.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -446,22 +446,16 @@ function startUsernotes ({maxChars, showDate, onlyshowInhover}) {
date = new Date(note.time);

// Construct some elements separately
let noteTime = `
<time
class="utagger-date timeago"
id="utagger-date-${i}"
datetime="${TBHelpers.escapeHTML(date.toISOString())}"
>
${TBHelpers.escapeHTML(date.toLocaleString())}
</time>
`;
let $noteTime = TBui.relativeTime(date);
$noteTime.addClass('utagger-date');
$noteTime.id = `utagger-date-${i}`;

if (note.link) {
let noteLink = note.link;
if (TBCore.isNewModmail && !noteLink.startsWith('https://')) {
noteLink = `https://www.reddit.com${noteLink}`;
}
noteTime = `<a href="${TBHelpers.escapeHTML(noteLink)}">${noteTime}</a>`;
$noteTime = $(`<a href="${TBHelpers.escapeHTML(noteLink)}">`).append($noteTime);
}

let typeSpan = '';
Expand All @@ -470,11 +464,10 @@ function startUsernotes ({maxChars, showDate, onlyshowInhover}) {
}

// Add note to list
$noteList.append(`
const $noteRow = $(`
<tr class="utagger-note">
<td class="utagger-notes-td1">
<div class="utagger-mod">${note.mod}</div>
${noteTime}
</td>
<td class="utagger-notes-td2">
${typeSpan}
Expand All @@ -483,10 +476,10 @@ function startUsernotes ({maxChars, showDate, onlyshowInhover}) {
<td class="utagger-notes-td3"><i class="utagger-remove-note tb-icons tb-icons-negative" data-note-id="${noteId}">${TBui.icons.delete}</i></td>
</tr>
`);
});
$noteRow.find('td:first-child').append($noteTime);

// Convert to relative dates once the element is added to DOM
$popup.find('time.timeago').timeago();
$noteList.append($noteRow);
});
} else {
// No notes on user
$popup.find('#utagger-user-note-input').focus();
Expand Down Expand Up @@ -1028,9 +1021,6 @@ function startUsernotesManager ({unManagerLink}) {
Object.entries(user.notes).forEach(([key, val]) => {
const color = _findSubredditColor(colors, val.type);

const timeISO = new Date(val.time).toISOString(),
timeHuman = TBHelpers.timeConverterRead(val.time / 1000);

const $note = $(`
<div class="tb-un-note-details">
<a class="tb-un-notedelete tb-icons tb-icons-negative" data-note="${key}" data-user="${user.name}" href="javascript:;">${TBui.icons.delete}</a>
Expand All @@ -1041,21 +1031,18 @@ function startUsernotesManager ({unManagerLink}) {
<span>-</span>
<span class="mod">by /u/${val.mod}</span>
<span>-</span>
<time class="live-timestamp timeago" datetime="${timeISO}" title="${timeHuman}">${timeISO}</time>
</div>
`);
const noteTime = TBui.relativeTime(new Date(val.time));
noteTime.classList.add('live-timestamp');
$note.append(noteTime);

if (color.key === 'none') {
$note.find('.note-type').hide();
}
$userNotes.append($note);
});

// Set relative times on the notes once the content is added to DOM
Promise.resolve().then(() => {
$userContent.find('time.timeago').timeago();
});

return $userContent;
}

Expand Down
Loading