# Providing Static Alternative Content for Silverlight Media Playing in a MediaElement

ID: SL17

Technology: silverlight

Type: Technique

## When to Use

- Microsoft Silverlight, versions 3 and greater
- Silverlight managed programming model and Silverlight XAML

## Description

The objective of this technique is to replace a Silverlight `MediaElement` with static alternative non-media content that is not time-based. The static alternative content replaces the media in the same or a nearby user interface region of the Silverlight application.

- If the media being played is audio-only, and the alternative content is a text equivalent such as a transcript, this technique addresses Success Criterion 1.2.1 (Audio-only and Video-only, Prerecorded).
- If the media includes content that cannot be adequately described by either alternative audio track or additional text captions, and the best alternative is to provide a full description in text such as a screenplay of the content, this technique addresses Success Criterion 1.2.3 (Audio Description or Full Text Alternative) and is similar to G69: Providing an alternative for time based media.

A Silverlight application user interface can be adjusted at run time by removing elements from the visual tree, and adding new elements to the visual tree. In this case, the user interface is designed to provide a control that the user activates to display the static alternative content, which is often a control that displays text, or a text element.

## Examples

### MediaElement playing audio, replace with transcript

This example has a UI definition in XAML and interaction logic in C#. In this case the `MediaElement` has no visual representation itself and is 0x0 size because it plays audio only. As a simple placeholder, this example displays the text "Library of Congress Audio" to represent the media element as something visible in the UI. In addition to Play/Stop controls, this interface includes a Display Transcript button. Activating the button displays static text that represents the transcript of the audio. The following is the basic UI in XAML.

    <UserControl x:Class="ReplaceAudioWithTranscriptText.MainPage"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:sys="clr-namespace:System;assembly=mscorlib">
       <UserControl.Resources>
           <sys:String x:Key="transSpeakerName">Matt Raymond: </sys:String>
           <sys:String x:Key="transText">This is Matt Raymond at the Library of Congress.
    Each year thousands of book lovers of all ages visit the nation's capital to celebrate the joys
    of reading and lifelong literacy, at the Library of Congress National Book Festival.
    For the first time in the festival's nine year history, President Barack Obama and
    First Lady Michelle Obama will serve as honorary chairs of this free event. </sys:String>
       </UserControl.Resources>
       <StackPanel x:Name="LayoutRoot" Background="White" >
           <TextBlock FontSize="30" Foreground="Blue">Library of Congress Audio</TextBlock>
           <MediaElement Source="/locintro.wma" AutoPlay="False" Name="player" Height="0" />
           <StackPanel Orientation="Horizontal" Name="ControlBar">
               <Button Name="Play" Click="Play_Click">Play</Button>
               <Button Name="Stop" Click="Stop_Click">Stop</Button>
               <Button Name="TextAlt" Click="TextAlt_Click">Display Transcript</Button>
           </StackPanel>
       </StackPanel>
    </UserControl>

The following is the C# logic.

       public partial class MainPage : UserControl
       {
           RichTextBox rtb;
           bool transDisplayed=false;
           public MainPage()
           {
               InitializeComponent();
               rtb = new RichTextBox();
               rtb.IsReadOnly = true;
               Paragraph p = new Paragraph();
               Run speakerName = new Run();
               speakerName.Text = this.Resources["transSpeakerName"] as String;
               speakerName.FontWeight = FontWeights.Bold;
               Run transText = new Run();
               transText.Text = this.Resources["transText"] as String;
               p.Inlines.Add(speakerName);
               p.Inlines.Add(transText);
               rtb.Blocks.Add(p);
           }
           private void Play_Click(object sender, RoutedEventArgs e)
           {
               player.Play();
               Play.IsEnabled = false;
           }
           private void Stop_Click(object sender, RoutedEventArgs e)
           {
               player.Stop();
               Play.IsEnabled = true;
           }
           private void TextAlt_Click(object sender, RoutedEventArgs e)
           {
               Panel parent = (player.Parent as Panel);
               if (!transDisplayed)
               {
                   DisplayTranscript();
                   (sender as Button).Content = "Hide Transcript";
                   transDisplayed = true;
               }
               else
               {
                   parent.Children.Remove(rtb);
                   (sender as Button).Content = "Display Transcript";
                   transDisplayed = false;
               }
           }
           private void DisplayTranscript()
           {
               Panel parent = (player.Parent as Panel);
               parent.Children.Add(rtb);
           }

This example is shown in operation in the working example of Replace Audio With Transcript.

## Tests

### Procedure

1. Using a browser that supports Silverlight, open an HTML page that references a Silverlight application through an object tag. That application has audio-only media content and is expected to supply a text alternative, or has media that is expected to be replaced entirely with a transcript or similar text alternative.
2. Check for a control that indicates that activating it will supply static alternative content for the media. Activate the control.
3. Verify that the media control is replaced with alternate content, and that assistive technologies represent the change to the user interface.

### Expected Results

#3 is true.

## Resources

- Audio and Video Overview