Playing Audio Using Keystrokes: Is It Possible?

Annabelle5893 · May 17, 2023

I'm wondering, how would I make an app that plays audio files using the keys on the number pad? Specifically, I want to make an app that triggers "Rotary Pulse 1" by pressing 1 on the numeric keypad, all the way up to "Rotary Pulse 0" on the 0 key. A dial tone will be toggled on by pressing the spacebar, which will begin with a "receiver pickup" noise. The dial tone turns off when digits are dialed via the numeric keypad. If you press the spacebar either when the dial tone is on, or after dialing a number, a "Receiver Hang Up" noise will be triggered. With the rotary dial sounds, the dial turning to the fingerhole is triggered at key down, and the release of the dial returning to the resting position will be triggered by releasing of the number corresponding to the fingerhole (1, 2, 3, 4, 5, 6, 7, 8, 9, 0). This will be accompanied by the internal sound of the dial pulses as heard in a telephone. What is the code I would use to make this audio app using HTML?

Annabelle5893 · Jul 1, 2023

Johna said:
There's a missing closing bracket at line 67, column 39.

Most of the errors you're showing here are missing closing brackets or curly brackets. Go through your code and make sure you have properly closed all brackets and curly brackets.

Is a "curly bracket" a "bracket" or a "brace"?

Annabelle5893 · Jul 1, 2023

Now it says there's a missing ) after argument list. Though in what line I'm not sure.

Johna · Jul 1, 2023

Annabelle5893 said:
Now it says there's a missing ) after argument list. Though in what line I'm not sure. View attachment 2176

The line number is covered by a notification.

Annabelle5893 · Jul 1, 2023

Johna said:
The line number is covered by a notification.

I'm not sure if my screenreader can read that notification. What does it say?

Johna · Jul 1, 2023

The notification isn't related to your code, just asking what to do with removable drives.

Annabelle5893 · Jul 1, 2023

Johna said:
The notification isn't related to your code, just asking what to do with removable drives.

How's this screenshot?

Annabelle5893 · Jul 1, 2023

Johna said:
The notification isn't related to your code, just asking what to do with removable drives.

How's this screenshot?

Annabelle5893 · Jul 2, 2023

Johna said:
There's a missing closing bracket at line 67, column 39.

Most of the errors you're showing here are missing closing brackets or curly brackets. Go through your code and make sure you have properly closed all brackets and curly brackets.

How about now? How does this version of the code look?

Annabelle5893 · Jul 3, 2023

It keeps telling me there's a "Missing ) after argument list" at 67:39. I'm not sure exactly where 67:39 is. I've carefully examined line 67, and it seems that I don't see where it thinks there should be a ). Here's the exact code I compiled in line 67:39.


  audio.loop = false;

Johna · Jul 3, 2023

it might not be that specific line. Check a bit before and after that line and see if there are any opening brackets missing closing brackets.

Annabelle5893 · Jul 3, 2023

Johna said:
it might not be that specific line. Check a bit before and after that line and see if there are any opening brackets missing closing brackets.

Does this also refer to open parenthesis and closed parenthesis pairs? How about open brace and closed brace pairs?

Annabelle5893 · Jul 3, 2023

This is a different page, but it's from TouchTone Telephone Emulator.
I wonder if this structure is what the code for my app should look like. This is from the Javascript file of that web site.


