Skip to content

videoStreamServer is a WebCam/Video "streaming" server to provide fiddle yard surveillance for the software project RailEssentials. It uses Emgu CV to retrieve WebCam data, the web view is provided by a small jquery plugin, and the stream is provided via small webserver.

License

Notifications You must be signed in to change notification settings

cbries/videoStreamServer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

WebCam/Video Stream Server with jquery Video Plugin

videoStreamServer is a WebCam/Video "streaming" server to provide fiddle yard surveillance for the software project RailEssentials (see GitHub Repository). It uses Emgu CV to retrieve WebCam data and provides the data via HttpListener (see Microsoft). The web view is provided by a small jquery plugin.

Quick Start for Developer

  • install VisualStudio 2019 or the old variant VisualStudio 2017
  • clone the videoStreamServer repository git clone https://github.com/cbries/videoStreamServer.git or download the latest archive master.zip
  • open the solution videoStreamServer.sln
  • set videoStreamServer as Startup Project
  • click F5 or call VisualStudio Toolbar / Debug / Start Debugging
  • Note: it is important to build a x86 variant (default)

Configuration

Open the file videoStreamServer\videoStreamServer.json in your editor of choice. The default configuration is:

{
  "WebServer": {
    "Prefixes": [
      "http://localhost:8088/",
      "http://127.0.0.1:8088/"
    ]
  }
}

The prefixes are the addresses for stream server to listen for requests (see Microsoft). In most cases the default can be used.

On Air

To start the streaming process, just doubleclick videoStreamServer\videoStreamServer.exe. A small window will open and in most cases an image will be shown, when a webcam is attached to your computer.

videoServerStream

View Stream

Includes:

Include jquery, jqueryUI, and videoStream.js:

    <link rel="stylesheet" href="libs/jquery-ui.min.css" type="text/css">
    <link rel="stylesheet" href="libs/jquery-ui.structure.min.css" type="text/css">
    <link rel="stylesheet" href="libs/jquery-ui.theme.min.css" type="text/css">
    <script type="text/javascript" src="libs/jquery-2.1.0.min.js"></script>		
    <script type="text/javascript" src="libs/jquery-ui.min.js"></script>
    <script type="text/javascript" src="videoStream.js"></script>

Provide rendering container:

Add any control to be used for the stream:

<div id="webcamBasement" class="videoStream"></div>

Call videoStream() for initialization:

Just initialize the container for using the stream:

$(document).ready(function () {
  $('#webcamBasement').videoStream({
    url: "http://localhost:8088/",
    width: 320,
    height: 240,
    fps: 5,
    caption: "www.cbries.de",
    moved: function(position) {
      console.log(position);
    }
  });
});

Result

If videoStreamServer has been started the stream should be available by just opening the example file jqueryVideoStream/videoStream.html.

The container is draggable and resizable.

videoServerStream

Usage in RailEssentials

The videoStreamServer was implemented for usage in RailEssentials and is used everyday during playtime with the model railway.

videoStreamServer Result

About

videoStreamServer is a WebCam/Video "streaming" server to provide fiddle yard surveillance for the software project RailEssentials. It uses Emgu CV to retrieve WebCam data, the web view is provided by a small jquery plugin, and the stream is provided via small webserver.

Topics

Resources

License

Stars

Watchers

Forks