ASP.NET Jumpstart: Introduction to the Media Share Library Starter Kit

 

Bill Evjen
Reuters

September 2005

Applies to:
   Microsoft ASP.NET 2.0
   Microsoft Visual Web Developer 2005 Express Edition

Summary: Learn how to build your own starter kit using Microsoft ASP.NET and Microsoft Visual Studio 2005 or Microsoft Visual Web Developer 2005 Express Edition. (23 printed pages)

Click here to download the code sample for this article.

Contents

Introduction
The Purpose of the Media Share Library Starter Kit
Creating the Required Admin Role
Creating an Admin User
The Administrator's Page
Entering Items Manually into Your Library
Entering Items Using Amazon Web Services into Your Library
Working with Your Personal Library
Browsing and Borrowing Items in the Main Library
Alerts on Items Borrowed and Lent
Changing the Status of Items Lent
Conclusion

Introduction

Welcome to ASP.NET Jumpstart, a four-article series that will run you through the creation of a complete application—from the beginning to the end. This article is really meant for the Microsoft ASP.NET beginner or hobbyist, but anyone interested in the new features provided by ASP.NET 2.0 will find value in this series of articles.

ASP.NET 2.0 is a dramatic new improvement over ASP.NET 1.0/1.1, which was first introduced in 2000. ASP.NET 2.0 (presently in Beta 2 as of this writing), can be found on MSDN and is freely downloadable and ready to use for any applications you want to build today. While ASP.NET 1.x was rather revolutionary in the world of building Web applications, you will find that ASP.NET 2.0 is just as revolutionary in making you the most productive developer you could possibly be. Much of the focus of this article will be on using new ASP.NET 2.0 features and how to take full advantage of the features it offers.

The article that we are working through here is an introduction to the Media Share Library Starter Kit and what it offers you once it is installed on your server. This article will assist you in the setup and installation of the starter kit so you can start working with it right away. After this, the next articles will work to show you how to actually build this application yourself.

Let's start by looking at the functionality provided by the Media Share Library Starter Kit.

The Purpose of the Media Share Library Starter Kit

The Media Share Library Starter Kit enables you to easily create an application that allows registered users to present a collection of media items (such as movie DVDs, music CDs, books, and more) for other registered users to borrow. Users will be able to look through a library of items collectively held by the group using the application and request to borrow specific items from the registered owners of the items. The idea of the Media Share Library Starter Kit is to provide you with a framework that you can use to quickly organize a library collection that can be shared with a larger group of people.

This starter kit provides you with a series of pages that easily allow you to present and manage items in your library, as well as items that are on loan. Starting pages for this starter kit include a basic home page and login page for registered users. Also included in the starter kit are pages that allow you to view the group library, your personal library, as well as an alert page that warns you of items you have due to others or items that are due to you.

From this brief description, you can see that there is a lot of functionality provided in this framework application. When compiling and running the Media Share Library Starter Kit and working with the application for some time, you will then have something similar to what is shown in Figure 1.

Aa479392.mediashare_fig01s(en-us,MSDN.10).gif

Figure 1. The alert page for the Media Share Library Starter Kit

Each of the pages in the Media Share Library Starter Kit are ready for you to make your own by simply changing the code that is provided. Doing this will start you on the personalization process for your group library Web site.

The Media Share Library Starter Kit is also a great learning tool. You can view the code that produces each page of the application, and you will find that it uses some of the strongest features from the latest release of ASP.NET. Even if you are not interested in using this starter kit for an actual production Web site, it is still a valuable resource to use to learn how to create an application using ASP.NET 2.0.

Before we look at working with this application, though, let's first start by taking a look at the installation and startup of this starter kit.

Initial Setup of the Media Share Library Starter Kit

The Media Share Library Starter Kit can be downloaded from MSDN and comes as a Windows Installer Package file—Media Share Library.msi. Double-clicking on this file will launch a process to install the starter kit onto your computer. The first screen in the installation wizard is shown in Figure 2. It is important to note that the Media Share Library Starter Kit only is available in Visual Basic 2005.

Aa479392.mediashare_fig02(en-us,MSDN.10).gif

Figure 2. Installing the Media Share Library Starter Kit

