I have a project that saves images from an IPcamera to a filestream. I have another project that takes the image from the filestream and saves it as a jpg, then displays the image in a webform. I added a javascript script to refresh the image every x seconds, but the problem is that the new image only gets saved when the page loads. It does that because I put the c# code in the "Page_Load()" function. I want to know if there is a way to make a function in C# that has the section of code that saves the image, then call that function every x seconds when I refresh the image? Because right now since there is no new image being saved it just refreshes to the same image. I have made a code that refreshes the entire page every x seconds, but I feel like this way would be better. I am using visual studio 2010.
Here is the C# code for the second project mentioned:
namespace PlayVideo
public partial class Video : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string saveTo = @"place to save";
FileStream writeStream = new FileStream(saveTo, FileMode.Create, FileAccess.ReadWrite);
using (FileStream fs = File.Open(@"Place where file is saved", FileMode.Open, FileAccess.ReadWrite, FileShare.ReadWrite))
{
ReadWriteStream(fs, writeStream);
}
Response.Clear();
Response.TransmitFile("~/images/test.jpg");
}
// readStream is the stream you need to read
// writeStream is the stream you want to write to
private void ReadWriteStream(Stream readStream, Stream writeStream)
{
int Length = 256;
Byte [] buffer = new Byte[Length];
int bytesRead = readStream.Read(buffer,0,Length);
// write the required bytes
while( bytesRead > 0 )
{
writeStream.Write(buffer,0,bytesRead);
bytesRead = readStream.Read(buffer,0,Length);
}
readStream.Close();
writeStream.Close();
}
}
The code for the viewer.aspx page is:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="viewer.aspx.cs" Inherits="PlayVideo.viewer" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div style="height: 60px" id="div1">
<img src="/video.aspx" id="the_image" alt="" /><br />
<script type="text/javascript" language="javascript">
function refreshImage() {
$("#the_image").attr('src', 'video.aspx');
setTimeout(refreshImage, x ms);
}
$(document).ready(function () {
setInterval(refreshImage, x ms);
})
</script>
</div>
</form>
</body>
</html>
Is there a way to do this? I have read stuff about client side vs. server side, but since I am already refreshing the image every x seconds does that matter?