1
- import SuperpoweredModule from '.. /superpowered.js'
1
+ import { SuperpoweredGlue , SuperpoweredWebAudio } from './superpowered/SuperpoweredWebAudio .js' ;
2
2
3
3
const states = { NOTRUNNING : 'START' , INITIALIZING : 'INITIALIZING' , RUNNING : 'STOP' }
4
4
5
5
var state = states . NOTRUNNING ;
6
- var audioContext = null ; // Reference to the audio context.
7
- var audioNode = null ; // This example uses one audio node only.
6
+ var webaudioManager = null ; // The SuperpoweredWebAudio helper class managing Web Audio for us.
8
7
var Superpowered = null ; // Reference to the Superpowered module.
8
+ var audioNode = null ; // This example uses one audio node only.
9
9
10
10
function setState ( newState ) {
11
11
state = newState ;
@@ -20,9 +20,9 @@ function onMessageFromAudioScope(message) {
20
20
async function toggleAudio ( ) {
21
21
if ( state == states . NOTRUNNING ) {
22
22
setState ( states . INITIALIZING ) ;
23
- audioContext = Superpowered . getAudioContext ( 44100 ) ;
23
+ webaudioManager = new SuperpoweredWebAudio ( 44100 , Superpowered ) ;
24
24
25
- let micStream = await Superpowered . getUserMediaForAudioAsync ( { 'fastAndTransparentAudio' : true } )
25
+ let micStream = await webaudioManager . getUserMediaForAudioAsync ( { 'fastAndTransparentAudio' : true } )
26
26
. catch ( ( error ) => {
27
27
// called when the user refused microphone permission
28
28
console . log ( error ) ;
@@ -31,44 +31,52 @@ async function toggleAudio() {
31
31
if ( ! micStream ) return ;
32
32
33
33
let currentPath = window . location . pathname . substring ( 0 , window . location . pathname . lastIndexOf ( '/' ) ) ;
34
- audioNode = await Superpowered . createAudioNodeAsync ( audioContext , currentPath + '/processor.js' , 'MyProcessor' , onMessageFromAudioScope ) ;
35
- let audioInput = audioContext . createMediaStreamSource ( micStream ) ;
34
+ audioNode = await webaudioManager . createAudioNodeAsync ( currentPath + '/processor.js' , 'MyProcessor' , onMessageFromAudioScope ) ;
35
+ let audioInput = webaudioManager . audioContext . createMediaStreamSource ( micStream ) ;
36
36
audioInput . connect ( audioNode ) ;
37
- audioNode . connect ( audioContext . destination ) ;
37
+ audioNode . connect ( webaudioManager . audioContext . destination ) ;
38
38
setState ( states . RUNNING ) ;
39
39
} else if ( state == states . RUNNING ) {
40
40
// stop everything
41
- audioContext . close ( ) ;
42
- audioContext = audioNode = null ;
41
+ webaudioManager . audioContext . close ( ) ;
42
+ webaudioManager = audioNode = null ;
43
43
setState ( states . NOTRUNNING ) ;
44
44
}
45
45
}
46
46
47
- SuperpoweredModule ( {
48
- licenseKey : 'ExampleLicenseKey-WillExpire-OnNextUpdate' ,
49
- enableAudioEffects : true ,
50
- enableAudioAnalysis : true ,
47
+ async function loadJS ( ) {
48
+ // download and instantiate Superpowered
49
+ Superpowered = await SuperpoweredGlue . fetch ( './superpowered/superpowered.wasm' ) ;
50
+ Superpowered . Initialize ( {
51
+ licenseKey : 'ExampleLicenseKey-WillExpire-OnNextUpdate' ,
52
+ enableAudioAnalysis : true ,
53
+ enableFFTAndFrequencyDomain : false ,
54
+ enableAudioTimeStretching : false ,
55
+ enableAudioEffects : true ,
56
+ enableAudioPlayerAndDecoder : false ,
57
+ enableCryptographics : false ,
58
+ enableNetworking : false
59
+ } ) ;
51
60
52
- onReady : function ( SuperpoweredInstance ) {
53
- Superpowered = SuperpoweredInstance ;
54
- // UI: innerHTML may be ugly but keeps this example small
55
- document . getElementById ( 'content' ) . innerHTML = '\
56
- <p>Put on your headphones first, you\'ll be deaf due audio feedback otherwise.</p>\
57
- <p id="audioStack" style="font-style: italic"></p>\
58
- <p><button id="btn">-</button></p>\
59
- <p>Reverb wet: <input type="range" min="0" max="100" value="50" class="reverbslider" id="wet"></p>\
60
- <p>Filter frequency: <input type="range" min="0" max="100" value="50" class="filterslider" id="freq"></p>\
61
- ' ;
61
+ // UI: innerHTML may be ugly but keeps this example small
62
+ document . getElementById ( 'content' ) . innerHTML = '\
63
+ <p>Put on your headphones first, you\'ll be deaf due audio feedback otherwise.</p>\
64
+ <p id="audioStack" style="font-style: italic"></p>\
65
+ <p><button id="btn">-</button></p>\
66
+ <p>Reverb wet: <input type="range" min="0" max="100" value="50" class="reverbslider" id="wet"></p>\
67
+ <p>Filter frequency: <input type="range" min="0" max="100" value="50" class="filterslider" id="freq"></p>\
68
+ ' ;
62
69
63
- document . getElementById ( 'audioStack' ) . innerText = window . AudioWorkletNode ? 'worklet' : 'legacy' ;
64
- document . getElementById ( 'btn' ) . onclick = toggleAudio ;
65
- document . getElementById ( 'wet' ) . oninput = function ( ) {
66
- if ( audioNode != null ) audioNode . sendMessageToAudioScope ( { 'wet' : this . value } ) ;
67
- }
68
- document . getElementById ( 'freq' ) . oninput = function ( ) {
69
- if ( audioNode != null ) audioNode . sendMessageToAudioScope ( { 'freq' : this . value } ) ;
70
- }
71
-
72
- setState ( states . NOTRUNNING ) ;
70
+ document . getElementById ( 'audioStack' ) . innerText = window . AudioWorkletNode ? 'worklet' : 'legacy' ;
71
+ document . getElementById ( 'btn' ) . onclick = toggleAudio ;
72
+ document . getElementById ( 'wet' ) . oninput = function ( ) {
73
+ if ( audioNode != null ) audioNode . sendMessageToAudioScope ( { 'wet' : this . value } ) ;
73
74
}
74
- } ) ;
75
+ document . getElementById ( 'freq' ) . oninput = function ( ) {
76
+ if ( audioNode != null ) audioNode . sendMessageToAudioScope ( { 'freq' : this . value } ) ;
77
+ }
78
+
79
+ setState ( states . NOTRUNNING ) ;
80
+ }
81
+
82
+ loadJS ( ) ;
0 commit comments