Solved

AJAX Toolkit SlideShowExtender Question

Posted on 2009-07-04
5
1,327 Views
Last Modified: 2012-05-07
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?
0
Comment
Question by:rkulp
  • 3
  • 2
5 Comments
 
LVL 18

Accepted Solution

by:
carlnorrbom earned 500 total points
ID: 24779070
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
 
LVL 18

Expert Comment

by:carlnorrbom
ID: 24781274
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
 
LVL 1

Author Closing Comment

by:rkulp
ID: 31599781
Thanks for the explanation. I may come back and ask for some AJAX code but want to try on my own first.
0
 
LVL 18

Expert Comment

by:carlnorrbom
ID: 24797616
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
 
LVL 1

Author Comment

by:rkulp
ID: 24798224
Thank you very much.
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

ASP.Net to Oracle Connectivity Recently I had to develop an ASP.NET application connecting to an Oracle database.As I am doing it first time ,I had to solve several problems. This article will help to such developers  to develop an ASP.NET client…
Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
This video discusses moving either the default database or any database to a new volume.
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now