lightbeam24 / customtube Goto Github PK

Hello, this is not an issue, but a question. It would be possible to tweak/change the YouTube player's CSS to have an old Adobe flash player-like controls in 2012 layout?

NO! I'm NOT saying, that “restore the Adobe flash plug-in!”, I'm saying only Adobe flash player-like video player controls.

Thank you for understanding!

Screenshot with old Adobe flash player-like player controls:

Would be really cool! :)

Some icons use the current (2023) style, others use the selected one.

Layout: 2019
Version: 1.0.4.4

Problem description:

The sidebar sometimes won't instantly disappear if I switch from YouTube home page to any channel (In this case the “Andrej Danko” channel).

Other details:

• Browser version: Firefox v113.0.2
• YouTube site zoom percentage: 100%
• YouTube layout: 2012 layout.
• OS version: Windows 11 22621.1778
• OS architecture: 64-bit
• Browser architecture: 64-bit
• CPU: AMD A10-7860K
• RAM: 16,0GB DDR3
• Motherboard: MSI A88XM-E35 V2
• Graphics: 1024MB ATI AMD Radeon R7

Screenshots & Videos:

See it yourself from this short video:
https://www.mediafire.com/file/sa9vc089hzjxjdj/The_sidebar_sometimes_won%2527t_disappear_if_switching_from_YouTube_home_page_to_channel.mp4/file

Affects all layouts. Might be something langauge related.

Something like YouTube Redux has.

For some reason on the view counter's place this text appearing: Song 1 of 2.
This is the second time I encountered this bug. After refreshing the page, or switching to another video, it goes back to normal.

When trying to open the description box under videos, the "Show More" button often doesn't do anything. Refreshing the page fixes the problem. I tested with every layout and all of them have this issue (except the disabled option).

thats all (i think)

It doesn't work on any of the custom layouts.

It only works when the "Disabled (Use Current YouTube Layout)" option is selected.

Problem description:

