Silverlight video player extension for Blogengine.NET

Anyone checking out my last post might have noticed the rather nice looking silverlight player demoing the code... Whilst I can't claim responsibility for the xaml and design of the player, I did manage to create an extension which makes adding a player like this very simple. I was thinking of adding some video to the post to demonstrate the sample app so that interested, but not that interested, people could see what was going on without downloading the code and firing up VS. Looking around I found that someone had already made an FLV player extension but hey, this is a .NET blog and Blogengine.NET is written using Microsoft technology, why not go all the way?!

My extension works almost exactly like the FLV player one, adding a token like this: [ silverlight:somevideo.wmv ] (without the spaces!) will get you a silverlight video player.

Now given that Blogengine.NET 1.3 has just landed, it's only right that we find a use for the new ExtensionManager amongst all this. It's time now that I confess why I can't claim responsibility for the lovely xaml, I stole it! There are actually 14 video player templates which come with Expression Encoder and from what I can make out from the EULA, I'm not doing anything wrong by redistributing them (someone please correct me if I'm wrong!). So to that effect we have 14 different skins and also width and height adjustments, all configurable from within the Extensions admin menu.



The attached zip file contains a file, SilverlightPlayer.cs, this must be uploaded to your ~/App_Code/Extensions folder. The zip also contains a folder, SilverlightPlayer, this must be uploaded along with it's contents (a Skins folder containing all the xaml/javascript etc..) to the root of your site. Any videos are then uploaded into your SilverlightPlayer folder before saving your post. If you want to check out what the other skins look like there are jpeg images in the SilverlightPlayer/Skins folder. Thats it!

One last note, if you haven't served silverlight content from your site before make sure you add the mime type for xaml, extension - .xaml, mime type - application/xaml+xml.

Enjoy a sample video here, curtesy of my partner who runs AlexZanDance.


(double click for full screen)

Update

Edited the code as per Troy Goode's suggestion in the comments to allow easy upload of files through the web interface. As Troy says below, all you need to do is go into the extension manager and change the Content Root to point to App_Data/files, which is where DotNetBlogEngine puts files you've uploaded through the web interface. Thanks Troy, like it!

SilverlightPlayer.zip (476.37 kb)

kick it on DotNetKicks.com  

Digg It!DZone It!StumbleUponTechnoratiRedditDel.icio.usNewsVineFurlBlinkList
December 29, 2007 21:01 by Sean
E-mail | Permalink | Comments (24) | Comment RSSRSS comment feed

Related posts

Comments

December 30. 2007 20:34

Pingback from geekswithblogs.net

Silverlight Cream for December 30, 2007 -- #163

geekswithblogs.net

January 1. 2008 10:40

I was just thinking about writing one,
Good Job I like yours.

Amr

January 1. 2008 17:56

This extension is great and very easy to implement and use. Have you thought about adding a way to upload the video to the SilverlightPlayer folder when creating a blog entry so you don't have to fireup Visual Studio or FTP the wmv? Even being able to do it from the Extension setup menu would work since that is what you have control over?

Bill Beckelman

January 1. 2008 22:27

Hi Bill,

Great idea, it's definitely something I'll look into for a future version!

Sean

January 3. 2008 01:02

Sean,

Have you seen http://www.vertigo.com/SlideShow.aspx. It looks like a cool candidate for an extension. I wrote one today using your code as a template and it seems to work though not too polished. If your interested let me know as I am sure you could improve it a lot more than I could. Might be handy for the community.

Bill Beckelman

January 3. 2008 15:03

Hi Bill,

Hadn't seen that actually, looks really great, I'm always blown away by Vertigo's samples. It's definitely something I'd be interested in looking at.

Sean

January 4. 2008 16:51

Hi Sean,

Like Bill I also wanted an easy way to upload my media files without using FTP. What I've done is modify your extension to make the contentRoot variable load from the settings file. To do so add the following to the SilverLightPlayer() contructor:

initialSettings.AddParameter( "contentRoot", "Content Root" );
initialSettings.AddValue( "contentRoot", "SilverlightPlayer/" );

And then in the Post_Serving(...) method change this line:

mediaFile = contentRoot + mediaFile;

To:

mediaFile = settings.GetSingleValue("contentRoot") + mediaFile;

I then went into my extension manager and changed the Content Root to point to App_Data/files, which is where DotNetBlogEngine puts files you've uploaded through the web interface. Hope this helps!

Troy Goode

January 5. 2008 12:00

Hi Troy,

That's a great idea! I'll add the changes and update the article when I get a chance. Thanks for sharing.

Sean

January 21. 2008 19:44

can we have a exemple how to implement into a aspx page?
How to call play a video into a aspx page?
Thanx!

oLi

January 21. 2008 19:56

Can we have «SilverlightPlayer.cs» file into a .vb ?
thanx again!!

oLi

January 23. 2008 08:24

Hi oLi,

If you'd like to use the player elsewhere, firtly you need to reference the common javascript files in your Html Head section:

<script id="SPJS0" type="text/javascript" src="/SilverlightPlayer/Skins/MicrosoftAjax.js"></script>
<script id="SPJS1" type="text/javascript" src="/SilverlightPlayer/Skins/Silverlight.js"></script>
<script id="SPJS2" type="text/javascript" src="/SilverlightPlayer/Skins/BasePlayer.js"></script>
<script id="SPJS3" type="text/javascript" src="/SilverlightPlayer/Skins/PlayerStrings.js"></script>
<script id="SPJS4" type="text/javascript" src="/SilverlightPlayer/Skins/StartPlayer.js"></script>

Need you need to reference the javascript file for the actual player you would like to use, this will be in one of the "Skins" subdirectories:

<script id="SPJS5" type="text/javascript" src="/SilverlightPlayer/Skins/CorporateWhite/player.js"></script>

Finally, at the place in your page where you'd like to embed the player, you need to use a div element that looks like this:

<div id="silverlightPlayer_dance" style="width:600px; height:450px;">
<script type='text/javascript'>
new StartPlayer_0("silverlightPlayer_dance",
"/SilverlightPlayer/Skins/CorporateWhite/player.xaml",
"/SilverlightPlayer/dance.wmv");
</script>
</div>

Notice the parameters passed to the StartPlayer function, the first is the id of the parent div, the second is the path to the Xaml for your chosen player and the third is the path to the media!

Thats it!

If you need the source as a vb file, you could try an online converter like this one for example:

labs.developerfusion.co.uk/.../csharp-to-vb.aspx

Hope that helped.

Sean

January 23. 2008 12:56

Thank you very much Sean, it really help me.

But one last thing, in the «SilverlightPlayer.cs» you refer to :
BlogEngine.Core
BlogEngine.Core.Web.Controls

Where can i have this dll?
My project doesn't compile anymore.
The type or namespace name 'BlogEngine' could not be found (missing assembly reference?)

Thank to help!

oLi

January 23. 2008 16:38

Hi again, because this code was designed to run as a plugin for Blogengine.NET (http://www.dotnetblogengine.net/), it expects that these namespaces to be available. They actually don't have anything to do with the silverlight player at all and are there just to facilitate integration with the blogging software.

If you're trying to use this player on your own site and you're not running Blogengine.NET, you can safely remove those references, and all calls which uses classes in those namespaces.

Sean

January 24. 2008 21:02

hi there
nice extension. Just struggling to get it to work. Can you please give more thourough instructions on how to configure this and apply it

thanks

NBURO

February 4. 2008 20:16

Pingback from johndyer.name

BlogEngine.NET Extension: Flash Video Player

johndyer.name

February 14. 2008 16:20

Hi,
After I upgrade to latest source code on Codeplex.com/blogengine (specifically 9605), [silverlight:sl_0001.wmv] on my post does not render a Silverlight Player Extension.
Here is link to that post: www.muratduman.net/.../...ht-Bize-Neler-Katti.aspx
Do you have a suggestion? Thanks in advance

Murat Duman

February 15. 2008 10:12

Hi Murat,
It's hard to know exactly what is happening there when I can't step through the code, although I have just downloaded that release and the extension works fine for me...
If I were to make a guess I'd say that there is a problem with your settings in the ExtensionManager. You can check that Width and Height are both valid integers, that the value of Skin exactly matches one of the listed values.

Let me know how you get on...

Sean

February 16. 2008 22:41

Hi Sean,
I have been trying some ways to solve my problem. I have checked the mime type for xaml, extension - .xaml, mime type - application/xaml+xml in my shared hosting, i think it is not working. So to workaround I have renamed player.xaml to player.xml in SilverlightPlayer/skins/popup folder. I also changed to code (line 65) to work without problem. This workaround also did not work.

In my vista + vs2008 I open my site and use view in browser option on solution explorer window. That does show the silverlight player and a message "URL not found.".. of course it can not find my video under app_data/files folder. But when I put this site under inetpub as a new web application, player does not show up as in my shared hosting.
I know it may seem very hard to analyze without seeing code. So can you help me about debugging silverlightplayer.cs code, any tricks to see extension code really can access to extensions.xml (when I first compile the code, 9605) I get a extensions.xml fileaccess error. After f5 problem goes away and site starts to work (except silverlight player.)

Thanks in advance.

Murat Duman

February 19. 2008 03:04

I mounted the plug to my site ... But the files larger than 10mb give me the error that are not successful ... Make-up should it?

AlexJimenez

February 19. 2008 12:08

Hi Murat,

Sorry for being a little slow to respond, I'll try to investigate further and will get back to you as soon as I can.

Sean

February 19. 2008 12:12

Hi Alex,
There should be no problem with larger files. The video embedded in the post above is actually 48MB and seems to work fine. It sounds like your web server is not configured correctly, sorry I can't be of more help.

Sean

February 28. 2008 20:51

Pingback from betaparticle.com

Silverlight Player

betaparticle.com

May 3. 2009 02:04

Pingback from moviesberry.com

The Tide of Life, 1996

moviesberry.com

Comments are closed