Once you have completed the installation process, you can then open up Visual Studio 2005 and open up the web site in a couple of different ways. You can open it up as a File System project by selecting File -> Open Web Site from the Visual Studio menu and selecting the File System button from the left-hand pane. This will give you the opportunity to navigate to the installed starter kit found at C:\Inetpub\wwwroot\MediaShareLibrary. The other option is to select the Local IIS button and open up the Default Web Site node to navigate to MediaShareLibrary. Both of these methods are shown in Figure 3.

Aa479392.mediashare_fig03s(en-us,MSDN.10).gif

Figure 3. Opening the Media Share Library Starter Kit

Once the Media Share Library Starter Kit option is opened, you will notice that the project includes a number of folders and files. You can view all of these created items in Visual Studio's Solution Explorer, as illustrated in Figure 4.

Aa479392.mediashare_fig04(en-us,MSDN.10).gif

Figure 4. The Media Share Library solution

Looking at Figure 4, you can see that there is a lot to this starter kit. It is really divided into five main parts:

  • The root files, which include the Default.aspx, Web.config, Web.sitemap, as well as some pages that deal with the login and registration process. The new addition to this list for ASP.NET 2.0 is the Web.sitemap file, which is an XML-based definition of the web site's navigation structure.
  • The App_Data folder, which contains a Microsoft SQL Server Express Edition file (ASPNETDB.MDF), as well as the Library.mdf file that is used to store all information input into Media Share Library. The ASPNETDB.MDF file stores all the membership and role management information that is used by the application.
  • The App_Themes folder contains files that allow you to define the style (look-and-feel) of the entire application. This is a new feature in ASP.NET 2.0 and it allows you to manage the look-and-feel of the entire application from one central point. The types of files that are included in this folder include a cascading style sheet file (.css) as well an ASP.NET skin file (.skin). The new file here, the skin file, is explained later in this article.
  • A folder named Admin, which contains a simple page that allows someone contained in the Admin role to manage the categories used by the library. These categories are then used by registered users when they input their library items into the system. Each item input into the library must have an associated category (DVD, XBOX, Book, and so on).
  • A folder named Library, which contains the bulk of the application that is reviewed in this article.

Creating the Required Admin Role

The first thing you should do when you create an instance of the Media Share Library Starter Kit in Visual Studio is to compile and run the application. Doing this will launch a page that contains an introduction page. This is shown in Figure 5.

Aa479392.mediashare_fig05s(en-us,MSDN.10).gif

Figure 5. The introduction page of the application

When you start up the application for the first time, you are also creating an administrator role that you can then map a single or multiple users to. How are these roles created? They are created in the application's Global.asax file. Taking a look at this file, you will notice that on the Application_Start event, there is the following code (as shown in Listing 1).

Listing 1. Creating the Admin role in the Application_Start event in the Global.asax file

Sub Application_Start(ByVal sender As Object, ByVal e As EventArgs)
      ' Code that runs on application startup
      If (Roles.Enabled) Then
         If Not Roles.RoleExists("Admin") Then
            Roles.CreateRole("Admin")
         End If
      End If
End Sub

From this bit of code you can see that an If statement first checks to see whether the role management system is even enabled and, if it is, checks are made to see whether the Admin role exists in the system. This is done using the Roles class's RoleExists() method. If this check is found to be False, then the roles are created using the CreateRole() method.

A user that is in the Admin role for this application will be able to view the Admin.aspx page while others will not. The Admin.aspx page allows for the management of the categories that are allowed to be used in the library. All items entered into the library do need to have an associated category.

Now that the Admin role is created for the Media Share Library Starter Kit, you can shut down the application by closing the browser instance. Then open up the ASP.NET Website Administration Tool for this application by selecting Website -> ASP.NET Configuration in the Visual Studio menu. You will be presented with a Web-based GUI that allows you to set specific configuration settings for your application. Clicking on the Security tab, you will see that there is indeed a single role configured for the application. This is illustrated in Figure 6.

Aa479392.mediashare_fig06s(en-us,MSDN.10).gif

Figure 6. Checking to see that the Admin role is created for the application

Now that the role is created, let's next take a look at creating some users (one of which we will later put in the Admin role).

