SoundManager 2: Turntable UI
An experimental HTML + CSS design inspired by the infamous Technics 1200 turntable.
This project is a remix of The Wheels Of Steel, using a subset of features from the original.
Click a link to load it on the turntable.
- Figub Brazlevič - Bosnian Syndicate (BY-CC-ND license, via)
- Beckyoncé - Single Loser (Put A Beck On It) (BY-NC-SA license, via)
- Chill With Schill (Summer 2012 Session Excerpt)
- SonReal - L.A. (Prod. Injetti)
HTML data attributes can be used to specify which turntable to use, and an optional album artwork image. You can also skin the turntable with background images, textures and colors.
- Figub Brazlevič - Bosnian Syndicate (BY-CC-ND, via)
- Beckyoncé - Single Loser (Put A Beck On It) (BY-NC-SA license, via)
- SonReal - L.A. (Prod. Injetti)
- SonReal - Everything I Am
JavaScript API
Refer to the window.turntables array, where you can call methods such as turntables[0].methods.powerToggle(). There is also a turntablesById object, where the ID is based on the HTML id attribute of the top-level turntable <div>.
General Disclaimer
This is an experimental prototype provided "unsupported" and "as-is", and a million things could be added; few are planned or will be implemented. Pitch bending support would require a Web Audio API implementation, not a part of SM2 at present. See the Wheels Of Steel project for the original feature list. Percentage-based scaling in this prototype means that some elements may shift slightly, and may not always be exactly square or round etc.