search

select / audius

Audius - 💬 chat, 🎧 listen, 📺 watch
https://audius.rockdapus.org/
41 stars 10 forks source link
mp3player music playlist stream streamus upnext youtube

readme

Audius (audius.rockdapus.org)

Audius is the ultimate streaming music player.

Community

If you have questions or feedback, join the chat on matrix or create an issue on github.

Run your own Audius

Easy as - Download the audius app, upload it to your server. Done!

If you run Audius as file (file:// URL) all information are lost when you restart.

Extension

The audius extension helps to search external webpages.

Share your Music with Matrix / Riot.im

Matrix is a chat network that Audius uses to share songs.

Join a room and drag and drop to add new music.

Create your own rooms with Audius and share it with your friends.

Change log

2.0.15

2.0.14

2.0.13

2.0.12

2.0.11

2.0.10

2.0.9

2.0.8

2.0.7

2.0.6

2.0.5

2.0.4

2.0.3

2.0.2

2.0.1

Run you own Audius

Download the audius app and upload it to you server.

Install Audius as app

Chrome desktop:

  1. At the top right, click More.
  2. Click More Tools.
  3. Add the app: Windows users: Click Add to taskbar. Linux users: Click Add to desktop. Chromebook users: Click Add to shelf.

Chrome android: Tap the menu button and tap Add to homescreen. The app is not yet optimized for mobile phones, it might work on tablets.

Local HTML5: Since this player is a pure HTML5 app without server side code you can simply download the HTML and JS code and run it from a local file. You can also download the latest version from the source code repository at github.

Why use the web version then?

  1. A click on "reload page" will pull the latests updates.
  2. I recognized that using this app from a local file blocks a lot of videos on YouTube (e.g. all Vevo videos) :(
  3. IndexDB, the browser database, does not work with file:// URLs, therefore Audius can not store your playlists etc. permanently.

Development

Get the code and install all dependencies.

git clone git@github.com:select/audius.git
cd audius
npm install

Run the dev server (with hot module replacement).

npm start

Open http://localhost:8080/ to test.

Build a debug version that includes source maps and the full vue runtime.

npm run build

The build is located in /dist-website, open index.html to test.

Build a production version with with minimal runtime and without source maps

npm run build:prod:app

The build is also located in /dist-website, open index.html to test.

The chrome extension can be build with

npm run build:extension

Media meta data object MediaMetaData

This is the internal media data JSON fromat of Audius.

{
    id: 'ozD4h9HCHOY', // universal unique id
    title: 'Human readable title',
    duration: { h: 0, m: 58, s: '51' }, // optional if 'video' or 'audio'
    durationS: 3531, // duration in seconds;  optional if 'video' or 'audio'
    type: 'youtube', // available types: 'audio', 'video', 'vimeo'
    href: 'https://example.com/items/funny-video', // link to external page; not required for youtube
    thumbUrl: 'https://example.com/img/funny-video_100x75.jpg', // not req for yt
    start: 0, // optional time in seconds
    stop: 379, // optional time in seconds
    youtubeId: 'ozD4h9HCHOY', // youtube only
    vimeoId: '36579366', // vimeo only
    tracks: [ // optional
        { // this is a full item with 
            trackId: 1,
            title: 'Kanan neni - Rokia Traoré - Wanita',
            duration: { d: 0, h: 0, m: 6, s: '19', ms: 0 },
            durationS: 379,
            id: 'Track1-ozD4h9HCHOY',
            type: 'youtube',
            start: 0,
            fullTitle: '1. Kanan neni : 00:00\r',
            durationAlbum: 3531,
            isTrack: true,
            youtubeId: 'ozD4h9HCHOY',
            stop: 379,
        },
    ],
},

Web scaper channels

A web scraper channel can be created by using URL patterns or a custom object with data entries and functions. The functions are evaled and executed in a sandbox in the Audius extension.

It must implement

Available types:

Example plugins

({
    pageIndex: 0,
    stepSize: 5,
    getUrl() { // return URL to request
        this.pageIndex += this.stepSize;
        return {
            type: 'ajaxJSON',
            data: `http://www.example.com/feeds/posts/summary?start-index=${this.pageIndex}&max-results=1&alt=json`,
            responseTemplate: { type: 'parse' },
        };
    },
    parse(data) {
        const datetime = data.feed.entry[0].published.$t;
        return {
            type: 'scanOneUrl',
            url: `http://www.example.com/search?updated-max=${encodeURIComponent(datetime.replace(/\.\d{3}-/, '-'))}&max-results=${this.stepSize}`,
        };
    },
})
({
    baseURL: 'https://example.com/api/',
    lastKey: '',
    getUrl() {
        return {
            type: 'ajaxJSON',
            data: !this.lastKey
                ? this.baseURL
                : `https://example.com/api/items/get?older=${this.lastKey}`,
            responseTemplate: { type: 'parseResults' }, // call the parse function below with the results from ajaxJSON
        };
    },
    parseResults(data) {
        this.lastKey = data.items[data.items.length - 1].id;
        return { // return list of MediaMetaData objects
            type: 'mediaList',
            data: data.items.filter(item => /\.mp4$/.test(item.image)).map(item => ({
                id: `example-${item.id}`,
                title: item.title,
                type: 'video',
                thumbUrl: `https://thumb.example.com/${item.id}.jpg`,
                href: `https://example.com/top/${item.id}`,
                url: `https://vid.example.com/${item.image}`,
            })),
        };
    },
});

Legality, security, saftey, and privacy

Web apps are true freedom! Support an open and liberal web without geo borders and login screens.

System requirements

Source code

The source code for this project is located at https://github.com/select/audius.

If you like this project give it a star ★ and contribute some code!

Migration from Streamus

On Linux use this script I created to dump the Streamus WebSql to a JSON file. The JSON can be imported using the IMPORT button below the playlist. Use the script like this:

./streamus-export.sh ~/.config/google-chrome/Profile\ 1/Local\ Storage/chrome-extension_jbnkffmindojffecdhbbmekbmkkfpmjd_0.localstorage

Be sure to validate the JSON output, the script is just a quick hack and you might have to tweak it.

Motivation

You are writing another music player, seriously? That's what I thought a lot when creating this, but you know ...

The extension (inactive for now) should have been the actual player since the original idea was to create a Chrome/FireFox extension with a media player for web.whatsapp.com. After struggeling alot with getting the YouTube player to run in an extension content script the plan completely failed when the content security policy did not allow the embdding of youtube videos. Even though it should be possible to overwrite the header fields for the content security policy of web.whatsapp.com I could not get it to work (it worked on every page except web.whatsapp.com). That meant no YouTube player, no music. The only way out of this mess was to create an extension with a a content script (grabs links) that communicates with a background script (relays found links) that in turn communicates with the a main player (this web app, that plays the songs). But this also meant that I had to write an extension and a web app. Well what the heck, I was still using Streamus but over the time less and less worked so I needed a replacement anyway. I tried tomahawk and it seemed quite promising, but I just could not get it to work with dragged in or paste in youtube links. Also the search was quite slow and did not show many results. This kind of left me no other option but to write Audius.

As Audius evolved I tried out new technologies, one of them the Matrix chat network. Matrix is similar to email (multiple federated servers) and offers open and encryped real time data and chat message transfer. This was a fun opportunity to create a new medium for the music chat rooms that I am part of. Music chat rooms are the best way to break out of filter bubbles from services that use algorithms, they allow you to discover new music your friends and strangers curate for you.

Here are some alternatives to Audius that are also interesting:

Just look at them and appreciate the simplicity of the Audius interface ... wait what don't leave X-D

Credits

This work is inspired by the incredible Streamus app.

Here are the tools I used to create Audius.