In this exercise, you will add a custom page to the EmpireTimes solution. This page will just display the categories you've created and any articles in that category. First you will set up the custom page framework just to make sure the page works.

1. In your EmpireTimes solution, add a new blank feature. No need for a receiver this time. Name the new feature something like TimesCategoryPage. I did, and you want to be like me, right? Also, make the feature web scoped.
2. In the feature folder for TimesCategoryPage, add a new folder called CategoryPage.

   This folder will remain inside TimesCategoryPage when deployed, so naming is less important here.

3. In the CategoryPage folder, add a new text file, and name it categories.aspx.
4. In your elements file, add the following code:
   <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <Module Name="CategoryPage" Path="CategoryPage">
    <File Url="categories.aspx">
    </File>
  </Module>
</Elements>

   This code will place our file in a module for deployment. The Path attribute refers to the folder inside TimesCategoryPage we just created. The File element's Url attribute tells SharePoint we want to place the file at the URL categories.aspx, which will be relative to the root of the site in which the feature is deployed. Also, the Url attribute doubles as the file name in this case.

   Refer to Chapter 4 for more information about modules.

5. In the categories.aspx page, add the following code:
   <%@ Assembly Name="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral,
PublicKeyToken=71e9bce111e9429c" %>
<%@ Page
 Language="C#"
 MasterPageFile="~masterurl/default.master"
 Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage"
%>
<asp:Content runat="server" ContentPlaceHolderID="PlaceHolderMain">
</asp:Content>

   This code simply adds the Microsoft.SharePoint namespace and declares that we are making a web part page that uses the default.master master page.

   We will explore the other classes from which you may inherit later in this chapter.

   Note The string MasterPageFile="~masterurl/default.master" is not a URL. The ~masterurl/default.master part is a token that SharePoint translates to the current master page URL of our site. If we change the master page for the site, all pages will get the new master page. Very convenient.

   You can read more about master page tokens on MSDN at http://www.understandingsharepoint.com/url/10033.

6. Add a random control to the asp:Content control. If you are in a particularly noncreative mood this day, here is a suggestion:
   <asp:Label Text="Custom content" runat="server" />

   The control doesn't really matter at this point; we just want to set up the framework.

7. Build, deploy, and then activate your new feature on the site you use for the Empire Times example. Go to the page siteurl/categories.aspx. For my example, that would be http://lab-s02:10000/categories.aspx.

   Check out Figure 14-1 for how this looks on my server.

   

   Figure 14-1. Custom site page

   That's it. It's nothing too fancy for the moment. We will return to the more elaborate examples in a moment.

In this exercise, you will add content directly to the asp:content control. You will manipulate the page using inline code to archive an article listing grouped by categories.

1. (Optional) Start from the page you created in Exercise 14-1, and add the following line to the top of the categories.aspx page:
   <%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint"
 Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral,
 PublicKeyToken=71e9bce111e9429c" %>

   Adding those lines makes code writing a lot easier because you do not have to prefix all your SPXXXX objects with Microsoft.SharePoint.

2. Add a script tag below the ASP:Content control you added earlier:
   <asp:Content ID="Content1" runat="server"
ContentPlaceHolderID="PlaceHolderMain">
</asp:Content>

<script runat="server">
</script>
3. Inside the script tag, override the OnLoad method, and remove the base.OnLoad method call:
   <script runat="server">
    protected override void OnLoad(EventArgs e)
    {
    }
</script>

   Note The rest of our code will happen inside the OnLoad method, so I will refrain from mentioning that fact every time.

4. Add some objects, and get some proper web and list references to the OnLoad method:
   EnsureChildControls();

SPWeb web = SPContext.Current.Site.RootWeb;
SPList categoryList = web.Lists["Categories"];
ContentPlaceHolder cp =
    (ContentPlaceHolder)Master.FindControl("PlaceHolderMain");
cp.Controls.Clear();

Table table = new Table();
// Whoops, better not, or we'll have the entire
// HTML TABLES ARE BAD crowd on our tails.

   Yeah, we'll stay away from the table-based layout, just to please the CSS geeks out there. Skip the last three lines if you like.

   Next we want to iterate over the category items and place the correct items in a list beneath the category name.

5. Add the following code after the object initialization in step 4:
   foreach (SPListItem categoryItem in categoryList.Items)
{
    Panel p = new Panel();
    p.CssClass = "empirenews-categorylist";
    Label lb = new Label();
    lb.CssClass = "empirenews-heading";
    lb.Text = categoryItem.Title;
    p.Controls.Add(lb);

    foreach (SPListItem articleItem in web.Lists["News"].Items)
    {
        SPFieldLookupValue articleCategory =
            new SPFieldLookupValue(articleItem["ArticleCategory"].ToString());
        if (articleCategory.LookupValue == categoryItem.Title.ToString())
        {
            LinkButton linkbutton = new LinkButton();
            linkbutton.CssClass = "empirenews-articleitem";
            linkbutton.Text = articleItem.Title;
            p.Controls.Add(linkbutton);
        }
    }

    cp.Controls.Add(p);
}

   As stated, this code iterates the category items, adds a nice <div> tag for each category, and then iterates all the items in the news list to check whether the item belongs to the category.

   Note If your current thought at this point includes the acronym WTF, you are not alone. Iterating every single item in the news list for every single category is a highly unoptimized way of generating a list. We will improve this later.

