All Projects → afreakk → ChromeAudioVisualizerExtension

afreakk / ChromeAudioVisualizerExtension

Licence: other
Audio Visualizer extension for chrome/chromium

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to ChromeAudioVisualizerExtension

music visualizer
Shader viewer / music visualizer for Windows and Linux
Stars: ✭ 137 (+163.46%)
Mutual labels:  visualizer, music-visualizer
midi-recorder
🎹 The easiest way to record MIDI. No install. Automatically records.
Stars: ✭ 38 (-26.92%)
Mutual labels:  visualizer, music-visualizer
drop
A LÖVE visualizer and music player
Stars: ✭ 17 (-67.31%)
Mutual labels:  visualizer, music-visualizer
catnip
terminal audio visualizer for linux/unix/macOS/windblows*
Stars: ✭ 79 (+51.92%)
Mutual labels:  visualizer, music-visualizer
Visualizer
UI-Router state visualizer and transition visualizer
Stars: ✭ 205 (+294.23%)
Mutual labels:  visualizer
Zookeeper Visualizer
zookeeper的可视化管理工具
Stars: ✭ 150 (+188.46%)
Mutual labels:  visualizer
Django Netjsongraph
Network Topology Visualizer & Network Topology Collector
Stars: ✭ 131 (+151.92%)
Mutual labels:  visualizer
Giraffeql
🦒 Developer tool to visualize relational databases and export schemas for GraphQL API's.
Stars: ✭ 128 (+146.15%)
Mutual labels:  visualizer
libvisual
Libvisual Audio Visualization
Stars: ✭ 67 (+28.85%)
Mutual labels:  music-visualizer
berkeley-parser-analyser
A tool for classifying mistakes in the output of parsers
Stars: ✭ 34 (-34.62%)
Mutual labels:  visualizer
Vudio.js
音频可视化展示模块
Stars: ✭ 194 (+273.08%)
Mutual labels:  visualizer
Rxfiddle
Visualize your Observables
Stars: ✭ 157 (+201.92%)
Mutual labels:  visualizer
Expressiontreevisualizer
Debugging visualizer for expression trees
Stars: ✭ 237 (+355.77%)
Mutual labels:  visualizer
Kaitai struct visualizer
Kaitai Struct: visualizer and hex viewer tool
Stars: ✭ 137 (+163.46%)
Mutual labels:  visualizer
shortest-path-finder
Shortest Path Finder visualizer using Breadth First Search algorithm
Stars: ✭ 195 (+275%)
Mutual labels:  visualizer
Orbit
C/C++ Performance Profiler
Stars: ✭ 2,291 (+4305.77%)
Mutual labels:  visualizer
Kaitai struct webide
Online editor / visualizer for Kaitai Struct .ksy files
Stars: ✭ 175 (+236.54%)
Mutual labels:  visualizer
Xstate
State machines and statecharts for the modern web.
Stars: ✭ 18,300 (+35092.31%)
Mutual labels:  visualizer
Visualee
A maven plugin to visualize java ee projects
Stars: ✭ 169 (+225%)
Mutual labels:  visualizer
Visualizer
A single-page website aiming to provide innovative and intuitive visualizations of common and AI algorithms.
Stars: ✭ 163 (+213.46%)
Mutual labels:  visualizer

AudioVisualizer

♬♫♪◖(●。●)◗♪♫♬ put on some music and turn your browsing session into a party! ┐(・。・┐) ♪
by pressing the av icon or default hotkey: 'Ctrl+Q'
install from the Chrome webstore
or git clone & install the unpacked extension
if you want to contribute, contact me: laderud(a-t)hotmail.com, for an explanation of the code :)

To create your own scene from scratch, copy js/scenes/genericScene.js, to js/scenes/yourSceneName.js, search for and replace "GenericScene" with scene name of your chosing. Also set this.name = 'YourSceneName' where it says SpectrumAnalyziz. (this is the displayed name).
You also need to add the JavaScript file to scriptsToInject.js in the AV.scripts.scenes array.
Then do you own thing inside the update method, (all scenes within the AudioScenes namespace will automatically get picked up by SceneManager, so you should see it in the extension scene dropdown list) g.ctx is the canvas context, and g.byteFrequency is the spectrum data you can use to move thing around the scene.

If you want to use WebGL, look at worldScene.js for inspiration, (the simple SpinningCube scene).
When done, I can merge your scene into the extension :)

Credits to jberg for butterchurn (milkdrop scenes)

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].