Last active
April 10, 2020 08:08
-
-
Save Duologic/cc8b5056386748e2961916b10290261d to your computer and use it in GitHub Desktop.
Quick and dirty Pan/Tilt for IPCam Foscam FI9821P
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Move camera feed left/right/up/down using arrow keys</title> | |
| <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> | |
| <script> | |
| $(function() { | |
| var username = "username"; | |
| var password = "password"; | |
| var hostport = "host:port"; | |
| function move(k) { | |
| $.get("http://"+hostport+"/cgi-bin/CGIProxy.fcgi?cmd=ptzMove" + k + "&usr="+username+"&pwd="+password, | |
| function(data) { | |
| console.log(data); | |
| }); | |
| window.setTimeout(stop, 500); | |
| } | |
| function stop() { | |
| $.get("http://"+hostport+"/cgi-bin/CGIProxy.fcgi?cmd=ptzStopRun&usr="+username+"&pwd="+password, | |
| function(data) { | |
| console.log(data); | |
| }); | |
| } | |
| var video = document.querySelector("#videoElement"); | |
| if (navigator.mediaDevices.getUserMedia) { | |
| navigator.mediaDevices.getUserMedia({ | |
| video: true | |
| }) | |
| .then(function(stream) { | |
| video.srcObject = stream; | |
| }) | |
| .catch(function(error) { | |
| console.log(error); | |
| }); | |
| } | |
| $(window).keyup(function(e) { | |
| switch (e.which) { | |
| case 37: //left arrow key | |
| stop(); | |
| break; | |
| case 38: //up arrow key | |
| stop(); | |
| break; | |
| case 39: //right arrow key | |
| stop(); | |
| break; | |
| case 40: //bottom arrow key | |
| stop(); | |
| break; | |
| } | |
| }); | |
| $(window).keydown(function(e) { | |
| switch (e.which) { | |
| case 37: //left arrow key | |
| move("Left"); | |
| break; | |
| case 38: //up arrow key | |
| move("Up"); | |
| break; | |
| case 39: //right arrow key | |
| move("Right"); | |
| break; | |
| case 40: //bottom arrow key | |
| move("Down"); | |
| break; | |
| } | |
| }); | |
| }); | |
| </script> | |
| <style type="text/css"> | |
| body { | |
| overflow: hidden; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| video { | |
| width: 100%; | |
| height: 100%; | |
| position: absolute; | |
| top: 0; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <video autoplay="true" id="videoElement"></video> | |
| </body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #!/bin/bash | |
| set -euo pipefail | |
| IFS=$'\n\t' | |
| # Use v4l2loopback interface to create webcam stream from RTSP with ffmpeg | |
| # https://github.com/umlaeute/v4l2loopback | |
| STREAM='rtsp://username:password@host:port/videoMain' | |
| ffmpeg -i $STREAM -vsync 2 -f v4l2 /dev/video2 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment