diff options
| -rw-r--r-- | README | 64 | ||||
| -rw-r--r-- | README.md | 123 | ||||
| -rw-r--r-- | src/frontend/tubo/components/layout.cljs | 2 |
3 files changed, 37 insertions, 152 deletions
@@ -1,29 +1,7 @@ # -*- mode: org; org-html-head-include-default-style: nil; org-html-postamble: nil; after-save-hook: org-md-export-to-markdown; -*- #+OPTIONS: toc:nil num:nil * Tubo -Tubo is a streaming front-end focused on bringing the [[https://github.com/TeamNewPipe/NewPipe][NewPipe]] experience to the web. It aims at providing a clean and simple user interface to consume media from your favorite streaming platforms. It currently supports the same services as NewPipe, including YouTube, SoundCloud, Bandcamp, and more. - -To retrieve the data, it wraps the excellent [[https://github.com/TeamNewPipe/NewPipeExtractor][NewPipe Extractor]] library and it exposes the extracted data over a REST API that is consumed by a local re-frame SPA. - -** Screenshots -| https://files.migalmoreno.com/tubo_stream.jpg | https://files.migalmoreno.com/tubo_channel.jpg | -|-----------------------------------------------+------------------------------------------------| -| https://files.migalmoreno.com/tubo_queue.jpg | https://files.migalmoreno.com/tubo_search.jpg | -** Features -- [X] No ads -- [X] Background player -- [X] Playback queue -- [X] Bookmarked Playlists -- [X] Settings -- [ ] Subscriptions -- [ ] User login - -** Instances -| URL | Country | -|-----------------------------------------+---------| -| https://tubo.migalmoreno.com (Official) | 🇪🇸 | -| [[https://tubo.reallyaweso.me][https://tubo.reallyaweso.me]] | 🇩🇪 | -| [[https://tubo.ducks.party][https://tubo.ducks.party]] | 🇩🇪 | +Tubo is a streaming front-end focused on bringing the [[https://newpipe.net/][NewPipe]] experience to the web. It aims at providing a clean and simple user interface to consume media from your favorite streaming platforms. It currently supports the same services as NewPipe, including YouTube, SoundCloud, Bandcamp, and more. ** Installation *** Packaging @@ -43,14 +21,14 @@ java -jar target/tubo-<VERSION>.jar #+end_src **** Docker -Alternatively, you can use Docker to set up Tubo. Simply invoke this: +You can use Docker Compose to set up Tubo. #+begin_src sh docker-compose up -d #+end_src **** Manual -You can also set up Tubo manually via the [[https://guix.gnu.org/][GNU Guix]] package manager. First, download the necessary tooling: +You set up Tubo manually via the [[https://guix.gnu.org/][GNU Guix]] package manager. First, download the necessary tooling: #+begin_src sh cd /path/to/tubo @@ -92,9 +70,9 @@ If you want to self-host Tubo and make it publicly accessible you'll need to set #+begin_src nginx server { listen 443 ssl http2; - server_name tubo.<YOUR_DOMAIN>; - ssl_certificate /etc/letsencrypt/live/tubo.<YOUR_DOMAIN>/fullchain.pem; - ssl_certificate_key /etc/letsencrypt/live/tubo.<YOUR_DOMAIN>/privkey.pem; + server_name <TUBO_HOST>; + ssl_certificate /etc/letsencrypt/live/<TUBO_HOST>/fullchain.pem; + ssl_certificate_key /etc/letsencrypt/live/<TUBO_HOST>/privkey.pem; location / { proxy_pass http://localhost:3000; @@ -105,16 +83,16 @@ server { #+end_src ** Browser Extension Support -*** [[https://github.com/einaregilsson/Redirector][Redirector]] -You can manually add any redirect rule based on regex patterns with this extension. Below are some sample configurations to redirect links from supported services to Tubo so you can get a basic idea of how to write manual Redirector rules. Note the =serviceId= of each service is: YouTube (0), SoundCloud(1), media.ccc.de(2), PeerTube(3), and Bandcamp(4). Replace https://tubo.migalmoreno.com/ in the redirect rule to the instance of your choice. +*** [[https://einaregilsson.com/redirector/][Redirector]] +You can manually add any redirect rule based on regex patterns with this extension. Below are some sample configurations to redirect links from supported services to Tubo so you get a basic idea of how to write manual Redirector rules. Note the =serviceId= of each service is: YouTube (0), SoundCloud(1), media.ccc.de(2), PeerTube(3), and Bandcamp(4). #+begin_src Description: YouTube video to Tubo stream Example URL: https://www.youtube.com/watch?v=YE7VzlLtp-4 Include pattern: ^((?:https?://)(?:www.)?youtube.com/(watch\?v.*|shorts/.*)) -Redirect to: https://tubo.migalmoreno.com/stream?url=$1 +Redirect to: https://<TUBO_HOST>/stream?url=$1 Example result: -https://tubo.migalmoreno.com/stream?url=https://www.youtube.com/watch?v=YE7VzlLtp-4 +https://<TUBO_HOST>/stream?url=https://www.youtube.com/watch?v=YE7VzlLtp-4 Pattern type: Regular Expression Apply to: Main window (address bar) #+end_src @@ -123,9 +101,9 @@ Apply to: Main window (address bar) Description: SoundCloud stream to Tubo stream Example URL: https://soundcloud.com/unfa/stop-the-panic Include pattern: ^((?:https?://)(?:www.)?soundcloud.com/.*/.*) -Redirect to: https://tubo.migalmoreno.com/stream?url=$1 +Redirect to: https://<TUBO_HOST>/stream?url=$1 Example result: -https://tubo.migalmoreno.com/stream?url=https://soundcloud.com/unfa/stop-the-panic +https://<TUBO_HOST>/stream?url=https://soundcloud.com/unfa/stop-the-panic Pattern type: Regular Expression Apply to: Main window (address bar) #+end_src @@ -134,8 +112,8 @@ Apply to: Main window (address bar) Description: Bandcamp album to Tubo playlist Example URL: https://unfa.bandcamp.com/album/suppressed Include pattern: ^((?:https?://)(.*\.)?bandcamp.com/album/.*) -Redirect to: https://tubo.migalmoreno.com/playlist?url=$1 -Example result: https://tubo.migalmoreno.com/playlist?url=https://unfa.bandcamp.com/album/suppressed +Redirect to: https://<TUBO_HOST>/playlist?url=$1 +Example result: https://<TUBO_HOST>/playlist?url=https://unfa.bandcamp.com/album/suppressed Pattern type: Regular Expression Apply to: Main window (address bar) #+end_src @@ -144,9 +122,9 @@ Apply to: Main window (address bar) Description: PeerTube (Framatube) channel to Tubo channel Example URL: https://framatube.org/accounts/framasoft@framatube.org Include pattern: ^((?:https?://)(?:www.)?framatube.org/accounts/.*) -Redirect to: https://tubo.migalmoreno.com/channel?url=$1 +Redirect to: https://<TUBO_HOST>/channel?url=$1 Example result: -https://tubo.migalmoreno.com/channel?url=https://framatube.org/accounts/framasoft@framatube.org +https://<TUBO_HOST>/channel?url=https://framatube.org/accounts/framasoft@framatube.org Pattern type: Regular Expression Apply to: Main window (address bar) #+end_src @@ -155,14 +133,8 @@ Apply to: Main window (address bar) Description: media.ccc.de search query to Tubo search query Example URL: https://media.ccc.de/search/?q=37c3 Include pattern: ^(?:https?://)media.ccc.de/search/\?q=(.*) -Redirect to: https://tubo.migalmoreno.com/search?query=$1&serviceId=2 -Example result: https://tubo.migalmoreno.com/search?query=37c3&serviceId=2 +Redirect to: https://<TUBO_HOST>/search?query=$1&serviceId=2 +Example result: https://<TUBO_HOST>/search?query=37c3&serviceId=2 Pattern type: Regular Expression Apply to: Main window (address bar) #+end_src - -*** [[https://github.com/libredirect/browser_extension][LibRedirect]] -Redirects many popular services to their alternative front-ends. Has a ton of features and an active community. Tubo is supported by default for YouTube and SoundCloud, so no need to do anything for these. The rest of services are pending as per [[https://github.com/libredirect/browser_extension/issues/884][#884]]. - -*** [[https://github.com/dybdeskarphet/privacy-redirector][Privacy Redirector]] -A userscript that redirects popular social media platforms to their privacy respecting front-ends. @@ -2,84 +2,7 @@ # Tubo -Tubo is a streaming front-end focused on bringing the [NewPipe](https://github.com/TeamNewPipe/NewPipe) experience to the web. It aims at providing a clean and simple user interface to consume media from your favorite streaming platforms. It currently supports the same services as NewPipe, including YouTube, SoundCloud, Bandcamp, and more. - -To retrieve the data, it wraps the excellent [NewPipe Extractor](https://github.com/TeamNewPipe/NewPipeExtractor) library and it exposes the extracted data over a REST API that is consumed by a local re-frame SPA. - - -## Screenshots - -<table border="2" cellspacing="0" cellpadding="6" rules="groups" frame="hsides"> - - -<colgroup> -<col class="org-left" /> - -<col class="org-left" /> -</colgroup> -<thead> -<tr> -<th scope="col" class="org-left"><img src="https://files.migalmoreno.com/tubo_stream.jpg" alt="tubo_stream.jpg" /></th> -<th scope="col" class="org-left"><img src="https://files.migalmoreno.com/tubo_channel.jpg" alt="tubo_channel.jpg" /></th> -</tr> -</thead> - -<tbody> -<tr> -<td class="org-left"><img src="https://files.migalmoreno.com/tubo_queue.jpg" alt="tubo_queue.jpg" /></td> -<td class="org-left"><img src="https://files.migalmoreno.com/tubo_search.jpg" alt="tubo_search.jpg" /></td> -</tr> -</tbody> -</table> - - -## Features - -- [X] No ads -- [X] Background player -- [X] Playback queue -- [X] Bookmarked Playlists -- [X] Settings -- [ ] Subscriptions -- [ ] User login - - -## Instances - -<table border="2" cellspacing="0" cellpadding="6" rules="groups" frame="hsides"> - - -<colgroup> -<col class="org-left" /> - -<col class="org-left" /> -</colgroup> -<thead> -<tr> -<th scope="col" class="org-left">URL</th> -<th scope="col" class="org-left">Country</th> -</tr> -</thead> - -<tbody> -<tr> -<td class="org-left"><a href="https://tubo.migalmoreno.com">https://tubo.migalmoreno.com</a> (Official)</td> -<td class="org-left">🇪🇸</td> -</tr> - - -<tr> -<td class="org-left"><a href="https://tubo.reallyaweso.me">https://tubo.reallyaweso.me</a></td> -<td class="org-left">🇩🇪</td> -</tr> - - -<tr> -<td class="org-left"><a href="https://tubo.ducks.party">https://tubo.ducks.party</a></td> -<td class="org-left">🇩🇪</td> -</tr> -</tbody> -</table> +Tubo is a streaming front-end focused on bringing the [NewPipe](https://newpipe.net/) experience to the web. It aims at providing a clean and simple user interface to consume media from your favorite streaming platforms. It currently supports the same services as NewPipe, including YouTube, SoundCloud, Bandcamp, and more. ## Installation @@ -101,13 +24,13 @@ To retrieve the data, it wraps the excellent [NewPipe Extractor](https://github. - Docker - Alternatively, you can use Docker to set up Tubo. Simply invoke this: + You can use Docker Compose to set up Tubo. docker-compose up -d - Manual - You can also set up Tubo manually via the [GNU Guix](https://guix.gnu.org/) package manager. First, download the necessary tooling: + You set up Tubo manually via the [GNU Guix](https://guix.gnu.org/) package manager. First, download the necessary tooling: cd /path/to/tubo guix shell @@ -140,9 +63,9 @@ If you want to self-host Tubo and make it publicly accessible you'll need to set server { listen 443 ssl http2; - server_name tubo.<YOUR_DOMAIN>; - ssl_certificate /etc/letsencrypt/live/tubo.<YOUR_DOMAIN>/fullchain.pem; - ssl_certificate_key /etc/letsencrypt/live/tubo.<YOUR_DOMAIN>/privkey.pem; + server_name <TUBO_HOST>; + ssl_certificate /etc/letsencrypt/live/<TUBO_HOST>/fullchain.pem; + ssl_certificate_key /etc/letsencrypt/live/<TUBO_HOST>/privkey.pem; location / { proxy_pass http://localhost:3000; @@ -155,60 +78,50 @@ If you want to self-host Tubo and make it publicly accessible you'll need to set ## Browser Extension Support -### [Redirector](https://github.com/einaregilsson/Redirector) +### [Redirector](https://einaregilsson.com/redirector/) -You can manually add any redirect rule based on regex patterns with this extension. Below are some sample configurations to redirect links from supported services to Tubo so you can get a basic idea of how to write manual Redirector rules. Note the `serviceId` of each service is: YouTube (0), SoundCloud(1), media.ccc.de(2), PeerTube(3), and Bandcamp(4). Replace <https://tubo.migalmoreno.com/> in the redirect rule to the instance of your choice. +You can manually add any redirect rule based on regex patterns with this extension. Below are some sample configurations to redirect links from supported services to Tubo so you get a basic idea of how to write manual Redirector rules. Note the `serviceId` of each service is: YouTube (0), SoundCloud(1), media.ccc.de(2), PeerTube(3), and Bandcamp(4). Description: YouTube video to Tubo stream Example URL: https://www.youtube.com/watch?v=YE7VzlLtp-4 Include pattern: ^((?:https?://)(?:www.)?youtube.com/(watch\?v.*|shorts/.*)) - Redirect to: https://tubo.migalmoreno.com/stream?url=$1 + Redirect to: https://<TUBO_HOST>/stream?url=$1 Example result: - https://tubo.migalmoreno.com/stream?url=https://www.youtube.com/watch?v=YE7VzlLtp-4 + https://<TUBO_HOST>/stream?url=https://www.youtube.com/watch?v=YE7VzlLtp-4 Pattern type: Regular Expression Apply to: Main window (address bar) Description: SoundCloud stream to Tubo stream Example URL: https://soundcloud.com/unfa/stop-the-panic Include pattern: ^((?:https?://)(?:www.)?soundcloud.com/.*/.*) - Redirect to: https://tubo.migalmoreno.com/stream?url=$1 + Redirect to: https://<TUBO_HOST>/stream?url=$1 Example result: - https://tubo.migalmoreno.com/stream?url=https://soundcloud.com/unfa/stop-the-panic + https://<TUBO_HOST>/stream?url=https://soundcloud.com/unfa/stop-the-panic Pattern type: Regular Expression Apply to: Main window (address bar) Description: Bandcamp album to Tubo playlist Example URL: https://unfa.bandcamp.com/album/suppressed Include pattern: ^((?:https?://)(.*\.)?bandcamp.com/album/.*) - Redirect to: https://tubo.migalmoreno.com/playlist?url=$1 - Example result: https://tubo.migalmoreno.com/playlist?url=https://unfa.bandcamp.com/album/suppressed + Redirect to: https://<TUBO_HOST>/playlist?url=$1 + Example result: https://<TUBO_HOST>/playlist?url=https://unfa.bandcamp.com/album/suppressed Pattern type: Regular Expression Apply to: Main window (address bar) Description: PeerTube (Framatube) channel to Tubo channel Example URL: https://framatube.org/accounts/framasoft@framatube.org Include pattern: ^((?:https?://)(?:www.)?framatube.org/accounts/.*) - Redirect to: https://tubo.migalmoreno.com/channel?url=$1 + Redirect to: https://<TUBO_HOST>/channel?url=$1 Example result: - https://tubo.migalmoreno.com/channel?url=https://framatube.org/accounts/framasoft@framatube.org + https://<TUBO_HOST>/channel?url=https://framatube.org/accounts/framasoft@framatube.org Pattern type: Regular Expression Apply to: Main window (address bar) Description: media.ccc.de search query to Tubo search query Example URL: https://media.ccc.de/search/?q=37c3 Include pattern: ^(?:https?://)media.ccc.de/search/\?q=(.*) - Redirect to: https://tubo.migalmoreno.com/search?query=$1&serviceId=2 - Example result: https://tubo.migalmoreno.com/search?query=37c3&serviceId=2 + Redirect to: https://<TUBO_HOST>/search?query=$1&serviceId=2 + Example result: https://<TUBO_HOST>/search?query=37c3&serviceId=2 Pattern type: Regular Expression Apply to: Main window (address bar) - -### [LibRedirect](https://github.com/libredirect/browser_extension) - -Redirects many popular services to their alternative front-ends. Has a ton of features and an active community. Tubo is supported by default for YouTube and SoundCloud, so no need to do anything for these. The rest of services are pending as per [#884](https://github.com/libredirect/browser_extension/issues/884). - - -### [Privacy Redirector](https://github.com/dybdeskarphet/privacy-redirector) - -A userscript that redirects popular social media platforms to their privacy respecting front-ends. - diff --git a/src/frontend/tubo/components/layout.cljs b/src/frontend/tubo/components/layout.cljs index 3c381e2..a55526f 100644 --- a/src/frontend/tubo/components/layout.cljs +++ b/src/frontend/tubo/components/layout.cljs @@ -206,7 +206,7 @@ [:button.font-bold {:on-click on-open} (str "show " (if open? "less" "more"))])])}))) (defn error [{:keys [failure parse-error status status-text]} cb] - [:div.flex.flex-auto.h-full.items-center.justify-center + [:div.flex.flex-auto.h-full.items-center.justify-center.p-5 [:div.flex.flex-col.gap-y-6.border-border-neutral-300.rounded.dark:border-stone-700.bg-neutral-300.dark:bg-neutral-800.p-5 [:div.flex.items-center.gap-2.text-xl [:i.fa-solid.fa-circle-exclamation] |