Navigation

Search

Categories

On this page

Creating Web-Based MP3 Player using ASP.NET 2.0, UltiDev Cassini Web Server and Macromedia Flash Player
Problem with Macromedia (Adobe) Flash Object on the ASP.NET Page Served by Visual Studio 2005 WebDev.WebServer2.exe

Archive

Blogroll

Disclaimer
The opinions expressed herein are my own personal opinions and do not represent my employer's view in anyway.

RSS 2.0 | Atom 1.0 | CDF

Send mail to the author(s) E-mail

Total Posts: 48
This Year: 15
This Month: 0
This Week: 0
Comments: 8

Sign In
Pick a theme:

 Monday, March 05, 2007
Monday, March 05, 2007 6:30:06 PM (Eastern Standard Time, UTC-05:00) (  |  |  |  )
Summary

UPDATE: This sample is an open-source project now.

This article describes how to build a redistributable ASP.NET application that allows users browse remote server's file system and pick folders with MP3 files to be played by embedded Macromedia Flash-based MP3 player.


Article Sources

Download article's C# source in a form of Visual Studio 2005 Solution comprising ASP.NET application and a Setup Project. Unzip the archive to "C:\".


End Result

UltiDevMP3Player-2-Thumbnail.PNG  

After building the project you will have an MSI-based setup package that can be installed on virtually any Windows-based PC. Installed application will be accessible from inside the LAN as an intranet application without having to install IIS.


Prerequisites

- Visual Studio 2005.
- UltiDev Cassini Web Server for ASP.NET 2.0. UltiDev Cassini is packaged together with the application into the Setup.exe so that the final application would not depend on IIS being present on target system.


Let's Begin (Getting Ducks in a Row)

A few weeks ago I stumbled upon a great piece of free software:Flash-based XSPF-compatible MP3 player. When embedded on a page, it can take playlist over HTTP and play it. Second nice thing was that XSPF play list format has XSD schema available. .NET Framework xsd.exe utility allows easy conversion of XSD schemas into C# or VB.NET classes incapsulating the structure of the data defined by the XSD, as well as implementing XML serialization to and from XML files conforming to the schema. So I had an XSPF-compatible MP3 player and a free code generating XSPF-compatible XML. That meant I could easily create XSPF-compatible playlists on a fly. Only if I had free ID3 tag (MP3 file metadata) access API...

Finding ID3v2 library for .NET was harder than I expected. However search was ultimately successful. The UltraID3Lib ended up being just what I needed. It's a nice library; may be just be a bit over the top object-oriented.

Final piece is UltiDev Cassini Web Server for ASP.NET 2.0. It's necessary because first, it can be packaged and shipped along with any ASP.NET application eliminating requirement for IIS. Second, unlike IIS UltiDev Cassini service works under "Local System" account, which enables access to any local file and folder on the server. One thing to note, while this is quite convenient to have a web server running under powerful account, it may pose a risk if the application is exposed on the web. It's best to work with the application inside protected local area network.

After you have downloaded the solution, unzip it on C:\. It will create "C:\UltiDevMusicPlayerSample" folder. If you want to put it in some other folder - you can do that too - simply adjust your project debugging settings later to point to the correct application folder (see below).


Application Flow

- Application has a single page (Default.aspx) containing the player control and file a system browser (Controls/PlayerControl.ascx and Controls/PlayerControl.ascx.cs).
- After user selected a folder with MP3 files, file system browser tree gets hidden and player control is re-rendered to point to the dynamically-generated playlist representing selected folder.
- Player control requests dynamic playlist and custom IHttpHandler (AppCode/PlaylistClass.cs and AppCode/xspf.cs) serves XSPF-encoded playlist containing songs in the selected folder. Playlist contains song information retrieved from songs' ID3v2 and ID3v1 MP3 tags.
- Player plays songs one by one: requesting each one from the custom IHttpHandler (Handlers/Song.ashx) serving songs from local file system. After song started playing player also requests song album artwork (cover art) from custom IHttpHandler (Handlers/CoverArt.ashx) which serves image extracted from song's ID3v2 tag.

Debugging

I had troubles getting Visual Studio 2005 internal web server to serve Flash component. I switched to UltiDev Cassini for debugging and that has solved the problem. Debugging with UltiDev Cassini is probably a good idea anyway since the application is eventually going to run under UltiDev Cassini.

To switch to UltiDev Cassini, bring up ASP.NET application's properties, select Start Options of the left, and check "Start External Program" radio-button. Enter "C:\Program Files\UltiDev\Cassini Web Server for ASP.NET 2.0\UltiDevCassinWebServer2.exe" as the program to be used for debugging, and specify "/run c:\UltiDevMusicPlayerSample\WebApp Default.aspx 4125" (no quotes) as command line arguments. If you have unzipped solution to a folder other than "C:\", then you will need to modify c:\UltiDevMusicPlayerSample\WebApp part of the command line arguments to point to the actual application location.
VS2005DebugSettingsForMP3App.PNG


Setup Project

Unlike regular ASP.NET application, this application is using regular (non-web) setup project for installer implementation. The reason for that is the Visual Studio web setup project is actually IIS setup project. Since we are using UltiDev Cassini instead of IIS, regular setup project is required instead.

Setup project packs UltiDev Cassini into Setup.exe bootstrapper and ensures application is registered with UltiDev Cassini during installation process and gets unregistered during uninstallation.

Creating a setup project for ASP.NET application bundled with UltiDev Cassini is not complex, but if you need step-by-step guide, please refer to this walk-through.

IMPORTANT: When installing the application, don't just click the .MSI file. You will need to run Setup.exe to ensure UltiDev Cassini web server gets installed on target system. This is especially true on Vista, where clicking .MSI and running Setup.exe are not nearly as functionally close as it used to be on Windows XP.

Build & Enjoy!

Comments [0] | | # 
Monday, March 05, 2007 4:22:37 PM (Eastern Standard Time, UTC-05:00) (  |  |  |  |  )

Recently I've been working on the small ASP.NET 2.0 app that has a page containing Macromedia (now Adobe) Flash object. When I tried debugging it with Visual Studio 2005 and its internal web server, the Flash piece has never been loaded by Internet Explorer - I am not even sure whether it was the Flash player that failed to load or the .SWF file. I wonder if anyone else had this issue. I could not check which component was not loaded because WebDev.WebServer2.exe serves only local applications, and I could not use an http tracer to see which request gets stuck.

I worked around the issue by switching to our own UltiDev Cassini for ASP.NET 2.0 for application debugging. It served all the bits and pieces required by Flash without a hitch.

Comments [0] | | #