Fire up your applications with Jazz
Jazz CMS Wiki

About Us

CMS CMS Administration GUI Jazz Jazz Administration Jazz Web Parts Library misc Roles Solutions Training Web Parts Web Service Website Design Website Procedures Wiki conventions WordML Workflow Administration

Quick Search
Advanced Search »

Photo Album (Silverlight) Web Part

Photo Album (Silverlight) Web Part

This Web Part displays images using Microsoft Silverlight. Images are presented in a slideshow, rotating through each image. Images are displayed from a directory or from an XML file.


The Web Part is accessed from the CMS Media Web Parts Library.

Editor for the Web Part

Editor for the Web Part

Edit Properties

Custom edit properties include:

  • Image Link - The path to the image directory. This is a path relative to the website.
    • NOTE: The Xml File takes precedence over the image directory.
  • Xml File - The configuration xml file that contains a list of images. This is a path relative to the website.
    • The xml file allows multiple albums to be displayed.
    • The xml file displays additional properties for each image.
      • Title
      • Description
      • Thumbnail
      • Source
      • Hyperlink
  • CMS Common Edit Properties

Website Configuration

Refer to Silverlight Site Dependencies to identify website configuration requirements.

Directory Option

The Directory option displays all images found in the selected directory. This is simpler to configure, but uses default characteristics for the display.
  • The directory is treated as a single album.
  • Photos are displayed alphabetically.
  • The default photo transition of CrossFadeTransition is used between photos.
  • The default wait time = 3000 ms and transition time = 500 ms are used.
  • Attributes of the photo include:
    • The Photo title is the file name.
    • There is no photo description.
    • A thumbnail photo option for display is not available.
    • The hyperlink is set to the image location.

XML File Option

XML Files define the display characteristics. To use the XML File option, the following files are required:
  • Data.xml file that defines the albums and images/videos to be displayed in the slide show. The name for the Data.xml file may be changed.
  • Configuration.xml file that configures the silverlight player. The name for the Configuration.xml file may not be changed.

These files should be placed in a folder in the website.

Photo Transitions

The photo album can be configured to transition images in the XML file option. Transitions include:
  • CircleInTransition
  • CircleOutTransition
  • CircleTransition
  • CrossFadeTransition
  • HorizontalSlideTransition
  • NoTransition
  • ShapeTransition
  • SlideDownTransition
  • SlideLeftTransition
  • SlideUpTransition
  • SlideTransition
  • SlideUpTransition
  • TranslateDownTransition
  • TranslateLeftTransition
  • TranslateRightTransition
  • TranslateUpTransition
  • VerticalSlideTransition

Sample Data File

The following xml snippet is a sample of the Data file used with the Silverlight Photo Album. To use the XML file for your application, create an xml file in a directory of your website, download the following file from Silverlight Photo Album sample xml file (Note: You may need to 'view the source' of the web page to see the file contents).

Features associated with using the XML file include:
  • Multiple albums can be displayed
  • Attributes for each Photo Album includes:
    • Album title
    • Album description
    • A photo for the album
    • Which album to start with
    • The transition used between photos in the album
  • Attributes for each slide includes:
    • Photo title
    • Photo description
    • A thumbnail of the photo (used for faster loading)
    • A hyperlink used when the photo is clicked

<?xml version="1.0" encoding="utf-8" ?>
<data startalbumindex="0" transition="CrossFadeTransition">
		title="Liam Molloy"
		description="A collection of Liam's favorite Hard Rock memorabilia items"
			title="Kids wave to the SeaWorld shark tank diver"
			description="SeaWorld San Antonio"
			source="../Assets/Memorabilia/Kids wave to the SeaWorld shark tank diver.jpg"
			thumbnail="../Assets/Memorabilia/Kids wave to the SeaWorld shark tank diver.jpg"/>
			description="This image doesn't exist, resulting in the blank image being shown.  This image also has a really long description, just to show that you can expand the description height in the XML configuration now to support really long descriptions."
			title="Chad Smith - Red Hot Chilli Peppers - Custom Pearl drum kit"
			description="Image provided by Hard Rock. Click on image for more details"
			title="Sid Vicious - The Sex Pistols - Jacket and letter from mom"
			description="Image provided by Hard Rock. Click on image for more details"
		title="Scott Stanfield"
		description="A collection of Liam's favorite Hard Rock memorabilia items"
			title="Bo Diddley - Tom Holmes custom guitar"
			description="Image provided by Hard Rock. Click on image for more details"
			title="John Lennon - US Army shirt"
			description="Image provided by Hard Rock. Click on image for more details"
			title="The Beatles - “Butcher Cover” Yesterday and Today LP, box"
			description="Image provided by Hard Rock. Click on image for more details"

Sample Configuration File

The configuration file (placed in a separate file in the same folder) is used to pre-configure the silverlight player. Examples include:
  • background colour
  • whether the player should start the slide show
  • whether the player starts in album view
  • The Height of the description
  • the duration of the transition between images
  • the time that the image is displayed

<?xml version="1.0" encoding="utf-8" ?>
<configuration background="Black" AutoStart="false" StartInAlbumView="true">
    <module name="SlideDescription">
        <option name="DescriptionHeight" value="60" />
    <module name="Transition">
        <option name="TransitionDuration" value="500" />
        <option name="WaitTime" value="3000" />
</configuration> - Wiki version