Skip to content

🆘Practicing Web Audio APIs, OscillatorNode, GainNode, and using JS Loop For, String.prototype.split(), onChange, onClick, this.setState.

Notifications You must be signed in to change notification settings

nguy2819/Morse-Code-fun

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

💫What I achieved in this Morse Code program: 💫

  • I used JS For Loop that automatically converts English text to Morse code (dots and dashes).
  • Also translate Morse code into text.
  • I'll generate Morse Code by toggling between 0 and 1 into sounds via 📢 OscillatorNode.
  • I'm also trying to work on converting dots and dashes into sequences of volume changes.:notes::thumbsup::shipit:
  • Last but not least, I would like to transfer this program into mobile app 📱(open source) for every users to use it offline.
  • Finally, I would like to like to build a practice site 📝- where people can practice listening 🎧 morse code and answer with the Right/Wrong text - send to API and DB - DB will send back the result if the user pass/fail the practices, and vice versa. 😲

👀What I've learn: 👀

  • According to Eric Holk's blog, APIs include parameter automation => allow users to schedule changes in various audio parameters at specific points in time.
  • Web Audio APIs
  • GainNode: allows us to adjust the volume.
  • A common modification is multiplying the samples by a value to make them louder or quieter (as is the case with GainNode). Once the sound has been sufficiently processed for the intended effect, it can be linked to the input of a destination (AudioContext.destination), which sends the sound to the speakers or headphones. (MDN source)
  1. Create audio context
  2. Inside the context, create sources — such as , oscillator, stream
  3. Create effects nodes, such as reverb, biquad filter, panner, compressor
  4. Choose final destination of audio, for example your system speakers
  5. Connect the sources up to the effects, and the effects to the destination. (MDN source
var context = new (window.AudioContext || window.webkitAudioContext());
var oscillator = context.createOscillator();

var gain = context.createGain();

oscillator.frequency.value = 750;
oscillator.connect(context);
gain.connect(context.destination);

oscillator.start(0);
function splitString(stringToSplit, separator) {
  var arrayOfStrings = stringToSplit.split(separator);
  }
var space = ' ';
var comma = ',';

String.prototype.split() applies into this program:

translate(typeMorseCode){
        var arrayOfStrings = typeMorseCode.split(' '); //"9MorseCode" "7MorseCode"=> the space between 9 and 7 be removed
        for(let i = 0; i < arrayOfStrings.length; i++){
            let element = arrayOfStrings[i]; //represents the whole chunk of the character - like ---..
            let result = this.state.morseToAlpha[element];
        }
        return ;
    }

About

🆘Practicing Web Audio APIs, OscillatorNode, GainNode, and using JS Loop For, String.prototype.split(), onChange, onClick, this.setState.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published