Jump To …

ui-audio.js

This module supplies the functionality behind the buttons that control the audio playback.

define(
    ['jquery', 'underscore', 'audio'],
    function($, _, audio) {

    function setup() {


Add button state style transitions to the mouse events of all playback buttons.

        $('.play-button').mousedown(function(e) {
            $('.play-button').removeClass('play-button-on');
            $('.play-button').removeClass('button-down');
            $(this).addClass('play-button-on');
            $(this).addClass('button-down');
        });
        $('.stop-button').mousedown(function(e) {
            $('.play-button').removeClass('play-button-on');
            $('.stop-button').removeClass('stop-button-on');
            $('.stop-button').removeClass('button-down');
            $(this).addClass('stop-button-on');
            $(this).addClass('button-down');
        });
        $('.play-button').mouseup(function(e) {
            $(this).removeClass('button-down');
        });
        $('.play-button').mouseleave(function(e) {
            $(this).removeClass('button-down');
        });
        $('.stop-button').mouseup(function(e) {
            $(this).removeClass('button-down');
            $(this).removeClass('stop-button-on');
        });
        $('.stop-button').mouseleave(function(e) {
            $(this).removeClass('button-down');
        });


Map every playback button to an audio file.

        var trackButtons = {
            '#track01': 'audio/funkyguitar.mp3',
            '#track02': 'audio/saxophone.mp3',
            '#track03': 'audio/jazzpiano.mp3',
            '#track04': 'audio/ocean.mp3',
            '#track05': 'audio/drumnbass.mp3',
            '#track06': 'audio/hiphopbeat.mp3',
            '#track07': 'audio/breaks.mp3',
            '#track08': 'audio/psytrance.mp3'
        };
        _.each(trackButtons, function(audioFile, buttonSelector) {
            $(buttonSelector + '-play').click(function(e) {
                currentAudio = audioFile;
                audio.playAudio(audioFile);
                e.preventDefault();
            });
            $(buttonSelector + '-stop').click(function(e) {
                e.preventDefault();
                audio.stopAudio();
            });
         });

    }

    return { setup: setup };
});