6. (Optional) Since we added the .CssClass property to our controls, we might as well add the CSS code to our page. Add the following code outside the script tag and existing asp:Content controls:
   <asp:Content runat="server"
ContentPlaceHolderID="PlaceHolderAdditionalPageHead">
    <style type="text/css">
.empirenews-heading
{
 font-size: medium;
 font-weight: bold;
 display: block;
}

.empirenews-articleitem
{
 display: block;
}
</style>
</asp:Content>

   Yeah, I know, that is CSS. There won't be much more, I promise. This is just done to pretty things up a bit.

7. Build and then deploy or update. You changes should be immediate; there's no need to reactivate the feature. Your result should resemble Figure 14-2.
   

   Figure 14-2. Custom site page deployed

   It's cool but not very efficient. We should work to improve our example a bit.

In this exercise, you will improve the code from the previous exercise and utilize an SPQuery object to optimize the page.

1. Replace the code you added in step 5 of Exercise 14-2 with the following code:
   foreach (SPListItem categoryItem in categoryList.Items)
{
    Panel p = new Panel();
    p.CssClass = "empirenews-categorylist";
    Label lb = new Label();
    lb.CssClass = "empirenews-heading";
    lb.Text = categoryItem.Title;
    p.Controls.Add(lb);

    SPQuery query = new SPQuery();
    query.Query = @"<Where><Eq>
        <FieldRef Name=""ArticleCategory"" LookupId=""True""
        <Value Type=""Lookup"">"
        + categoryItem.ID +
        "</Value></Eq></Where>";

    foreach (SPListItem articleItem in web.Lists["News"].GetItems(query))
    {
            LinkButton linkbutton = new LinkButton();
            linkbutton.CssClass = "empirenews-articleitem";
            linkbutton.Text = articleItem.Title;
            p.Controls.Add(linkbutton);
    }

    cp.Controls.Add(p);
}

   The major changes here are that we now use an SPQuery object and design a CAML query to return only the relevant items from the news list. Since we get only the relevant items from the query, we have also simplified the foreach loop that iterates the news list.

   Note Look at the FieldRef element of our query, and note that we add the LookupId="True" attribute. This ensures that we query the Id part of the lookup value. If you do not care about the possibility of duplicate names in a lookup list, you can skip the LookupId attribute and just put the SPListItem.Title property in the Value element.

   That should be it. Running your code should yield exactly the same result as shown in Figure 14-2.

In this exercise, you will create and deploy a global page that will display the content type hierarchy.

1. Start by creating a new Visual Studio solution based on the WSPBuilder project template. Call it whatever you like; I have called mine CustomPages.

   If you like to maintain full control, feel free to start with a class library and make scripts to deploy the pages on your own. WSPBuilder will help out with certain aspects of the page creation but is in no way an absolute requirement for page development.

2. (Optional) Add a Feature with Receiver item to your solution.

   Adding a Feature with Receiver will make WSPBuilder create some of the folder structure for us, sign our assembly, and output the strong name in the Feature.xml file. It just saves a bit of time.

3. Add a folder structure as shown in Figure 14-4. If you performed step 2, this will be just a matter of adding the LAYOUTS folder. If you did not perform step 2, just ignore the FeatureWithReceiver1 folder; the important thing is to mimic the 12/TEMPLATE/LAYOUTS structure as shown.
   

   Figure 14-4. The folder structure for Layouts deployment

4. In the LAYOUTS folder, create a new text file, and name it ContentTypeHierarchy.aspx or something you like better.

   Again, using a text file but naming it .aspx will give us a plain file that Visual Studio will interpret as an ASPX file.

5. Open the ASPX file. Enter the following code at the very beginning of the page:
   <%@ Assembly Name="" %>
6. Inside the Name attribute, put the strong name of your assembly.

   If you performed step 2, this is as easy as opening the Feature.xml file of your Feature with Receiver feature and copying the strong name from there. If you did not perform that step, you need to add a key file from the project properties, build your solution, and get the strong name manually. I recommend using .NET Reflector for this task; refer to Chapter 1 for detailed instructions.

   Note If you followed step 2, we have now gotten all we need from the Feature with Receiver we added, so you are free and encouraged to delete the feature folder as well as the FeatureCode folder holding the class file of the receiver.

7. Add a new class file to your solution. This will be your code-behind file. I have called mine ContentTypeHierarchy.cs, but you can call it whatever you like.
8. Add a reference to the Microsoft.SharePoint.dll file if it is not already present.
9. In your new class file, named ContentTypeHierarchy.cs in my example, add the following Using statements:
   using Microsoft.SharePoint.WebControls;
using System.Web.UI.WebControls;
using Microsoft.SharePoint;

   Microsoft.SharePoint.WebControls is used for the LayoutsPageBase parent class, System.Web.Ui.Webcontrols holds the TreeView control, and Microsoft.SharePoint gives us access to the content types.

