YePpHa / YouTubeCenter

YouTube Center is a userscript designed to expand the functionality of YouTube. It includes the ability to download the video you're watching, auto selecting your preferred video quality and much more.
MIT License
2.89k stars 520 forks source link

The new UI in video page breaks like (and probably dislike) button and the "More" button is missing. #874

Closed Piter432 closed 10 years ago

Piter432 commented 10 years ago

Like title says. Looks like for some users (including me), Google push an update of video page UI, which breaks like (and probably dislike) button and "More" button is missing after loaded player (no matter what type is this player). Please, fix this quickly or someone, who knows javascript, etc., try to fix this bug and make a pull request :)

Betsy25 commented 10 years ago

I see the like & dislike buttons on the right, and for me, they still work as expected.

Piter432 commented 10 years ago

Ah, forgot about one thing. Maybe this bug is only in Firefox and in the version 30 and in the version 31 maybe it's fixed. Can't check the 31.0 version, because Kaspersky still didn't update their plugins for Firefox in KIS 2013, which should work with 31.0 :/

Yonezpt commented 10 years ago

EDIT: Other users in a few replies below have confirmed that the add-on is indeed conflicting with the new rating buttons, the temporary solution seems to be to disable the add-on.

@Piter432 What version of youtube center are you using? Try to update to the most recent developer version for your browser, which can be found here: https://github.com/YePpHa/YouTubeCenter/wiki/Developer-Version

I also just checked and the buttons are still there. Let us know if the update fixed your problem.

By the way, you mentioned a "more" button, does it have 3 dots like this? "··· more"

If that's the case then you are most likely using a new youtube design, in which case the like and dislike buttons are located where the number of likes&dislikes are, just click on them.

Update: As I expected, youtube is really going ahead with the new cards design.

@Piter432 The like and dislike buttons are located where the numbers of likes and dislikes are, see the blue like button in the following screenshot:

ugspndn

Those are the new like/dislike buttons and that's where they will be located now. They are basically streamlining the android individual cards design, will be more effective and easy for them to manage the mobile and desktop versions of youtube now.

It's funny, for the past few days I have been reverse-engineering this new design into a Stylish CSS sheet and when I almost got it all done they finally release it.

@YePpHa Guess my previous suggestion is off the table now, I will still be tinkering with it, but at least the main design itself is already native. I still haven't been hit with the new design yet, but I am curious to see if anything breaks in youtube center (probably the grid layout).

guiaurelio commented 10 years ago

I'm having this same problem... I select the "Like" button but it doesn't work... When I reload the page the "Like" button is not selected. I try to use the Developer Mode Version 378 and the Regular Mode Version 2.1.5 on Tampermonkey. I'm using Google Chrome Version 37.0.2062.94 m.

Yonezpt commented 10 years ago

@guiaurelio It's the new youtube design, they are rolling it out today so some issues might occur. This has nothing to do with youtube center so all we can do is wait for them to fix any of the problems with the current new design.

guiaurelio commented 10 years ago

@Yonezpt Yes, I thought about that... I hope they fix it :) I realised that when I select the "Like" button on Fullscreen it works normal...

Piter432 commented 10 years ago

@Yonezpt I always use the newest dev version ;)

Yonezpt commented 10 years ago

@Piter432 I figured as much once I saw the news of the design change going hate viral (lots of people are hating it). Can you tell me if the grid layout in the subscription page is broken?

guiaurelio commented 10 years ago

@Piter432 @Yonezpt I'm having this problem in my grid layout too... I take a Print as you can see. It's a little bit messed up. grid layout issue

Yonezpt commented 10 years ago

@guiaurelio As I expected, the new youtube design broke something in Youtube Center's grid layout. Now THAT is something YePpHa can fix, we just need to be patient and wait until he has the time for it.

So far as I can see over the web there are people complaining of the likes/dislikes not registering, sorting videos in the user channels is broken and watch history is also broken (both the option to not save any history as well as the history not saving videos when it should).

guiaurelio commented 10 years ago

@Yonezpt Great, I understand. I know he will fix this soon, he's freaking awesome !! :) Youtube Center Rules !! I don't imagine me using Youtube without YTC...

guiaurelio commented 10 years ago

@Yonezpt I know this is not the place to do a question, but I don't find anywhere I can do a question here... See if you can answer to me :) When I disable the Youtube "commercials" with the YTC, the video count a visualisation even so?

Yonezpt commented 10 years ago

@guiaurelio I am 99% sure that it does since the ads and the video are two seperate modules, both of which gather visualization stats independent of each other. Watching a video with no ads is the same as... well, watching a video that really has no advertisement whatsoever and it still counts views all the same. For everything in life there is always that small chance of being wrong when discussing possibilties, so I can't be 100% sure without obtaining that information from a valid source.