function reload(){location.reload(true);}
var allowDial;allowDial=true;var availableNumbers=["0","611","711","811","911","*67 + 1 (847) 765-1008","1 (847) 765-1008","867-5309","1 (212) 456-1414","555-1212","555-5555","748-0900","650-0050","650-8950","970-3920","1 (714) 733-9969","*57","*69"];function numberSuggestion(){var randomNumber=Math.floor(Math.random()*(availableNumbers.length));var suggestedNumber=availableNumbers[randomNumber];document.getElementById("suggestion").innerHTML="How about dialing <strong id='suggestedTelephoneNumber'>"+suggestedNumber+"</strong>? Don't like this number? Click the button above again!";}
var dialTone;var isOffHook=false;var callIncoming=false;function receiverRaised(){if(allowDial===false){telephoneAnswered();}
else{offHook();}}
setCallTimeout();function setCallTimeout(){var delay=5000;var delayCaller=Math.floor((Math.random()*8000)+1);delay=delay+delayCaller;setTimeout(incomingCall,delay);}
var ringRing=new Audio('telephoneBells.wav');var hasTelephoneBeenAnswered=false;function incomingCall(){function ringTelephone(){if(!hasTelephoneBeenAnswered){ringRing.play();ringRing.currentTime=0;}}
if(isOffHook===false){ringRing.play();allowDial=false;callIncoming=true;setInterval(ringTelephone,5500);}}
var potentialCallers=["fridge.m4a","sellhimself.mp3","other-2.mp3","hotline-2.mp3","hotline-3.mp3","hotline-4.mp3","hotline-5.mp3","importantMessage.wav","disregardCall.mp3","salt.m4a","machinePlant.wav","malware.mp3","frenchtechsupport.mp3","oppenheimer.mp3"];function telephoneAnswered(){hasTelephoneBeenAnswered=true;ringRing.pause();document.getElementById("WE2500").style.display="none";document.getElementById("receiverImg").style.display="block";var randomNumber=Math.floor(Math.random()*(potentialCallers.length));var callingPartyAudio=potentialCallers[randomNumber];var callingPartyCall=new Audio("potentialCallers/"+callingPartyAudio);callingPartyCall.addEventListener("ended",function(){timeoutHowler();});callingPartyCall.play();}
function offHook(){isOffHook=true;document.getElementById("WE2500").style.display="none";document.getElementById("dialPad").style.display="block";function dialToneTimedOut(){allowDial=false;timeoutHowler();}
dialTone=new Audio('dialTone.m4a');dialTone.addEventListener("ended",function(){dialToneTimedOut();});dialTone.play();allowDial=true;}
var number="";var timeout;function numberDial(){if(dialTone){dialTone.pause();dialTone.currentTime=0;}
clearTimeout(timeout);timeout=setTimeout(dial,2000);}
function dial1(){if(allowDial){numberDial();number=number+"1";var tone1=new Audio('tones/Dtmf-1.wav');tone1.play();}}
function dial2(){if(allowDial){numberDial();number=number+"2";var tone2=new Audio('tones/Dtmf-2.wav');tone2.play();}}
function dial3(){if(allowDial){numberDial();number=number+"3";var tone3=new Audio('tones/Dtmf-3.wav');tone3.play();}}
function dial4(){if(allowDial){numberDial();number=number+"4";var tone4=new Audio('tones/Dtmf-4.wav');tone4.play();}}
function dial5(){if(allowDial){numberDial();number=number+"5";var tone5=new Audio('tones/Dtmf-5.wav');tone5.play();}}
function dial6(){if(allowDial){numberDial();number=number+"6";var tone6=new Audio('tones/Dtmf-6.wav');tone6.play();}}
function dial7(){if(allowDial){numberDial();number=number+"7";var tone7=new Audio('tones/Dtmf-7.wav');tone7.play();}}
function dial8(){if(allowDial){numberDial();number=number+"8";var tone8=new Audio('tones/Dtmf-8.wav');tone8.play();}}
function dial9(){if(allowDial){numberDial();number=number+"9";var tone9=new Audio('tones/Dtmf-9.wav');tone9.play();}}
function dial0(){if(allowDial){numberDial();number=number+"0";var tone0=new Audio('tones/Dtmf-0.wav');tone0.play();}}
function dialStar(){if(allowDial){numberDial();number=number+"*";var toneStar=new Audio('tones/Dtmf-star.wav');toneStar.play();}}
function dialPound(){if(allowDial){numberDial();number=number+"#";var tonePound=new Audio('tones/Dtmf-pound.wav');tonePound.play();}}
document.onkeydown=function(e){var key=e.keyCode?e.keyCode:e.which;if(e.which===48||e.which===96){dial0();}
if(e.which===49||e.which===97){dial1();}
if(e.which===50||e.which===98){dial2();}
if(e.which===51||e.which===99){dial3();}
if(e.which===52||e.which===100){dial4();}
if(e.which===53||e.which===101){dial5();}
if(e.which===54||e.which===102){dial6();}
if(e.which===55||e.which===103){dial7();}
if(e.which===56||e.which===104){dial8();}
if(e.which===57||e.which===105){dial9();}
if(e.which===106){dialStar();}
if(e.which==109){dialPound();}}
var ringingTone=new Audio('DTMF-ringbackTone.mp3');var timesRung=0;function dial(){allowDial=false;function ring(){ringingTone.play();timesRung++;if(timesRung>1){setTimeout(response,700);}}
ring();setTimeout(ring,4000);}
function response(){switch(number){case "0":var operatorPickup=new Audio('callResponses/OperatorAnswer.wav');operatorPickup.addEventListener("ended",function(){number=prompt("Operator, your number please? (Numbers only; enter 'police' for police and emergency)");if(number==null){number="0";}
operatorPutCallThrough();});operatorPickup.play();break;case "611":var pickup611=new Audio('callResponses/611.wav');pickup611.addEventListener("ended",function(){timeoutHowler();});pickup611.play();break;case "711":var pickup711=new Audio('callResponses/tdd-1.mp3');pickup711.play();break;case "811":var pickup611=new Audio('callResponses/811.wav');pickup811.addEventListener("ended",function(){timeoutHowler();});pickup811.play();break;case "911":var pickup911=new Audio('callResponses/911-xxx-fleet.mp3');pickup911.addEventListener("ended",function(){timeoutHowler();});pickup911.play();break;case "18477651008":var pickupMCI=new Audio('callResponses/MCI.wav');pickupMCI.play();break;case "8675309":var pickup8675309=new Audio('callResponses/discoornis-bell-f1.mp3');pickup8675309.addEventListener("ended",function(){timeoutHowler();});pickup8675309.play();break;case "12124561414":busy();break;case "5551212":busy();break;case "5555555":var pickup5555555=new Audio('callResponses/timeout-xxx-fleet.mp3');pickup5555555.addEventListener("ended",function(){timeoutHowler();});pickup5555555.play();break;case "7480900":var pickupSelf=new Audio('callResponses/partyline-xxx-fleet.mp3');pickupSelf.play();break;case "18005820655":busy();break;case "6508950":var pickupAM=new Audio('callResponses/answering-machine-1.mp3');pickupAM.play();break;case "6500050":var pickupModem=new Audio('modem.wav');pickupModem.play();break;case "9703920":var pickupFax=new Audio('fax-1.mp3');pickupFax.play();break;case "17147339969":var pickup714=new Audio('device-conference.mp3');pickup714.play();break;case "*8217147339969":var pickup714=new Audio('device-conference.mp3');pickup714.play();break;case "*6717147339969":var pickup714block=new Audio('callResponses/reject2-xxx-fleet.mp3');pickup714block.addEventListener("ended",function(){timeoutHowler();});pickup714block.play();break;case "*57":var randNum57=Math.random()>=0.5;if(randNum57){var pickupCallTrace=new Audio('callResponses/trace3-xxx-fleet.mp3');}
else{var pickupCallTrace=new Audio('callResponses/trace-xxx-fleet.mp3');}
pickupCallTrace.addEventListener("ended",function(){timeoutHowler();});pickupCallTrace.play();break;case "*69":var pickupStar69=new Audio('callResponses/return-xxx-fleet.mp3');pickupStar69.addEventListener("ended",function(){timeoutHowler();});pickupStar69.play();break;case "police":var pickupPolice=new Audio('callResponses/policePickup.wav');pickupPolice.addEventListener("ended",function(){var policeComplaint=prompt("Police Department, Sergeant Duffy Speaking.");confirm("Really? You say that "+policeComplaint);var policeHangup=new Audio('callResponses/policeHangup.wav');policeHangup.addEventListener("ended",function(){timeoutHowler();});policeHangup.play();});pickupPolice.play();break;default:var pickupDefault;if(number.length>7){pickupDefault=new Audio('callResponses/ldcircuits-bell-f1.mp3');}
else{pickupDefault=new Audio('callResponses/completeordc-xxx-fleet.mp3');}
pickupDefault.addEventListener("ended",function(){timeoutHowler();});pickupDefault.play();}}
function busy(){busyTone();function busyTone(){var pickupBusy=new Audio('tele-busy.wav');pickupBusy.play();pickupBusy.currentTime=0;}
setInterval(busyTone,4000);}
function timeoutHowler(){var timeoutTone=new Audio('OffHookHowler.wav');timeoutTone.play();function timeoutTonePlay(){timeoutTone.currentTime=0;timeoutTone.play();}
setInterval(timeoutTonePlay,19800);}
function operatorPutCallThrough(){if(number!="police"){alert("One moment please, ringing the line now.");}
if(number=="police"){var operatorPoliceTransfer=new Audio('callResponses/OperatorPolice.wav');operatorPoliceTransfer.play();}
setTimeout(response,4000);}
document.getElementById('numberSuggestion').onclick=function(){numberSuggestion()};document.getElementById('receiverRaised').onclick=function(){receiverRaised()};document.getElementById('dial1').onclick=function(){dial1()};document.getElementById('dial2').onclick=function(){dial2()};document.getElementById('dial3').onclick=function(){dial3()};document.getElementById('dial4').onclick=function(){dial4()};document.getElementById('dial5').onclick=function(){dial5()};document.getElementById('dial6').onclick=function(){dial6()};document.getElementById('dial7').onclick=function(){dial7()};document.getElementById('dial8').onclick=function(){dial8()};document.getElementById('dial9').onclick=function(){dial9()};document.getElementById('dial0').onclick=function(){dial0()};document.getElementById('dialStar').onclick=function(){dialStar()};document.getElementById('dialPound').onclick=function(){dialPound()};document.getElementById('reload').onclick=function(){reload()};

