Auto detect user's timezone through javascript

In this post i would like to describe how to detect user's timezone and auto set in dropdown. In C# there is class called TimeZoneInfo through which you can get system Timezone.

First of all get system timezone info and bind it to dropdown list.(In my case i am using mvc application that's why IEnumerable<SelectListItem> return type of object )



Now to to auto select timezone as per user's location there is very simple solution is read offset value using date object using javacript as per below




This offset will be in minutes and you need to store it somewhere (cookie is one option)


Now in above code in GetTimezone() function you need to read that value and set it selected value as per below.


Here i haven't consider  daylight savings time (DST), you can refer his link for more detail about that

HTML5 target schema for visual studio

If you are web developer then you know that every web application is build on stack of html controls, when you say we are building asp.net application using asp.net controls, then you need to understand that asp.net controls have higher level of abstraction.

An output of an ASP.NET server control can be the result of many HTML tags that combine together to produce that control and its events.

If you want to read more about difference between HTML controls and ASP.NET server control then visit this link.

When you are designing aspx/html/cshtml page inside visual studio you need to specify target schema for validation as per below (By default it is selected so some people don't aware of this!)

Today HTML5 is in demand and it is supported by most of browsers, some people says that HTML5 will remove flash from web!
Anyway if you want to know more about HTML5 and it's features then following are good links.

• what is HTML5?
• What's new in HTML5?

If you want to take benefit of Intelisense and validation of html5 controls in visual studio then you need to install target schema for html5 from here first,then you can see it in that list and select that schema for your application as per below.

Look at Cloud Storage available on internet

Toady every IT industry taking benefit of cloud technology to reduce their infrastructure cost to company.cloud technology is very vast topic not possible describe in this post, however here I would like to talk about different cloud storage providers available on Internet where you can store your data,files,video, photo etc and access that data from anywhere without any software, it only requires browser with Internet connection!

Amazon Cloud Drive
Free storage            : 5 GB
Max File Upload size  : 2 GB
Sync to desktop       : No
Pricing details           : https://www.amazon.com/clouddrive/learnmore

Google Docs
Free storage            : 1 GB
Max File Upload size  : 1 GB
Sync to desktop       : Yes (Windows only)
Pricing details           :http://support.google.com/docs/bin/answer.py?hl=en&answer=37371

Microsoft SkyDrive

Free storage            : 25 GB
Max File Upload size  : 50 MB
Sync to desktop       : Yes (Windows and Mac)
Pricing details           : http://explore.live.com/skydrive

DropBox
Free storage             : 2 GB
Max File Upload size   : 300mb via web, unlimited using client:www.dropbox.com/install
Sync to desktop        : Yes http://www.dropbox.com/help/4

Pricing details            : http://www.dropbox.com/pricing

Box.net
Free storage             : 50 GB
Max File Upload size   : 25 MB to 1 GB
Sync to desktop        : http://www.box.com/business/features/box-sync/
Pricing details            : http://www.box.com/pricing/

My blog reached to 1000 unique visitors

I have started this blog before 1 year to just share my knowledge among people who are new in programing or geek person, and step by step i have improve this blog to make more useful to help people.

Today i am happy that flag counter display 1000 unique visit to my blog and 59 country visited this blog! 


  

Also Google has approved my blog's authorship so user can see my google+ profile pics in Google search result as per below.



Also till now more successful posts as per below

Paypal Integration in MVC and razor collected great comments
why Mark zukerberg is great IT leader got appreciation from Mark Zukerberg himself

I hope that my blog is contributing in technology field very well and hope that it will be!
Welcome your comments on this! Have a nice day!

Knol will be moving to Annotum on May 1, 2012

Google has lunched knol in 2007 to improve web content by expert's collaboration in that content, and many expert created their account and made efforts to improve web contents.
Now as per Google announcement of shutting down some of it's products, knol is part of that.

What will be the alternative of knol?
As per google's official blog they will replace this service with Annotum (opern source wordpress based product)


"Knol—We launched Knol in 2007 to help improve web content by enabling experts to collaborate on in-depth articles. In order to continue this work, we’ve been working with Solvitor and Crowd Favorite to create Annotum, an open-source scholarly authoring and publishing platform based on WordPress. Knol will work as usual until April 30, 2012, and you can download your knols to a file and/or migrate them to WordPress.com. From May 1 through October 1, 2012, knols will no longer be viewable, but can be downloaded and exported. After that time, Knol content will no longer be accessible."
So transfer our knol content to Annotum today.

• Get staretd with Annotum (knol users ot not Knol users )
• FAQ

Google is in process of shutting number of it's products

The web based giant company google had announced that they will discontinue some of it's product in 2012.

"we’re in the process of shutting a number of products which haven’t had the impact we’d hoped for, integrating others as features into our broader product efforts, and ending several which have shown us a different path forward. Overall, our aim is to build a simpler, more intuitive, truly beautiful Google user experience." said on their blog.

Following are list of product/service which are going to be shutting down.

• Google Bookmarks Lists
• Google Friend Connect
• Google Gears
• Google Search Timeline
• Google Wave
• Knol
• Renewable Energy Cheaper than Coal (RE<C)
  

So if you are using any services from above list then please keep in touch with Google's official blog for update.

Bundling and Minification in ASP.NET 4.5 and MVC4

In MVC4 Beta release from Microsoft last week, have a look with series of blog and would like to talk about one feature called Bundling and Minification which is also available to ASP.NET 4.5

Bundling: As per name suggest it bundle or combine multiple javascript, css requests to fewer Http request means bundle by type of file
Minifying: will remove white space form css and javascript which cause to reduce download size of that files

Let's if we have project with 3 javascript and 3 css files




Bundling and minifying the .css files
If you want to add css file as per listed above in fig then  you need to add refernce of all 3 files as per below which will result in to 3 separate http requests but this feature allow you to bundle and minify in to styles folder and call it in only one http request as per below.


Same way it will apply to javascript files as well
This is simple overview of this feature you can read about it in more details on scottgu's blog.

Integrate Bing Searchbox in MVC3 with razor application

If you are building MVC3 application with razor view engine then now it is very easy to integrate Bing Searchbox in just 2 steps as per below.

1) Add Microsoft Web Helpers
In your MVC application just add this helper's reference using Nuget Command

2) Add below code to cshtml Page

