Giter Site home page Giter Site logo

holographic-audio-visualizer's Introduction

Holographic-Audio-Visualizer

Holographic audio visualizer that plays Soundcloud playlists and animates graphics in realtime with the music. The visualizer can be controlled with hand gestures using a motion control board (powered by a Raspberry Pi).

Setup

This project runs on two different devices. A Raspberry Pi controls the Flick gesture recognition board which sends commands to the visualizer running on a more powerful Mac/Windows/Linux computer with support for webGL to run the graphics.

To start, make sure that you download this repository on the computer that you want to run the visualizer on and the Raspberry Pi.

Visualizer

The visualizer must run on a normal computer since the 3d visualizer animations lag on the Raspberry Pi. The visualizer animations are run in an Electron environment and use Three.js (a WebGL library) for 3d graphics. A server running with Node.js allows communication with the hand gesture board.

Start by installing the latest stable version of Node.js on your computer. I used version 6.x.

Next, navigate to the repository directory and run sudo npm install to install the dependencies for the project.

Start the visualizer with

npm start

The Soundcloud playlist can be changed by modifying the const playlist = 'path/to/playlist'; const in the renderer.js file. The path can be found by extracting the end of the url for a Soundcloud playlist. For example, if the url for a playlist is

https://soundcloud.com/someartist/sets/aplaylist

The const would be

const playlist = 'someartist/sets/aplaylist';

Controls

First, make sure that you have the necessary dependencies installed on your Raspberry Pi for the Flick gesture board. Start by running the following command in your terminal:

curl -sSL https://pisupp.ly/flickcode | sudo bash

Make sure to restart your Pi, then run the following command in the terminal to test your Flick board. You'll need to make sure it's wired properly before testing.

flick-demo

The controls portion of this project runs on a Raspberry Pi with a python program. You'll need to make sure that your Raspberry Pi uses python 2.7 so that the program runs properly. You can check the version of python running on your system by running:

python --version

Navigate to the controls folder in the repository directory and execute the following command to install all of the dependencies:

sudo pip install -r requirements.txt

Before running the controls program, modify the swipe-controller.py file by replacing the <HOST_IP> portion of the host = 'http://<HOST_IP>:3000' variable with the local IP of the computer running the visualizer.

Note: both computers must be on the same network. You can find the IP address of your computer by typing ifconfig (ipconfig /all on windows) in the terminal and looking for the inet address.

Run the program with

python swipe-controller.py

Once both programs are running, you can test it out!

Visualizer Interface

The visualizer is controlled with web requests. The following urls can be typed in the browser to control the visualizer.

Command Description
http://localhost:3000/next advance to the next song
http://localhost:3000/prev play the last song
http://localhost:3000/changeVis change to the next visualizer
http://localhost:3000/toggleVis toggle the visualizer colors
http://localhost:3000/toggle start/stop the current song
http://localhost:3000/volume?level=50 change the volume to 50 (can be 1 - 100)

localhost:3000 can be replaced with the local IP of your computer to control it from another device on the same network.

holographic-audio-visualizer's People

Contributors

yasinsayyed-2508 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.