Code Monkey home page Code Monkey logo

blokdust's Introduction

BlokDust

Build Status

BlokDust is a web-based music making app. By joining blocks together, you can build synthesizers, put effects on your voice, remix & manipulate samples and arrange self-playing musical environments.

You can share what you make and if you want, you can expand on other people's creations. You can also contribute by tagging your tracks in SoundCloud with #blokdust so that your music is available for people to play with in the app.

Play the app at blokdust.com

BlokDust

Visit our Youtube channel to view some examples of the app in action and follow us on Facebook and Twitter for updates. Also, share your creations with each other on the BlokDust Subreddit.

Guide

For tutorials, examples and other related features please visit our wiki/user companion site guide.blokdust.com

Frequently Asked Questions

guide.blokdust.com/frequently-asked-questions/

Requirements

Chrome browser recommended, desktop or tablet and an internet connection. If you have one, use a MIDI key controller for the best experience!

Contributing

We’ll hopefully be publishing some developer notes when we have time. There’s a lot of things we’ve explored for the first time with this project and plenty that can be improved so we welcome any extra insight.

Clone the repository

git clone https://github.com/BlokDust/BlokDust.git

Prerequisites

Blokdust needs these things to work:

Workflow

npm install to install the dependencies.

Serve Blokdust on localhost:8000:

grunt serve:dev

Serve Blokdust on localhost:8000 and update on changes:

grunt watch:dev

Build & compile project to dist folder:

grunt dist

Contact

Get in touch with us at [email protected]

blokdust's People

Contributors

bsick7 avatar edsilv avatar lukephills avatar rholinshead avatar whitevinyl 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

blokdust's Issues

Effect connection unexpected behaviours

TEST:
make two Tonesource blocks, and one LFO block.
Position the LFO so it's connected to both sources.
Both Sources will be affected by the LFO.
Now move the LFO so that it's only connected to one of the Source blocks.
Neither Source is affected by the LFO despite one being visibly connected.

record block positions

make it possible to record the positions of blocks over time between right clicks over a span of 10 secs.

config.json

Add settings such as MaxOperations and the image path for PixelPalette to config.json. This should be a JSON.Stringified Config.ts

Minify using r.js

Need to figure out how to set the base url to the .build directory where the compiled js is copied to.

  • appDir
  • baseUrl
  • dir

I imagine there is a magical combination of these.

Make param settings undoable

Use ChangePropertyOperation.ts

This example shows block position changes

// if the block has moved, create an undoable operation.
if (!Point.isEqual(this.SelectedBlock.Position, this.SelectedBlock.LastPosition)){
    var op:IUndoableOperation = new ChangePropertyOperation<IBlock>(this.SelectedBlock, "Position", this.SelectedBlock.LastPosition.Clone(), this.SelectedBlock.Position.Clone());
    App.OperationManager.Do(op);
}

Make PixelPalette loadable using require.js

Note: we should try to keep things out of require-config.js (Tone.js is still in there until I figure out another way to set window.Tone = Tone). Instead put things in Fayde.json. This keeps all our libs separate from the main fayde ones (fayde.json is passed to require.js too).

group select

make it possible to drag to select multiple blocks

Add version number to saved JSON

When loading JSON it can inspect this version number in order to provide backward compatibility for deprecated blocks/schema.

Add the concept of "scenes"

So the app knows when to display/enable certain elements. Will be useful for preloading (ie we start at scene 0 and only move to scene 1 after all loading & initialisation is complete) and also transitioning from a splash screen to the main view.

Make Params changes undoable

A mouseup on a slider could create an Update_Param command. Alternatively, we could create an Update_Params command when the dialogue is closed.

Dragged block moves to front

switch to last in array? so that it draws last. Not sure what else depends on the ID so don't know if that creates any issues.
Also there's a minor bug where multiple blocks can answer true to isPressed if they're stacked on top of each other, only the top onebecomes dragable though

Poly Keyboard has various bugs

  1. Need to fix trigger release when multiple keys are pressed.
  2. Connect more than 3 sources to poly keyboard and then not all keys release
  3. Make it work with the playback rate sources

Add POWER: Switch

Start us on the path of simple logic with a switch that toggles when powered. When "on" acts the same as a bower block.

OperationManager.Dispose

When the OperationManager exceeds MaxOperations, call Dispose on the Operation being popped off the start of the array.

The Dispose method is implemented for each Operation as a way of clearing down any in-memory objects. For example, DeleteBlockOperation stores this._Block, which should be deleted from memory.

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.