guiaurelio commented 10 years ago

@Yonezpt Well, that is the best answer I already recieved hehe I think @YePpHa would give me that answer too. Thank you very much !!

SuperSajuuk commented 10 years ago

I'm unable to like/dislike videos either, just confirming the OP's bug.

Yonezpt commented 10 years ago

@SuperSajuuk As I said above, that is a issue with youtube, not with the add-on itself. There are many users reporting the same problem as yours all over the web because of the new design youtube is rolling out today. Likes and dislikes not registering is a website problem which youtube devs will surely get it fixed as soon as possible.

SuperSajuuk commented 10 years ago

@Yonezpt Then explain how that when I disabled this extension that the buttons just worked as they were supposed to? Pretty sure it's down to extensions and a change in youtube's like/dislike button code, or the button would still not work after disabling the extension.

Yonezpt commented 10 years ago

@SuperSajuuk As far as I can see there is no function in the youtube center addon that could cause the rating action to not register, the most logical explanation is that youtube has fixed that problem and by coincidence it fixed it around when you disabled the add-on.

Plenty of other users have been reporting on the web the same problem and most of them didn't have the youtube center add-on.

Do the buttons stop working again after you activate the add-on? I am sorry for asking this, but I still don't have the new design so I am unable to test it by myself.

SuperSajuuk commented 10 years ago

@Yonezpt They might be using other extensions that modify YouTube, not specifically this extension, as they probably all use similar logic, just done with separate feature sets.

To answer you question: yes, when I enable the addon, the buttons stop working, but they work fine when it isn't running, which leads me to believe it's based on the addons using older logic code for the buttons that have been changed by YouTube in the redesign of the site.

Yonezpt commented 10 years ago

@SuperSajuuk Then if that is the case there really is something in the add-on that is conflicting with the sentiment buttons. It's strange, though, because the only options that can affect those functions at first look are only the UI > Like/Dislike Button and UI > Rating Bar, both of which supposedly only affect the CSS style sheet, not the action itself. They shouldn't affect the buttons' functionality at all.

Now we just have to wait for YePpHa to fix it.

EDIT: After further looking it looks like there are functions that might be affecting the rating system, which confirms your assertions. This will be a problem because there are still many users that don't have the new design and if the add-on is fixed for the new design it might also create problems for those with the old design.

guiaurelio commented 10 years ago

@Yonezpt @SuperSajuuk Thats true. I tried to use the buttons without the extension and it works fine... But when I use the extension the buttons don't work again. The only way that the buttons work normal with the extension is when I use the Fullscreen mode, if I select the "like" button in Fullscreen it counts as usual.

SuperSajuuk commented 10 years ago

@Yonezpt It might be a good idea for @YePpHa to create a small patch file for those who use the new design, at least until the new design is rolled out across to everyone.

Yonezpt commented 10 years ago

@guiaurelio @SuperSajuuk I finally have the new design and I confirm your reports, the youtube center is breaking the rating buttons.

I have searched for the root of the problem and found that this has already happened before, which was also reported back in July by @Piter432 himself (the user that opened this current issue) when he was experimenting this same new design. The report can be read here: #729

The solution back then was simply to disable the experiment, but of course now this isn't an option. I suspect that by the end of this next week all users will have the new design, so hopefully for YePpHa he won't have to branch 2 versions.

guiaurelio commented 10 years ago

@Yonezpt Yes, lets wait for @YePpHa ... He can do it :)

YePpHa commented 10 years ago

I am rewriting the code responsible for this issue as it's some very old code and it needs to be rewritten anyway. I will properly begin testing it soon when I'm finished with the rewriting.

guiaurelio commented 10 years ago

@YePpHa That is nice !! Thanks Bro :)

Yonezpt commented 10 years ago

@YePpHa Since you will be redoing that part I thought I could suggest you taking this opportunity to make the code lighter by converting the base64 pngs into gifs, the result will be exactly the same visually and the number of characters will be greatly reduced if you use gifs instead of pngs for base64 encoding.

Just as an example, here is the comparison between a png cog icon you use in your code and the gif version of the same cog without any quality loss, but with lots of characters reduced: http://jsfiddle.net/xwuofhav/

As you can see, by converting that cog icon into gif the number of characters was reduced by almost 9x less. This practice will greatly decrease the size of the script, but there is one thing to consider:

  • The gifs should have a flat background color that matches the background where the icons will be used, so if the icon is used over a white background then the gif also needs a white background, otherwise the quality will be terrible if transparency is used without background

Don't delete the original png icons in case you need to change the gif background in the future, something that is impossible to do with a gif without sacrificing the quality.

Hope you consider doing this because it will reduce the size of the add-on which has its benefits.

dxgldotorg commented 10 years ago

