Merge remote-tracking branch 'origin/project_refactor'

diff --cc .gitignore
index ce4969521342ac498e52877a1f250b58ce9076d6,ce4969521342ac498e52877a1f250b58ce9076d6..c8e3bba075547fba29945e66a2f0d710b35f5b8f
--- 1/.gitignore
--- 2/.gitignore
+++ b/.gitignore
@@@ -4,6 -4,6 +4,8 @@@ node_module
  /crate/target/*
  /.log
  
++rawAudio.wav
++
  # local env files
  .env.local
  .env.*.local

diff --cc rawAudio.wav
index 5582bc0ad66fe760dfe16e090c450aef6ace6b93,e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
deleted file mode 100644,100644
Binary files differ

diff --cc src/components/taInput/inputController.ts
index 0000000000000000000000000000000000000000,6ff7117509999422101c0668c64a903a5d4d9e84..9a83a0cfa8b81d0f29f805aa519163bb004f27bd
mode 000000,100644..100644
--- /dev/null
--- 2/src/components/taInput/inputController.ts
+++ b/src/components/taInput/inputController.ts
@@@ -1,0 -1,93 +1,93 @@@
 -            // window.postMessage({
 -            //   myTypeField: 'update-recorder',
 -            //   record: false
 -            // }, '*')
+ import { ref, watch, onUnmounted, onMounted } from "vue";
+ 
+ import useKeyDownHandler from "@/composables/keyDownHandler/useKeyDownHandler";
+ 
+ import useMediaStream from "@/composables/mediaStream";
+ 
+ import useAudioVisualizer from './audioDetails/audioVisualizer';
+ 
+ import useTextVisualizer from './textDetails/textVisualizer';
+ 
+ /*
+ * Controls which input to visualize
+ * Will visualize text input by default as user types or
+ * if user holds space bar down, input audio stream
+ * will be visualized & recorded
+ */
+ // NOTE: input params should probably be input and MediaStream
+ // TODO: visualize audio stream from nodeJS background process
+ export default function useInputController() {
+     const visualizeStream = ref(false);
+     const paths = ref([]);
+     const audioBubbleWidth = ref(10);
+     let stream: MediaStream;
+ 
+     const { keyDownHandler, input } = useKeyDownHandler();
+     const { textInputXoffset, renderTextInput } = useTextVisualizer(input);
+     const { visualizeStreamAsPaths, expandBubble } = useAudioVisualizer(visualizeStream);
+ 
+     // stops stream recording on space key up
+     function keyupHandler(e: any) {
+         if (e.key === " " && visualizeStream.value) {
+             console.log("stop recording");
+ 
 -            // window.postMessage({
 -            //   myTypeField: 'update-recorder',
 -            //   record: true
 -            // }, '*')
++            window.postMessage({
++              myTypeField: 'update-recorder',
++              record: false
++            }, '*')
+ 
+             visualizeStream.value = false;
+             paths.value = []
+             audioBubbleWidth.value = 10;
+             input.value = ''
+         }
+     }
+ 
+     // add window event keyboard listeners
+     window.addEventListener("keydown", keyDownHandler);
+     window.addEventListener('keyup', keyupHandler);
+ 
+     // get stream & initialize recorder object on mount
+     onMounted(async () => {
+         stream = await useMediaStream({ audio: true });
+     })
+ 
+     // determine whether to render text or audio based one the keyboard input
+     watch(input, (input, prevInput) => {
+         if (prevInput !== "" || prevInput.length > 0) {
+             if (!visualizeStream.value) {
+                 renderTextInput();
+             }
+             return;
+         }
+         if (input === " " && visualizeStream.value === false) {
+             console.log("record MediaStream");
+             visualizeStream.value = true;
+ 
++            window.postMessage({
++              myTypeField: 'update-recorder',
++              record: true
++            }, '*')
+ 
+             expandBubble(audioBubbleWidth);
+             visualizeStreamAsPaths(stream, paths, audioBubbleWidth);
+             return;
+         }
+         renderTextInput();
+     });
+ 
+     // remove Event Listeners on component unMount
+     onUnmounted(() => {
+         window.removeEventListener("keydown", keyDownHandler);
+         window.removeEventListener("keyup", keyupHandler);
+     });
+ 
+     return {
+         input,
+         visualizeStream,
+         textInputXoffset,
+         audioBubbleWidth,
+         paths
+     }
+ 
+ }