How To Question

S

Steven

Greetings,
This project, among other things, requires:
1. the ability to capture a screen size image from a directory every x
seconds (x= 1-5) and display this image to a publicly addressable web form
without any screen flicker.
Basically, we have a device that captures frames from one PC (1) and saves
them to a directory on a different PC (2). The web app will be on the number
2 PC.
So far, I have created a web site with Ajax UpdatePanels,an Image control
to display the image from the directory, and a FileSystemWatcher to capture
and serve a .jpg to the Image control in the UpdatePanel. The UpdatePanel
refresh is triggered by an AsyncPostBackTrigger and a Timer. This works,
but because the image is large ( I guess), the screen flickers between image
loads. My question is: is there a better way to do this?
The aspx looks like this:

<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"
EnableViewState="false" EnablePartialRendering="true">
</asp:ScriptManager>

<asp:Timer ID="Timer1" OnTick="Timer1_Tick" runat="server"
Interval='<%# GetTimerInterval() %>' />

<asp:UpdatePanel ID="UpdatePanel2" runat="server" EnableViewState=
"false" UpdateMode="Always">
<ContentTemplate>
<div align="center">
Last Update:
<asp:Label ID="dtMessage" runat="server"></asp:Label>
</div>
</ContentTemplate>
</asp:UpdatePanel>

<asp:UpdatePanel ID="UpdatePanel1" runat="server" EnableViewState=
"false" UpdateMode="Always">
<ContentTemplate>
<div align="center">
<asp:Image ID="Image1" runat="server"
BackColor="DimGray" OnDataBinding="OnDataBinding" ImageUrl='<%# GetData()
%>' />
</div>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>

where GetData() returns the string url from the FileSystemWatcher's
OnCreated event.

Any advice on this matter would be greatly appreciated.

Thank you,
Steven
 
K

Ken Fine

Yes. I think you're using the wrong tool/presentational platform for the
job, maybe.

Have a look at Flash Actionscript or maybe Silverlight. Flash is performant
in the ways that you're looking to make it work, and can be programmed to
poll XML or to be addressed directly by various means; image data is loaded
asynchronously. I've built things similar to what you're trying to make and
they work well. You can effectively crossfade/transition between images/fade
to black/fade to white("bleach fade") and it all looks smooth and
aesthetically pleasing on the Flash player.

More performance info that might help you: I just made a webpage that has
four of these panels with crossfading images in each. Each panel is about
350x 240. It works smoothly with no stutter on the average PC.

-KF
 
B

bruce barker

serveral things you can do.

1) throw away the update panels, there is no need

just a standard timer and setting image src is all thats needed:

<div id="dtMessage">
</div>
<img id="theImage" src="myimage.aspx" />
<script>
var refeshCount=0;
refreshImage = function() {
document.getElementById('theImage').src = "myimage.aspx?r=" +
(++refeshCount);
document.getElementById("dtMessage").innerHTML = "last updated" + new
date
window.setTimeout(refreshImage ,1500);
}
window.setTimeout(refreshImage ,1500);
</script>

2) specify the image size in the image tag (so the space stay the same).

but if you want it smoother you will proably need to do a media stream like
flash

-- bruce (sqlwork.com)
 
S

Steven

Thanks, I will look at both of these techniques. I spent most of my time
building Windows Services and Wcf Web Services powered by Windows Services
engine, so I really don't spend a lot of time using asp.net techniques. If
it gets beyond basic, Google and UseNet are my friends. Like all things, I
wish I had more time to do this sort of thing. One cannot keep with all
technnoogies, at least, I cannot:) Thanks again!
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top