{"ast":null,"code":"var _jsxFileName = \"/Users/shanyi/Desktop/Projects/UC_Trains_Voice/react-demo/src/gavt/Wave/WaveCanvas.jsx\",\n  _s = $RefreshSig$();\n// Manually created for GAVT project on 2024-06-03, based on commit 10df1d9 of the original project\nimport { useRef, useEffect } from 'react';\nimport useUserMedia from './useUserMedia';\nimport { initAudio, updateCoeffsOffline, updateData, FRAME_SIZE } from './waveAudio';\nimport './Wave.css';\n\n// =====================================================\nimport { jsxDEV as _jsxDEV } from \"react/jsx-dev-runtime\";\nconst WaveCanvas = props => {\n  _s();\n  const {\n    draw,\n    // this is the drawLoop sketch\n    isPaused,\n    // req'd for renderer\n    isTracking,\n    strokeStyle = \"#50D3D6\",\n    ...rest\n  } = props;\n\n  // Audio Vars ------\n  const SAMPLE_RATE = 44100;\n  const refAudioCtx = useRef(null);\n  const analyser = useRef();\n  let microphone = useRef(null);\n  let audioData = []; // Holds the time domain data.\n  let lastReceivedCoeffs = []; // self-explanatory\n  const BROADCASTS_PER_SECOND = 6; // used in audioData Interval, affects drawing smoothness, and will eventually be used with Vonage\n\n  // Canvas Vars -------\n  const refCanvas = useRef(); // html holds canvasEle\n  const refCtx = useRef(); // holds canvas drawing ctx\n  const refAniId = useRef(); // holds window.requestAnimationFrame\n  let count = 0; // just a var to count the draw loops\n  let drawData = {\n    magnitudes: [],\n    peaks: []\n  }; // set each audio interval\n\n  // Services ---------\n  const {\n    stream,\n    error,\n    getMedia\n  } = useUserMedia();\n\n  // ------------------------------------------------\n  const renderer = () => {\n    let ctx = refCtx.current;\n    count++;\n    drawData = updateData(drawData, lastReceivedCoeffs, isTracking);\n    if (!isPaused) {\n      // drawLoop. Drawing is passed in thru props.\n      draw(ctx, count, drawData.magnitudes, drawData.peaks, strokeStyle); // FOR WAVE CUSTOMIZATION!\n    }\n    refAniId.current = window.requestAnimationFrame(renderer, isPaused, isTracking);\n  };\n\n  // onMount & onWillUnmount ------------------------------------------------\n  useEffect(() => {\n    refCtx.current = refCanvas.current.getContext('2d');\n    let interval;\n    if (!stream) {\n      getMedia();\n    }\n    if (stream) {\n      console.log('canvas has stream');\n      console.log('stream.active = ' + stream.active);\n\n      // Anything that attaches to a DOM ele should be CREATED here with a ref.\n      // Once the refs are init'd/created, they can be passed to external scripts for maipulation.\n      refAudioCtx.current = new AudioContext({\n        sampleRate: SAMPLE_RATE\n      });\n      analyser.current = refAudioCtx.current.createAnalyser();\n\n      // I assume this will be needed later...but I don't really know\n      microphone.current = refAudioCtx.current.createMediaStreamSource(stream);\n\n      // configs the analyser to our mic input\n      analyser.current = initAudio(microphone.current, refAudioCtx.current, analyser.current);\n\n      // ready to send to audioData to LPC script, which we will do at an interval\n      interval = setInterval(() => {\n        // console.log('audioData interval');\n        // creates a 1D array\n        audioData = new Float32Array(analyser.current.fftSize);\n        // updates that array with analyser data\n        analyser.current.getFloatTimeDomainData(audioData);\n\n        // call to audio script\n        lastReceivedCoeffs = updateCoeffsOffline(audioData);\n      }, Math.round(1000 * (FRAME_SIZE / SAMPLE_RATE)));\n      console.log(Math.round(1000 * (FRAME_SIZE / SAMPLE_RATE)));\n      console.log('audioReady. Starting render');\n      renderer();\n    }\n\n    // onUnmount -----------------\n    return () => {\n      clearInterval(interval);\n      console.log('cancel render / cancelAnimationFrame');\n      window.cancelAnimationFrame(refAniId.current);\n    };\n  }, [stream, isPaused, isTracking]);\n\n  // _________________________________________\n  return /*#__PURE__*/_jsxDEV(\"canvas\", {\n    className: \"fullWidth\",\n    ref: refCanvas,\n    ...rest,\n    children: \"Please use an HTML5 browser.\"\n  }, void 0, false, {\n    fileName: _jsxFileName,\n    lineNumber: 98,\n    columnNumber: 7\n  }, this);\n};\n_s(WaveCanvas, \"bFd9X1ufgyl2Uvcu7Z2+Kqb6qIs=\", false, function () {\n  return [useUserMedia];\n});\n_c = WaveCanvas;\nexport default WaveCanvas;\nvar _c;\n$RefreshReg$(_c, \"WaveCanvas\");","map":{"version":3,"names":["useRef","useEffect","useUserMedia","initAudio","updateCoeffsOffline","updateData","FRAME_SIZE","jsxDEV","_jsxDEV","WaveCanvas","props","_s","draw","isPaused","isTracking","strokeStyle","rest","SAMPLE_RATE","refAudioCtx","analyser","microphone","audioData","lastReceivedCoeffs","BROADCASTS_PER_SECOND","refCanvas","refCtx","refAniId","count","drawData","magnitudes","peaks","stream","error","getMedia","renderer","ctx","current","window","requestAnimationFrame","getContext","interval","console","log","active","AudioContext","sampleRate","createAnalyser","createMediaStreamSource","setInterval","Float32Array","fftSize","getFloatTimeDomainData","Math","round","clearInterval","cancelAnimationFrame","className","ref","children","fileName","_jsxFileName","lineNumber","columnNumber","_c","$RefreshReg$"],"sources":["/Users/shanyi/Desktop/Projects/UC_Trains_Voice/react-demo/src/gavt/Wave/WaveCanvas.jsx"],"sourcesContent":["// Manually created for GAVT project on 2024-06-03, based on commit 10df1d9 of the original project\nimport { useRef, useEffect } from 'react'\nimport useUserMedia from './useUserMedia'\n\nimport { initAudio, updateCoeffsOffline, updateData, FRAME_SIZE } from './waveAudio'\nimport './Wave.css'\n\n// =====================================================\nconst WaveCanvas = props => {  \n  const {draw, // this is the drawLoop sketch\n    isPaused, // req'd for renderer\n    isTracking,\n    strokeStyle = \"#50D3D6\",\n    ...rest} = props;\n\n  // Audio Vars ------\n  const SAMPLE_RATE = 44100;\n  const refAudioCtx = useRef(null);       \n  const analyser = useRef();\n  let microphone = useRef(null);\n  let audioData = [];                   // Holds the time domain data.\n  let lastReceivedCoeffs = [];   // self-explanatory\n  const BROADCASTS_PER_SECOND = 6; // used in audioData Interval, affects drawing smoothness, and will eventually be used with Vonage\n\n  // Canvas Vars -------\n  const refCanvas = useRef();   // html holds canvasEle\n  const refCtx = useRef();      // holds canvas drawing ctx\n  const refAniId = useRef();    // holds window.requestAnimationFrame\n  let count = 0                 // just a var to count the draw loops\n  let drawData = { magnitudes: [], peaks: [], } // set each audio interval\n\n  // Services ---------\n  const { stream, error, getMedia } = useUserMedia();\n\n  // ------------------------------------------------\n  const renderer = () => {\n    let ctx = refCtx.current;\n    count++\n    drawData = updateData(drawData, lastReceivedCoeffs, isTracking)\n\n    if(!isPaused) { // drawLoop. Drawing is passed in thru props.\n      draw(ctx, count, drawData.magnitudes, drawData.peaks, strokeStyle) // FOR WAVE CUSTOMIZATION!\n    }\n    refAniId.current = window.requestAnimationFrame(renderer, isPaused, isTracking)\n  }\n\n  // onMount & onWillUnmount ------------------------------------------------\n  useEffect(() => { \n    refCtx.current = refCanvas.current.getContext('2d');\n    let interval;\n\n    if(!stream) { getMedia(); }\n\n    if(stream) {\n      console.log('canvas has stream')\n      console.log('stream.active = ' + stream.active)\n\n      // Anything that attaches to a DOM ele should be CREATED here with a ref.\n      // Once the refs are init'd/created, they can be passed to external scripts for maipulation.\n      refAudioCtx.current = new AudioContext({sampleRate: SAMPLE_RATE,});\n      analyser.current = refAudioCtx.current.createAnalyser();\n\n      // I assume this will be needed later...but I don't really know\n      microphone.current = refAudioCtx.current.createMediaStreamSource(stream);\n\n      // configs the analyser to our mic input\n      analyser.current = initAudio(microphone.current, refAudioCtx.current, analyser.current)\n\n      // ready to send to audioData to LPC script, which we will do at an interval\n      interval = setInterval(() => {\n        // console.log('audioData interval');\n        // creates a 1D array\n        audioData = new Float32Array(analyser.current.fftSize);\n        // updates that array with analyser data\n        analyser.current.getFloatTimeDomainData(audioData);\n\n        // call to audio script\n        lastReceivedCoeffs = updateCoeffsOffline(audioData);\n      }, Math.round(1000 * (FRAME_SIZE / SAMPLE_RATE)));\n      console.log(Math.round(1000 * (FRAME_SIZE/SAMPLE_RATE)));\n\n\n      console.log('audioReady. Starting render')\n      renderer()\n    }\n\n    // onUnmount -----------------\n    return () => {\n      clearInterval(interval);\n      console.log('cancel render / cancelAnimationFrame')\n      window.cancelAnimationFrame(refAniId.current)\n    } \n  }, [stream, isPaused, isTracking])\n\n\n  // _________________________________________\n  return (\n      <canvas className=\"fullWidth\" ref={refCanvas} {...rest}>\n          Please use an HTML5 browser.\n      </canvas>\n  )\n}\n\nexport default WaveCanvas"],"mappings":"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","ignoreList":[]},"metadata":{},"sourceType":"module","externalDependencies":[]}