1
0
Fork 0

Further polish hashtag stuffing logic

This commit is contained in:
Lim Chee Aun 2023-08-20 10:17:56 +08:00
parent a325630c20
commit ccd79e5348
2 changed files with 43 additions and 27 deletions

View file

@ -78,9 +78,11 @@ Everything is designed and engineered following my taste and vision. This is a p
![Hashtag stuffing collapsing](readme-assets/hashtag-stuffing-collapsing.jpg) ![Hashtag stuffing collapsing](readme-assets/hashtag-stuffing-collapsing.jpg)
- Any paragraphs, except the first one, with more than 3 hashtags will be collapsed. - First paragraph of post content with more than 3 hashtags will be collapsed to max 3 lines.
- Subsequent paragraphs after first paragraph with more than 3 hashtags will be collapsed to 1 line.
- Adjacent paragraphs with more than 1 hashtag after collapsed paragraphs will be collapsed to 1 line.
- If there are text around or between the hashtags, they will not be collapsed. - If there are text around or between the hashtags, they will not be collapsed.
- Collapsed hashtags will be a single line with `...` at the end. - Collapsed hashtags will be appended with `...` at the end.
- They are also slightly faded out to reduce visual noise. - They are also slightly faded out to reduce visual noise.
- Opening the post view will reveal the hashtags uncollapsed. - Opening the post view will reveal the hashtags uncollapsed.

View file

@ -174,35 +174,49 @@ function enhanceContent(content, opts = {}) {
// ================ // ================
// Get the <p> that contains a lot of hashtags, add a class to it // Get the <p> that contains a lot of hashtags, add a class to it
if (enhancedContent.indexOf('#') !== -1) { if (enhancedContent.indexOf('#') !== -1) {
const hashtagStuffedParagraph = Array.from(dom.querySelectorAll('p')).find( let prevIndex = null;
(p) => { const hashtagStuffedParagraphs = Array.from(
let hashtagCount = 0; dom.querySelectorAll('p'),
for (let i = 0; i < p.childNodes.length; i++) { ).filter((p, index) => {
const node = p.childNodes[i]; let hashtagCount = 0;
for (let i = 0; i < p.childNodes.length; i++) {
const node = p.childNodes[i];
if (node.nodeType === Node.TEXT_NODE) { if (node.nodeType === Node.TEXT_NODE) {
const text = node.textContent.trim(); const text = node.textContent.trim();
if (text !== '') { if (text !== '') {
return false;
}
} else if (node.tagName === 'A') {
const linkText = node.textContent.trim();
if (!linkText || !linkText.startsWith('#')) {
return false;
} else {
hashtagCount++;
}
} else {
return false; return false;
} }
} else if (node.tagName === 'BR') {
// Ignore <br />
} else if (node.tagName === 'A') {
const linkText = node.textContent.trim();
if (!linkText || !linkText.startsWith('#')) {
return false;
} else {
hashtagCount++;
}
} else {
return false;
} }
// Only consider "stuffing" if there are more than 3 hashtags }
return hashtagCount > 3; // Only consider "stuffing" if:
}, // - there are more than 3 hashtags
); // - there are more than 1 hashtag in adjacent paragraphs
if (hashtagStuffedParagraph) { if (hashtagCount > 3) {
hashtagStuffedParagraph.classList.add('hashtag-stuffing'); prevIndex = index;
hashtagStuffedParagraph.title = hashtagStuffedParagraph.innerText; return true;
}
if (hashtagCount > 1 && prevIndex && index === prevIndex + 1) {
prevIndex = index;
return true;
}
});
if (hashtagStuffedParagraphs?.length) {
hashtagStuffedParagraphs.forEach((p) => {
p.classList.add('hashtag-stuffing');
p.title = p.innerText;
});
} }
} }