@Yonezpt If the image files use more than 256 colors each, try PNGGauntlet (Windows only, http://pnggauntlet.com/) which will aggressively (and losslessly) optimize any PNG file you feed it. For images with 256 or less colors, try both PNGGauntlet and GIF encoding and use whatever is smallest.

Zarggg commented 10 years ago

@Yonezpt: Is there any particular reason why you would want to use GIF over PNG? The latter is generally accepted as the superior format and for the icons you're talking about, a properly-optimized PNG should not be nine times larger than the equivalent GIF when encoded in base-64.

To echo @WilliamFeely's comment about PNGGauntlet, the PNG file you reference is able to be compressed to 494 bytes.

Yonezpt commented 10 years ago

@tditmars Ease of use, mostly. The gif format is a simple case of adding background > save as gif > convert to base64 while with the png, for it to be better than the gif, you have to do more steps, add background > save as png > compress in pnggauntlet (for example) > convert to base64.

Png is superior, of course, as the updated example shows that the lossly compressed png beats the gif icon: http://jsfiddle.net/xwuofhav/2/

While the gif "weighs" 514 characters, the punched png wins with just 314 characters, but between the size difference and including more steps, some users might prefer to just go with the gif while others will favor having the smallest size possible. My reply was complemented by @WilliamFeely, I am used to working with gif formats that I forgot about the compression pngs can achieve which he mentioned very well.

But there's also an advantage for gifs when the image is too small, I have on a few ocasions found that for gifs that are less than 200 characters long the png version cannot be smaller.

Either way, gif or punched png will use far less space than the original files, whichever the user chooses it will always benefit his code.

Creat commented 10 years ago

I'm also experiencing the problem that liking something doesn't actually work. I'm even on the latest development version (378), but as far as I can tell there wasn't an update to it recently (i.e. it was published before YouTube changed the layout). Is the next test-build in sight? It's a bit of a hassle to constantly toggle the plugin just to 'like' a video...

Yonezpt commented 10 years ago

@Creat Until YePpHa is able to finish recoding, the only options you have are either to do what you are doing, not use the like buttons or not use the add-on.

guiaurelio commented 10 years ago

@Creat The only way that the buttons work normal with the extension is when I use the Fullscreen mode, if I select the "like" button in Fullscreen and after that select the "like" button normaly it counts as usual.

Creat commented 10 years ago

@guiaurelio do you mean the fullscreen-top-player or the normal fullscreen mode of the (flash) player? I played around with it a bit, but couldn't follow your comment, as there is no fullscreen mode that I know that has a like-button visible in it.

While playing around with it I also noticed that when I set the "Player type" in the options to something other than 'Default', the like occasionally works (don't know when exactly, seems erratic). The downside is that this breaks the page for me in other ways: I have the HTML5-player set as the default (via youtubes own option for this, YTC is set to 'Default') and Chrome is set to not show plugins (including flash) unless I click to load them. When I now force the flash player in YTC options, I see the expected 'Click to run Adobe Flash Player' prompt, despite this the video starts playing (presumably behind this prompt) as I can hear the sound. If I click to load the player, I have the audio twice, one instance is correct, plus the one that started in the beginning in the background, which just continues on until the end of the video (note that it doesn't respect the "set volume to 0%" setting of YTC for this background play, but the real/main player does).

Yonezpt commented 10 years ago

@Creat Youtube player in fullscreen displays info and rating buttons on the top. 5phar

Notice the buttons on the top-right corner. This is for the flash player, I don't know if the same exists in the html5 player.

Creat commented 10 years ago

Wow holy crap I'm blind, thank you.

Yea, that button also exists in the HTML5 version and it seems to work just fine. That's a good enough workaround for me. After clicking it, you'll see the "added to liked playlist" notification (if you exist fullscreen mode fast enough). While the normal thumbs-up isn't lit up by this, reloading the page does and shows that this works. Thanks again!

guiaurelio commented 10 years ago

@Creat Ur welcome :)

Piter432 commented 10 years ago

Whoa, sorry for OT, but... so many posts in my reported issue O.o

YePpHa commented 10 years ago

I have now rewritten the code that handles the placement system. The tests I've made were all successful and hopefully it will for all of you too. If there are any new issues relating to the fix then please create a new issue.

If no issues have been reported for a few days I will release the next version of YouTube Center with this fix.

Yonezpt commented 10 years ago

@YePpHa Those are great news and I agree with your decision for a trial period before the final release, youtube has been changing some things since the recent major changes. It appears that they have finally fixed the watch history problem and some minor issues with the playlist behaviour were also fixed today.

Also, the new logo is really nice.

guiaurelio commented 10 years ago

@Yonezpt @YePpHa Works perfectly here for me !!! Very good Bro !!!

Fironet commented 10 years ago

Fixed, yay! :+1: Thanks so much.