ASP.NET MVC 4 with Windows Azure for Windows Phone 7, BlackBerry, Android & i-Os.


Though MVC 4 is still in developer preview , not released in RTM phase but there is cool staff of development of ASP.NET MVC 4 applications for desktop & Mobile with Windows Azure environment.

Since it’s always been a great experience with working of MVC with Windows Azure of rich web experiences in Cloud. So , Lets a Windows Azure application targeted for Mobile Smart devices (Windows Phone 7, BlackBerry 7 , i-Os, Android ) & deploy in Azure of Microsoft Data Centeres.

  • Let’s Create a new Windows Azure Application from Visual Studio & do not add any webrole to it as we will add our ASP.NET MVC 4 webrole with it . (P.S:  Those  who have already MVC4 Webrole Template installed in Windows Azure environment of Visual Studio , can go & take a MVC 4 Web Role Template).
  • For those who dont have MVC 4 WebRole Template for Windows Azure environment for Visual Studio can simply create the blank Azure Project as we will add ASP.NET MVC 4 web application project later.

  •  Check out the  WebRole sections, Click OK as we dont need to take WebRole from default WebRole options.

  •  Next , Check out the Blank Azure Project created in your Visual Studio solution with ServiceConfiguration.cscfg & ServiceDefinition.csdef files.
  • Now , Time to add a new ASP.NET MVC 4 Project from Visual Studio , so on the solution explorer right click the solution -> add -> new project -> choose New ASP.NET MVC 4 Web Application.

  • Next , Add the ASP.NET MVApplication C 4 application with Windows Azure Project . To do this , right click on Roles of your Windows Azure project & select Web Role Project in Solution . Redirect to Associate Web Role Project in Solution Window  & Click OK.

        Check the ASP.NET MVC 4 web application has been added as webrole in Windows Azure Roles.

    • Click OK to add the existing MVC 4 solution with Windows Azure Application.
  •  Now it’s time to run the Windows Azure Project with ASP.NET MVC 4 in development fabric. So hit F5.

  •  Now time to test the application in Mobile Devices so , test in Windows Phone as this asp.net MVC 4 web application project has been enabled for Mobile apps.

  •  Associate Page View 

  •  Now , Test it in Android 2.2 & Android 3 Tablet device.

  •  Android 3.0 Tablet View for ASP.NET MVC 4 Windows Azure Application.

  •  Run it on BlackBerry OS of BlackBerry 9800 device.

  •  So the Windows Azure Application with ASP.NET MVC 4 for mobile is ready for development fabric , so deploy it Azure VM & run it from cloud to mobile.

 

 

 

ASP.NET MVC 3 Razor Mobile Ready Website Template & JQuery Mobile Web Template for Visual Studio 2010 SP1


ASP.NET MVC 3 Razor capability with Visual Studio 2010 has rich support for Mobile Devices. But , in Project development we have to keep all CSS, JQuery, JavaScript files to keep in touch , Copy & Paste in Project Folder / Drag & Drop. For Mobile Specific Views keep in mobile Section all Mobile Javascript, mobile.css, JQuery for Mobile files etc..

What If we have a seperate Template in Visual Studio 2010 for Mobile Ready ASP.NET MVC3 Razor Teamplete & JQuery for Mobile like this.

  •                  For JQuery for Mobile ASP.NET & ASP.NET MVC .

  •  On starting project with Mobile Ready ASP.NET MVC 3 Template, we got inbuilt support of MobileViewEngine file which helps to render the desktop MVC web application to mobile browser by detecting the User-Agent.
  • Having help for Mobile Specific View of websites without using any mobile.browser file or WURFL database. No need to write any extra code for mobile browser rendering logic .
  •   Put the simple logic here: (Already Available in ApplicationHelper.cs in the default project installed with template)

publicstaticbool IsSupportedMobileDevice(thisHttpRequestBase request)

