source: main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/js/in-the-groove.js@ 29883

Last change on this file since 29883 was 29883, checked in by davidb, 9 years ago

Next round of development. Fixed up clicking on text over drum images. Added guitar chords. Change that might help Safari web audio

File size: 2.1 KB
Line 
1//"use strict";
2
3// https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createScriptProcessor
4
5var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
6
7if( 'webkitAudioContext' in window) {
8 console.log("*** Web Audio found in webkit namespace");
9 audioCtx = new webkitAudioContext();
10}
11
12var InTheGroove = false;
13var MissingTheGroovePending = false;
14
15//var bufferSize = 4096;
16var bufferSize = 512;
17
18
19//window.addEventListener('load', onLoad, false);
20
21
22var prev_input = [0,0];
23
24var tinnyEffectNode = null;
25
26$(document).ready(function() {
27 $('#video').on('loadedmetadata', function() {
28
29 displayDuration(this.duration);
30
31 // Create a MediaElementAudioSourceNode
32 // Feed the HTMLMediaElement into it
33 var source = audioCtx.createMediaElementSource(this);
34 console.log("**** video source = " + source);
35
36 // connect the AudioBufferSourceNode to the tinnyEffectNode
37 // and the tinnyEffectNode to the destination, so we can play the
38 // music and have the filter 'kick in' when 'Missing Out' button
39 // pressed
40
41 tinnyEffectNode = audioCtx.createScriptProcessor(bufferSize, 2, 2);
42 tinnyEffectNode.onaudioprocess = function(e) {
43
44 for (var c = 0; c<2; c++) {
45 var input = e.inputBuffer.getChannelData(c);
46 var output = e.outputBuffer.getChannelData(c);
47
48
49 for (var i = 0; i < bufferSize; i++) {
50 if ( ((mediaPlaybackMode == "neutral") || (mediaPlaybackMode == "record"))
51 || InTheGroove) {
52 output[i] = input[i];
53 }
54 else {
55 // Make sound 'tinny' through simple high-pass filter
56 output[i] = input[i] - prev_input[c];
57 }
58
59 prev_input[c] = input[i];
60 }
61 }
62 }
63
64 source.connect(tinnyEffectNode);
65 tinnyEffectNode.connect(audioCtx.destination);
66
67 console.log("onLoadMetadata done");
68 });
69
70});
71
72function inTheGroove()
73{
74 InTheGroove = true;
75 MissingTheGroovePending = false;
76}
77
78function missingTheGroove()
79{
80 if (MissingTheGroovePending) {
81 InTheGroove = false;
82 }
83 MissingTheGroovePending = false;
84}
85
86function delayedMissingTheGroove(delay)
87{
88 MissingTheGroovePending = true;
89 setTimeout(missingTheGroove,delay || 400);
90}
91
92
Note: See TracBrowser for help on using the repository browser.