AJAX Toolkit SlideShowExtender Question

It seems that slides for the slideshowextender are downloaded again if the user navigates to another page and then returns to the slideshow page. Is there a way to download them only once in a session and keep them available should the user return to the slideshow again?
LVL 1
rkulpAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
carlnorrbomConnect With a Mentor Commented:
Hi,

Well, by design the SlideShowExtender consumes a webservice for the slides, that means you'll pretty much have to stick with that service call I guess. So I would say no. However, I have not played around with the SlideShowExtender enough to know whether it can be manipulated in other ways than using a webservice (i think not..).

However, with that said - it should be quite possible using other ajax components, for instance an update panel and a timer and programatically swap images on an interval. Then you should be able to preload the images into session (be careful - not too many though..)

/Carl.
0
 
carlnorrbomCommented:
Hi,

Just let me know if you require some example code on how to set up a slideshow without using the extender and loading images into a session object as bytestreams and then reading them back.

/Carl.
0
 
rkulpAuthor Commented:
Thanks for the explanation. I may come back and ask for some AJAX code but want to try on my own first.
0
 
carlnorrbomCommented:
Hi,

Since you awarded the points I feel I should provide a more careful / thought out explanation. Please review the attached code snippet as a possible solution. I'll walk you through the critical parts:

1. Two pages make out the solution: SlideShow.aspx and DisplayImage.aspx
2. It facilitates loading images into a session object of Byte() which allows you to read back the Byte() streams and display the image.
3. You need to create a folder called "slideshow" in the root of your application to hold the images.
4. Some key points:

If Session("SlideImages") Is Nothing Then

Determines if the imageas have been loaded into a session object as Byte(). Only needs to be done once, you can then consume this object throughout your web site.

For each image file in the folder we create a Byte() stream and load it into the session object:

For Each fi As FileInfo In di.GetFiles()
    Dim objImg As Byte() = ImageToByteStream(fi)
    slideImages.Add(objImg)
    numImages += 1
Next
Session("SlideImages") = slideImages 'Load the list of byte into Session
Session("numImages") = numImages
Session("CurrentSlideIndex") = 0

We retrieve the bytestreams from session and convert it back to image using:

img.ImageUrl = "~/DisplayImage.aspx?CurrentSlideIndex=" & currentSlideIndex
img.Height = New Unit(350)
phSlideImage.Controls.Add(img)

The code is far from perfect but I put together just to explain the concept. Let me know if you need any further explanations.

/Carl.
SlideShow.aspx:
 
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="SlideShow.aspx.vb" Inherits="SlideShow" %>
 
<%@ Register Assembly="AjaxControlToolkit, Version=3.0.30512.20315, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"
    Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
 
