Introduction to Web Parts in ASP.NET/MOSS 2007

Content:

• Introduction
• System requirement
• Web part framework
• Comparing with asp.net
• Creating a new web part solution
• Deploying and debugging



Introduction:

Microsoft ASP.NET 2.0 provides a Web Part infrastructure that helps you build custom Web Parts and deploy them to Web sites built using Microsoft Windows SharePoint Services 3.0. This article provides a walkthrough how to build custom Web Parts that work in both standard ASP.NET 2.0 Web sites and Windows SharePoint Services 3.0.



Web part framework:

A Web Part is an ASP.NET server control designed to be edited and modified by users in the browser. It works as a component of a SharePoint site that presents information pulled from multiple data sources. Web Part pages allows to personalize information relevant to the needs by updating the value of specific Web Part properties. SharePoint Web Parts are UI elements that support both customization and personalization.

The Web Part infrastructure in Microsoft Windows SharePoint Services 2.0 and Microsoft Office SharePoint Portal Server 2003 provides a framework to build custom Web Parts targeted to Microsoft SharePoint Products and Technologies by using managed code.

ASP.NET 2.0 includes a new Web Part control set that allows site customization and personalization on custom Web sites that are independent of MOSS. The Web Part infrastructure in Windows SharePoint Services 3.0 exists on a layer above the ASP.NET 2.0 Web Part infrastructure.

Comparing with asp.net:


Office SharePoint Server 2007 and Windows SharePoint Services 3.0 are built on top of the ASP.NET 2.0 Framework. Windows SharePoint Services 3.0 uses the ASP.NET 2.0 Web Part infrastructure to take advantage of features such as master pages and custom Web Part development while providing a complete set of Windows SharePoint Services features, such as document services, events, workflow, search, site columns, content types and more.

We can build Web Parts for Windows SharePoint Services 3.0 in two ways:

• Create custom ASP.NET 2.0 Web Parts.
• Create SharePoint-based Web Parts.

The following table provides a decision matrix to help you choose the best option depending on your business needs.

Creating a new web part solution:
 
To create a new Web Part solution
o Open VS 2005 > File menu> click New, and then select Project.
o In Project types, select Visual C#, and then select SharePoint.

o In Templates, select Web Part.


o Specify a new name, location, or solution name of Web Part, and then click OK. The extensions create a new Web Part solution project, which includes the following:

 References to the Microsoft.sharepoint

 AssemblyInfo.cs, a file that enables you to specify company and product information for the Web Part assembly, and version information

 Temporary.snk, a temporary signature key file for the Web Part assembly

 A Visual C# code file for the Web Part, named the same as the Web Part name

 By default, the code file for the Web Part contains the following:

 using statements for the necessary System and Windows SharePoint Services namespaces, such as Microsoft. SharePoint, Microsoft.SharePoint.WebControls, and Microsoft.SharePoint.WebPartPages

 An empty Web Part class that inherits from System.Web.UI.WebControls.WebParts.WebPart

o Add the code you want to the Web Part class.

Customizing the Web Part Solution Package


The Web Part project template automatically generates the XML files needed to package your Web Part as a MOSS 2007 feature for deployment and activation. The required GUIDs contained in the XML files are also generated automatically.

The extensions generate a .webpart file as the element.xml file for the Feature containing the Web Part. Every Web Part should have a .webpart file, which is an XML file that describes the Web Part. The .webpart file also makes your Web Part appear in the Web Part gallery in MOSS 2007.

we can customize the information in these XML files by editing solution, Feature, and element properties on the SharePoint Solution tab in project's Properties dialog box, as follows:



o Solution Information in this node is written into the manifest.xml file for the Feature. You can set the following solution property:

o Name The name of your Web Part solution.

o Feature Information in this node is written into the feature.xml file for the Feature. You can set the following feature properties:

o Folder Name The name of the folder to contain the files for this Feature.

o Title The title of the Feature. Limited to 255 characters.

o Description A longer representation of what the Feature does.

o Version Specifies a System.Version-compliant representation of the version of a Feature. This can be up to four numbers delimited by decimals that represent a version.

o Scope The Feature scope. Can contain one of the following values: Farm (farm), WebApplication (Web application), Site (site collection), or Web (Web site).

o Hidden Hides the feature. This attribute is FALSE by default.

o Default Resource File Indicates a common resource file for retrieving Feature XML resources.

o Element Information in this node is written into the element.xml file for the Feature. As mentioned earlier, this file contains the information usually contained in a .webpart file. You can set the following element properties:

o Title The title of your Web Part on web page.

o Description The description of your Web Part that you want to appear in the Windows SharePoint Services user interface.

o ImportErrorMessage The error string to display if Windows SharePoint Services is unable to import your Web Part solution.

Customizing the Web Part solution feature package


o In Solution Explorer, right-click the Web Part project, and then select Properties.

o In the Properties window, select SharePoint Solution. This tab lists the nodes that contain the properties for the solution package that the extensions will generate.

