How to Build a VoIP-Based Baby Monitor
February 17th, 2011 by cmatthieu
Two members of the Phono/Tropo team, and soon a third member, have recently added new babies to their families. Congratulations Mark, Justin, and John!
All of this excitement got the hacker in me thinking… What would a modern Baby Monitor look like today? Armed with the Phono (http://phono.com) and Tropo (http://tropo.com) APIs, I started hacking and 2 hours later had the following example application to share with you!
Here’s the link to the demo. Let us know what you think! http://phonophone.heroku.com/babymonitor.html
Phono runs in the web browser to monitor activity in the room where it is running. Tropo is used to manage the baby monitor’s conference room (based on the access code) and the dial-in numbers to listen to the baby monitor via PSTN, Skype, SIP, or iNum. The Phono side of the conference is unmuted so you can hear activity while the Tropo side of the conference is muted. You can have many people (Mom, Dad, Grandparents, etc.) dialed in listening to the same baby monitor using any combination of the access channels listed above.
Shhh! This application is using the latest Phono V0.2 release with echo suppression :)
Here is the Phono source used in the demo:
<html>
<head>
<meta http-equiv="PRAGMA" content="NO-CACHE" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="/stylesheets/babymonitor.css" rel="stylesheet" type="text/css" />
<title>Phono Baby Monitor Demo</title>
<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script src="http://s.phono.com/releases/0.2/jquery.phono.js"></script>
<script type="text/javascript">
var phono;
var call;
var randomnumber=Math.floor(Math.random()*1001)
$(document).ready(function(){
phono = $.phono({
apiKey: "f12dc371538c...b43b6c594d",
onReady: function() {
if( ! this.audio.permission() ){
this.audio.showPermissionBox();
}
$("a.callme").addClass("phono-ready").text("Start");
},
phone: {
onConnect: function(event) {
},
onDisconnect: function(event) {
$(document).trigger("callHangUp");
}
}
});
$("a.callme").click(function(){
$(".digit-hldr").slideDown();
$(this).hide();
$("a.hangup").show().css("display","block");
makeCall();
return false;
});
$("a.hangup").click(function(){
$(document).trigger("callHangUp");
return false;
});
$(document).bind("callHangUp", function(){
(call) ? call.hangup() : call = null;
$(".digit-hldr").slideUp();
$("a.hangup").hide();
$("a.callme").show();
});
})
function makeCall() {
numberToDial = "app:9995555538";
call = phono.phone.dial(numberToDial, {
headers: [
{
name:"web",
value:"true"
},
{
name:"babycode",
value: randomnumber
}
],
tones: false,
onAnswer: function(event) {
},
onHangup: function() {
$(document).trigger("callHangUp");
},
onDisconnect: function() {
$(document).trigger("callHangUp");
}
});
}
</script>
</head>
<body>
<center>
<h1>Baby Monitor Demo</h1><br/>
<p> Access Code: <script>document.write(randomnumber);</script><br/><br/><br/>
Voice: (267) 702-4977 <br/>
Skype Voice: +990009369991483638<br/>
SIP Voice: sip:9991483638@sip.tropo.com<br/>
INum Voice: +883510001828861<br/>
</p>
</center>
<div id="phono">
<a class="callme" href="#">Loading...</a>
<a class="hangup" href="#">Stop</a>
</div>
</body>
</html>
Here is the Tropo Scripting API source code used in the demo:
web = $currentCall.getHeader("x-sbc-web")
babycode = $currentCall.getHeader("x-sbc-babycode")
if web == "true"
mute = false
else
mute = true
end
conferenceOptions={
:mute=>mute,
:playTones=>false
}
#Create conference ID
conferenceID = "babymon" + babycode.to_s
answer
sleep 2
#Create conference ID
if web == "true"
say 'Baby monitor active.'
conferenceID = "babymon" + babycode.to_s
else
say 'Baby monitor demo.'
result = ask "Please enter your access code followed by the pound key.", {
:choices => "[1-4 DIGITS]",
:terminator => '#'}
conferenceID = "babymon" + result.value
end
conference(conferenceID,conferenceOptions)
That’s all there is to it! This was a fun mini-project and using Phono and Tropo made building the VoIP-based Baby Monitor application a breeze!
No related posts.
Tags: baby monitor, conference, phono, sip, skype, tropo, voip
RSS Feed
February 19th, 2011 at 5:43 pm
Very cool. I thought my friend using two iPod Touchs and Viber was techy but this takes the cake. Just be sure not to run a normal desktop or laptop in the baby’s room. The noise from either is bad for early hearing (heck, it’s bad for adult hearing too over a prolonged period). A jailbroken iPod Touch or one of those Pogo plug computers would probably be best, something without fan noise.
Amazing we can script telephony over the net these days. Used to be a no go area for casual hacking. Great stuff.