and output of this will look like as per below

You can also add Twitter Feeds, Facebook Feeds using this helper, to read about how to do this refer this link.
To read more about Microsoft.Web.Helpers refere msdn link.

Add Elamh to ASP.NET MVC application

Elmah is great open source module developed by Atif Aziz to handle error logging for asp.net application and there is nuget pacakge also available to add in to existing application. If you are new to Elmah then visit my previous post to started with it.

Alexander Beletsky has developed Elmah.Mvc for asp.net mvc application it is also available through Nuget package.
You can add it by GUI tool as per below
Go to Reference> Manage Nuget Pacakge > Search Elamh.MVC

OR By Package Manager console as per below

Now Hit admin/elmah with your app's URL,you will get elmah page. That's it!

Please refer Author's blog post about what are the changes in this MVC version of Elmah.

Paging sorting with WebGrid in MVC3 and razor

If you have worked with MVC3 and Razor view engine then you may be aware that when will you create new view for details on bases of IEnumerable Model then it
it will create cshtml code with foreach loop which will cause to render data in Grid Format as per shown in below fig.


Now if you want Paging and sorting to this data then manually you need to make lots of efforts to achieve desired result.
But Microsoft has already built very good helpers called WebGrid, to achieve this so you do not need to do that manually.
So it will look like as per below after replacing above code.


If you notice URL in above fig then you can see that it WebGrid will automatically make sorting request with proper parameter you can also change parameter
name to customize URL,e.g.
var grid = new WebGrid(Model, canSort: true, canPage: true, rowsPerPage: 2,sortFieldName:"S", sortDirectionFieldName:"SD");

You can apply style to particular column by style: attribute. http://stackoverflow.com/questions/9357786/apply-specific-width-in-column-of-webgrid-in-mvc3

Look at

• Complete List of Properties
• Apply styles and customize WebGrid
• Details of Webgrid's Properties and how it works
• Inside WebGrid

Look at ASP.NET MVC4 Beta!

Microsoft has released ASP.NET MVC4 Beta officially and Jon Galloway announced regarding of it in his blog with introduction to ASP.NET web API.

Top Most Features