o Expand the Solution node, and then expand the Feature node and the Element node.

o To edit properties for a node, click a node, and then edit the properties. For example, click the Element node, and then edit the values for the Title, Description, and ImportErrorMessage keys.

o To commit your changes for a node, click in the Description value field.

Deploying and debugging:

We can deploy and start debugging of the Web Part simply by pressing F5.

When you press F5, the extensions automatically build, deploy, and initiate debugging of Web Part solution Feature. To accomplish this, the extensions perform the following actions automatically:

o Build the Web Part assembly.

o Package the Web Part solution as a Windows SharePoint Services Feature.

o If this Web Part solution was deployed previously, the extensions retract the previous version of the Web Part solution Feature.

o Install your Web Part assembly to the global assembly cache using gacutil utility

o Deploy and activate your Web Part solution Feature in Windows SharePoint Services.

o Add your Web Part to the Safe Controls list.

o Restart Microsoft Internet Information Services (IIS) by invoking the iisreset command.

o Attach to the w3wp processes to enable debugging.

Singleton Design Pattern

Singleton design pattern
Design patterns are useful to implement a functionality of known problem. Singleton pattern is a object creational pattern which helps when you want only and only one instance of your class

You don’t allow the consumer of your class to create the instance but return a instance to the calling class by a static property and private\protected constructor

Here is a sample implementation
Class SingletonPattern
{
Private SingletonPattern _instance ;

Private SingletonPattern(){}

Public static SingletonPattern getInstance()
{
        If(_instance==null)
       {
            _instance =new SingletonPattern();
        }
return _instance;
}
}

Key considerations in singleton patterns:

Thread safety: when multiple threads are trying to get the only instance it may behave inconsistently so you must consider locking the object e.g.

LOCK(_instance)
{
      if(_instance==null)
      {
       _instance =new SingletonPattern();
       }
       return _instance;
}
Lazy initialization: when you initialize the instance as late as it requires called as lazy initialization. To ensure thread safety we can initialize the instance while declaring it in the class but that comes with a cost of object creation as soon as the class instantiate. Above given example is a lazy initialization where we initialized it in getInstance function. Another way to do is as follows
Class SingletonPattern
{
              Private SingletonPattern _instance= new SingletonPattern() ;
              Private SingletonPattern(){}
              Public static SingletonPattern getInstance()
              {
                            return _instance;
              }
}
Private Vs Protected constructor: singleton pattern doesn’t suggest to create a public constructor so which access modifier should we use protected or private.
Well all that depends on the functionality required but if you want to inherit your singleton class you must have to provide a protected constructor

Difference in static class implementation and Singleton pattern:

• Static class doesn’t represent the instances but represents a global variable while singleton is only possible instance of a class
• Static classes can’t be passed as objects in a function call
• Singleton classes can implement interfaces while static classes can’t
• Initialization may be lazy or during the class load in singleton but static simply initialized when class loads in the memory

 Singleton pattern mostly used in scenarios when object initialization is heavy and program can’t afford to do so every time for almost similar operation

Creating a Tag Cloud using C#

Introduction:
A tag cloud is a visual depiction of user-generated tags used typically to describe the content of web sites, which is basically a feature of web 2.0 sites. Tags are usually single words and are typically listed alphabetically, and the importance of a tag is shown with font size or color. Thus both finding a tag by alphabet and by popularity is possible. The tags are usually hyperlinks that lead to a collection of items that are associated with a tag.
A tag cloud is a set of related tags with corresponding weights. Typical tag clouds have between 30 and 150 tags. The weights are represented using font sizes or other visual clues.


Types of Tag Cloud:

There are three types of tag cloud representation in WEB 2.0 as described below:
1) In the first type, size represents the number of times that tag has been applied to a single item. This approach is being used to display metadata about an item.
2) In the second type, size represents the number of items to which a tag has been applied,
This represents the popularity of a particular tag.
3) In the third type, tags are used as categorization method for content items. Tags are represented in a cloud where larger tags represent the quantity of content items in that category.
In this document, second type tag cloud is being created, where tag size is the token for the popularity of a particular tag. Tag’s size shows that how many times that particular tag is being used for tagging.

