Gif wont run while processing is taking place

[Frinavale]

Hi there,

I'm developing an ASPX web application system and at times the processing takes a while to finish. In order to keep the users from closing the browser before my site is finished working, I thought I'd display an animated .gif that would indicate my system was doing something.

The problem I'm having is that the gif doesn't do its animated thing when my site is processing. A progress bar is displayed and shows some progress at the bottom of the browser but the gif won't do its thing.

Does anyone know how I can get around this problem?

Thanks in advance
-Frin

[b1randon]

Frin, I work on an application that does exactly this. You might want to think about using ajax. Ajax will allow you to check on the server's progress on your task intermittently. Also, since your page will no longer be loading it may clear up the problem with the animated gif (our project uses on too without issue).

[Frinavale]

Frin, I work on an application that does exactly this. You might want to think about using ajax. Ajax will allow you to check on the server's progress on your task intermittently. Also, since your page will no longer be loading it may clear up the problem with the animated gif (our project uses on too without issue).

I have absolutely no experience with Ajax. I hadn't even heard of it 'til the other month when I started posting on this forum.

Is it easy to learn?
Is it easily incorporated into a .NET application?
Is it anything like JavaScript?

Thanks for the suggestion

-Frinny

[AricC]

Hey Frin, how much data are you processing? Is this in ASP? You could use Application.Lock while your processing ( performance may be an issue )

(Moved thread to Javascript/Ajax)

[Frinavale]

Hey Frin, how much data are you processing? Is this in ASP? You could use Application.Lock while your processing ( performance may be an issue )

(Moved thread to Javascript/Ajax)

I'm using VB .Net (which uses asp of course)

I'm doing a bunch of validation requests that run against a database. Its quite a bit of processing and for the database to timeout its sometimes taking something like 30seconds....

I've never heard of Application.Lock before.
I'm going to look into it now to see if it could help me.

I just looked up Ajax stuff and even though it looks like something I'd want to implement in the future...I can't really learn this right now and write the server side functions since my project is going to be launched within the next couple of days.

I didn't think it would take much to get an animated .gif to run while sever processing was happening. I guess I was wrong.

Thanks for all your help
-Frinny

[AricC]

I don't think it is that difficult, in fact I'm moving this to the .Net forum and copy the ASP forum as this is more of an ASP.Net issue. As a work around for the time being maybe this solution would work. While the user is in the process if in your Try/Catch you hit an excError ( what I call mine ) throw the error to a log file on your server. Then just check the log file for errors daily or write a script to get it emailed to you. I have a great example of a VB.Net error file writer if you need one. I will just need to dig it up. Let me know.


HTH,
Aric

[kenobewan]

If the animated gif is showing and is not animated, then I believe that there is a problem with the image. Confirm by opening by itself in the browser. If this is the case, you need to recreate or find another image...

[Killer42]

If the animated gif is showing and is not animated, then I believe that there is a problem with the image. Confirm by opening by itself in the browser. If this is the case, you need to recreate or find another image...

You may find that it's browser-specific.

Sorry to butt in, I know virtually nothing about ASP, or web programming in general. However, just from the end-user perspective, I've noticed in IE that animated GIFs always stop whenever any link is clicked. FireFox, on the other hand, appears to leave them running, in at least some cases. For example, click on someone's avatar on the leader-board to the right. Under IE (for me, at least) my avatar immediately stops. Under FireFox, it keeps right on animating until the page disappears.

[Frinavale]

I don't think it is that difficult, in fact I'm moving this to the .Net forum and copy the ASP forum as this is more of an ASP.Net issue. As a work around for the time being maybe this solution would work. While the user is in the process if in your Try/Catch you hit an excError ( what I call mine ) throw the error to a log file on your server. Then just check the log file for errors daily or write a script to get it emailed to you. I have a great example of a VB.Net error file writer if you need one. I will just need to dig it up. Let me know.


HTH,
Aric

I actually do recording the error...but not into a file....


Thanks for the suggestion though. Its a good one!

-Frinny

[Frinavale]

If the animated gif is showing and is not animated, then I believe that there is a problem with the image. Confirm by opening by itself in the browser. If this is the case, you need to recreate or find another image...

There is nothing wrong with the gif. I've checked it in browsers and picture viewers alike. It just simply will not work when the browser is waiting for a response from the server....the whole point to putting it in is go give the user something to watch to keep them from closing the web browser while some processing is happening.

You may find that it's browser-specific.

Sorry to butt in, I know virtually nothing about ASP, or web programming in general. However, just from the end-user perspective, I've noticed in IE that animated GIFs always stop whenever any link is clicked. FireFox, on the other hand, appears to leave them running, in at least some cases. For example, click on someone's avatar on the leader-board to the right. Under IE (for me, at least) my avatar immediately stops. Under FireFox, it keeps right on animating until the page disappears.

I've noticed this too.

I've also noticed while FireFox is waiting for the site to finish processing that sometimes (not always because sometimes it works flawlessly) the image isn't even loaded onto the page. I've used javaScript to change the image source once the submit button's clicked ...and when I view the html code this value has been changed properly...it should be displaying, but the browser's waiting for a response.

