Motorola Focus 66 WiFi HD Audio and Video Camera – Live Feed Embed

Focus 66
Motorola Focus 66 WiFi HD Audio and Video Camera - Live Feed Embed

So, you've bought yourself a camera to have a play with? Cool. Easy to set up, and everything seems to work OK... then you notice that the software used to play it back is... well... erm... not very good at all. The Hubble apps are poor, cut out every 5 minutes and do not offer any real streaming capability. They also start charging you after a trial period, which isn't cool.

Worry not, buried in the technology is everything you need to set up a Live stream to a web page, and I'll tell you how. First, a few 'Prep' steps:

  1. Register with DynDNS.org or your preferred provider so you can connect to the camera from outside your local network.
  2. Give your camera a static IP address reservation on your router.
  3. Configure port forwarding on your router to send any external request to port 80 to the IP address you reserved for the camera in step #2.
  4. IMPORTANT - configure your firewall to block all comms in and out to the camera IP address to port 8080. This is the port Motorola will use to update the camera, and the new firmware stops this working.

Having done all that you're good to go, The HTML code below is enough to display a live feed of your camera on a web page. Simply change the elements I have left bold and italicised for clarity according to your setup - the BaseURL DynDNS change being the only functional requirement:

<html>
<title>Add your page title here</title>
<body>
<center>

<SCRIPT LANGUAGE="JavaScript">

var BaseURL = "http://yourdyndnsdomainname/";

var Camera = "";

var ImageResolution = "704x480";var DisplayWidth = "704";var DisplayHeight = "480";

var File = "axis-cgi/mjpg/video.cgi?resolution="+ImageResolution;
if (Camera != "") {File += "&camera=" + Camera;}
var output = "";
if ((navigator.appName == "Microsoft Internet Explorer") &&
(navigator.platform != "MacPPC") && (navigator.platform != "Mac68k"))
{
// If Internet Explorer under Windows then use ActiveX
output = '<OBJECT ID="Player" width='
output += DisplayWidth;
output += ' height=';
output += DisplayHeight;
output += ' CLASSID="CLSID:DE625294-70E6-45ED-B895-CFFA13AEB044" ';
output += 'CODEBASE="';
output += BaseURL;
output += 'activex/AMC.cab">';
output += '<PARAM NAME="MediaURL" VALUE="';
output += BaseURL;
output += File + '">';
output += '<param name="MediaType" value="mjpeg-unicast">';
output += '<param name="ShowStatusBar" value="0">';
output += '<param name="ShowToolbar" value="0">';
output += '<param name="AutoStart" value="1">';
output += '<param name="StretchToFit" value="1">';
output += '<BR><B>Axis Media Control</B><BR>';
output += 'The AXIS Media Control, which enables you ';
output += 'to view live image streams in Microsoft Internet';
output += ' Explorer, could not be registered on your computer.';
output += '<BR></OBJECT>';
} else {
// If not IE for Windows use the browser itself to display
theDate = new Date();
output = '<IMG SRC="';
output += BaseURL;
output += File;
output += '&dummy=' + theDate.getTime().toString(10);
output += '" HEIGHT="';
output += DisplayHeight;
output += '" WIDTH="';
output += DisplayWidth;
output += '" ALT="Camera Image">';
}
document.write(output);
document.Player.ToolbarConfiguration = "play,+snapshot,+fullscreen";

</SCRIPT>
</body>
</html>

Copy all the text above in to a test editor and save as 'page.html' or as you see fit, then upload the page to your chosen location - hosting services available :).

I bought my camera for £30 in the sales to have a play with and set it up on my 1000 litre aquarium, you can see the results here. I used the Code Embed WordPress plugin to call the html from within PHP but the code used for the feed is exactly as above.

I hope given the lack of information out there on this subject that this proves helpful. Please feel free to leave any comments or questions below.

Paul

Comments are closed.