{

bool isMobile = request.Browser.IsMobileDevice;

string userAgent = request.UserAgent.ToLowerInvariant();

isMobile = isMobile || (userAgent.Contains( “iphone”)

|| userAgent.Contains(“blackberry”)

|| userAgent.Contains(“mobile”)

|| userAgent.Contains(“windows ce”)

|| userAgent.Contains(“opera mini”)

|| userAgent.Contains(“palm”)

|| userAgent.Contains(“fennec”)

|| userAgent.Contains(“adobeair”)

|| userAgent.Contains(“ripple”)

);

return isMobile;

  • Next , Run the MVC 3 web application & check the view in desktop as well as in Windows Phone.

                                                                                       Desktop –  View

Mobile-  View

  •  To get the Rich Template in Visual Studio 2010 , go to Tools -> Extension Manager -> Search Online Templates -> Select ASP.NET MVC3 Razor Mobile Ready Template & JQuery for Mobile Template.

  • JQuery for Mobile with rich .css & javascript support. No need to download seperately & copy, paste or make seperate template.

  •  Download it & Install in your Visual Studio 2010 & Enjoy building MVC 3 Razor Website Ready for Mobiles with rich support API of HTML 5, JQuery.

  •    Install in Visual Studio 2010 as default template instead of copy & paste in Project/Item Template of Visual Studio 2010 folders.

  •    Lets work with Visual Studio 2010 installed templates of Mobile Ready ASP.NET MVC 3 Razor & JQuery for Mobile with HTML 5.

Asynchronous Programming in .NET 4.5 , HTML 5 , CSS 3 with Visual Studio 2011 Developer Preview


Asynchronous programming has been started with continuation of Dynamic Programming in .NET 4.0 framework with C# , since in .NET Framework 4.5 Client Profile contains a strong support for Asynchronus programming & portrays a full – fleged .NET programming’s future in Asynchronous programming with MultiBinding Support in ASP.Net 4.5 , Strong API with XHTML 5 , CSS 3 , JQuery.

Advantage of Asynchronous Programming: Parallel Programming or Dynamic Programming shows some facilities of Async client call rather than synchronous processing of method. Those of constrains have been throughly modified in .NET Framework 4.5 & enriches the new feature of Asynchronous programming in C# /VB.

Sample Application:

The Sample Application demonstrates the Asynchronous downloading of web: msdn.microsoft.com with left & corresponding page details in right pane of the WPF Windows.

Sample Application Development :

Create a new WPF 4.5 application in Visual Studio 2011 & named in AsyncApp.

Provide the necessary code of MainWindow.xaml:

<Window x:Class=”AsyncLab.MainWindow”

xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation&#8221;

xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml&#8221;

Title=”MainWindow”

Width=”640″ Height=”480″>

<Window.Resources>

<DataTemplate x:Key=”DataTemplateItem”>

<StackPanel Orientation=”Horizontal”>

<TextBlock>

<TextBlock.Text>

<MultiBinding StringFormat=”  {0}  –  {1}  “>

<Binding Path=”Length”/>

<Binding Path=”Title”/>

</MultiBinding>

</TextBlock.Text>

</TextBlock>

</StackPanel>

</DataTemplate>

</Window.Resources>

<Grid>

<TextBox Height=”379″ HorizontalAlignment=”Left” Margin=”12,12,0,0″ Name=”textBox1″ VerticalAlignment=”Top” Width=”294″ />

<ListBox Height=”379″ HorizontalAlignment=”Right” Margin=”0,12,12,0″ Name=”listBox1″ VerticalAlignment=”Top” Width=”294″ ItemTemplate=”{DynamicResource DataTemplateItem}”/>

<Button Content=”Start” Height=”23″ HorizontalAlignment=”Left” Margin=”272,406,0,0″ Name=”Start” VerticalAlignment=”Top” Width=”75″ Click=”Start_Click” />

</Grid>

</Window>

MainWindow.Xaml.Cs:

using System;

using

System.Collections.Generic;

using System.Linq;

using System.Text;

using System.Threading.Tasks;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Data;

using System.Windows.Documents;

using  System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Imaging;

using System.Windows.Navigation;

using System.Windows.Shapes;

using System.Net.Http;

using System.Text.RegularExpressions;

using System.Collections.ObjectModel;

using System.Threading;

namespace AsyncLab

{

///<summary>

/// Interaction logic for MainWindow.xaml

///</summary>

publicpartialclassMainWindow : Window

{

privateCancellationTokenSource cancellationToken;

public MainWindow()

{

InitializeComponent();

}

private sync void Start_Click(object sender,RoutedEventArgs e)

{

ObservableCollection<string> uris = newObservableCollection<string>();

this.Start.IsEnabled = false;

try

{

var response = awaitnewHttpClient().GetAsync(http://msdn.microsoft.com);

string result = response.EnsureSuccessStatusCode().Content.ReadAsString();

this.textBox1.Text = result;

awaitTask.Run(() =>

{

MatchCollection mc = Regex.Matches(result, “href\\s*=\\s*(?:\”(?<1>http://%5B^\”]*)\”)”, RegexOptions.IgnoreCase);

foreach (Match m in mc)

{

uris.Add(m.Groups[1].Value);

}

});

this.listBox1.ItemsSource = awaitTask.WhenAll(from uri in uris select DownloadItemAsync(newUri(uri)));

}

catch (Exception ex)

{

MessageBox.Show(ex.ToString());

}

this.Start.IsEnabled = true;

}

private static asyncTask<LinkInfo> DownloadItemAsync(Uri itemUri)

{

string item;

try

{

HttpClient httpClient = newHttpClient();

httpClient.MaxResponseContentBufferSize = 1000000;

var response = await httpClient.GetAsync(itemUri);

item = response.EnsureSuccessStatusCode().Content.ReadAsString();

}

catch

{

item = string.Empty;

}

LinkInfo linkInfo = newLinkInfo { Length = item.Length, Title = GetTitle(item), Html = item };

return linkInfo;

}

private static string GetTitle(string html)

{

if (html.Length == 0)

{

return“Not Found”;

}

Match m = Regex.Match(html, @”(?<=<title.*>)([\s\S]*)(?=</title>)”, RegexOptions.IgnoreCase);

return m.Value;

}

}

}

  • HTML5 & CSS 3 has Rich Support in VS 2011 developer Preview in .NET Framework 4.5 Client Profile .

  • The future of Web is Web11 with VS 2011 , HTML 5 & CSS 3.

  • Javascript has more indent set of API in .NET Framework 4.5 Client Profile in VS 2011 developer Preview.

If you check WPF 4.5 development environment compared to WPF 4.0 environment , there has been addition of app.config file in VS 2011 developer preview WPF 4.5 development continues richer set of config support with SKU building. (Traditional Winforms Support)

Next article will describe more about HTML 5 & CSS 3…

Troubleshooting:Windows Azure with WCF Webrole & Windows Phone Client:Could not load file or assembly ‘MyTodo.Web’/ ‘msshrtmi’ or one of its dependencies. An attempt was made to load a program with an incorrect format.


While working with a project of  Windows Azure Toolkit Training Kit 2011 November update named Windows Phone 7 & Cloud, observed some issues while running the application Azure Development fabric. The Azure Project simply loads a WCF service webrole project in Begin , now while compiling in Azure Compute emulator it throws the following exception :

Similar Exception incorporated with ‘msshrtmi’.dll while connecting with dfservice. Possible solutions are :

  • Solutions: Check out the Debug platform (Any CPU/X86/X64/Itanium) in Build section of WCF Webrole property.
  • Make it out as X64 for 64 bit OS & x86 for 32 bit OS. Windows Azure itself hosts as 64bit OS in VM.
  • Unload the Webrole project from Solution & open the edit section of the project. Remove the Entry :
  • <PlatformTarget>Any CPU </PlatformTarget>

  • Next Reload the project & compile the project. If it again produces same error then try out the following steps:

 

  • Download Dependency Walker from : http://www.dependencywalker.com/  & Choose your appropriate OS compatible version.
  • Check out if the msshrtmi.dll is present inside bin/debug folder of your webrole project , if yes then check in dependency checker the version of the .dll whether it’s x64 or x86.

 

If the version of the .dll is appropriate then try to stop the copying of msshrtmi.dll in bin/debug of your project by applying the following code in Build Event section of Proeject Property in your Webrole project.

 

cd $(TargetDir)  

del msshrtmi.dll

Save it  & compile the project.

Hope , this steps will help to remove the issues.

Visual Studio 2011 Developer Preview with Windows Azure SDK 1.6 -November 2011 Update


Visual Studio Developer Preview 2011 is already released in CTP on September 2011 which has a seperate Option for Windows Azure development in File-> New Project option too instead of Cloud found in Visual Studio 2010. As like this:

Next , if you go to install Windows Azure Tools for Visual Studio 2011 developer preview , you may get a warning page of Windows Azure Toolkit like this:

But, not to confused with this, you can download Windows Azure SDK 1.6 November update which is working fine with visual studio 2011 developer preview edition.

Download Windows Azure SDK 1.6 November Edition: http://www.microsoft.com/windowsazure/sdk/

 

Explore Windows Azure with Visual Studio 2011 Developer Preview.

Debugging & TroubleShooting: Development Fabric Roles are busy,Certificate installation error in Windows Azure Toolkit for Windows Phone


As a part of Windows Azure Troubleshooting , it ‘s important to get Windows Azue roles as Busy, Aborted or Stopped in dev fabric.  Primary reasons are underlying behind the development error.

Cases of Staged environments or Production environment is quite different because in that case we need to troubleshoot the VM on which the instance is running.

For development fabric , there is a common error of getting Azure Roles get Busy, Aborted or Stopped. Such a case quite common for Windows Azure Toolkit for Windows Phone.

After installing Windows Azure Toolkit for Windows Phone, you might get a Project option in Visual Studio like this:

After that , you might get a prompt like this :

You can select default Storage account name & key or Use development Storage Emulator.

In Next screen , you will be prompted with the options to select Azure asp.net membership role or Use ACS account credentials.

If you select to create a new ASP.NET membership store in Windows Azure Tables. Then , the project loads & start F5 to dubug. But , you will see the Busy status of Windows Azure Roles & there is a issue in connecting the Azure instance with Windows Phone. check the storage emulator for endpoints addresses:

as over HTTPS on port 443 and HTTP on port 10080, both on IP address 127.0.0.1. If it is running on a different port or IP address, stop the deployment, and exit the Windows Azure Compute Emulator.

Now , Try to install the certificate in Windows Phone , even its got installed but after it will throw exception as Azure Web Role got stuck in Busy state in dev fabric.

In development Fabric , Check the Role Status as Busy & Exception Details:

Resolution:

To fix this issue you need to remove users created with the old authentication method in the Windows Azure Storage tables used by the application. To do this, you can use a tool like https://www.myazurestorage.com to remove the old users in the PushUserEndpoints table (if you are using the Storage Emulator you can use other tools like the Azure Storage Explorer).

More hotFix are here: http://watwp.codeplex.com/wikipage?title=Troubleshooting

DDMS Functionality in Android to Call, Send SMS , Capture Image in Android Emulator


DDMS is an open perspective to debug Android applications & provide native support with ADB bridge to test the functionality of Android Emulator.

In Android Eclipse plug-in there is a build-in feature of DDMS debugging support including to call, sms functionality to emulator.

To Call an Android Emulator from DDMS , Open DDMS Perspective -> Choose your Device in left pane -> Select Call functionality .

Now, Capture the Call & SMS in Android Device Emulator.

Similar functionality for receiving SMS in Android Emulator:

 

In order to capture Screen shots from Emulators , there is an built-in snapshot plugin in DDMS . Explore it during Activity running.

That’s it . Explore DDMS with debugging of Android.

View ASP.NET Web Applications & Web Services & WCF Services in Android Emulators.


There has been a tremendous problem for asp.net developers as well as android application developers to test asp.net applications on android emulators. Since android itself is a virtual device so it’s not possible to test an asp.net web application or a WCF service as directly putting

http://localhost :1022/MyAsp.NetApp/Default.aspx or http://127.0.0.1:1022/MyAsp.NetApp.Default.aspx.

Henceforth , localhost or 127.0.0.1 in android browser seems that it’s requesting to its own loopback address in android dalvik VM.

So, to run asp.net web applications , Web services, WCF Services in android emulators other than hosting the application in IIS , test it in following format:

http://10.0.2.2:8374/Service1.svc 

That’s it & same like while testing asp.net Web applications.

That’s all. Lets check the screenshots:

This slideshow requires JavaScript.

 

SQL Server 2012 RC Installation Step by Step


SQL Server 2012 RC(Release Candidate) published on November 17th, 2011 as official product from Microsoft. The Release candidate has several bug fixes for BI (Business Intelligence) , Data Synchronization & High Availability.

  • Compared to CTP3 Denali is more compact in release mode & available in five different forms (both x86 & x64):
  • Express
  • Express with Tools
  • SQL Server 2012 Management Studio
  • Express DB (Local DB only)
  • Express with Advance Series(With SSRS, Full Text Search).

Download Today: http://www.microsoft.com/download/en/details.aspx?id=28151&WT.mc_id=aff-n-in-loc–pd

Next the Step by Step installation guide:

Extract the Express with Advanced Series SQL Server 2012 .exe as start installation as new instance:

Check the box : I accept the licence terms.

Next put you Features installation after verifying setup rules with Windows Domain settings.

Next , put the Installation Rules with Instance name that will re required to identify your SQL Server 2012 instance in your system.

Next , after calculating  Disk Space Requirements, it will start to check Server Configuration. Put your choice to set the instance of your SQL Server with Windows  domain a/c Login or Mixed Mode(Windows + SQL Server ) with sa account mode.

Next , if you would like to provide FILESTREAM configuration with SQL Server 2012 , you can configure it here.

Similar to User Instance Configuration ,

Next , Check out the box if you would like to install SQL Server Reporting Services 2012 with SQL Server Instance with Sharepoint integration.

Next , Start your Installation process of SQL Server 2012 & Check out the progress bar.

Next , you are done with your installation , so next explore the latest updates of SQL Server 2012 denali in developer preview.

 

Explore the latest SQL Server 2012 book in evaluation mode which will be in release on Spring 2012.

Download from here: https://skydrive.live.com/?cid=7f185b0e5a1ba82e#!/?cid=7f185b0e5a1ba82e&sc=documents&uc=1&nl=1&id=7F185B0E5A1BA82E%21142!cid=7F185B0E5A1BA82E&id=7F185B0E5A1BA82E%21142

So, now Work & explore your favourite database SQL Server 2012 & provide feedback.

Building Google Map Based Applications on Android Tablet Device with Google Map API


Developing Google Map based application on Android Tablet applications is pretty easy with the help of Google Map API Key.

To start for developing application for Google Map with Android device , First start with Eclipse & locate your debug.keystore file from Window-> Preference-> Android->Build .

Then , find your MD5 key from Keytool.exe(Available in JDK/JRE folder in Program Files) for Google MAP API Key:  http://code.google.com/android/add-ons/google-apis/mapkey.html  & Run the following command in command prompt:

keytool.exe -list -alias androiddebugkey -keystore

“C:\Users\<username>\.android\debug.keystore” -storepass android

-keypass android

 

Next , go to  http://code.google.com/android/maps-api-signup.html & paste the MD5 Key to find your Google Map API Key.

Source Code Design:

Locations.java:

package com.example.LBS;

import android.app.ListFragment;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.*;

import android.widget.ArrayAdapter;

import android.widget.ListView;

import android.widget.Toast;

public class Locations extends ListFragment{

String[] locations = {

“Grand Canyon,Arizona(Valley)”,

“Bill Gates’ house”,

“Yosemite National Park,California (Park)”,

};

String[] latlng = {

“36.1125,-113.995833”,

“47.627787,-122.242135”,

“36.849722,-119.5675”,

};

@Override

publicvoid onCreate(Bundle savedInstanceState){

super.onCreate(savedInstanceState);

// — Displays the list of locations in the list

setListAdapter(new ArrayAdapter<String>(getActivity(),

android.R.layout.

simple_list_item_1,locations));

}

public void onListItemClick(ListView parent,View v,

int position,long id)

{

Toast.makeText(getActivity(),

“You have selected” + locations[position],

Toast.LENGTH_SHORT).show();

}

@Override

public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState){

return inflater.inflate(R.layout.locations, container,false);

}

}

Next Code for ShowMap.java:

package com.example.LBS;

import android.app.Fragment;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.Menu;

import android.view.MenuItem;

import android.view.MenuInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.Toast;

import  com.google.android.maps.GeoPoint;

import com.google.android.maps.MapController;

import com.google.android.maps.MapView;

public class ShowMap extends Fragment

{

private MapView mapView;

private MapController mc;

@Override

public View onCreateView(LayoutInflater inflater,

   ViewGroup container,Bundle savedInstanceState)

   {

return inflater.inflate(R.layout.showmap,container,false);

   }

// Displaying Zoom Control on Map

publicvoid onStart() {

super.onStart();

mapView = (MapView)getActivity().findViewById(R.id.mapView);

mapView.setBuiltInZoomControls(true);

mc = mapView.getController();

//mc.zoomIn();

//mc.zoomOut();

mapView.setSatellite(true);

   }

}

Next , Insert locations.xml & showmap.xml in res/layout folder:

<?

xmlversion=“1.0”encoding=“utf-8”?>

<

LinearLayoutxmlns:android=http://schemas.android.com/apk/res/android&#8221;

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:orientation=“vertical”>

<TextView

android:layout_width=“fill_parent”

android:layout_height=“wrap_content”

android:text=“List of Locations”

android:textSize=“30sp”

android:textColor=“#adff2f”       

/>

<ListView 

android:id=“@id/android:list”

android:layout_width=“match_parent”

android:layout_height=“match_parent”

android:layout_weight=“1”

android:drawSelectorOnTop=“false”/>

</

LinearLayout>

showmap.xml:

<?

xmlversion=“1.0”encoding=“utf-8”?>

<

LinearLayoutxmlns:android=http://schemas.android.com/apk/res/android&#8221;

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:orientation=“vertical”>

<com.google.android.maps.MapView

android:id=“@+id/mapView”

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:enabled=“true”

android:clickable=“true”

android:apiKey=“0a2QzmzSZf-7SPfgI5CwwHFtZnf86krSsP6qbrw”/>

</

LinearLayout>

Modify main.xml:

<LinearLayoutxmlns:android=http://schemas.android.com/apk/res/android

android:id=“@+id/container”

android:layout_width=“match_parent”

android:layout_height=“match_parent”

android:orientation=“horizontal”>

<fragment

android:name=“com.example.LBS.Locations”

android:id=“@+id/locationFragment”

android:layout_weight=“0.25”

android:layout_width=“20dp”

android:layout_height=“match_parent”/>

<fragment  

android:name=“com.example.LBS.ShowMap”

android:id=“@+id/mapFragment”

      android:layout_weight=“1”

android:layout_width=“0px”

android:layout_height=“match_parent”/>

</LinearLayout>

Modify MainActivity.Java:

package com.example.LBS;

import android.app.Activity;

import android.os.Bundle;

import com.google.android.maps.MapActivity;

public class LocationBasedServiceActivity extends MapActivity {

//** Called when the activity is first created. */

@Override

publicvoid onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

        setContentView(R.layout. main);

    }

@Override

protectedboolean isRouteDisplayed() {

// TODO Auto-generated method stub

returnfalse;

    }

}

At Last : AndroidManifest.xml:

<?xmlversion=“1.0”encoding=“utf-8”?>

<manifestxmlns:android=http://schemas.android.com/apk/res/android

package=“com.example.LBS”

android:versionCode=“1”

android:versionName=“1.0”>

<uses-sdkandroid:minSdkVersion=“11”/>

<uses-permission  android:name=“android.permission.INTERNET”/>

<application 

android:icon=“@drawable/ic_launcher”

android:label=“My Location”>

<uses-libraryandroid:name=“com.google.android.maps”/>

<activity 

android:label=“@string/app_name”

android:name=“.LocationBasedServiceActivity”>

<intent-filter>

<actionandroid:name=“android.intent.action.MAIN”/>

<categoryandroid:name=“android.intent.category.LAUNCHER”/>

</intent-filter>

</activity>

</application>

</manifest>

That’s it, Lets Check the Application!!…

This slideshow requires JavaScript.