Real Time Morse Code Converter

Real Time Morse Code Converter

by EnigmaMaster

HTML

<div id="two">
    Click in the text box below and use the left arrow for "." and the right arrow for "-" the bottom arrow is space.
</div>
<div id="box">
    <textarea id="type"></textarea>
</div>
<img src="http://www.learnmorsecode.com/pix/CW.gif" />
<!-- Created By Raul Rodriguez-->

CSS

input[type="button"] {
    width:20px;
    clear:both;
   
}

#prompt {
border:thin solid black;
    width:100px;
    height: 100px;
    word-wrap: break-word;
    overflow: auto;
}

#two {
border: thin solid black;
float:left;
width:400px;
height:200px;
margin-right:10px;
}

JavaScript

//$('#type').val().replace(/..-/g, "a");
$('#type').keydown(function(e) {
    switch(e.keyCode) {
        case 37: this.value += "."; break;
        case 39: this.value += "-"; break;
        case 40: this.value += " "; break;
        case 8: return; // allow backspace
    }
    e.preventDefault();

});

$(document).keyup(function() {
    var typedText = $('#type').val().replace(/\--\.- /g, "q").replace(/\--\.\. /g, "z").replace(/\-\.-- /g, "y").replace(/\-\.\.- /g, "x").replace(/\.-- /g, "w").replace(/\.\.\.- /g, "v").replace(/\.\.- /g, "u").replace(/\.--- /g, "j").replace(/\--- /g, "o").replace(/\-\.- /g, "k").replace(/\.- /g, "a").replace(/\-- /g, "m").replace(/\- /g, "t").replace(/\-\.-\. /g, "c").replace(/\-.\.\. /g, "b").replace(/\.--\. /g, "p").replace(/\--. /g, "g").replace(/\.-.\. /g, "l").replace(/\-.\. /g, "d").replace(/\.\.-. /g, "f").replace(/\.\.\.\. /g, "h").replace(/\.\.\. /g, "s").replace(/\.\. /g, "i").replace(/\.-. /g, "r").replace(/\-. /g, "n").replace(/\. /g, "e");
    $('#two').text(typedText);
});