I've had this before on one of my previous blogs under the toponcefamily.com domain. I no longer own that domain (I let it expire, and now some "search engine" is selling it), but it was pretty cool. You could see what I was doing at anytime during the day.
Well, I set it up again here on pthree.org. Why, you ask? Honestly, I don't know. Probably more for the geek factor than anything. But at any event, it's there, and cool.
Writing the code was really easy, actually. The only trouble I had was setting up SSH to allow password-less secure copy. Once that was up, a simple Bash script to capture the screenshot, resize the image, and send it to the server. Here are the steps I followed to get my Desktop Cam up and running:
- Generate an SSH DSA key on the client that will be sending the image to the server. The command was 'ssh-keygen -t dsa'.
- Append id_dsa.pub to the file 'authorized_keys' on the server. If the file doesn't exist, create it.
- Create the Bash script with a simple while loop that executes creating the image and copying to the server every 30 seconds.
- Write the HTML for displaying the screenshot.
- Write the JavaScript to refresh the image every 30 seconds also.
For the Bash code, it was easy (text wrapped as necessary):
1 2 3 4 5 6 7 8 | #!/bin/bash sleep 5 bool_test=1 while (( bool_test == 1 )); do import -window root -resize 512 ~/DesktopCam.jpg scp ~/DesktopCam.jpg encryptz@pthree.org:/var/www/wp-content/uploads/ sleep 30 done |
The JavaScript to reload the image was just as easy:
1 2 3 4 5 6 7 8 9 10 11 12 | <script type="text/javascript"> refreshImage = function() { img = document.getElementById("desktopcam"); img.src = "http://www.pthree.org/wp-content/uploads/DesktopCam.jpg?rand=" + Math.random(); } </script> <script type="text/javascript"> <!-- window.setInterval(refreshImage, 30*1000); //--> </script> |
The HTML in the post was even easier:
1 | <img id="desktopcam" src="http://www.pthree.org/wp-content/uploads/DesktopCam.jpg" alt="Desktop Cam" /> |
That's it! Probably what kept me hung up the most was getting WordPress to play nicely with inline JavaScript. After a bit of searching and digging around though, I found the trick to getting JavaScript to work.
Anyway, there you go. Fairly simple code, easy to implement and low overhead.
{ 2 } Comments