Johna · Jul 4, 2023

I have no idea what you're trying to do so I don't know if this is how your code should be.

I can only help you if you're having a specific problem, but I'm not going to go through your entire code for you, to see if that's how it should be.
I don't know what you're trying to do, so I can't say how your code is supposed to be.

Annabelle5893 · Jul 4, 2023

Johna said:
I have no idea what you're trying to do so I don't know if this is how your code should be.

I can only help you if you're having a specific problem, but I'm not going to go through your entire code for you, to see if that's how it should be.
I don't know what you're trying to do, so I can't say how your code is supposed to be.

I'm trying to get audio to be played using keystrokes that would trigger a file or files on keyup, keydown, or keypress.

Johna · Jul 5, 2023

I showed you how to do that in some of my earlier posts.

Annabelle5893 · Jul 5, 2023

Johna said:
I showed you how to do that in some of my earlier posts.

I know you showed me how, but I'm wondering if I should try codes like:

JavaScript:

function dial3(){if(allowDial){numberDial();number=number+"3";var DTMFToneDial3=new Audio('DTMF Dials/DTMF Tone Dial 3.ogg');DTMFToneDial3.play();}

Would that work better than what I have there on the current version of the code I've made?

Johna · Jul 5, 2023

There's no one correct way of writing code.
As long as your code is working and is written well, I don't see a reason to change it to how someone else did it.

You can change your code to that code if you want, but it wont just start working like that, you'll have to make sure variables are defined, and call the function when a (specific) key is pressed.

Annabelle5893 · Jul 5, 2023

Now I get this error about a "missing ( before formal parameters". What exactly would you consider "Formal Parameters"? I'm confused!

Johna · Jul 6, 2023

I'm not sure what "formal parameters" are, but I would think it's parameters in a function.
Like most of these errors, check for a missing opening bracket ( at the line number (94).

Annabelle5893 · Jul 6, 2023

Johna said:
I'm not sure what "formal parameters" are, but I would think it's parameters in a function.
Like most of these errors, check for a missing opening bracket ( at the line number (94).

Would that be an [ (opening bracket) or an { (opening brace)?

Welcome!

Playing Audio Using Keystrokes: Is It Possible?

Gold Coder

Gold Coder

Gold Coder

Frontend Developer

Gold Coder

Frontend Developer

Gold Coder

Gold Coder

Gold Coder

Attachments

Gold Coder

Frontend Developer

Gold Coder

Gold Coder

Frontend Developer

Gold Coder

Frontend Developer

Gold Coder

Frontend Developer

Gold Coder

Frontend Developer

Gold Coder

Log in

Share this page

Buy us a coffee!

About Us

Site links

Stay Connected

We value your privacy