10. In the class file, make your class inherit from the LayoutsPageBase class as such:
    public class ContentTypeHierarchy: LayoutsPageBase

    Inheriting from the LayoutsPageBase ensures that we can limit access to our page based on SharePoint permissions. The alternative is to inherit from the UnsecuredLayoutsPageBase, which effectively gives us a global open-for-all page.

    At this point, your class file should look like Figure 14-5.

    

    Figure 14-5. Class file after initial setup

11. In your ContentTypeHierarchy.aspx page, or whatever you chose to call it, add the following code after the Assembly statement:
    <%@ Page Language="C#"
         MasterPageFile="~/_layouts/application.master"
         Inherits="" %>

    You may, of course, change the language if you are writing your code in a different language. My examples are in C#, though.

12. In the Inherits attribute, add the namespace and class name of your class. In my example, this would be

At this point, we have connected our code-behind file with our page, so we are ready to add some content. Let's take a short break first.

In this exercise, you will add some content to your application page. Because this is for illustrative purposes only, the actual content will be very simple.

1. In your ContentTypeHierarchy.aspx page, add the following code:
   <asp:Content ID="Main" contentplaceholderid="PlaceHolderMain" runat="server">
    <asp:TreeView ID="tvContentTypes" runat="server">
    </asp:TreeView>
</asp:Content>
2. In your code-behind file, ContentTypeHierarchy.cs, add the following code to the ContentTypeHierarchy class:
   protected TreeView tvContentTypes;
protected override void OnLoad(EventArgs e)
{
    SPContentTypeCollection cts = this.Web.AvailableContentTypes;
    Dictionary<SPContentTypeId, TreeNode> ctsNodes = new
 Dictionary<SPContentTypeId, TreeNode>();
    TreeNodeCollection nodes = tvContentTypes.Nodes;

    foreach (SPContentType ct in cts)
    {
        TreeNode ctnode = new TreeNode(ct.Name, ct.Id.ToString());
        if (ctsNodes.ContainsKey(ct.Parent.Id))
        {
            TreeNode parent = ctsNodes[ct.Parent.Id];
            parent.ChildNodes.Add(ctnode);
        }
        else
        {
            nodes.Add(ctnode);
        }
        ctsNodes.Add(ct.Id, ctnode);
    }
}

   This code essentially builds the node tree of the TreeView control.

   Note that simply adding a protected TreeView object with the same name as the ID of the TreeView in our ASPX page will cause ASP.NET to map our object to the correct control.

3. Build your solution and deploy it. There are no features to activate, and WSPBuilder will make sure your file gets placed where it should inside [12]. Also, WSPBuilder puts the assembly in the GAC for you. If you have chosen not to use WSPBuilder, you must perform these steps manually.
4. Go to any site in your site collection, add /_layouts/ContentTypeHierarchy.aspx to the URL of your site (for example http://lab-s02:1000/_layouts/ContentTypeHierarchy.aspx), and see your new application page in all its glory.

If something didn't work, you can see my results, in all their glory, in Figure 14-6.

Figure 14-6. Custom application page in action!

Another pat on the back for you. Let's see how we can make access to our page a bit easier.

In this exercise, you will create a farm-scoped feature to add links to your page from the Site Settings page. You will do this in two ways, first as a separate column on the Site Settings page and then as part of the Galleries column on that page.

1. Add a new Blank Feature WSPBuilder item to your CustomPages solution. Yes, that's right, no receivers this time either.
2. Add the following code to the elements file:
   <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <CustomActionGroup Id="MyCustomSettings"
                   Location="Microsoft.SharePoint.SiteSettings"
                   Description="Custom administration options"
                   Sequence="5"
                   Title="Custom administration"/>
  <CustomAction Id="MyCustomSiteAction"
                GroupId="MyCustomSettings"
                Location="Microsoft.SharePoint.SiteSettings"
                Rights="ManageWeb"
                Title="Content Type hierarchy"
                >
    <UrlAction Url="_layouts/ContentTypeHierarchy.aspx"/>
  </CustomAction>
</Elements>

   Note You may recognize this code. It is very similar to the example used for custom actions in Chapter 5.

3. Build and deploy your feature. Go to the Site Settings page to verify that you do have a new column, as shown in Figure 14-7.

   Tip Remember that our new feature is farm scoped, so if you need to deactivate it, you need to go to the Central Administration web site. You will find farm features on the Operations tab.

   

   Figure 14-7. Custom column for page links

   I realize this looks horrible, so let's modify our elements.xml file a bit to put our custom link in the Galleries column instead.

4. (Optional) Modify your elements file as such:
   <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <CustomAction Id="MyCustomSiteAction"
                GroupId="Galleries"
                Sequence="22"
                Location="Microsoft.SharePoint.SiteSettings"
                Rights="ManageWeb"
                Title="Content Type hierarchy"
                >
    <UrlAction Url="_layouts/ContentTypeHierarchy.aspx"/>
  </CustomAction>
</Elements>

Your content type hierarchy should now be moved to the Galleries column, just below the “Site content types” link. Check out Figure 14-8 if you don't believe me.

Figure 14-8. Told you!

I think that's it!