Hmmm...I wonder if there's a way to tell the browser to wait but not pause everything. I guess this is how Ajax would help out here. I'm just not sure what to write for the server side script that the Ajax code would call to display a gif...it seems to be overkill (and I've never used Ajax)...that and I'm not sure if Ajax is used the same way JavaScript is used for .Net applications.


Thanks for all the suggestions!

-Frinny

[Frinavale]

I
... I have a great example of a VB.Net error file writer if you need one. I will just need to dig it up. Let me know.
HTH,
Aric

I'm interested in how you were able to write a file to the disk. I haven't been able to do this in the past...and I'm sure its a permissions problem, but even though I've tried to grant permissions to the ASPNET user to let the program write the file, I've had no luck.

What sort of permissions did you use to get this to work?

Thanks again for your help!

-Frinny

[Frinavale]

Hey Frin, how much data are you processing? Is this in ASP? You could use Application.Lock while your processing ( performance may be an issue )

(Moved thread to Javascript/Ajax)

I remember now what Application.Lock is used for:

http://msdn2.microsoft.com/en-gb/library/ms525184.aspx[/url]
The Lock method blocks other clients from modifying the variables stored in the Application object, ensuring that only one client at a time can alter or access the Application variables...

I tried it just in case it would help out the situation but it doesn't. I remember using this in school....it seems so long ago.

Thanks for the refresher!

[AricC]

I remember now what Application.Lock is used for:
I tried it just in case it would help out the situation but it doesn't. I remember using this in school....it seems so long ago.
Thanks for the refresher!

Do you think something like this would work?

[Frinavale]

Do you think something like this would work?

Thank you so much Aric!

I have no idea how this fixed my problem but it did.

I didn't use the code from that example but used the <body onload="..."> idea then wrote my own function. I initialized the image to show the processing gif and then changed the source of this image to be a blank image.

Now the processing message appears when the page is loading and then it goes away. When the user clicks the submit button I called a function to show the picture again.

For some reason when I did the exact same thing in the button's onclick the gif froze....but now that I'm calling a function it works fine.

This solution is working flawlessly in both FireFox and IE.

The functions I used were:

<script type='text/javascript' language='JavaScript'>
 <!--
                    function processingMessageOn() {
                    document.img_processing.src='Images/Email.gif';
                    }
                    function processingMessageOff() {
                    document.img_processing.src='Images/Blank.jpg';
                    }
  -->
</script>
 

I don't know why this fixed the problem but I'm happy for the simple solution.

I was starting to go off on a tangent with Ajax...this was much easier.

If anyone knows why this works I would love an explanation


Thanks so much!

-Frinny

[AricC]

Thank you so much Aric!

I have no idea how this fixed my problem but it did.

I didn't use the code from that example but used the <body onload="..."> idea then wrote my own function. I initialized the image to show the processing gif and then changed the source of this image to be a blank image.

Now the processing message appears when the page is loading and then it goes away. When the user clicks the submit button I called a function to show the picture again.

For some reason when I did the exact same thing in the button's onclick the gif froze....but now that I'm calling a function it works fine.

This solution is working flawlessly in both FireFox and IE.

The functions I used were:

<script type='text/javascript' language='JavaScript'>
 <!--
                    function processingMessageOn() {
                    document.img_processing.src='Images/Email.gif';
                    }
                    function processingMessageOff() {
                    document.img_processing.src='Images/Blank.jpg';
                    }
  -->
</script>
 

I don't know why this fixed the problem but I'm happy for the simple solution.

I was starting to go off on a tangent with Ajax...this was much easier.

If anyone knows why this works I would love an explanation


Thanks so much!

-Frinny

Frin,
Glad we finally found something that works for your issue. I have never had any ASP.Net write problems when writing log files I will try to find my example maybe it will help maybe not.

Aric

[kenobewan]

Sorry Frin, I should have remembered this. When you preload an image it loads it into your cache waiting to be used and is available when needed. I believe that what was happening in your case, was that resources were busy processing your request so that your image was loading too slowly to show the animation. Preloading is often used for image rollovers so that there is no delay when the user hovers over with their mouse...

[Frinavale]

Sorry Frin, I should have remembered this. When you preload an image it loads it into your cache waiting to be used and is available when needed. I believe that what was happening in your case, was that resources were busy processing your request so that your image was loading too slowly to show the animation. Preloading is often used for image rollovers so that there is no delay when the user hovers over with their mouse...

Thanks a lot for the insight Kenobewan.
It clears up my confusion.

Do you know of any way to preload the image without using the <body onload=...>?

I have a bunch of forms that don't need to use this feature but still have to put the <img> tag on each page or else my javascript crashes.

-Frinny

[Frinavale]

This solution isn't working for IE6.

I should have tested it earlier. Is there a way to force it to load the gif into cache?

Thanks
-Frinny

[kenobewan]

In JS the preloading is done in the head of the page, e.g.:

<SCRIPT language="JavaScript">
<!--
pic1= new Image(100,25); 
pic1.src="http://someplace.com/image1.gif"; 
//-->
</SCRIPT>
 

This means that the images are downloaded with the page and ready when you need them. As far as forcing... not sure will require more testing.

[airwings17]

hi,
I am working on a site and need to develop a (animated and designed ) Button with some Text on it. (Image Button not allow text) can u help me on that ?

[Frinavale]

hi,
I am working on a site and need to develop a (animated and designed ) Button with some Text on it. (Image Button not allow text) can u help me on that ?

Hi Airwings,

You should post a new thread for your questions in the future. To do this go to the menu at the top, select Forums, click the forum where your question belongs, and then find the yellow button labeled "start a discussion".

Anyways,
Is this a .NET question or an HTML question?
Could you please elaborate on your problem :)

Cheers!

- Frinny

[Frinavale]

Update to the problem with "Gif wont run while processing is taking place"

See this post for JavaScript that is basically a continuous loop in which the Gif is re-loaded over and over. This constant re-loading keeps the Gif Animated.

Thanks to iam_clint for the solution!

-Frinny

[Killer42]

I hope this is of use to someone. It looks as though airwings17 hasn't been in since August. Must be waiting for that process to finish. :)