Solved

AJAX Toolkit SlideShowExtender Question

Posted on 2009-07-04
5
1,340 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today is the age of broadband.  More and more people are going this route determined to experience the web and it’s multitude of services as quickly and painlessly as possible. Coupled with the move to broadband, people are experiencing the web via …
The Confluence of Individual Knowledge and the Collective Intelligence At this writing (summer 2013) the term API (http://dictionary.reference.com/browse/API?s=t) has made its way into the popular lexicon of the English language.  A few years ago, …
Monitoring a network: why having a policy is the best policy? Michael Kulchisky, MCSE, MCSA, MCP, VTSP, VSP, CCSP outlines the enormous benefits of having a policy-based approach when monitoring medium and large networks. Software utilized in this v…
Add bar graphs to Access queries using Unicode block characters. Graphs appear on every record in the color you want. Give life to numbers. Hopes this gives you ideas on visualizing your data in new ways ~ Create a calculated field in a query: …

623 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