•     ASP.NET Web API
•     Refreshed and modernized default project templates
•     New mobile project template
•     Many new features to support mobile apps
•     Recipes to customize code generation
•     Enhanced support for asynchronous methods

Also you can build ASP.NET MVC project with Nuget Package
For more details and installation tips look at http://www.asp.net/mvc/mvc4

Swap VIP in Window Azure

Swap VIP is very good feature available in Window azure, I would like to described here about that with good reference link.

What is SWAP VIP ?
There are 2 type of environment on which you can deploy on window azure application.

Staging
In other word you can say testing environment, having similar configuration as per production. Before deploying to production (where actual user will use your application) you can deploy to staging to fix bugs, test security issues, configuration problem etc.

Production
It is actual environment where you can move tested staging application which will be used by real users. (you can directly deploy your application if you are confident on your testing!!)

In sort Swap VIP is azure feather to move application from staging to production by just one click!

How to use Swap VIP?
After testing your application just click on Swap VIP as per shown in above fig.and click ok and it will transfer from staging to production with zero downtime of your original application!

What will happen while swapping?
If you have notice DNS when you have created staging would be as per below.
ID + Cloudapp.net

and in production DNS would be actual URL with something like myapp.cloudapp.net
When you going to swap azure will just transfer this DNS entry.

Reference Links

• More info on SWAP VIP on msdn
• Swap VIP with screenshots
• Step by Step: Publishing your application and Swap VIP
• Make sure about your configuration setting when you will swap VIP
• Deploying application using azure management portal
  

Step by Step : Upload asp.net web application to Window Azure

Window Azure is in demand for cloud hosting to host asp.net web application and make scalable that application as per retirements, so I would like to describe here step by step to upload asp.net application on window azure. so let's start!

1. Create New Project > ASP.NET web application

   
   

2. Create New Cloud Project and Just click OK without selecting anything

   

3. Go to Cloud Project > Right click on Roles Folder > Add web role from solution as per below fig.

   
   

4. Here you can configure your cloud project with .csdef config file (you can also add stratup task in that.)
   

   
   

5. Build Solution then right click on Cloud Project and click Publish, it will open dialog as per below.
   
   

6. Here i will go through "Create Service package only" which will create published files to upload manually on window azure portal, if you want details on 2^nd option then please refer this link for Getting Started with the Windows Azure Tools for Visual Studio
   
   

7. Click on "Configure Remote Desktop" if you want RDP connection to that application and chose certificate and credentials as per below
   
   

8. Click Ok on both dialogs and it will generate 2 files which we need to upload on Window azure portal
   

   
   

9. Create "New Hosted Service" on azure portal then fill details, choose certificates and browse 2 published files in step-9 and click ok
   

   
   
   
   cheers!
   

Alternate way to set default browser in VS2010

If you are using Visual studio on daily basis for development then you are familiar about to change default browser setting as per shown in below fig.

Right click on any aspx page and click "browse with" will open window with installed browser list and you can set default browser for that application.

But if you are working with MVC3 application where aspx page is not available then how you can change this setting? because browse with option only available with aspx or html page

Some person prefer to add extra aspx page or html page to application change this setting, however i explore alternate way to do this as per below..

Following are steps i have followed to change my default browser to chrome

1.     Open the web project properties
2.     Go to Web tab
3.     In Start Action section select Start external program and then add chrome executable path and the url as       Command line arguments.
4.     In Servers section set specific port to the same port set in the URL in step 3.

KeyTips plugin : Add keyboard support to Web application

It is very useful to add keyboard support to commercial application interface where user can able to fill up details and navigate throughout application without using mouse. Till now this type of accesskey only available with window application but now it is also possible with web application interface as well with KeyTips Jquery Plugin.

The KeyTips (formerly the Access Key Highlighter plugin) provides various options for highlighting access keys on web forms when the user presses their browser's access key shortcut key, e.g. Alt for Internet Explorer and Safari, Shift+Alt in Firefox.
Visit the KeyTips jQuery demo page and hold down ALT + Shift (Alt for IE) to see the key tips.

Following are steps to add this jquery plugin to your application

If you look at source code you found accesskey attributes in all fields which will be used to with combination with ALT + SHIFT (ALT for IE and safari)



You can also add this Jqeruy plugin by Nuget


AJAX wrapper on basis of this jquery plugin also available at codeplex