Highcharts

Highcharts is a charting library written in pure JavaScript, offering an easy way of adding interactive charts to your web site or web application. Highcharts cost $80 for a single website license and $360 for a single developer / web application license.

For .NET developers who don’t want to dive into client-side JavaScript and jQuery to create their charts, options do exist.  While Highcharts doesn’t offer an ASP.NET library directly, however there are a few open source options available.

DotNet.Highcharts

DotNet.Highcharts is "the .NET way to display Highcharts into your ASP.NET application." The library proclaims easy integration with ASP.NET applications and that you’ll only need to write in C# (no JavaScript coding needed — however the output code is pure JavaScript). Of course, you will actually need to use JS coding if you want to do more advanced functions like AJAX loading.

The most recent release comes with over 35 example charts including Multiple X-Axes, Chart inside JavaScript function, Multiple charts in one page, Disable Animation, Bind Decimal Values, and more. It is available as a NuGet package as well.  Developed by Vangel Kolarov.

Highcharts MVC

Highcharts MVC is "an Open-source Highcharts wrapper for ASP.NET MVC which aims to provide a better, easier and cleaner API." Currenty the source is hosted on GitHub. This has also been made available as a NuGet package. Three examples showcase the ability to use the library in simple, advance, and AJAX scenarios. More information is available at the developer’s website.  Developed by Guilherme Oenning.

Highcharts .Net (WebForms)

Highcharts .Net encapsulates the Highcharts API on ASP.net controls making it easier to use. It is free for non-commerical use. At this time it doesn’t seem to formally support ASP.NET MVC at this time (only WebForms), however there is a discussion of usage with MVC 3. Note: It looks like a hack / workaround to me. Examples and more information at the developer’s website.  Developed by André Paulovich and André Castro.

Telerik Extensions for MVC

Telerik Extensions for ASP.NET MVC is "a comprehensive set of native MVC, jQuery-powered UI components that help you deliver richer apps to market faster." Charting is offered out of box, and examples exist. The examples range from simple to complex and all come with the source code.

The extension is HTML5-based, and chart rendering utilizes lightweight SVG-powered engine for modern browsers with a fallback to VML for legacy browsers.

Aside from open source projects, Telerik Extensions for ASP.NET MVC comes in at a hefty price tag of $999, and is really only suitable for businesses that can afford it. The Telerik code is hosted on CodePlex.

Telerik KendoUI

KendoUI is the new kid on the block, and allows developers to build modern web apps with HTML5 / JavaScript. Charting is only one small feature amongst over fifteen included in this Framework. KendoUI current costs $399 for a developer license, and offers charting through its DataViz package (currently free with Web for a limited time). KendoUI is not tied to any server-side library as is the case with Telerik’s ASP.NET MVC Extensions. Currently there is minimal support in the ASP.NET realm.

Kendo MVC Extensions for ASP.NET

The Kendo MVC Extensions for ASP.NET library aims to "makes it easier for ASP.NET MVC developers to implement the Kendo UI JavaScript framework." A sample exists of how to use the Chart function.

Other Options?

Again, many other controls exist, but several that I came across were geared towards WebForms, build for Silverlight or were a bit older (eg. NPlot and Microsoft Chart Controls). There is a post about usage of Microsoft’s Chart Controls of .NET with MVC and more information in this Stackoverflow post. You also always have the option to work with JavaScript more directly, or create your own API wrapper for other top jQuery charting libraries.

Conclusion

Dotnet.Highcharts definitely has the most examples, so that is a win in my book. It makes getting started and understanding the code that much easier.  KedoUI is still quite new, but it looks slick and so I’ll be giving the DataViz a try as well with their free thirty-day trial.  While Telerik Extensions provides a stable, robust product, paying a thousand bucks for MVC extensions seems too heavy for me, especially since I mainly require charting.

DotNetOpenAuth + OpenID-Selector

DotNetOpenAuth can be used to build custom authentication solutions from the ground up. This is a general implementation of the DotNetOpenAuth library which uses a simple JavaScript OpenID selector. Haitham Khedre provides a full tutorial on how to accomplish establishing social authentication with OpenId using the jQuery OpenID selector in MVC3 and has published the full source code.  Note that other tutorials exist for using DotNetOpenAuth directly, so Google around to find one more akin to your liking.

Pros

• Simple – Very simple implementation and the tutorial is fairly straight-forward.  Could be a good starting point for building your own.

Cons

• Support – Only OpenId is supported, and the code itself looks to be unmaintained.  Likely will take some tweaking to actually using a in a production environment.

SimpleSocialAuth.MVC3

