A simple image carousel prototype using Asp.net webforms and SignalR

If you are like and you were give a scenario” where you had to design an online carousel which would show some images stored on the application server then you might find this demo useful . There are many different ways to create such an application and a typical method that comes to mind when brainstorming is to create an Asp.Net MVC app which has a razor template that has a place holder for these images. The browse initiates a request for these images by a click of a button, a full server postback is performed which invokes some controller in the application which renders our razor template in the view with the place holders resolved as img tags pointing to these images on our server. The HTML response will also have the required css and js files to create the carousel animation.

I’ve been using SignalR lately in a few projects and love the simplicity of this library. It makes it so darn easy to invoke the client side code from the server side and vice versa. So i decided to whip up a quick demo.

The basic idea with the prototype is:

Here is what the final output looks like:

screenshot

Attached is the full source code of the implementation.


<div 
    id="scid:fb3a1972-4489-4e52-abe7-25a00bb07fdf:85fd7707-45d5-4b17-86b3-fe204497974f" 
    class="wlWriterEditableSmartContent" 
    style="float: none; padding-bottom: 0px; padding-top: 0px; padding-left: 0px; margin: 0px; display: inline; padding-right: 0px">
    
</div>

May 22, 2013 · Asp.net · SignalR


Previous:Simple logging with NLog Application logger
Next:Sharing common connection strings between projects