Tag Cloud Implementation:
In this approach, Tags information is stored in Tag.xml file which will provide necessary data to create tag cloud .This information can be stored in database or file system as per requirement.
Tags.xml is used to store following information:-
Tag-Id Attribute depicts uniqueness of the tag, so that no repetitive tags should be displayed in the user control.
Tag-Count Attribute defines the size of the tag that will be displayed in the user control. This count defines the uses of that particular tag. Every time an existing tag is used for tagging, Count increases by one.
The tag size is shown using a simple logic. What the user controls does is that it displays top 100 most popular tags. The tags in the xml file are sorted in descending order as per their count and then the top 100 are picked. The size of those top 100 tags is then defined by the formula:
(Tag count/max. count) x 30 pixel
Thus the most popular tag will be having the size of 30 pixel and later tags will have size with respect to most popular tag.
The below shown xml file displays all the necessary information to create a tag cloud.
Tags.xml
<tags>
<tag id="1" count="34">india</tag>
<tag id="2" count="33">chandigarh</tag>
<tag id="3" count="33">symonds</tag>
<tag id="4" count="34">adobe</tag>
<tag id="5" count="71">infosys</tag>
<tag id="6" count="36">microsoft</tag>
<tag id="7" count="156">Amir Khan</tag>
<tag id="8" count="38">tata motors</tag>
<tag id="9" count="39">bse</tag>
<tag id="12" count="40">suzene</tag>
<tag id="13" count="39">bhatinda</tag>
<tag id="14" count="23">ABB</tag>
<tag id="15" count="50">BHEL</tag>
<tag id="16" count="11">Reliance natural</tag>
<tag id="17" count="23">Asia electronics</tag>
<tag id="18" count="56">jaypee hydro</tag>
<tag id="19" count="30">bank of india</tag>
<tag id="20" count="58">HDFC</tag>
<tag id="21" count="10">Asp.Net</tag>
<tag id="22" count="78">Atlanta</tag>
<tag id="23" count="20">tiger</tag>
<tag id="25" count="47">EMEA</tag>
<tag id="26" count="50">wedding</tag>
<tag id="27" count="11">ONGC</tag>
</tags>
Create a New Visual studio C# project name Forum3.UserControls.In this project directory ,create a New folder name xml and place tags.xml file there, now a tag cloud can be created as a User Control.
By Using C# Code:
Create a User Control name UCTagCloud in Visual studio 2005.
It consists two files:-
• UCTagCloud.ascx
• UCTagCloud.ascx.cs

Now Copy the following code in UCTagCloud.ascx
<%@ Control Language="C#" AutoEventWireup="true" Inherits="Forum3.UserControls.UCTagCloud, Forum3.UserControls, Version=1.0.0.0, Culture=neutral, PublicKeyToken=18c318ff50f694f2" %>
<table id="TABLE1" runat="server" style="width: 100%">
<tr>
<td style="width: 100%">
</td>
</tr>
</table>

And copy the following code in UCTagCloud.ascx.cs.
public partial class UCTagCloud : System.Web.UI.UserControl
{
DataSet ds;
protected void Page_Load(object sender, EventArgs e)
{
int mincount;
ds = new DataSet();
//Get Tags.xml Data into Dataset
ds.ReadXml(Server.MapPath("./xml/Tags.xml"));
//Sort the tags data on Its Count
ds.Tables["Tag"].DefaultView.Sort = "count desc";
DataTable dt = ds.Tables["Tag"].DefaultView.ToTable();
//Get Row count of Table
int rowCount = dt.Rows.Count;
//Get Max value of count in existing Data
int maxcount = Convert.ToInt32(dt.Rows[0]["count"].ToString());
if (rowCount > 100)
{
//If More then 100 tags are available
//Get the Value of 100 th Tag as Minimum value of Count from sorted data
mincount = Convert.ToInt32(dt.Rows[100]["count"].ToString());
}
else
{
//If less then 100 tags are available
//Get the Value of last Tag as Minimum value of Count from sorted data
mincount = Convert.ToInt32(dt.Rows[rowCount-1]["count"].ToString());
}
//Select tags data from data table which have count value more or equal then minimum count to display in tag cloud
DataRow[] drc = dt.Select("count>=" + mincount, "tag_Text");
dt = ds.Tables["Tag"].DefaultView.ToTable();
//For each tag to diplay
foreach (DataRow dr in drc)
{
HtmlAnchor a = new HtmlAnchor();
//Assign URL as a hyperlink to each tag
//User will be traversed to this link when click on particular tag
a.HRef = "http://********:999/search.aspx?q=" + dr["tag_Text"].ToString();// xnod.InnerText;
//Assign inner text to Display as a Tag
a.InnerText = dr["tag_Text"].ToString();
//Assign Text to Display as a Tag
a.Title = dr["tag_Text"].ToString();
//Calculate size(weightage) of each tag based on its count and maximum count value
double normalWeight = (Convert.ToDouble(dr["count"].ToString()) / maxcount) * 30;
//Assign Font size to Each Tag according to its weightage
a.Style.Add(HtmlTextWriterStyle.FontSize, normalWeight.ToString());
//Add tags in a Htmltable to display
this.TABLE1.Rows[0].Cells[0].Controls.Add(a);
this.TABLE1.Rows[0].Cells[0].Controls.Add(new LiteralControl(" "));
}
}
}
}

Results will be displayed as in picture

Please note that the size of some tags is too small (the tag is not popular), there is possibility that it will be difficult to read. To rectify this we need to implement the “tooltip” on all the tags as shown in the picture above.
However it depends upon the developer choice whether he/she wants to implement this functionality or not.