Creating an Admin User

The easiest place to create a user is from the application's registration page (Join.aspx). You can get to this page by clicking on the Join Today! link found on every page of the application. The registration page you'll encounter is shown in Figure 7.

Aa479392.mediashare_fig07s(en-us,MSDN.10).gif

Figure 7. Join.aspx

The registration process takes two steps. The first form asks for the user's first name, last name, as well as the group they belong to. Clicking on the next button brings the user to the second form in the registration process. This form asks for the user's username, password, and e-mail address. Once complete, the user simply clicks the Create User button and the user will be registered in the system.

Any person that browses to the Media Share Library application will be able to get to this page and register him or herself for the site. This means that by default, the application is open to all users. Anyone can set themselves up as a user and login to the application.

If someone wants to view the library and create his or her own libraries, he or she will need to be a registered user. Much of the application is closed to anonymous users through settings applied in the web.config file found in the Library folder. This is illustrated in Listing 2.

Listing 2. Blocking anonymous users in the web.config file

<?xml version="1.0" encoding="utf-8"?>
<configuration 
 xmlns="https://schemas.microsoft.com/.NetConfiguration/v2.0">
    <system.web>
        <authorization>
            <deny users="?" />
        </authorization>
    </system.web>
</configuration>

Since the web.config file shown in Listing 2 is found in the Library folder, whatever settings are specified in this file only apply to the files and folders contained in the Library folder. Using the <authorization> element, you can deny all anonymous (not registered) users by using the sub-element <deny> and specifying anonymous users through the use of the question mark as a value.

The single file contained in the Admin folder is also controlled in a similar fashion, but instead of denying anonymous users, the web.config denies everyone and allows only registered users who are contained in the newly created Admin role. This web.config is presented in Listing 3.

Listing 3. The web.config file from the Admin folder

<configuration 
 xmlns="https://schemas.microsoft.com/.NetConfiguration/v2.0">
      <system.web>
        <authorization>
          <allow roles="Admin" />
          <deny users="*" />
        </authorization>
      </system.web>
</configuration>

Now that you have a new user created through the registration form found on Join.aspx, the next step is to open up the ASP.NET Web Site Administration Tool as before and navigate to the Security page. On this page, you will now see that there has been one user created. Click on the Manage users link and this will bring you to a page that will allow you to manage the user you just created. Since we want to add our new user to the Admin role, from this page, click on the Edit roles link next to the name of the user. This will then show the single role which is available. You can then add your new user to the Admin role by checking the checkbox next to the name of the role. This is illustrated in Figure 8.

Aa479392.mediashare_fig08s(en-us,MSDN.10).gif

Figure 8. Adding a user to the Admin role

Now that a user has been created to work with the application as an administrator, let's next take a look at the one page an administrator can visit that other registered users cannot.

The Administrator's Page

There is only a single page in the application which is for the administrator of the application. You will find this page, Default.aspx, in the Admin folder. As shown earlier, the single web.config file also in the Admin folder controls access to this folder and only allows users who are in the Admin role to access the page. If you are a registered user who is already logged into the application and you try to access this page, you will be sent to the Login.aspx page and asked to provide the appropriate credentials to access it. Once accessed, you will find a page similar to what is shown in Figure 9.

Aa479392.mediashare_fig09s(en-us,MSDN.10).gif

Figure 9. The Administration page

When any user enters new items into the library, he or she has to assign each item a particular category. These categories are later used in the presentation of items and make it easier for people to search for the items that they are interested in borrowing. For this reason, there has to be a way to dynamically present a list of categories.

Categories are stored in a Microsoft SQL Server Express Edition file (.mdf) and this one administration page allows you to add, edit, or delete the categories that are used by the application. By default, the Media Share Library Starter Kit comes with three default categories (DVD, XBOX, and Book).

Entering Items Manually into Your Library

Once you are registered and have logged into the application, you will be able to start entering items into the main library system. The items that you enter into the overall library system will show up in your personal library. The idea is that the items you enter into the library are there for others to request to borrow for a specific amount of time. For instance, if you are using this application with a small group at work, then someone might make a request to borrow one of the items you have placed in the system. Upon request, you would then bring that item to work and lend it to the requestor for a set period of time. Then, when the item is due back, the borrower will return the item to the original owner. This is a self-governed library system for all accounts.

