Search code examples
asp.netimagehtml-emailashx

Auto refresh image (without javascript, flash, silverlight)

I would like to display an image that changes its content every 2 seconds (or something like that). Unfortunetly I can't use JavaScript, Flash or Silverlight because I want to use the animation in outgoing html emails with maximum compatibility between various email clients.

So, I tried to generate the image with an .ashx handler. But I am not able to refresh the image (or re-execute the ashx handler). I tried a loop, but that didn't work.

    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "image/png";

        string strDisplay = DateTime.Now.ToString();

        Bitmap bmpOut = new Bitmap(400, 50);
        Graphics g = Graphics.FromImage(bmpOut);
        g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
        g.FillRectangle(Brushes.Black, 0, 0, 400, 50);
        g.DrawString(strDisplay, new Font("Verdana", 18), new SolidBrush(Color.White), 0, 0);

        MemoryStream ms = new MemoryStream();
        bmpOut.Save(ms, System.Drawing.Imaging.ImageFormat.Png);
        byte[] bmpBytes = ms.GetBuffer();
        bmpOut.Dispose();
        ms.Close();

        context.Response.BinaryWrite(bmpBytes);
        context.Response.End();

    }

How do I have to do this, or is there an other solution?

Edit: The image content is not predefined. It contains for example a list of tweets.

Edit: Currently we are trying MJPEG. Does anyone know more about this and email clients?

Help much appreciated,

Vincent

Solution

  • After reading some of the comments, it appears the real question is how to display an animated sequence of images in an email.

    You are almost never allowed to run JavaScript inside email clients, and even if you could the support could vary dramatically between clients and web mail clients might muck things up. So this option has been eliminated.

    Likewise Flash/Silverlight are not likely to have good support by email clients and require that a browser plugin be installed which may not be possible from some desktop email client software. So this option has been eliminated.

    So we are left with animated GIF images. This format has been supported for a very long time in "internet time". However, you have two things to keep in mind:

    1. Most email clients now block images (actually all external resources) until the user explicitly clicks "show images and links" or something like that in their email client. This means its still not guaranteed they will see your image. You might be able to embed the animated gif in the email when its sent, but then you give up the ability to have recent info in the animation. (ie I might not read your email for a week, if the image was embedded it is now a week old social news, if its an external URL I might not click "show images")
    2. Animated GIFs use a 256 color palette so you can't do photographic animations with photographic quality. This question though appears to be about displaying mostly textual content writing out recent social interactions (tweets/posts), so we should be ok.

    Assuming these conditions are suitable for your application, we need to figure out how to produce an animated GIF in your HttpHandler code you've posted in the question. This is not a new idea, we don't need to re-invent the wheel. There are other posts on stackoverflow here:

    The most upvoted answer in the first stackoverflow post looks quite reasonable to me: HOWTO: create an animated GIF using .Net (C#)

    This technique is not dependent on any external libraries and has some comments explaining the various header fields. In your case you will be interested in the buf3 byte array in this code which is the header for each frame. This is where you can set the delay for each image being displayed. You will probably benefit from a quick google search for the animated GIF specifications, which would turn up:

    The specifications will allow you to lookup exactly what each header field does. If you don't have the desire to learn about the headers in a GIF, then maybe just go back to someone else's implementation like: NGif encoder on CodeProject. Of course you'll always have more control over the process if you have a deeper understanding of how it works. Even if you use someone else's implementation, it is handy to understand what its doing behind the scenes.