Coder Social home page Coder Social logo

skeddles / jummbox2 Goto Github PK

View Code? Open in Web Editor NEW

This project forked from jummbus/jummbox

0.0 0.0 0.0 22.31 MB

An online tool for sketching and sharing instrumental melodies.

Home Page: https://jummbus.bitbucket.io/

License: MIT License

Shell 0.08% JavaScript 0.04% TypeScript 59.86% HTML 40.02%

jummbox2's Introduction

JummBox

JummBox is an online tool for sketching and sharing instrumental music. Try it out here! It is a modification of the original BeepBox, focused on improving ease-of-use.

All song data is packaged into the URL at the top of your browser. When you make changes to the song, the URL is updated to reflect your changes. When you are satisfied with your song, just copy and paste the URL to save and share your song!

BeepBox, and JummBox by extension, are passion projects and will always be free to use. If you find it valuable and have the means, please support the original creator, John Nesky, via PayPal! JummBox is developed by Jummbus.

Compiling

The compilation procedure is identical to the repository for BeepBox. I will include the excerpt on compiling from that page's readme below for convenience:

The source code is available under the MIT license. The code is written in TypeScript, which requires node & npm, so install those first. Then to build this project, open the command line and run:

git clone https://github.com/jummbus/jummbox.git
cd jummbox
npm install
npm run build

JummBox makes a divergence from BeepBox that necessitates an additional dependency: rather than using the (rather poor) default HTML select implementation, the custom library select2 is employed. select2 has an explicit dependency on jQuery as well, so you may need to install the following additional dependencies if they are not picked up automatically.

npm install select2
npm install @types/select2
npm install @types/jquery

Code

The code is divided into several folders. This architecture is identical to BeepBox's.

The synth/ folder has just the code you need to be able to play JummBox songs out loud, and you could use this code in your own projects, like a web game. After compiling the synth code, open website/synth_example.html to see a demo using it. To rebuild just the synth code, run:

npm run build-synth

The editor/ folder has additional code to display the online song editor interface. After compiling the editor code, open website/index.html to see the editor interface. To rebuild just the editor code, run:

npm run build-editor

The player/ folder has a miniature song player interface for embedding on other sites. To rebuild just the player code, run:

npm run build-player

The website/ folder contains index.html files to view the interfaces. The build process outputs JavaScript files into this folder.

Dependencies

Most of the dependencies are listed in package.json, although I'd like to note that JummBox also has an indirect, optional dependency on lamejs via jsdelivr for exporting .mp3 files. If the user attempts to export an .mp3 file, JummBox will direct the browser to download that dependency on demand.

jummbox2's People

Contributors

johnnesky avatar jummbus avatar zoadt avatar maincharacteroftheproblem avatar jummbus-2 avatar realcyguy avatar fpesari avatar forrcaho avatar jcreedcmu avatar gtrxac avatar skeddles avatar

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.