Git Product home page Git Product logo

loop-drop-app's Introduction

Loop Drop

MIDI looper, modular synth and sampler app built around Novation Launchpad controller.

Written in JavaScript and powered by Web Audio, Web MIDI, and electron.

Currently Unmaintained

I'm taking a (possibly permanent) break from this project. My efforts are now mostly focused on a hardware only version of this project for my own personal use.

The latest master is more recent than the releases, so I suggest that if you can, install from source! (master includes Ableton Link support and midi outputs).

I put a lot of work into this project over the years, but it was always a struggle trying to get Web Audio to work the way I wanted. That combined with trying to also make this an app for other people to use, took up way to much energy. I just want to get back to making music.

So long, and thanks for all the fish. โค๏ธ

Overview

Create sounds and load samples

Drop them where you want on your controllers then start jamming!

Everything you play is recorded.

Hit the loop button at any time. Whatever you just played will start to loop!

Play to the beat.

Use beat repeat and hold down buttons to trigger at different rates relative to tempo.

Transform your loops while they play.

Select, move, repeat, suppress. All using your hardware controller.

Using with a launchpad

Add as many Launchpad controllers as your need.
Loop Drop supports the MK1, Mini, MK2 and Pro editions!

๐Ÿ“บ Check out the Loop Drop YouTube channel!
or Matt's personal YouTube channel (full of Loop Drop gigs)

Using with qwerty keys

To get the most out of Loop Drop, you should use it with a hardware controller, but you can try it out using your computer's qwerty keyboard.

Video: Using Loop Drop with a Qwerty Keyboard

Loading Audio Samples

Create Triggers Chunk and drag to controller

Trigger chunks are blocks of related sounds e.g. drumkit, sliced sample, vocals, etc. They must be added to a controller before they do anything.

Select shape and drag in audio samples

Tip: You can also manually add the slot, add a sample source, then click 'Choose File' to browse.

Play!

Synthesize!

Create Chromatic Chunk and drag to controller

Chromatic chunks are like trigger chunks, except that they only have one editable trigger ('template').
This is repeated for all triggers in the block, except that the pitch increases chromatically. You can create pitched instruments using samples or synthesis.

Add Oscillators and tweak<

Clicking ENV adds an ADSR (attack, decay, sustain, release) envelope to the chosen param.

Choose Output Effects

Tip: Effects like 'reverb' should be added to the 'Output' slot instead of the triggers to avoid unnecessary CPU usage.

Build and Install from source

$ git clone https://github.com/mmckegg/loop-drop-app.git
$ cd loop-drop-app
$ npm install
$ npm start

Troubleshooting