There are a couple of ways to enter items into this system—manually or by using Amazon Web services. Let's first look at how to enter the items into the system manually.

To enter in an item manually, click on the Enter New Media link in the site's navigation. You will be presented with a page as shown in Figure 10.

Aa479392.mediashare_fig10s(en-us,MSDN.10).gif

Figure 10. Entering in new media into your personal library

From the EnterMedia.aspx page, you can see that the user is first asked to select a category to place the item into. This list derives itself from the collection that the administrator has created (as shown earlier). The next item asked for is the item's ISBN or ASIN number.

Books tend to use ISBN numbers and you can find this number on the back of the book above the book's barcode. An example ISBN is 0764576100. Besides books, other products (such as XBOX games) tend to use an ASIN code. These codes are harder to find, as they might not be listed on the actual product; you can generally find a product's ASIN code online, however (also, give Amazon a try).

In addition to the item's category and its ISBN/ASIN code, other items to provide include the item's title, description, and a URL of an image to use for the item. If you don't have an image online to use for the item, then use the default ~/Images/NoImage.gif. Once all the details for an item are entered into the form, click on the Enter Into System button. Once clicked, the item will be recorded into the SQL Express Edition file and you will be redirected to your library page.

Entering Items Using Amazon Web Services into Your Library

The other (and easier) option to enter items into your library is to use Amazon Web services (which are free) to populate all the required values based upon the ISBN/ASIN code you would provide.

The first step is to visit Amazon's Web site and register for an Amazon Web Services account.

Amazon allows you to request and consume their services using either SOAP-based Web services or by using REST Web services. This Media Share Library application uses REST to consume the required data from Amazon.

Once you have registered with Amazon, you will be provided with a subscription ID that will need to be placed in the code-behind file of the EnterMediaAmazon.aspx page. In the page's code-behind file, you will find where you need to place your subscription ID. This is shown in Listing 4.

Listing 4. Adapting the page to use your Amazon subscription ID

    Protected Sub Page_Load(ByVal sender As Object, 
     ByVal e As System.EventArgs) Handles Me.Load

        XmlDataSource1.DataFile = 
           "http://webservices.amazon.com/onca/xml?
            Service=AWSECommerceService&
            SubscriptionId=[YOUR SUBSCRIPTION ID]&
            Operation=ItemLookup
            &ResponseGroup=Medium
            &ItemId=" & Request.QueryString("ISBN").ToString()
        FormView1.DataBind()
    End Sub

Note   Please make sure this URL is on one line; it is broken up here to multiple lines for reading clarity purposes only.

To use Amazon to populate all the required values, you must first enter in the item's ISBN/ASIN number into the form on the EnterMedia.aspx page. Once this number is in place, the next step is to click on the Populate Values From Amazon Instead button found at the bottom of the form. This will forward you to a page where the collected results from Amazon will be displayed. This is illustrated in Figure 11.

Aa479392.mediashare_fig11s(en-us,MSDN.10).gif

Figure 11. Automation of getting the results using Amazon

On this page, the EnterMediaAmazon.aspx page, first check to make sure the information is correct, and then select the media type using the dropdown list provided and press the Select button at the bottom of the page. This will input the results into your library. You will see this addition after you are directed to the MyLibrary.aspx page.

Working with Your Personal Library

The items you input into the system will show up in your personal library, which is presented on the MyLibrary.aspx page. Items appearing in your personal library will also appear in the main library and are available for people to request to borrow the item. An example screen shot of the MyLibrary.aspx page is shown in Figure 12.

Aa479392.mediashare_fig12s(en-us,MSDN.10).gif

Figure 12. Looking at a personal library

The personal library page allows you to see what items you have entered into the system. These items are displayed by their media type, which is controlled by the dropdown list at the top of the form. For instance, Figure 12 simply shows all the books that this user has input into the system.

The personal library will tell you all the information about the items you have input into the system, including whether or not the item is on loan. If it is on loan, then the background of the row will be light blue. For each item in the table, you are able to edit some of the item's information by clicking the appropriate Edit button. You can even delete the item by clicking the Delete button.

