asked on

media element and silverlight

How do you create something like this with a media element?

http://narenda.com/silverlight/default.html

What I have so far is:

and I got this error:

Error: Unhandled Error in Silverlight 2 Application SlidingBlocks.xap
Code: 4001
Category: MediaError
Message: AG_E_NETWORK_ERROR

Canvas[] cI = new Canvas[9];
        MediaElement[] me = new MediaElement[9]; 
         int blockSizeW = 97;
        int blockSizeH = 97;
 
int nx = 0;
            for (int ix = 0; ix < 3; ix++)
                for (int iy = 0; iy < 3; iy++)
                {
                    nx = (ix * 3) + iy;
                    me[nx] = new MediaElement();
                    me[nx].Height = 300;
                    me[nx].Width = 300;
                    me[nx].Stretch = Stretch.UniformToFill;
                    RectangleGeometry r = new RectangleGeometry();
                    r.Rect = new Rect((ix * blockSizeW), (iy * blockSizeH), blockSizeW, blockSizeH);
                    me[nx].Clip = r;
                    me[nx].Source = new Uri("assets/SharePoint.wmv", UriKind.Relative);
                    me[nx].SetValue(Canvas.TopProperty, Convert.ToDouble(iy * blockSizeH * -1));
                    me[nx].SetValue(Canvas.LeftProperty, Convert.ToDouble(ix * blockSizeW * -1));
                 
                    cI[nx] = new Canvas();
                    cI[nx].Width = blockSizeW;
                    cI[nx].Height = blockSizeH;
                    cI[nx].Children.Add(me[nx]);
                    cI[nx].SetValue(Canvas.NameProperty, "C" + nx.ToString());
                    cI[nx].MouseLeftButtonDown += new MouseButtonEventHandler(Page_MouseLeftButtonDown);
                    if (nx < 8)
                        GameContainer.Children.Add(cI[nx]);
                }

Open in new window

JaressLoo

The first thing you'll need is a reference to the Microsoft Silverlight dll (System.Web.Silverlight). You can download what you'll need from here: http://silverlight.net/GetStarted/

Then, you'll need the media player ASP.NET code that I've attached.

The way I usually do this is by opening up expression encoder and then encode a video with the player that I like. It outputs to you a completed HTML web page.

You can take what it provides and integrate it with the media player element that I've attached.

I'm also attaching the skin and javascripts that make my player work on this page: http://betatest1.jaressloo.com/tutorials/butterfly

I hope you find this helpful

<%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls" TagPrefix="asp" %>
 
    <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Path="~/includes/MicrosoftAjax.js" />
            <asp:ScriptReference Path="~/includes/Silverlight.js" />
            <asp:ScriptReference Path="~/includes/SilverlightControl.js" />
            <asp:ScriptReference Path="~/includes/SilverlightMedia.js" />
            <asp:ScriptReference Path="~/includes/ExpressionPlayer.js" />
            <asp:ScriptReference Path="~/includes/PlayerStrings.js" />
            <asp:ScriptReference Path="~/includes/player.js" />
            <asp:ScriptReference Path="~/includes/StartPlayer.js" />
        </Scripts>
    </asp:ScriptManager>
 
<asp:MediaPlayer ID="mpVideo" runat="server" Height="400px" Width="530px" MediaSource="../videos/Butterfly.wmv"  
  MediaSkinSource="../includes/player.xaml" ScaleMode="Stretch">
</asp:MediaPlayer>

Open in new window

ExpressionPlayer.js.txt
MicrosoftAjax.js.txt
player.js.txt
player.xaml.txt
PlayerStrings.js.txt
Silverlight.js.txt
SilverlightControl.js.txt
SilverlightMedia.js.txt
StartPlayer.js.txt

kuntilanak

ASKER

isn't there a simple way to do this using a media element? and a canvas?

JaressLoo

You don't have to use all of the scripts in the script manager.

You can just use the media element. That should work.

kuntilanak

ASKER

Yes, but how do I use the media element?? Can you tell why my code doesn't work?

JaressLoo

Unfortunately, no. When I create a media element in a page I literally just drag the media element from the toolbox onto the page in VS and it just works.

This looks like server-side coding that I don't need to do nor have I ever done.

Sorry I couldn't be of more help!

Have you downloaded the silverlight SDK from Microsoft?

ASKER CERTIFIED SOLUTION

JaressLoo

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial