YOU.DJ - Install the YouDJ mixer on your website

Processing payment... don't close the tab!

this should takes from 5 to 10 seconds

SECURE PAYMENTS are 100% managed by PAYPAL and STRIPE

YouDJ never access to your payment details, we only receive a "confirmation of payment" at the end. Please notice that you will be redirected to the Paypal or Stripe websites for the actual payment.

* ⏰ This 30% discount is limited in time and will end the May 21st at 12:00pm EST

Online Live Demo

Below you can use a customized YouDJ mixer integrated on this page. You can now load and mix MP3 files stored on this server.
The music browser under the DJ mixer is optional, you can build what you want around the YouDJ mixer.

To add the YouDJ mixer on your webpage, you just need to add these 2 lines in your HTML file, no programming skills needed !
The unique CLIENT_ID is provided to you after your purchase the license.

<script type="text/javascript" src="https://you.dj/embed.js"></script>

<iframe id="youdj_mixer" width="1285" height="350" frameborder="0" src="https://you.dj/embed?YOUR_CLIENT_ID"></iframe>

The background of the YouDJ mixer is transparent, it means you can define the background you want in your CSS (colors or images).
To change the colors of the mixer itself, apply CSS filters on the iframe such as hue-rotate, saturate, sepia, brighness, contrast...
To finish, the YouDJ mixer for websites is upgraded by default with DJ level 3 (all effects and pro tools, MIDI, headphones...).

In the live demo above, it is important to understand that YouDJ mixer is the upper part only (2 decks + mixer). It means that you are free to build anything around the YouDJ mixer. However if you are looking for a quick and ready-to-use solution, we also provide a minimalist music browser which is able to list your MP3 files on your server and to load them into the YouDJ mixer.

To install the music browser, click here to download all the files and then copy them on your website. Then copy your MP3 files directly on your server into the 'music' folder. Please note that all the source code is provided so you are free to modify anything you want to fit to your needs.

If you want program your own music browser or if you want to create something a bit more complex, you will be happy to know that the YouDJ mixer comes with a javascript API. The API allows to establish a bidirectionnal communication between the embedded YouDJ mixer and your webpage. You don't have to use the API if you use our ready-to-use solution! Click here to see the API technical specifications.

function

youdj.loadsong (deckid, url, title, autoplay)

description : allows to load a MP3 file into the mixer
deckid <int> : deck number you want to load the mp3 in, must be equal to 1 (left deck) or 2 (right deck)
url <string> : absolute url of the MP3 file you want to load
title <string> : title to display for this file
autoplay <boolean> : set to true if you want this file to autoplay

youdj.loadsong(1, "https://yoursite.com/music/song.mp3", "This is an example song", true);

A note about the MP3 files
The MP3 files must be located on the same domain than the YouDJ mixer. Also cross-domain policy (CORS) must be enabled on this domain, meaning the HTTP response header must have Access-Control-Allow-Origin set to *. Click here to enable CORS on your server.

function

youdj.automix (enable)

description : allows to programmically turn on or off the automix mode
enable <boolean> : true to activate the automix, false to desactivate it

youdj.automix(true);

event

youdj.onready = function(version)

description : this event is triggered when the YouDJ mixer is loaded and ready. You must wait for this event before loading a song.
version <string> : the version of the YouDJ mixer

youdj.onready = function(version) { /* start sending commands to YouDJ */ } ;

event

youdj.oninfo = function(deckinfo1, deckinfo2)

description : this event is triggered 20 times per seconds and return the decks playback state such as the bpm, position, volume...
deckinfo1 <object> : the playback state of the deck 1 (left deck)
deckinfo2 <object> : the playback state of the deck 2 (right deck)

youdj.oninfo = function(deckinfo1,deckinfo2) { console.log("deck1 BPM = ", deckinfo1.bpm); } ;

event

youdj.onrequest = function(deckid)

description : when automix mode is enabled, this event is triggered when the YouDJ mixer needs a new song to be loaded. You are in charge to select and load the next song. In means that you can implement any kind of algorithm for generating the automix playlist.
deckid <int> : deck number which requests a new mp3 to be loaded, must be equal to 1 (left deck) or 2 (right deck)

youdj.onrequest = function(deckid) { youdj.loadsong(deckid, "https://.../newsong.mp3", "New song", false); } ;