Launchpad Programming

[mrharpo]

Launchpad

The Novation Launchpad is a USB class compliant MIDI device, just like a digital piano, or drum pad, but with lights and some fancy features under the hood.

Versions

There are 3 generations of Launchpads, the earlier ones do not have as many features as the later ones, but they all share the same basic protocol for sending and receiving data, and they can all be used for this project.

Earliest versions (original Launchpad, LaunchpadS) have a very reduced feature set, but still communicate in the same general way.

Language

Python

The simplest approach is sending the MIDI commands with Python.

For a simple, but fully fledged example, see launchchess-python.

I also use Launchpads for music control. A more complicated example of Launchpad operation can be found in the Holophonor project.

Javascript

In order to make a MIDI webapp (like launchchess.com), the control logic needs to run in a browser, which can only run Javascript.

This repository is designed as a simple webapp (served by Python), to allow a browser to interact with the Launchpad as a chess board, using most modern browsers.

Protocol

The best way to become familiar with the features and protocols of any Launchpad is with its Programmer's Reference Guide for your specific device.

These are available at https://downloads.novationmusic.com/novation

[CrazyH2]

Ok, thank you do much this will be really useful!

[mrharpo]

@CrazyH2 Replying to your other question here:

Yes, I'm still maintaining this repo! I haven't had time to develop features lately, but I always accept pull requests! 😄

See the issue list for some ideas on new features, or feel free to suggest new ones!

[CrazyH2]

Ok thank you, I will add some more as I have a few ideas. 😄

[CrazyH2]

@mrharpo

Hi, when using inspect, I realised it loads a script called index.6976356c.js (https://launchchess.com/index.6976356c.js).
How is this script generated, as there is no script inside /web/src/ that has this name or its contents?
I don't use Docker much so I don't know whether it's that or something else.

I have remade all the code that needed docker to no longer need it but just wanted to know how I could still make it generate that file.
Don't worry if you don't know, but I thought it was worth a try.

Thanks in advance,
CrazyH

[mrharpo]

Yes, this is the production js file, which is the source files transpiled and minified for transit. It is built from the web/src/ files using parceljs to build the javascript modules into code that can run in a browser.

For a more developer friendly look at the source files in action, you will either have to build the files locally using a parcel development server with parcel --dist-dir dist src/index.html, or use the included shortcut script, which is set to build the correct docker images and start a dev server (recommended!):

./launchchess dev

[CrazyH2]

Thanks for helping, I managed to get it all working!
I'll keep you updated on what else I manage to get done!

Thanks,
CrazyH

[CrazyH2]

Hi @mrharpo,

I have just finished rewriting the oauth for the backend and the parceljs is still giving me errors.

The local mode and online mode both have the issue. Parceljs is not bundling it correctly for some reason and gives the error:

TypeError: undefined is not an object (evaluating 'e.SQUARES.forEach')
$3de23e0577f75d48$export$7dc676b6dd72d281 — utils.js:8
oncreate — Games.js:149

I know that it is something that I have done wrong as if I just copy the bundled files you are using it all works.
I am using "parcel build web/src/index.html --dist-dir dist" to bundle it.

Thanks in advance,
CrazyH

[mrharpo]

Hi, @CrazyH2. Just getting around to this:

Did you install the js dependencies?

yarn install

... or (recommended) with docker + init script:

./launchchess init

It works for me when I do a fresh clone, and ./launchchess init && ./launchchess dev, and go to localhost:5555.

If it doesn't work, can you post more details, like the stack trace with screenshots?

Hope that helps!

[CrazyH2]

@mrharpo ^

[CrazyH2]

Hi, @mrharpo

Yes, I have installed all dependencies and I rewrote the code in NodeJS so it no longer uses docker.

I know the issue is with chess.js and when I look at its src it defines SQUARES but then it is undefined.
I know nodeJs isn't causing the issue as I am running a shell command from nodejs to bundle it.

Here is the version that I rewrote (This could take up to 15secs to load the page as I am using replit): https://launchchess-1.crazyh.repl.co

[CrazyH2]

This is what i saw when looking in console:

Where it has chess: $75c179ea5d911d9c$export$a4d6ea685c300d39 is the chess.js class which doesn't seem to have SQUARES but it exports the value in the src

it exported but not in the class chess so I know how to fix it but just wondering which way to. I could edit the module or I could edit the frontend js

[Log]  (2) (index.7e054468.js, line 2065)
Object

animationDuration: 400

animations: [] (0)

changeLayout: null

chess: $75c179ea5d911d9c$export$a4d6ea685c300d39

_board: [{type: "r", color: "b"}, {type: "n", color: "b"}, {type: "b", color: "b"}, {type: "q", color: "b"}, {type: "k", color: "b"}, {type: "b", color: "b"}, {type: "n", color: "b"}, {type: "r", color: "b"}, 16: {type: "p", color: "b"}, 17: {type: "p", color: "b"}, …] (128)

_castling: {w: 96, b: 96}

_comments: {}

_epSquare: -1

_halfMoves: 0

_header: {}

_history: [] (0)

_kings: {w: 116, b: 4}

_moveNumber: 1

_turn: "w"

$75c179ea5d911d9c$export$a4d6ea685c300d39 Prototype

color: "w"

colors: {p: 13, r: 9, n: 45, b: 37, q: 53, …}

connected: false

deviceId: null

deviceName: null

deviceType: null

game: null

games: function(t)

grid: true

ground: null

header: null

history: function(t)

influence: false

input: null

inputName: null

inputs: function(t)

invert: function(t)

layout: null

opponent: null

output: null

outputName: null

outputs: function(t)

pieces: true

selectedPiece: null

selectedSquare: null

theme: "dark"

top: [91, 92, 93, 94, 95, 96, 97, 98, 99] (9)

Object Prototype
Object

[CrazyH2]

I just fixed the issue by going back to version 0.12.1

[mrharpo]

@CrazyH2 Awesome! 🥳 Glad you found a workaround!

I just updated the dependencies, and migrated chess.js to the latest 1.0-beta release, and fixed the SQUARES issue by using the internally generated one in utils.js

Try it out from the branch in the PR, and see if that works for you.

[mrharpo]

By the way, you should also be able to run everything with yarn (no docker required)

yarn install
yarn parcel --port 5555 --no-cache --dist-dir dist src/index.html