If you receive an error on start up about missing lib/*, you may have to run the following as administrator:

Windows

# run admin
$ node scripts/link-lib.js

Linux

$ sudo node scripts/link-lib.js

If it still doesn't work, try copying the /lib folder into /node_modules.

Installing updates

New versions are being pushed out all the time. To update:

$ git pull
$ npm update
$ npm start

You can also install via npm

$ npm install -g loop-drop
$ loop-drop

# install update
$ npm update -g loop-drop

Module Overview

License

AGPL-3.0

loop-drop-app's People

Contributors

ahdinosaur avatar benbaker avatar cepko33 avatar fourseven avatar fzero avatar janmonschke avatar mmckegg avatar timpietrusky avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

loop-drop-app's Issues

missing module deps

$ npm run build

[email protected] build /home/michael/repos/mmckegg/loop-drop-app
node build -d

** REBUILD ERROR **
module "observ" not found from "./context/index.js"
** REBUILD ERROR **
module "observ/watch" not found from "./context/index.js"
** REBUILD ERROR **
module "bopper" not found from "./context/index.js"
** REBUILD ERROR **
module "observ/watch" not found from "./views/audio-meter.js"
** REBUILD ERROR **
module "observ" not found from "./editor/index.js"
** REBUILD ERROR **
module "observ/watch" not found from "./editor/index.js"
** REBUILD ERROR **
module "observ" not found from "./loop-launchpad/index.js"
** REBUILD ERROR **
module "observ/watch" not found from "./loop-launchpad/index.js"
** REBUILD ERROR **
module "observ/watch" not found from "./loop-drop-editor/raw.js"
** REBUILD ERROR **
module "observ-grid" not found from "./loop-qwerty/index.js"
** REBUILD ERROR **
module "observ-grid/grabber" not found from "./loop-qwerty/index.js"
** REBUILD ERROR **
module "observ-grid/indexes-where-contains" not found from "./loop-qwerty/index.js"
** REBUILD ERROR **
module "observ/watch" not found from "./lib/map-watch-diff-stack.js"
** REBUILD ERROR **
module "observ/watch" not found from "./controller/grid-state-hook.js"
** REBUILD ERROR **
module "observ/watch" not found from "./params/wave-hook.js"

  • loop-drop-app needs observ and bopper
  • loop-qwerty needs observ-grid
  • loop-drop-editor needs observ
  • loop-launchpad needs observ

midi port stack

multiple controllers should be able to access the same midi port, but this should be managed by some kind of stack, so that only the top most controller gets control.

switching setup tabs should reorder the midi stack so that the focussed setup's controllers are connected to the midi ports

multiplayer stratagy

Sync all clocks

Minimal server that broadcasts any received messages to all connected clients.

Ability to direct message clients. When a client learns about a new connection, direct message all current state and nickname.

Client ID is assigned by server.

Clients can set a display name

Use hash of samples as the filename so we can ensure unique files. Ideally everyone ends up with a copy of the samples and they will only be downloaded if unavailable locally. The server can cache them for a short period as well.

Request sample from server via GET. If server has sample in cache, return. Otherwise broadcast message to all clients asking who has the file. Tell one (or more) of the clients that reply to POST the file to the sample url. As soon as the file starts being received, pipe to all pending GET requests for that file.

better handling of flatten vs store

currently all control mappings are switching between store and flatten loop modes depending on current transforms. this can be quite annoying when laying down repeating notes, and accidently just looping the one.

maybe split the two into separate functions so you always know if it is going to flatten the transforms, or loop what was just played.

will require some documentation rewriting (but it's all useless anyway so who cares)

do we need inline chunks?

It's a bit unwieldy having chunks all over the place for all the different setups in one list. How often do you really want the chunk to update bidirectionally?

what if the chunk library was just a repo of reusable chunks?

optimise code for vu meter

the current mercury stuff is too slow for the 60fps audio meter
move to cached element, class swapping
or use an html5 element, svg, or canvas?

Disabling the meter freed up about 20% of the frame time for scheduling audio

qwerty key bindings for loop-grid

So it can be used without a midi-controller.

Not sure if it should be it's own "controller", or if all loop-grid instances should support qwerty input.

Build issue 'module "loop-qwerty" not found'

When building I get this issue I presume a module needs to be included/uploaded to npm.

** REBUILD ERROR **
module "loop-qwerty" not found from "C:\Users<username>\Documents\GitHub\loop-drop-app\midi-controllers.js"

new setup based project structure

Move to 'setup as a directory' approach.

Remove separate chunk browser pane. Replace with a single hierarchical tree browser. Double clicking on a directory attempts to load an index.json. Hide index files from browser.

This is a major breaking change. Probably will have to bump major.

New project structure:

Project Root
  - Setup 1
     - index.json
     - chunk 1.json
     - chunk 2.json
     - sample 1.wav
     - sample 2.wav
  - Setup 2
     - index.json
     - chunk 1.json
     - chunk 2.json
     - sample 1.wav
     - sample 2.wav

as an artist, i can generate a url to share loop

maybe this bundles javascript as a static gist that can be hosted to play the loop at that url.
maybe this contacts a "loop server" which hosts a page to play the loop at that url.

in the future, the "loop player" pages can have a link to open up the loop in the "loop editor".

sampler chunk

slices target sample into slices based on chunk shape

timestretch option (uses granular)

  • set tempo
  • trim

play to end option

npm install dependency issue on global-setups branch

I was able to run npm install (etc fine on the master branch)

However when I tried to run npm install on the global-setups branch npm complains: No compatible version found: loop-grid@'>=3.1.0-0 <4.0.0-0'

Do you need to push the latest version of loop-grind to npm? (the current version is 3.0.0)

npm WARN package.json [email protected] repo should probably be repository.
npm WARN package.json [email protected] No README data
npm WARN package.json [email protected] No repository field.
npm ERR! notarget No compatible version found: loop-grid@'>=3.1.0-0 <4.0.0-0'
npm ERR! notarget Valid install targets:
npm ERR! notarget ["1.0.0","1.1.0","1.2.0","1.2.1","1.3.0","1.4.0","1.5.0","2.0.0","3.0.0"]
npm ERR! notarget
npm ERR! notarget This is most likely not a problem with npm itself.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.

npm ERR! System Windows_NT 6.1.7601
npm ERR! command "C:\\Program Files\\nodejs\\\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js"
 "install"
npm ERR! cwd C:\Users\<username>\Documents\GitHub\loop-drop-app
npm ERR! node -v v0.10.32
npm ERR! npm -v 1.4.28
npm ERR! code ETARGET
npm ERR! not ok code 0

don't extend AudioContext

Instead pass project context as second argument to node creation.

Available audio-nodes can be set like controllers or chunks in an audio-nodes.js config file.

See #36 and #44

use webtorrent to share setup bundles

Setups get a share button.

It generates a torrent and starts seeding giving the user a sharable loop drop url.

When a user accesses the url, it puts the remote setup into their own project.

handle multiple controllers (nicely)

Instead of having individual spawners for each controller, maybe have just one "loop grid".

The loop grid node allows specifying sub nodes which would be the different controllers. Then they can share a lot of the render code and styling.

Maybe need to rethink the code hierarchy of controllers inheriting from loop-grid?

double click to edit chunk

by default, chunk pane is hidden

setup pane is fullscreen

  • should the chunks load into the main tabbed view? rather than split
  • would give a lot more room for customizing chunks
  • could do a proper grid selector for the chunk editor

improve chunk spawning

When spawning external chunks from chunk spawner, rename on chunk reference, instead of in file browser. Don't open it immediately.

Do the same renaming with local chunks too.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.