Creating a Sharepoint Portal for Mobile

Introduction

This article discusses the approach I used to develop a mobile version for a Sharepoint 2010 publishing portal, after a lot of research I found that Sharepoint out of the box features will not fit my business needs, so you will find in this article the approach I used.

Note: I'm not sure that this is the best way to develop a mobile version for sharepoint portal so feel free to send me your feedback and comments if you have a better approach.

Sharepoint 2010 Mobile support limitations

Sharepoint 2010 has a mobile support but after research we found the following limitations

1. Sharepoint 2010 doesn't allow to create a custom master page for your mobile site
   
2. Sharepoint doesn't allow creating custom style sheet and classes for mobile
   
3. Publishing portal template is not supported
   
4. Any layout or any customization in the master pages will affect all other sites on the same farm

The Approach Used in My project

1. Disable SharePoint default mobile redirection feature to stop the redirection to the mbllists.aspx page.
   
2. Create Http Module which detects that the request is coming from a Mobile device and redirect to the Mobile home page.
   
3. Create a new sub site for mobile with an optimized master page and layouts for mobile. (Physical pages and user controls).
   
4. Multilanguage support
   
5. Create the Search Control and search result page from scratch (Querying the Crawler results).
   
6. Create optimized style sheets and Masterpage for mobile.

Limitations of this approach

• The customer will not be able to create any pages for the mobile site from the back end
  
• The customer will not be able to create any subsites for the mobile site from the back end
  
• Will not be able to use SharePoint search, and the way around is to use SharePoint API and create the search controls and the result page from scratch.

The following sections will explain how to implement each point

1. Disable SharePoint default mobile redirection feature to stop the redirection to the mbllists.aspx page

a. Open compat.browser file you will find it in the following directory

C:\inetpub\wwwroot\wss\VirtualDirectories\[port number]\App_Browsers

b. change isMobileDevice for each browser from True to False and save the file.

Example

<capabilities>
<capability name="isMobileDevice" value="false" />
<capability name="platform" value="WinCE" />
<capability name="supportsTouchScreen" value="true" />
</capabilities>

2. Create Http Module which detects that the request is coming from a Mobile device and redirect to the Mobile home page

This is a normal Http Module which detects that the request is coming from a mobile phone and redirect to the mobile site

Sample function used in the Module

public static bool isMobileBrowser()
{
//GETS THE CURRENT USER CONTEXT
HttpContext context = HttpContext.Current;

//FIRST TRY BUILT IN ASP.NT CHECK
if (context.Request.Browser.IsMobileDevice)
{
return true;
}
//THEN TRY CHECKING FOR THE HTTP_X_WAP_PROFILE HEADER
if (context.Request.ServerVariables["HTTP_X_WAP_PROFILE"]
!= null)
{
return true;
}
//THEN TRY CHECKING THAT HTTP_ACCEPT EXISTS AND CONTAINS WAP
if (context.Request.ServerVariables["HTTP_ACCEPT"] != null &&
context.Request.ServerVariables["HTTP_ACCEPT"].ToLower().Contains("wap"))
{
return true;
}
//AND FINALLY CHECK THE HTTP_USER_AGENT
//HEADER VARIABLE FOR ANY ONE OF THE FOLLOWING
if (context.Request.ServerVariables["HTTP_USER_AGENT"] != null)
{
//Create a list of all mobile types
string[] mobiles =
new[]
{
"midp", "j2me", "avant", "docomo",
"novarra", "palmos", "palmsource",
"240x320", "opwv", "chtml",
"pda", "windows ce", "mmp/",
"blackberry", "mib/", "symbian",
"wireless", "nokia", "hand","android", "mobi",
"phone", "cdm", "up.b", "audio",
"SIE-", "SEC-", "samsung", "htc",
"mot-", "mitsu", "sagem", "sony"
, "alcatel", "lg", "eric", "vx",
"philips", "mmm", "xx",
"panasonic", "sharp", "wap", "sch",
"rover", "pocket", "benq", "java",
"pt", "pg", "vox", "amoi",
"bird", "compal", "kg", "voda",
"sany", "kdd", "dbt", "sendo",
"sgh", "gradi", "jb", "dddi",
"moto", "iphone"
};

//Loop through each item in the list created above
//and check if the header contains that text
foreach (string s in mobiles)
{
if (context.Request.ServerVariables["HTTP_USER_AGENT"].
ToLower().Contains(s.ToLower()))
{
return true;
}
}
}

return false;
}

We call this function in the OnBeginRequest event handler as the following

public void OnBeginRequest(Object s, EventArgs e)
{

HttpApplication app = s as HttpApplication;
HttpRequest request = HttpContext.Current.Request;