Dll Shepherd.Net: Writing code in a Blog Post

As a developer I have a few must have requirement for adding code to my blog:

1. My users must be able to copy the code (I have seen some blogs where copy also copies the numbering which for me is a major failure!)

2. It won’t cause me any extra work to put the code in the blog

3. It will look good (if not exactly like my VS than like a regular VS): both coloring and indentation

4. It works in VS2010… (one of them didn’t)

5. Optional: It looks the same on all the browsers.

With those requirements let’s get to work:

1. Using Word:

When I just started I used Word and when copying code to Word the code had the coloring and indentation.

It supported copy paste (while using paste special->Keep Formatting)

And it looked like this:

private void LoadRawCadCompleted()

{

var dissolveTask = new Geoprocessor(MapApplicationConfigWrapper.Instance.DissolveCadServiceUrl);

dissolveTask.CancelAsync();

dissolveTask.ExecuteCompleted += DissolveTask_ExecuteCompleted;

dissolveTask.Failed += DissolveTask_Failed;

dissolveTask.ExecuteAsync(new List<GPParameter>());

}

Not so bad, right?

Well I thought so until I tried to remove Word from the equation, than I got:

private void LoadRawCadCompleted()
{
    var dissolveTask = new Geoprocessor(MapApplicationConfigWrapper.Instance.DissolveCadServiceUrl);
    dissolveTask.CancelAsync();
    dissolveTask.JobCompleted += DissolveTask_ExecuteCompleted;
    dissolveTask.Failed += DissolveTask_Failed;
    dissolveTask.SubmitJobAsync(new List<GPParameter>());
}

I didn’t get the option of paste special->Keep Formatting, all I got was was paste special-> Html, which looked even worst:

private void LoadRawCadCompleted() { var dissolveTask = new Geoprocessor(MapApplicationConfigWrapper.Instance.DissolveCadServiceUrl); dissolveTask.CancelAsync(); dissolveTask.JobCompleted += DissolveTask_ExecuteCompleted; dissolveTask.Failed += DissolveTask_Failed; dissolveTask.SubmitJobAsync(new List()); }

Well this looks ugly and using Word in this point is too much extra work.

FAIL

2. Using VS extension Code4Blog

That was my second trial and I used it for like 3 days (which looking back was too long).

The Extension can be downloaded from the Extension Manager in VS2010 or from here.

It works like this:

1. You select the piece of code or file you wish to copy to your blog

2. You click on Tools->Save Code as Html:

This opens an Html document you can edit and copy from:

And all what left was paste as html, the ~~end~~ middle result looks like:

         private  void  LoadRawCadCompleted ()

             var  \b dissolveTask\b0  = new  Geoprocessor (MapApplicationConfigWrapper .Instance .DissolveCadServiceUrl );

             \b dissolveTask\b0 .CancelAsync ();

             \b dissolveTask\b0 .JobCompleted  +=  DissolveTask_ExecuteCompleted ;

             \b dissolveTask\b0 .Failed  +=  DissolveTask_Failed ;

             \b dissolveTask\b0 .SubmitJobAsync (new  List <GPParameter >());

Can you spot the bugs?

A. \b Text \bo – was from any bold text in the editor (which comes from Resharper) so I fixed that by removing all the bold stuff in Tools->Options->Environment->Fonts and Colors

B. It adds spaces everywhere, for example look at Instance. I fixed that manually!

C. There is another bug that I found where regions with a name like C'tor (name with ') got changed…

So I added the bugs at the CodePlex site, and even opened the source code to find the bugs but couldn’t find how to run it and didn’t really have the time to spent on this (I even started a post on that so maybe I will return to it).

So it also failed because it simply not easy or looks good!

FAIL

3. Using the VS extension Copy as Html

This one failed on take off since it works only on VS2008.

It can be downloaded from here.

FAIL

4. Using Windows live writer extension Paste As Visual Studio Code

This one is what I use now. Can be installed from here. More information can be found here.

All you have to do is copy from VS and click on the add-on when you are in Windows live writer:

It opens a nice sidebar that once you save your defaults you don’t have to touch. This are my defaults:

And shows your code live in the blog post in Windows Live Writer:

Running Example:

private void LoadRawCadCompleted()
{
    var dissolveTask = new Geoprocessor(MapApplicationConfigWrapper.Instance.DissolveCadServiceUrl);
    dissolveTask.CancelAsync();
    dissolveTask.JobCompleted += DissolveTask_ExecuteCompleted;
    dissolveTask.Failed += DissolveTask_Failed;
    dissolveTask.SubmitJobAsync(new List<GPParameter>());
}

With Class Names:

private void LoadRawCadCompleted()
{
var dissolveTask = new Geoprocessor(MapApplicationConfigWrapper.Instance.DissolveCadServiceUrl);
dissolveTask.CancelAsync();
dissolveTask.JobCompleted += DissolveTask_ExecuteCompleted;
dissolveTask.Failed += DissolveTask_Failed;
dissolveTask.SubmitJobAsync(new List<GPParameter>());
}

~~This is exactly like my VS code – so for me it looks good.~~ Until I opened the blog post and it didn’t look ok. But it was all caused by a settings of blogger.

Attention: Change your blogger settings: Settings->Formatting->Convert Line breaks to “No” (since you write html to your post in the post it will add more and more lines making your post look and feel bad).

Now the code looks like this in Chrome:

Looks Perfect!

Users can Copy-Paste the code (it looks like you copy the numbering but on pasting it is without numbers).

And last but not least it is easy to post.

(you can even use CSS classes I use them but keep it with the defaults, so that when I will want to change it I could do it to all my posts (without going over them))

Success

Resources:

VS2010 Extension: Code4Blog

CodePlex: Code4Blog

VS2008 Extension: Copy as Html

Windows Live Writer extension: Paste As Visual Studio Code

Paste As Visual Studio Code help

Keywords: Blog, post, code, C#, bold, Code4Blog, VS2008, VS2010, Copy, Paste, Windows live writer, CSS, Html, Word