How can I build a Silverlight Media Player where I can modify the playlist and source in code?

02-06-2009 4:39 PM |

I need some help getting pointed in the right direction.  I can build and use a simple MediaElement in Silverlight and play a video.  However, I want the video window to have a clickable thumbnail list of videos which the user can select.  As recomended in the Silverlight Videos, I used "Expression Encoder' to output one of the robust Video Player templates that is complied into a .xap that I can then reference in my ASP.NET via a <asp:Silverlight> tag.

However, I have no idea how to interact with the control and change its source at runtime via code or JS.  I tried the following JavaScript and it states "Object does not support this property or method".

function SetVideoSource() {
    var slVplayer = document.getElementById("ctl00_ContentPlaceHolderMyApp_Silverlight1");
    //for debugging; still does not work
    //alert(slVplayer.GetProperty("Source"));
    slVplayer.SetProperty("Source", "http://MediaFiles/MyMovie.wmv");

}

 I am not sure which direction to take at this point.  I don't want to build the entire player from scratch because there is a ton of support code, but at the same time I don't know how to interact with this player to set either the source or the thumnail playlist, without statically setting the info in Expression Encoder 1st and then recompiling the .xap.

Can anyone make a reccomendation or lead me in the right direction on how to go about using a video player that I can interact with in my ASP.NET app?

Thanks!!

Re: How can I build a Silverlight Media Player where I can modify the playlist and source in code?

02-07-2009 9:55 AM |

using "Expression Encoder 2 SDK"  you can get Thumbnail...

this is C# code....

MediaItem item = new MediaItem(@"C:\Users\Administrator\Desktop\video.wmv");
TimeSpan get_time = new TimeSpan(0, 0, 5);  //get 5 sec's thumbnail
Bitmap image = item.GetThumbnail(get_time, item.VideoSize);
image.Save(@"C:\Users\Administrator\Desktop\myThumbnail.png", ImageFormat.Png);

You Must Incude this...

using Microsoft.Expression.Encoder;
using System.Drawing;
using System.Drawing.Imaging;

Re: Re: How can I build a Silverlight Media Player where I can modify the playlist and source in code?

02-10-2009 11:03 AM |

I downloaded the Expression Encoder SDK and I could not find that code example to expand on.  Could you send me a reference or link where that code came from please?

Also, I am looking at more than just the thumbnails.  I need to be able to populate the playlist and have it load into the media player at runtime.  I could probably use a WCF service to pull back a playlist at contol load, and use code behind to wire up the video being played from a selection. 

Any ideas on getting my control list to interact with my video player?

Re: Re: How can I build a Silverlight Media Player where I can modify the playlist and source in code?

02-10-2009 11:57 PM |

You need to Add Reference...
if you install SDK you can find them... 

Microsoft.Expression.Encoder
Microsoft.Expression.Encoder.Types
Microsoft.Expression.Encoder.Utilites
WindowsBase

you muse use WCF or Web Service
1. WebService make thumbnail
2. webpage load image

 http://earips.cafe24.com/data/EE2.rar

Re: How can I build a Silverlight Media Player where I can modify the playlist and source in code?

06-20-2009 6:02 PM |

Ouuuuups... sorry here the right code: in CS use "Movies/MVClip..." instead of "Movies/Movie..."

XAML:

<UserControl x:Class="VideoList.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="clr-namespace:Microsoft.Windows.Controls;assembly=Microsoft.Windows.Controls"        
    Width="800" Height="600" Loaded="UserControl_Loaded">
    <Grid x:Name="LayoutRoot" Background="White" HorizontalAlignment="Left" VerticalAlignment="Top">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="300"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <ListBox Grid.Column="0" x:Name="lstVideo"
                          Width="300" Height="200"
     HorizontalAlignment="Left"
     VerticalAlignment="Top"
     SelectionChanged="lstVideo_SelectionChanged">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <controls:WrapPanel />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.Template>
                <ControlTemplate>
                    <Grid>
                        <ScrollViewer>
                            <ItemsPresenter />
                        </ScrollViewer>
                    </Grid>
                </ControlTemplate>
            </ListBox.Template>
            <ListBox.ItemTemplate>
                <DataTemplate>
     <Grid Width="50" Height="50" Background="Red">      
                    <TextBlock Text="{Binding}"
                               TextAlignment="Right"
                               Width="25"
          HorizontalAlignement="Center"
          VerticalAlignment="Center"/>
                   </Grid>

                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <MediaElement x:Name="VideoMedia"
                      Width="400"
                      Height="400"
                      AutoPlay="True"
                      Source="Movies/MVClip1.wmv"
                      Grid.Column="1"
                      HorizontalAlignment="Left"
                      VerticalAlignment="Top"
                      />       

    </Grid>
</UserControl>

CS:
--------------------------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace VideoList
{
    public partial class Page : UserControl
    {
        public Page()
        {
            InitializeComponent();
        }

       
 private void UserControl_Loaded(System.Object sender, System.Windows.RoutedEventArgs e)
        {
           
            for (int i = 1; i <= 8; i++)
            {
                lstVideo.Items.Add(i);
            }
        }

        private void lstVideo_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
           
            string i = lstVideo.SelectedItem.ToString();
            string myVideo = "Movies/MVClip" + i + ".wmv";           

            VideoMedia.Source = new Uri(myVideo, UriKind.Relative);
            VideoMedia.Play();

        }

    }
}
----------------------------------------------------------------