<!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 runat="server">
    <title>AJAX SlideShow Extender</title>
    <style type="text/css">
        .container  
        {
            border:solid 1px Silver;
            padding: 10px;
            margin-top: 25px;
            font-family: Trebuchet MS;
            font-size: 10pt;
        }
        .header
        {
            font-size: 14pt;
            font-weight:bold;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="sm1" runat="server">
    </asp:ScriptManager>
    <div class="container">
        <div>
            <asp:Label id="lblHeader" runat="server" Text="Slideshow" CssClass="header" /><br />
            <asp:UpdatePanel ID="upImage" runat="server" UpdateMode="Conditional">
                <ContentTemplate>
                    <asp:placeholder ID="phSlideImage" runat="server" >
                    </asp:placeholder>              
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="btnPrevious" EventName="Click" />
                    <asp:AsyncPostBackTrigger ControlID="btnNext" EventName="Click" />
                    <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
                </Triggers>
            </asp:UpdatePanel>
            <cc1:UpdatePanelAnimationExtender id="upae1" runat="server" TargetControlID="upImage">
                <Animations>
                    <OnUpdating>
                        <FadeOut Duration="1" Fps="25" />
                    </OnUpdating>
                    <OnUpdated>
                        <FadeIn Duration="1" Fps="25" />
                    </OnUpdated>
                </Animations>
            </cc1:UpdatePanelAnimationExtender>
            <asp:Timer ID="Timer1" runat="server" Interval="5000" enabled="false"/>
        </div>
        <div style="padding-top:5px;padding-bottom:5px;">
            <asp:Button ID="btnPrevious" runat="server" Text="Previous" />
            &nbsp;<asp:Button ID="btnPlay" runat="server" Text="Play" />
            &nbsp;<asp:Button ID="btnStop" runat="server" Text="Stop" />
            &nbsp;<asp:Button ID="btnNext" runat="server" Text="Next" />
        </div>
    </div>
    </form>
</body>
</html>
 
SlideShow.aspx.vb:
 
Imports System.IO
Imports System.Drawing
 
Partial Class SlideShow
    Inherits System.Web.UI.Page
 
    Private slideImages As New List(Of Byte())
    Private numImages As Integer
    Private currentSlideIndex As Integer
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Session("SlideImages") Is Nothing Then 'First visit to the page - images have not been loaded into session
            Dim di As New DirectoryInfo(Server.MapPath("~/slideshow"))
            For Each fi As FileInfo In di.GetFiles()
                Dim objImg As Byte() = ImageToByteStream(fi)
                slideImages.Add(objImg)
                numImages += 1
            Next
            Session("SlideImages") = slideImages 'Load the list of byte into Session
            Session("numImages") = numImages
            Session("CurrentSlideIndex") = 0
        End If
        Dim img As New System.Web.UI.WebControls.Image()
        If Not Page.IsPostBack Then
            currentSlideIndex = 0
            img.ImageUrl = "~/DisplayImage.aspx?CurrentSlideIndex=" & currentSlideIndex
            img.Height = New Unit(350)
            phSlideImage.Controls.Add(img)
        Else
            currentSlideIndex = CType(Session("CurrentSlideIndex"), Integer)
            img.ImageUrl = "~/DisplayImage.aspx?CurrentSlideIndex=" & currentSlideIndex
            img.Height = New Unit(350)
            phSlideImage.Controls.Add(img)
        End If
    End Sub
 
    Protected Sub Timer1_Tick(ByVal sender As Object, ByVal e As System.EventArgs) Handles Timer1.Tick
        If CInt(Session("CurrentSlideIndex")) < (CInt(Session("numImages")) - 1) Then
            Session("CurrentSlideIndex") = CInt(Session("CurrentSlideIndex")) + 1
        Else
            Session("CurrentSlideIndex") = 0
        End If
    End Sub
 
    Protected Sub btnPlay_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnPlay.Click
        Timer1.Enabled = True
    End Sub
 
    Protected Sub btnStop_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnStop.Click
        Timer1.Enabled = False
    End Sub
 
    Protected Sub btnPrevious_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnPrevious.Click
        If CInt(Session("CurrentSlideIndex")) > 0 Then
            Session("CurrentSlideIndex") = CInt(Session("CurrentSlideIndex")) - 1
        ElseIf CInt(Session("CurrentSlideIndex")) = 0 Then
            Session("CurrentSlideIndex") = (CInt(Session("numImages")) - 1)
        Else
            Session("CurrentSlideIndex") = 0
        End If
    End Sub
 
    Protected Sub btnNext_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btnNext.Click
        If CInt(Session("CurrentSlideIndex")) < (CInt(Session("numImages")) - 1) Then
            Session("CurrentSlideIndex") = CInt(Session("CurrentSlideIndex")) + 1
        ElseIf CInt(Session("CurrentSlideIndex")) = 0 Then
            Session("CurrentSlideIndex") = 0
        End If
    End Sub
 
    Private Function ImageToByteStream(ByVal fi As FileInfo) As Byte()
        Dim objImg As Byte()
        Dim fs As New FileStream(fi.FullName, FileMode.Open, FileAccess.Read)
        Dim reader As BinaryReader = New BinaryReader(fs)
        objImg = reader.ReadBytes(CInt(fs.Length))
        fs.Close()
        fs.Dispose()
        Return objImg
    End Function
End Class
 
DisplayImage.aspx:
 
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="DisplayImage.aspx.vb" Inherits="DisplayImage" %>
 
<!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 runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    </form>
</body>
</html>
 
DisplayImage.aspx.vb:
 
Partial Class DisplayImage
    Inherits System.Web.UI.Page
    Private currentSlideIndex As Integer
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not Session("SlideImages") Is Nothing Then
            currentSlideIndex = Request("CurrentSlideIndex")
            Response.ContentType = "image/bmp"
            Response.BinaryWrite(CType(Session("SlideImages")(currentSlideIndex), Byte()))
        End If
    End Sub
 
 
End Class

Open in new window

0
 
rkulpAuthor Commented:
Thank you very much.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.