crittermike/toogles

A fresher, less annoying interface to YouTube.

Toogles: Awesome Goggles for YouTube

Toogles is a super fast and super clean alternative interface for YouTube. It's built for people who want to watch and browse and search without the bulk that comes along with YouTube.com

Toogles is built on top of Angular.js (no jQuery) and Zurb Foundation.

Contributing (it's only 5 commands!)

Toogles is a single page JS app with no back end, so it's incredibly easy to set up locally.

git clone <your-fork-url>
cd <your-fork-directory>
npm install 
bower install
grunt serve

That last command will start a lightweight server and open your browser to the URL for testing and development. It uses LiveReload internally so all code changes should automatically refresh, and it also will watch your .scss files to compile to CSS on the fly.

Note that known working versions are:

⇒ node --version
v0.10.48
⇒ npm --version
2.15.1

If anyone would like to upgrade things to work with latest versions, that would be fabulous.

Feel free to hack on it to fix any bugs you find or add any features you'd like and send them in as a pull request. I'll add you to the contributors section!

Contributors

• mcrittenden - Creator and Lead
• ispedals

toogles's Issues

Re: Shutdown

Just learned about the API situation while scrolling your website's post history (after reading another linked article from HN). So annoying when that happens...

You may already know about https://invidio.us/, which provides a YouTube frontend by going in the opposite direction to what this project does, and HTML-scraping youtube.com.

I'm not sure exactly how one server (??) hits YouTube on behalf of apparently 35k users without being nuked, but... somehow... it lives.

Incidentally, while verifying I did indeed remember the website's name, I discovered that the author has hit burnout: https://omar.yt/posts/stepping-away-from-open-source

It seems the server-scraping approach scales (further clarification would probably be needed, and the details probably quite interesting) where the API approach, er, doesn't.

I have no particular investment in either project; I'm simply mentioning invidio.us in case you find it relevant/interesting.

Videos in playlists say the author is person who created the playlist (should be the original video uploader)

Show Video Age

Thanks for a great app.

Would it be possible to show the age of each video (like YouTube does), maybe on the left of the length info?

Thanks,
Richard

[Question] Accepting PR?

Are you accepting PRs?

Playlist

It would be nice to have a playlist and a loop feature.

Maintain scroll position between states

If I follow through to a video (from browse page) then go back, the scroll position is lost and the thumbnails are reloaded.

Allow adding videos as favorites

It is possible to do it via the API, so it would be nice to have a "favorite this video" button (maybe also like/dislike ones since the ones embedded in the video aren't very visible and it would make sense to keep a consistent interface)

Goggles doesn't sound like Toogles

I've typed many times toggl.es in my URL input box, because the page slogan says something with goggles and that got into my mind.

This may be affecting other people and preventing them from reaching the website after the first time.

Toogles doesn't support older clients since HTTPS support was added

I like to use Toogles on my quite old BlackBerry PlayBook as it is much more responsive than YouTube. But since issue #24 was implemented, Toogles doesn't load on my tablet neither in the default browser nor in alternative browsers.

Toogles supports only TLS 1.2, however based on the Qualys SSL Labs SSL Client Test my tablet does not support TLS 1.2:

I am not a security expert therefore I cannot judge whether enabling older TLS versions, especially version 1.0 is an acceptable security risk, but many sites still allow connections over TLS 1.0. For example YouTube supports TLS 1.2, 1.1 and 1.0.

install bower to app, not root

I was having issues till I modified .bowerrc to

{
  "directory": "app/bower_components"
}

from "directory": "bower_components"

Also all references in Gruntfile.js I changed to /app/bower_components

touch and css problems on mobile

While testing the demo file on browser it didn't work (running it via a local server or also using the Firefox Developer browser), like as the side menu for the search (not on the initial screen with pre-programmed name but doing a new word search) were going all the way to the right side of screen, so while trying to select one of the videos the selection was being done for the Options in the search menu instead.
Using the browser's developer tools I could find out that the main.scss file was the one causing the problem so I went to the toogl.es web site and downloaded the main.css file from there, and its running perfectly now.

Now the problem is that for the mobile application I'm still using the Titanium cross-developer tool, as a webview, and there it's also now running well the whole app BUT the touch is difficult, like to select any of the videos.
I've already took out the fastclick.js, as maybe it was in conflict with either the angular-touch.js or the own Titanium touch access, but either taking one or the other out didn't fix the problem and it's still hard to select any video.
Any help on this ?

One last point is that the foundation framework has compatibility with Android 4.2+ only, so as still there are lots of devices with older versions then could be a problem while deploying app.

create module admin

option for add playlist to menu user and more future

Liking/Disliking

Is liking or disliking a video possible or is that functionality only available from YouTube itself

Should be submitted to builtwith.angularjs.org

This is a great app. It's worth to be shown on builtwith.angularjs.org

webpage not available

hi and thanks for this interesting, simple and clean fast access to the Youtube, plus being a very good "module" to the Angular package.
I tested it here using the Firefox browser and it works fine, and with either Opera or Chrome it didn't work if I run the index.html as a ///file and not as a localhost.
As the goal is to use it in a mobile, and for that I'm playing with Titanium to package it as an HTML inside an webview, then what I'm getting here is that using the Titanium 3.2.0 SDK it's running smoothly, meaning starting, then selecting video and playing it well, but right after you select the video that you'll play, and before its page shows up it's showing a message that can't find a webpage at /Resources/HTML/app/%7B%7Bvideo.embedurl%7D%7D so then I have to click "back" and it goes to the file's page and lay it well, but always this message pops up before the player.
I checked this and it's inside the view.js file, so now I'm trying to understand why this happens inside a webview and not in the browser (or it's something related to the way that Titanium pack things), so any idea/help to fix this ?

Playlists are semi-broken if they contain videos that no longer exist

Example: http://toogl.es/#/playlist/PL30ED381E5A3176A4

In the playlist tab, you can see videos without images, and since those are "removed" from YT, it messes up the ordering so for example the #8 video on toogles isn't the #8 video in the actual YT playlist.

Issues with IE 9 & Opera

When navigating through back button I get this error " This content cannot be displayed in a frame "

Also this app hardly works on Opera browser not that I use opera that much.

HTTPS support

HTTPS support for the Toogl.es webserver would be nice (easily configured using the https://letsencrypt.org script).

Thanks for creating / hosting toogl.es, I really like the clean interface.

Possibility to start in dark mode?

Hi,

I've discovered Toogles recently I was wondering if there's any way to start in dark mode rather than having to click the theme-switcher every time. Of course a css could handle it but if there's any quick way I'd appreciate knowing it, especially that coding, even a css, is not among my talents!

Thanks.

Hi ,I was wondering if this app could be altered such that it only lists videos from a particular channel (for example to be able to view only videos in my channel)) rather than from youtube as a whole

Arguably use of $watch

First of all, nice work guys.

---

But, I am not quite sure that the use of $watch in list.js is the easiest way to do that as it is a best practice to not call it in controllers. blog post here

What about calling search in the ng-submit function of list.html and then set the location ?

Add support for the start time parameter in the app and the extension

FR: better results: as list (instead of cards) and with chanels

Would it be possible to make search results more compact (using list instead of thumbnails comes to mind)? And including channels that names matches would be awesome (eg. https://toogl.es/#/search/veritasium).
The list suggestion could also apply to channel view (with option to sort by date/relevance/whatever YT api provides)

(I love the project, I was so annoyed with YT itself that I switched to NewPipe on android and it occurred to me that there should be something similar for the desktop and there is!)

The UI no longer updates when the video changes from within the player

For example, if you click a related video at the end of a video, or if a playlist video moves on to the next one in the playlist, the UI doesn't update to show the new video's info like it used to. YouTube must have updated their player API and broken that.

please add a LICENSE file

Hi Mike, I could not find what the license of this project is. Thanks! - Jama

Auto-Suggest for Search Box

Hi,
I miss the youtube auto-suggest / auto-complete in searchbox. It is a must have for me.
I have some patch on old version of toogles
Can you can take bootstrap + angular bootstrap as dependency ?
Bootstrap typeahead integrates well with angular - very few changes.

Playlist in Search

HI,

Will there be an option to search for playlists on Toogles anytime soon? An option to create playlists on the site would be useful, but not as important.