SimpleSocialAuth is a new solution, and it utilizes the DotNetOpenAuth library. It aims to fill the void of a simple, lightweight social authentication NuGet package for MVC. From the NuGet page: “Super simple and easy to install package that allows web sites creators to seamlessly add OAuth support to their ASP.NET MVC 3 sites. Supporting Twitter, Google and Facebook.”  Integration with ASP.NET Membership is beyond the scope of the library, and is left to the developer to implement.

Pros

• Lightweight – You can easily get Authentication up and running for Facebook, Twitter or Google within minutes by adding in this NuGet package.
• Extensible – Seems like a good starting point to build a custom solution off of.

Cons

• Authentication Only – To do anything beyond authentication you’ll need to utilize other 3^rd party libraries to communicate with the APIs (eg. Facebook SDK, Twitterizer, etc.), however this isn’t much of a con as it is by design and keeps it lightweight.

SocialAuth.NET

SocialAuth-NET is an extensible .NET Library for authentication/authorization through Google, Yahoo, Facebook and other providers supporting OAuth. It provides social authentication, profile data, social sharing (consume REST API feeds of supported providers), and more. It is a port from the Java-based SocialAuth library.  They have only recently added support for MVC with the 2.x release of the library, and ASP.NET Membership integration is not currently supported.

Pros

• Features – It goes beyond authentication to offer social sharing, contact import and other features by communicating directly with the APIs to offer a bundled solution.
• Coverage – It supports Facebook, Twitter, Google, Yahoo!, LinkedIn, MySpace and Hotmail / MSN out of the box, plus new providers are easily creatable.

Cons

• Support – There are a number of reported issues with no timeline in sight.  You won’t get the same support level as you would with a paid solution. 
• Membership – They have not provided support for ASP.NET Membership, and the issue remains open, as well as a general issue with supporting both traditional logins and social logins simultaneously.

Janrain Engage

