Skip to content

Commit

Permalink
chore: linting files to new standard
Browse files Browse the repository at this point in the history
  • Loading branch information
@Essomia
Essomia committed Nov 27, 2024
1 parent 39e2b29 commit 9c5f0a2
Show file tree
Hide file tree
Showing 8 changed files with 169 additions and 235 deletions.
4 changes: 2 additions & 2 deletions src/background.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ chrome.runtime.onInstalled.addListener(({ reason, previousVersion }) => {
* If the extension is installed
*/

if (reason === "install") {
if (reason === 'install') {
// Set the default upon installation
chrome.storage.sync.set({
// General Options
Expand All @@ -34,7 +34,7 @@ chrome.runtime.onInstalled.addListener(({ reason, previousVersion }) => {
* If the extension is updated
*/

if (reason === "update") {
if (reason === 'update') {
// Get the current version
const currentVersion = chrome.runtime.getManifest().version;

Expand Down
22 changes: 11 additions & 11 deletions src/content.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
*/

chrome.storage.sync.get(
["doHideShorts", "doHideWatched", "doFadeByLength", "videoLengthMax", "videoLengthMin"],
['doHideShorts', 'doHideWatched', 'doFadeByLength', 'videoLengthMax', 'videoLengthMin'],
({ doHideShorts, doHideWatched, doFadeByLength, videoLengthMax, videoLengthMin }) => {
/**
* General Options
Expand All @@ -13,13 +13,13 @@ chrome.storage.sync.get(
// Hide watched videos (if the option is enabled)
const hideWatchedVideos = () => {
if (doHideWatched) {
const videoElements = document.querySelectorAll("ytd-rich-item-renderer");
const videoElements = document.querySelectorAll('ytd-rich-item-renderer');

videoElements.forEach((video) => {
const progressBar = video.querySelector("ytd-thumbnail-overlay-resume-playback-renderer");
const progressBar = video.querySelector('ytd-thumbnail-overlay-resume-playback-renderer');

if (progressBar) {
video.style.display = "none";
video.style.display = 'none';
}
});
}
Expand All @@ -28,10 +28,10 @@ chrome.storage.sync.get(
// Hide shorts sections (if the option is enabled)
const hideShortsSections = () => {
if (doHideShorts) {
const shortsSections = document.querySelectorAll("ytd-rich-shelf-renderer[is-shorts]");
const shortsSections = document.querySelectorAll('ytd-rich-shelf-renderer[is-shorts]');

shortsSections.forEach((shorts) => {
shorts.style.display = "none";
shorts.style.display = 'none';
});
}
};
Expand All @@ -43,15 +43,15 @@ chrome.storage.sync.get(
const filterVideos = () => {
if (doFadeByLength) {
// Select all video elements on the YouTube page
const videoElements = document.querySelectorAll("ytd-rich-item-renderer");
const videoElements = document.querySelectorAll('ytd-rich-item-renderer');

videoElements.forEach((video) => {
// Find the element that contains the video duration
const timeElement = video.querySelector("ytd-thumbnail-overlay-time-status-renderer span");
const timeElement = video.querySelector('ytd-thumbnail-overlay-time-status-renderer span');

if (timeElement) {
// Split the duration text into parts (e.g., "12:34" or "1:02:34")
const timeParts = timeElement.textContent.trim().split(":").map(Number);
const timeParts = timeElement.textContent.trim().split(':').map(Number);
let videoMinutes = 0;

// Calculate the video length in minutes
Expand All @@ -65,9 +65,9 @@ chrome.storage.sync.get(

// Set the opacity of the video thumbnail based on the video length
if (videoMinutes < videoLengthMin || videoMinutes > videoLengthMax) {
video.style.opacity = "0.2"; // Reduce opacity if video is outside the filter range
video.style.opacity = '0.2'; // Reduce opacity if video is outside the filter range
} else {
video.style.opacity = "1"; // Set normal opacity otherwise
video.style.opacity = '1'; // Set normal opacity otherwise
}
}
});
Expand Down
4 changes: 2 additions & 2 deletions src/contentCategorize.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@
border-radius: 18px;
border: none;
color: var(--yt-spec-inverted-background);
font-family: "Roboto", "Arial", sans-serif;
font-family: 'Roboto', 'Arial', sans-serif;
font-size: 14px;
font-weight: 500;
}
Expand Down Expand Up @@ -47,7 +47,7 @@
border-radius: 18px;
border: none;
color: var(--yt-spec-inverted-background);
font-family: "Roboto", "Arial", sans-serif;
font-family: 'Roboto', 'Arial', sans-serif;
font-size: 14px;
font-weight: 500;
}
Expand Down
76 changes: 38 additions & 38 deletions src/contentCategorize.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,19 @@
* Constants
*/
const YTB_CHANNEL_PAGE_SELECTOR = ".ytd-page-manager[page-subtype='subscriptions-channels']";

Check failure on line 4 in src/contentCategorize.js

View workflow job for this annotation

GitHub Actions / build 

Strings must use singlequote
const YTB_CHANNEL_BLOCK_SELECTOR = "ytd-channel-renderer";
const YTB_CHANNEL_BLOCK_SELECTOR = 'ytd-channel-renderer';
const YTB_SUBSCRIPTIONS_PAGE_SELECTOR = ".ytd-page-manager[page-subtype='subscriptions']";

Check failure on line 6 in src/contentCategorize.js

View workflow job for this annotation

GitHub Actions / build 

Strings must use singlequote
const YTB_SUBSCRIPTIONS_VIDEO_SELECTOR = "ytd-rich-item-renderer";
const YTB_SUBSCRIPTIONS_VIDEO_SELECTOR = 'ytd-rich-item-renderer';

const CATEGORY_DD_DEFAULT = "Category";
const CLASS_CATEGORY_SELECT = "sptcl-category-select";
const CLASS_CATEGORY_OPTION = "sptcl-category-option";
const CATEGORY_DD_DEFAULT = 'Category';
const CLASS_CATEGORY_SELECT = 'sptcl-category-select';
const CLASS_CATEGORY_OPTION = 'sptcl-category-option';

const CATEGORY_ALL = "All";
const CATEGORY_NOT_ASSIGNED = "Not Assigned";
const CLASS_FILTER_CONTAINER_CHANNEL = "sptcl-channel-filter-container";
const CLASS_FILTER_CONTAINER_SUBSCRIPTION = "sptcl-subscription-filter-container";
const CLASS_FILTER_BUTTON = "sptcl-filter-button";
const CATEGORY_ALL = 'All';
const CATEGORY_NOT_ASSIGNED = 'Not Assigned';
const CLASS_FILTER_CONTAINER_CHANNEL = 'sptcl-channel-filter-container';
const CLASS_FILTER_CONTAINER_SUBSCRIPTION = 'sptcl-subscription-filter-container';
const CLASS_FILTER_BUTTON = 'sptcl-filter-button';

/**
* Get the channel name from the channel block
Expand All @@ -24,12 +24,12 @@ const CLASS_FILTER_BUTTON = "sptcl-filter-button";
*/
function getChannelName(contentEl, isChannelPage = false) {
const channelLink = isChannelPage
? contentEl.querySelector("#main-link.channel-link")
: contentEl.querySelector(".ytd-channel-name > a.yt-formatted-string");
? contentEl.querySelector('#main-link.channel-link')
: contentEl.querySelector('.ytd-channel-name > a.yt-formatted-string');

// get the channel name from the link href, remove the leasding slash, and trim the whitespace, and lowercase the channel name for consistency
const channelNameArr = channelLink?.href?.split("/") || [];
const channelName = channelNameArr[channelNameArr.length - 1]?.trim()?.toLowerCase() || "";
const channelNameArr = channelLink?.href?.split('/') || [];
const channelName = channelNameArr[channelNameArr.length - 1]?.trim()?.toLowerCase() || '';

return channelName;
}
Expand All @@ -42,22 +42,22 @@ function getChannelName(contentEl, isChannelPage = false) {
*/
function renderButtonsFilters(filterContainerEl, categories) {
categories.forEach((category) => {
const filterButtonEl = document.createElement("span");
const filterButtonEl = document.createElement('span');
filterButtonEl.textContent = category;
filterButtonEl.classList.add(CLASS_FILTER_BUTTON);

// Set the default filter to "All" when the page is loaded
if (category === CATEGORY_ALL) {
filterButtonEl.setAttribute("data-active", "true");
filterButtonEl.setAttribute('data-active', 'true');
}

filterButtonEl.addEventListener("click", () => {
filterButtonEl.addEventListener('click', () => {
// Add an attribute data-active="true" to the selected filter
document.querySelectorAll(`.${CLASS_FILTER_BUTTON}`).forEach((btn) => {
btn.removeAttribute("data-active");
btn.removeAttribute('data-active');
});

filterButtonEl.setAttribute("data-active", "true");
filterButtonEl.setAttribute('data-active', 'true');
});

filterContainerEl.appendChild(filterButtonEl);
Expand All @@ -81,16 +81,16 @@ function applyFilterToContent(contentArr, category, channelCategoryAssigned, for
if (category === CATEGORY_NOT_ASSIGNED) {
// Show the content only if the channel is not assigned to any category
if (!channelCategoryAssigned[channelName]) {
contentEl.style.display = "";
contentEl.style.display = '';
} else {
contentEl.style.display = "none";
contentEl.style.display = 'none';
}
} else {
// If the category is assigned to the channel, show the content
if (channelCategoryAssigned[channelName] === category) {
contentEl.style.display = "";
contentEl.style.display = '';
} else {
contentEl.style.display = "none";
contentEl.style.display = 'none';
}
}
});
Expand All @@ -115,7 +115,7 @@ function observeSubscriptionsPage(subscriptionsPageContainer, channelCategoryAss

if (category === CATEGORY_ALL) {
contentArr.forEach((video) => {
video.style.display = "";
video.style.display = '';
});
} else {
applyFilterToContent(contentArr, category, channelCategoryAssigned, forChannelPage);
Expand All @@ -127,7 +127,7 @@ function observeSubscriptionsPage(subscriptionsPageContainer, channelCategoryAss
}

chrome.storage.sync.get(
["doCategorizeSubscription", "categories", "channelCategoryAssigned"],
['doCategorizeSubscription', 'categories', 'channelCategoryAssigned'],
({ doCategorizeSubscription, categories, channelCategoryAssigned }) => {
/**
* Channel Page: Dropdown for Category Assignment
Expand All @@ -143,7 +143,7 @@ chrome.storage.sync.get(
// Add a dropdown for each channel to select categories
channelBlockElArray.forEach((channelBlockEl) => {
// Get DOM elements
const actionsContainerEl = channelBlockEl.querySelector("#buttons");
const actionsContainerEl = channelBlockEl.querySelector('#buttons');

// If the dropdown already exists, skip
if (actionsContainerEl.querySelectorAll(`.${CLASS_CATEGORY_SELECT}`).length > 0) return;
Expand All @@ -152,19 +152,19 @@ chrome.storage.sync.get(
const channelName = getChannelName(channelBlockEl, true);

// Create the category dropdown
const selectEl = document.createElement("select");
const selectEl = document.createElement('select');
selectEl.classList.add(CLASS_CATEGORY_SELECT);

// Create a default option
const defaultOptionEl = document.createElement("option");
const defaultOptionEl = document.createElement('option');
defaultOptionEl.text = CATEGORY_DD_DEFAULT;
defaultOptionEl.classList.add(CLASS_CATEGORY_OPTION);

selectEl.appendChild(defaultOptionEl);

// Create each categories as an option
categories.forEach((category) => {
const optionEl = document.createElement("option");
const optionEl = document.createElement('option');
optionEl.text = category;
optionEl.value = category;
optionEl.classList.add(CLASS_CATEGORY_OPTION);
Expand All @@ -178,7 +178,7 @@ chrome.storage.sync.get(
});

// Add event listener to save the selected category
selectEl.addEventListener("change", () => {
selectEl.addEventListener('change', () => {
if (selectEl.value === CATEGORY_DD_DEFAULT) {
// Remove the category from the assigned list if the default option is selected
delete channelCategoryAssigned[channelName];
Expand Down Expand Up @@ -207,7 +207,7 @@ chrome.storage.sync.get(
// If filters do not exist, do create them...
if (!channelPageEl.querySelectorAll(`.${CLASS_FILTER_CONTAINER_CHANNEL}`).length) {
// Create the filters container
const filterContainerEl = document.createElement("div");
const filterContainerEl = document.createElement('div');
filterContainerEl.classList.add(CLASS_FILTER_CONTAINER_CHANNEL);

// Create filter buttons
Expand All @@ -221,14 +221,14 @@ chrome.storage.sync.get(
const filterButtonsArr = channelPageEl.querySelectorAll(`.${CLASS_FILTER_BUTTON}`);

filterButtonsArr.forEach((filterButtonEl) => {
filterButtonEl.addEventListener("click", () => {
filterButtonEl.addEventListener('click', () => {
const contentArr = document.querySelectorAll(YTB_CHANNEL_BLOCK_SELECTOR);
const category = filterButtonEl.textContent;
const forChannelPage = true;

if (category === CATEGORY_ALL) {
contentArr.forEach((channel) => {
channel.style.display = "";
channel.style.display = '';
});
} else {
applyFilterToContent(contentArr, category, channelCategoryAssigned, forChannelPage);
Expand All @@ -248,7 +248,7 @@ chrome.storage.sync.get(
// If filters do not exist, do create them...
if (!subscriptionsPageContainer.querySelectorAll(`.${CLASS_FILTER_CONTAINER_SUBSCRIPTION}`).length) {
// Create the filters container
const filterContainerEl = document.createElement("div");
const filterContainerEl = document.createElement('div');
filterContainerEl.classList.add(CLASS_FILTER_CONTAINER_SUBSCRIPTION);

// Create filter buttons
Expand All @@ -262,14 +262,14 @@ chrome.storage.sync.get(
const filterButtonsArr = subscriptionsPageContainer.querySelectorAll(`.${CLASS_FILTER_BUTTON}`);

filterButtonsArr.forEach((filterButtonEl) => {
filterButtonEl.addEventListener("click", () => {
filterButtonEl.addEventListener('click', () => {
const contentArr = document.querySelectorAll(YTB_SUBSCRIPTIONS_VIDEO_SELECTOR);
const category = filterButtonEl.textContent;
const forChannelPage = false;

if (category === CATEGORY_ALL) {
contentArr.forEach((video) => {
video.style.display = "";
video.style.display = '';
});
} else {
applyFilterToContent(contentArr, category, channelCategoryAssigned, forChannelPage);
Expand All @@ -287,12 +287,12 @@ chrome.storage.sync.get(

if (doCategorizeSubscription) {
setInterval(() => {
if (window.location.pathname === "/feed/channels") {
if (window.location.pathname === '/feed/channels') {
renderChannelsPageCategoryDropdown();
renderChannelsPageFilters();
}

if (window.location.pathname === "/feed/subscriptions") {
if (window.location.pathname === '/feed/subscriptions') {
renderSubscriptionsPageFilters();
}
}, 3000);
Expand Down
52 changes: 26 additions & 26 deletions src/manifest.json
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
{
"manifest_version": 3,
"name": "SimpleTube - YouTube Filters & Subscriptions Manager",
"version": "1.3.0",
"description": "Filters for YouTube videos based on video length and subscriptions manager",
"permissions": ["storage", "activeTab", "scripting"],
"icons": {
"16": "icons/icon16.png",
"32": "icons/icon32.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
"manifest_version": 3,
"name": "SimpleTube - YouTube Filters & Subscriptions Manager",
"version": "1.3.0",
"description": "Filters for YouTube videos based on video length and subscriptions manager",
"permissions": ["storage", "activeTab", "scripting"],
"icons": {
"16": "icons/icon16.png",
"32": "icons/icon32.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
},
"background": {
"service_worker": "background.js"
},
"options_page": "options.html",
"content_scripts": [
{
"matches": ["*://www.youtube.com/*"],
"js": ["content.js"]
},
"background": {
"service_worker": "background.js"
},
"options_page": "options.html",
"content_scripts": [
{
"matches": ["*://www.youtube.com/*"],
"js": ["content.js"]
},
{
"matches": ["*://www.youtube.com/*"],
"js": ["contentCategorize.js"],
"css": ["contentCategorize.css"],
"run_at": "document_idle"
}
]
{
"matches": ["*://www.youtube.com/*"],
"js": ["contentCategorize.js"],
"css": ["contentCategorize.css"],
"run_at": "document_idle"
}
]
}
Loading

0 comments on commit 9c5f0a2

Please sign in to comment.