• The Subscriber Groups sidebar section (with PocketTube extension installed) is unclickable, which means, that it is inaccessible.
• Also the buttons in PocketTube are greyed out.
• The “Deck” button is though clickable, but greyed out too.
• UPDATE 19:02 (7:02 PM): The blue tick mark/check mark in the video description from PocketTube is misaligned in some (maybe all (I've not tested every layout)) layouts.

Expected results:

• The Subscriber Groups in the sidebar should be accessible.
• The buttons in PocketTube should NOT be greyed out!
• And for “Deck” button, then it shouldn't have an icon in 2013 layout, and it should have smaller icon in 2014, '15, '16, '17 layouts, and the tooltip/title of that button should be aligned correctly in every of layouts.

Other details:

• Browser version: Firefox v113.0.2
• YouTube site zoom percentage: 100%
• OS version: Windows 11 22621.1778
• OS architecture: 64-bit
• Browser architecture: 64-bit
• CPU: AMD A10-7860K
• RAM: 16,0GB DDR3
• Motherboard: MSI A88XM-E35 V2
• Graphics: 1024MB ATI AMD Radeon R7

Screenshots:

• SCREENSHOT NOTE: “Skupiny Odberov” means “Subscriber Groups”.
• WARNING: Inaccurate accessibility due to black arrows icons, black text & dark grey background in this screenshot!

Hey,

I read the other "issues" and it helped learn more about the project. Big respect to you lightbeam24 for making this.

I noted something odd,

I don't think that button is supposed to be up there with the logo, is it?

Apart from that - great work dude. Is there any way to support the project monetarily? Anything that allows me to remember my childhood in the modern age is priceless to me! But this does seem like something that might need constant maintenance, so best of luck to you! If the project is still around in 3, 6, 12 months from now, and still being worked on, I would be amazed and thankful.

The surprising thing to me is the sheer number of options you've gone for - one year is not enough, huh? Hey what if you could take "return youtube dislike" data, combined with real like data use it to visually represent dislikes as 5 stars, like really old youtube - 50 likes 50 dislikes could be 2.5 stars, 100 likes 50 dislikes could be 3.3333 stars, etc. I am just messing with you lol but having written that just now I like the idea myself.

everything is all sorts of mixed together

Problem description:

• In some languages (In my case Slovak/Slovenčina) in comments the reply button (“Reply” is “Odpovedať” in Slovak language) overlaps the like button.
• Also the “Show less” line (in video description) is overlapping the video description.

Expected results:

• The reply button shouldn't overlap the like button in comments in Slovak (Slovenčina) language, nor in any other language.
• The “Show less” line shouldn't overlap the video description.

Other details:

• Browser version: Firefox v113.0.2
• YouTube site zoom percentage: 100%
• YouTube layout: 2012 layout.
• OS version: Windows 11 22621.1778
• OS architecture: 64-bit
• Browser architecture: 64-bit
• CPU: AMD A10-7860K
• RAM: 16,0GB DDR3
• Motherboard: MSI A88XM-E35 V2
• Graphics: 1024MB ATI AMD Radeon R7

Screenshots:

• I didn't click on anything (Only to stop video), this page is as is (untouched).
  

I'm stuck on the 2017 layout even after reinstalling the extension and changing the style

ouch!

Problem description:

Hello, I want to say, that the Manifest v2 is slowly being outdated, so it would be good if you update this extension to Manifest v3.

When using anything other than "Use current YouTube layout", the topbar does not become black in Cinema mode. The icons on the topbar still change color to white though, which makes them invisible.

Screenshot of how it looks:

And how it should look loke:

(Very nice addon btw, I'll likely keep using it until Google inevitably breaks it)

Clicking on the video pauses after a couple seconds of delay, pressing the button pauses instantly and pressing space/k pauses instantly but there is a delay to when the pause icon appears on screen.

This doesn't happen on the 2017 layout but that layout looks very strange with dark mode enabled and I'd prefer to use the polymer layout.

I like the extension so far, but there are some features I miss. One of them being the option to choose a preferred video player size. The current video player in my opinion is too small. I know if I turn off the "Force consistent video size" option, then the video player is reverted to the default YouTube size, but that's too big for my taste lol. Also the video player won't keep the 16:9 aspect ratio that way.

When I visit the YouTube homepage, it either moves rapidly up and down, or the top row of videos is slightly obscured by the bar that lets you sort by different recommended categories. This seems to be happening on every layout after 2013.

Hi!!
Can you add the Watch11 classic layout which was a watchpage layout that youtube used from June 2021 up until May 2022 here are the different versions shown in this video:https://m.youtube.com/watch?v=84eafpC16XQ

Note: Betas are discontinued (for now), please use the Stable version.

This issue will contain all the fixes that CustomTube Stable has gotten, but CustomTube Beta hasn't. You can use this CSS by putting it into a userstyle in the Stylus extension.

Important: These fixes are made for CustomTube V1.2.0 Beta 3. The Beta version does not update, so make sure to download the newest Beta if you don't have it.

There are currently no fixes that the Beta version hasn't gotten.

Actual screenshots: 2019 video screen, 2016 video screen, 2017 home screen, 2013 video screen, 2012 video screen.

Missing screenshots: 2019 home screen, 2016 home screen, 2017 video screen, 2013 home screen, 2012 home screen.

the button can't seem to fit the text or icon in

• Are you planning to implement the 2005, 2006, 2007, 2008, 2009, 2010, and 2011 layouts?
• Maybe the 2005, and 2006 would be harder to implement (Because of lack of archiving), but 2007+ would be easier, I think.

I guess that in July 12, YouTube moved the Shorts from https://www.youtube.com/feed/subscriptions to a separate bar, which points to https://www.youtube.com/feed/subscriptions/shorts, but if you try to access that link directly, it's empty.

Enabling the extension, the new separate bar is gone and you don't have access to the Shorts anymore.

https://blog.shahednasser.com/chrome-extension-tutorial-migrating-to-manifest-v3-from-v2

Affects all the hitchhiker layouts while in theater mode.

Problem description:

• The YouTube has old favicons in 2012, 2013, and other layouts, but this extension is not changing the favicons for the YouTube.
• NOTE: Favicon is icon in head of website (also in Firefox tabs are favicons).

Expected results:

• The YouTube should use the old favicons in 2012, 2013, and other layouts.

Other details:

• Browser version: Firefox v113.0.2
• YouTube site zoom percentage: 100%
• YouTube layout: Almost all layouts.
• OS version: Windows 11 22621.1778
• OS architecture: 64-bit
• Browser architecture: 64-bit
• CPU: AMD A10-7860K
• RAM: 16,0GB DDR3
• Motherboard: MSI A88XM-E35 V2
• Graphics: 1024MB ATI AMD Radeon R7

Where to find the old favicons?

• See the https://youtube.com in Wayback Machine.

Actual order of screenshots: 2019 > 2016 > 2017 > 2013 > 2012

Expected order of screenshots: 2019 > 2017 > 2016 > 2013 > 2012

Here: https://addons.mozilla.org/en-CA/firefox/addon/customtube/

Search filter is supposed to be to the left. (It also now opens a screen with the search filters instead of just displaying them)

Attempting to delete a comment creates a confirmation dialogue to confirm the deletion. This dialogue closes itself after a few hundred milliseconds before the user has an opportunity to make a selection. Refreshing the page shows that the comment has not been deleted.

Using latest version of Firefox on Windows 10. Confirmed on all layouts (while using a few other extensions). Confirmed on the 2019 layout in a clean instance of Firefox with all other extensions disabled.

Enhancement description:

• The YouTube's 2012 layout has the old comments layout, so why not to implement it to CustomTube?
• If you want to like, dislike, or reply to the old-school 2012 YouTube comments, then you have to hover over the comments, then like, dislike, and reply buttons appear.

And for the pagination:

• This is NOT a planned feature! (at least at this year.)
• Mr. lightbeam24 said, that it would be difficult to implement.
• I don't know, but maybe inspecting the archived YouTube code would help to understand the pagination code, but maybe later. (I'm going to find an extension which restores the pagination on YouTube comments & search results.)
• I created the petition action in Slovakia, which would NOT return this feature, because Mr. lightbeam24 said, that it would 100% not help.

Screenshots:

The share button on watch pages only works on the first video I watch, if I switch to another video, the share button still acts like if I was still watching the first video. No matter how many videos I open, it always showing the first video's url.

This is the first video i opened. The share button shows the correct url.

This is the second video I opened. The share button shows the previous video's url.

And this is the third video I opened. Still showing the first video's url.

This was fixed on the June 30th update but broken by todays update. It affects all layouts and causes them to change text color when hovered over with the cursor. Minor issue,

This seems to cause added lag on the YouTube site.

Console logs from youtube.com:

[main.js:1532:14](moz-extension://0edcb5d9-321a-471f-8913-edb711bb2142/main.js)
TypeError: document.querySelector(...) is null
    watchPageEveryLoad moz-extension://0edcb5d9-321a-471f-8913-edb711bb2142/main.js:1532
    wait moz-extension://0edcb5d9-321a-471f-8913-edb711bb2142/main.js:38
    (Async: setInterval handler)
    waitFor moz-extension://0edcb5d9-321a-471f-8913-edb711bb2142/main.js:33
    urlListen moz-extension://0edcb5d9-321a-471f-8913-edb711bb2142/main.js:818

Seems to be from this line in main.js:

if (notNeedNewString == true) {
		  document.querySelector("#bt-desc-upload-date #published-on").style.display = "none";	

Browser: Firefox 112.0.2
Layout Select: Disabled

Will it be possible to add the original style players that came with the original layout ?
It would be cool if it did

Hello, I am the lead developer of the Rehike project, and I have a fair amount of experience working with ECMAScript and I know how to design good code. If I take it correctly, you seem to have some beginner level code that has some simple mistakes that complicate the flow of your code a lot.

For example, look at this section of the main JS file that forms a triangle with nested if statements. There are a few bad things going on, notably, a lack of proper formatting and an unclear use of asynchronous code. I recommend that you format long conditional operations like this to use && rather than using multiple nested if statements. That is to say:

// Instead of this:
if (flags.hasOperationA) {
    if (flags.hasOperationB) {
        if (flags.hasOperationC) {
            operationD();
        }
    }
}

// Do this:
if (
    flags.hasOperationA &&
    flags.hasOperationB &&
    flags.hasOperationC
) {
    operationD();
}

This approach not only makes it more clear to you and other developers what is going on here and doesn't require scrolling in the same way, but it also makes you intent more obvious and looks nicer to the eyes. It's just all around a better way to write the same thing.

I also reckon you're unfamiliar with asynchronous ECMAScript, which is fine because I made many mistakes when I first started working with it too. I highly recommend you build your APIs around Promises rather than pure setInterval or setTimeout calls. It sounds complicated at first, especially if you're still thinking with a synchronous mindset like I did, but it is so much easier than what you're doing right now. A benefit of using Promises is you can break up your tasks system that you used in the aforementioned examples into multiple functions that each return a Promise, with a master function that returns a status based on a composite response of the Promises. To put that simply, you can easily implement a nuanced API that has error handling functionality and so on while just using regular function-based programming like you are using. It'll be less global state to keep track of, easier to understand and maintain, and more stable.

Finally, there are quite a few behavioral quirks of how Polymer YouTube works that I haven't really written documentation on, but they're worth knowing, especially for a project of your calibre, and I wish to inform you of them. I'll share some code snippets and techniques I've used in my various Polymer modifications I've made which you can also use for certain purposes involving the modification of any Polymer HTML.

Polymer or how YouTube implements it (I'm not sure which) is very odd in that it reuses elements (and in a very weird way too). I am not sure how any of it works or the motivations for implementing this in such a manner. All I can tell you is that once a custom element (ytd elements) is created, it will not be deleted by YouTube's scripts, but simply moved to outside the DOM. Yes, you can actually do this. I believe that you can use DOMDocument objects in ECMAScript or something similar to create a user-inaccessible element, even through Inspect Element. Though, obviously, I haven't looked into this much to prove that this is something that they do.

You can get the InnerTube API data of most ytd elements by accessing their data property. As an example, document.querySelector("ytd-app").data will give you data for the entire website, including the current page and some miscellaneous information as well. This is provided in a pretty consistent format. For the main watch page contents, the data schema has hardly changed since 2016, which marks our earliest sight of it, so it has pretty much been the same for as long as we know. You can also modify this, to some degree, on certain elements, although that gets pretty complicated quickly.

If you are modifying the data of an element, it can often help to "data cycle" it. This is a term we have adopted in my little community for forcing an element to refresh its data. Here are the two methods that we developed to do this:

// The simple, "classical" method. Simply refreshes the same element:
var dataCopy = elm.data;
elm.data = {};
elm.data = dataCopy;

// The new, advanced method. Creates a new copy element to replace the original:
var newElm = elm.cloneNode();
newElm.data = elm.data;
for (var i in elm.properties)
    newElm[i] = elm[i];
elm.insertAdjacentElement("afterend", newElm);
elm.remove();

I use this code snippet a lot to wait for elements that I am certain that are going to exist:

async function waitForElement(elm)
{
    while (null == document.querySelector(elm))
    {
        await new Promise(r => requestAnimationFrame(r);
    }
    return document.querySelector(elm);
}

Finally, you can look through my profile or ask me further questions wherever about this. I have a good repo where I demonstrate use of a lot of what I described here called yt-anti-shorts. I highly recommend that you look through it no matter what you intend on doing with this project, since I think it is a very high quality project for modifying Polymer reliably.

Happens while using layouts 2012 - 2017.
Both stable and beta version of the extension are affected.

OS: Windows 11 22631.1835 (Insider beta)
Browser: Firefox Nightly 116.0a1