Janrain provides a third party solution for handling Social Login, Social Sharing, Social Analytics and more with their Janrain Engage product. Troy Goode has provided a NuGet package called EngageNet that adds a wrapper library for the Janrain Engage service on ASP.NET MVC sites, though it was last updated a year ago. Janrain also provides a very basic wrapper (C#), but it definitely isn’t complete either. Other than that I struggled to find much in the way of .NET libraries for Janrain Engage. From what I remember (used it about 18 months ago), I had to write my own implementation for Pro/Enterprise features of the API like Account Mapping.

Pros

• Managed – A totally hands off approach. You setup to work with one API system and they handle the rest.
• Coverage – Pretty much covers any authentication provider you would need, plus more.
• Features – It goes beyond authentication to offer social sharing, contact import and other features by communicating directly with the APIs.
• Support – You can expect more support than you would get with an open-source solution.

Cons

• Third-party – You and your data are dependent on an intermediary party. If their solution is down, so is your login. And the lower levels of the service aren’t completely white-label so people could see you are using a third-party service, which they might not appreciate when considering their authentication details.
• User Caps & Cost – It gets costly for full features, with price caps at 10K / 25K users and beyond. Up to 10K users you are paying a $1000 / mo, which equates to a minimum of .10 per user or more. If you are planning to have a large user community, it could become very costly.
• .NET Support – There isn’t much of a .NET community utilizing Janrain Engage, at least not those that are sharing their code publicly.  You’ll have to dig and ask around for coding help using Pro/Enterprise plans.

Conclusion

I should mention that the OAuth.net website provides a list of extensions / libraries itself, but, with the exception of DotNetOpenAuth, the others for .NET are old fairly old and seem unmaintained.  This was one reason for putting this article together.

I’ve tried Janrain Engage myself, and after the initial implementation it does make things easier, even though I had to write my own integration code. While they offer the most robust out-of-box solution at this point in time, in the end I really disliked having to rely on a third-party solution and eventually dropped it.

I think the SocialAuth solution is positioned very well, and if BrickRed would put more focus, resources and priority on the library, I think they’d have a solution developers would embrace, and likely pay for.

In the end I still struggle to determine what is the best method of authentication and interacting with social websites using .NET, specifically within MVC. Should I use a full-blown solution like Janrain Engage or SocialAuth.NET, or use barebones Authentication provider in conjunction with the Facebook/Twitter libraries directly? 

For now I’ll likely stick with a lightweight solution like SimpleSocialAuth.MVC3, and use the most stable SDKs directly.

Clipboard Plugins

Developers can provide end-users the ability to copy text to their clipboard (eg. mimic Ctrl+C action).

ZeroClipboard
This is the most active clipboard project available.  Most robust, lots of options and active community.
http://code.google.com/p/zeroclipboard

Example of ZeroClipboard with multiple per page
http://www.webmasterworld.com/javascript/3901742.htm

zClip jQuery Plugin
zClip Wraps the ZeroClipboard functionality into jQuery and is worth checking out for those using jQuery and seeking a quick clipboard implementation:
http://www.steamdev.com/zclip/

jQuery Clipboard
Another (older) clipboard plugins for jQuery.  These only work prior to the "actionable-effect requirement" in Adobe 10 and works completely differently. *This won’t work with the latest Flash versions*
http://plugins.jquery.com/project/copy
http://plugins.jquery.com/project/clipboard

Detecting Flash

Easily identify if the end-user has Flash capabilities installed on their web browser.

Flash Detect (JavaScript Flash Detection Library)
Doesn’t seem to require a separate SWF file.  Small and easy to implement.
http://www.featureblend.com/javascript-flash-detection-library.html

SWFObject
Another good options for Flash Detection that is very reliable.
http://code.google.com/p/swfobject/wiki/whats_new

Some example code can be found here:
http://stackoverflow.com/questions/159261/cross-browser-flash-detection-in-javascript

jQuery Flash Plugin
Used for embedding Flash movies but also has detection.
http://jquery.lukelutman.com/plugins/flash/

Be sure to read the developer docs and include the correct ShareThis widget JS file with your publisher Id prior to this code [ something like http://w.sharethis.com/widget/?tabs=web%2Cpost%2Cemail&charset=utf-8&style=default&publisher=(pub-id) ]

What I’ve done is loop through any cases where the sharethis class is present.  Inside the link include all the necessary information in data-* attributes that we pull out using jQuery.

<script type="text/javascript">
$(document).ready(function () {
  SHARETHIS.onReady();
  $("a.sharethis").each(function (index) {
    var id = $(this).attr('data-id');
    var purl = 'http://mydomain.com/posts/' + id
    var ptitle = $(this).attr('data-title');
    var thisobj = SHARETHIS.addEntry({ title: ptitle, url: purl }, { button: false });
    thisobj.attachButton(document.getElementById("sharethis-" + id));
  });
});
</script>

Example customized ShareThis Link

<a class="sharethis" data-id="(uniqueid)" data-title="The Title of This Post" id="sharethis-(uniqueid)">Share</a>

jQuery Tagedit
Demo: http://tagedit.webwork-albrecht.de
Code: https://github.com/webworka/Tagedit

I’m using it in the revamp for the CouponFollow website which I hope to push into private beta before the end of the month, and roll live shortly after.  I’ll likely use this plugin in future projects as well.

Here are some others that I liked but didn’t make the final cut for this project.

jQuery Tag It!
Link: http://levycarneiro.com/projects/tag-it/example.html
Code: http://github.com/levycarneiro/tag-it
My Notes: Very simple, autocomplete using jQuery UI.  Tagedit is based on this one.

jQuery Tag Editor
Link: http://blog.crazybeavers.se/wp-content/Demos/jquery.tag.editor/
My Notes: Good but no autoComplete. Some CSS overflow issues with large amount of tags.

jQuery Tag Suggestion
Link: http://remysharp.com/2007/12/28/jquery-tag-suggestion/
My Notes:  Good, simple.  Slick auto-complete, but no spacing support.  Older, not actively developed?

I had a few options, one of which is to use Cantonal URLs, but that would involve editing the web app to some degree.  So before going that way, I wanted to start making permanent redirects to the correct website URL.  The quickest approach I could think of was to create a global redirect as a new web application and reassign all the domain name bindings needed.  So I created a simple MVC 3 Web Application called GlobalPermanentRedirect which effectively takes any page and redirects the path / query to domain specified in the appSettings.

The code is very simple, however I got stumped for a few minutes with Routing, as I forgot about the catch-all parameter using *.  Here’s the code, it’s really only about three lines.

In the routing area (Global.ascx) register the route:

routes.MapRoute(
   "Default", // Route name
   "{*path}", // catch all urls
   new { controller = "Redirect", action = "Index" } // Parameter defaults
);

Create a controller called RedirectController.cs with the following line of code:

public ActionResult Index()
{
	return RedirectPermanent(ConfigurationManager.AppSettings["BaseUrl"] + Request.Url.PathAndQuery.ToString());
}

In web.Config under appSettings:

<add value="http://www.yourmainsite.com" key="BaseUrl" />

It appears, as of now, there is a two step process to migrate from MVC 1 to MVC 3:
1) Migrate from ASP.NET MVC 1 to MVC 2 (using this tool)
2) Migrate from ASP.NET MVC 2 to MVC 3 (using this tool)

Things to be wary of…

• ASP.NET MVC 3 Application Upgrade tool is not compatible with VS 2008
• It may compile, but jQuery version changes could still break your app on the client-side

I haven’t tried it myself just yet.  Based on what I’ve read, in theory, it should work, but there will likely be minor annoyances and issues to clean up.  If it seems to work the first time, something is really wrong!

I’ll post a follow-up once I give it a go.