Browsing and Borrowing Items in the Main Library

Whether or not you enter in any items yourself into the main library, you are still able to peruse the main library in order to request to borrow any of the items it contains. The main library will show all the items that are entered into the system. A sample library is illustrated in Figure 13.

Aa479392.mediashare_fig13s(en-us,MSDN.10).gif

Figure 13. Looking at the main library

From the screen shot in Figure 13, you can see that the main library is similar to that of the personal library, except in the main library you cannot edit or delete the items contained in the list. At the top of the page, you will find a dropdown list that allows you to filter the type of items that show up in the table below. In the example in Figure 13, XBOX was selected and all the XBOX games that are in the system are then displayed. The table will show the title of the item, the owner, how many times the item has been viewed and loaned, as well as whether or not the item is on loan at that time.

Clicking on the title of the item will pull up a detailed view of the selected item. This is illustrated in Figure 14.

Aa479392.mediashare_fig14s(en-us,MSDN.10).gif

Figure 14. Looking at the detailed view of an item in the library

The detailed view of the item shows an image of the selected item, whether or not it is on loan, who owns it, and a description, as well as information such as how many times it has been viewed and loaned previously.

From the detailed view of an item, you can actually make a request to borrow the item (if it is available) by clicking on the Borrow button at the bottom of the form. Once clicked, you will be notified that you have made the request and that it is up to you to pick up the item from the owner. Also included in the statement is the date on which the item is due back to the owner (see Figure 15).

Aa479392.mediashare_fig15s(en-us,MSDN.10).gif

Figure 15. Borrowing an item from the main library

Alerts on Items Borrowed and Lent

When you log into the Media Share Library application, you are directed to the Default.aspx page in the Library folder. This page will display a set of alerts on items you have borrowed from others, as well as a set of alerts on items that you own. This is shown in Figure 16.

Aa479392.mediashare_fig16s(en-us,MSDN.10).gif

Figure 16. Being alerted of items due

In addition to being alerted on items you owe and own, there is also a table at the bottom of the page that displays the latest ten items that have been input into the main library.

Changing the Status of Items Lent

Once a user has returned an item to the original owner, it is up to the owner to mark the item in the system as returned. Doing this will put the item back in the system for others to borrow and will remove all the alerts. To do this, a user must go to his or her personal library page and click on the Log items in catalog as returned button at the bottom of the page.

This will direct him or her to the ReturnItems.aspx page, where he or she will see a checkbox list of all their items that are on loan (shown in Figure 17).

Aa479392.mediashare_fig17s(en-us,MSDN.10).gif

Figure 17. Marking selected items as returned

The owner of these items will then need to check all the items that have been returned, and then click the button at the bottom of the form to change the loan status of the marked items.

Conclusion

This article gives you an introduction of the Media Share Library Starter Kit, as well as how to set it up and use it. This starter kit is meant to give hobbyists an introduction to ASP.NET 2.0 and show just how easy it is to build ASP.NET 2.0 applications.

The next article in this ASP.NET Jumpstart series will start the process of showing you how to build this application yourself, starting with the data tier.

Have fun and happy coding!

 

About the author

Bill Evjen is a technical director for Reuters (www.reuters.com), the global news and information company, and is an active proponent of the .NET technologies and community-based learning initiatives for .NET. He has been actively involved with .NET since the first bits were released in 2000 and has since become president of the St. Louis .NET User Group (www.stlnet.org). Bill is also the founder and executive director of the International .NET Association, known as INETA (www.ineta.org), which represents more than 100,000 members worldwide. Based in St. Louis, Missouri, USA, Bill is an acclaimed author and speaker on ASP.NET and XML Web services. He has written such books as the ASP.NET Professional Secrets, the Visual Basic .NET Bible, XML Web Services for ASP.NET, and Web Services Enhancements: Understanding the WSE for .NET Enterprise Applications (all published by Wiley). He is presently working on Professional VB.NET 3rd Edition and Professional C# 3rd Edition (both from Wrox). He can be reached at evjen@yahoo.com.

© Microsoft Corporation. All rights reserved.