The catch was that I’m using SubSonic 3.0.  I love SubSonic, but I couldn’t think of an easy way to implement Data Annotations in conjunction with it.   So… I searched Stackoverflow like usual, and found a couple good posts.  The short of it is to create an additional TT file that creates buddy classes.

Here is the walkthrough: http://subsonicproject.com/docs/User_talk:Minus4

Note that the MetaGenerator TT file referred to in the above post must be created manually by you and is not included with SubSonic by default.  Actually you could call it whatever you like.  The code is included in the posted link above.

In my MetaGenerator.TT (download) I added an extra line to the includes:

using DataAnnotationsExtensions;

Once saved, right click the file and select “Run Custom Tool” to generate the .cs (MetaGenerator.cs) file.  Open that up and start adding your Data Annotations, and if you’ve so chosen, the Data Annotations Extensions as well.

I guess the only “gotcha” here is that if change your DB schema and you re-run the custom tool (TT file), it will wipe any custom input you’ve created.  Perhaps there is a work around for that?

Q: Can my existing SMTP applications deliver email via Amazon SES?
Yes. The Amazon SES Developer Guide provides instructions for configuring common mail transfer agents (MTAs) to use Amazon SES as their email transport. By following these instructions, you can create a private SMTP relay for use with any existing SMTP client software.

In looking at the Amazon SES Developer Guide, they currently have examples of how to setup either Postfix or Sendmail software to use Amazon SES, and suggest adapting the examples to work with other agents.

If you want to test sending Amazon email in your own mock environment (or have an extreme situation that I don’t want to know about) below is how to setup a Mock SMTP Server and use it to test sending mail via local SMTP using the Amazon SES SendRawEmail API call.

There are a number of open source Mock SMTP servers available.  For this demo I chose the Antix Mail SMTP Impostor.  It seemed to have a good bit accomplished, while not being overly complex (brief writeup here by @LeeDumond).   You can download the source code from here:  http://ssfd.codeplex.com/

Once you’ve got the source code loaded up, Open FileMessageStorage.cs (in the Antix.Mail.Smtp.Impostor project).  Add a reference to the Amazon .NET SDK.

Next find the Store() function.  This function is used to store Mock emails locally on the hard drive.  Insert the following code to actually send the email out via Amazon SES.

//Send msg via Amazon SES
AmazonSimpleEmailServiceClient client = new AmazonSimpleEmailServiceClient("accessKey", "secretKey");
SendRawEmailRequest rawObj = new SendRawEmailRequest();
rawObj.RawMessage = GetRawMessageFromString(message.Data);
rawObj.Source = message.From.Address;
foreach (MailAddress addressTo in message.To)
{
	rawObj.Destinations.Add(addressTo.Address);
}
client.SendRawEmail(rawObj); 

Remember to include the namespaces

using Amazon.SimpleEmail.Model;
using Amazon.SimpleEmail;

That’s it!  Now you can create a sample Console App or even Outlook to use your localhost to test sending emails via local SMTP.  I’m not sure if anyone would ever want to do this, but it was a fun exercise for me.

What You’ll Need

Postal – lets you create emails using regular MVC views.  Use NuGet to get the package and get started instantly.

Amazon Simple Email Service -  a highly scalable and cost-effective bulk and transactional email-sending service for businesses and developers.  Download and install the Amazon SDK and reference the DLL in your project.

Here’s what I hacked together for now which I just called MailExtensions:

SendEmailBySES – Handles everything from the dynamic Postal view to sending the message via Amazon SES.

public static void SendEmailBySES(dynamic email) {
	//Create Amazon SES client instance
	AmazonSimpleEmailServiceClient client
		= new AmazonSimpleEmailServiceClient("accessKey", "secretKey");
	//create postal service instance
	IEmailService service = new EmailService(ViewEngines.Engines);
	//create the mail message
	MailMessage msg = service.CreateMailMessage(email);
	//convert MailMessage object to Amazon SES SendEmailRequest object
	SendEmailRequest mailObj = ConvertFromMailMessage(msg);
	//Send the email via SES
	dynamic response = client.SendEmail(mailObj);
}

ConvertFromMailMessage – Converts a MailMessage object to an Amazon SES SendEmailRequest object.

The code for this is a bit longer and more hacky so just download it instead.  You can download the source here.

NOTE: If you aren’t setup with Amazon SES you’ll have to signup up, and then need to verify your email addresses initially and go through the sandbox.  Then you’ll have to apply for production.  Below is a snippet to verify your email address through the API:

public static void VeryifySESEmail(string addy)
{
	VerifyEmailAddressRequest verRequest = new VerifyEmailAddressRequest();
	verRequest.EmailAddress = addy;
	VerifyEmailAddressResponse verResponse = client.VerifyEmailAddress(verRequest);
}