Visual Studio Hacks [Electronic resources]

Hack 96. Blog Code from Visual Studio

Convert code in Visual Studio to HTML so it is easier to post that code on a web site or web log. Then, share your snippets with your adoring public.

It is easy to grab a piece of code from your project and then turn around and write about it in an article or in a post on your web log. One tricky part of the process is getting the nice code coloring that Visual Studio provides for that code. When publishing your code to an online article or weblog, you need to convert that code to HTML and hand-code all the coloring, a tedious process. A couple of hacks make it much easier to cut and paste code directly from Visual Studio and transform it into HTML so you can easily post it to your web log.

13.6.1. Convert to HTML with a Macro

Cory Smith (http://addressof.com/blog) has come up with an interesting solution to this problem. He has written a macro that will take the code you have selected, copy it to Microsoft Word, and then save it from Microsoft Word in HTML. This is possible for a couple of different reasons. This works because Visual Studio lets you copy and paste the code from Visual Studio with formatting intact. So, if you copy text from Visual Studio and simply paste it into Microsoft Word, you will notice that all of the formatting and coloring comes with the text. This gets around the funky HTML that Word typically generates because Microsoft Word now allows you to save filtered HTML, which is much cleaner than before.

Following is the code for the macro. For more information on how to create and manage macros please refer to [Hack #51].

Option Explicit On 
Option Strict Off ' Using late binding.
Imports System
Imports EnvDTE
Imports System.Diagnostics
Public Module FormatCode
Private Const wdPasteDefault As Integer = 0
Private Const wdFormatFilteredHTML As Integer = 10
Private Const wdWebView As Integer = 6
Private m_text As String
Private m_thread As System.Threading.Thread
Sub FormatSourceCode( )
' Get the currently selected code snippet.
Dim selection As TextSelection = 
CType(DTE.ActiveDocument.Selection( ), TextSelection)
' Check that something is selected.
If selection.Text = " Then
MsgBox("No code selected!", MsgBoxStyle.Critical Or _
MsgBoxStyle.OKOnly, "Format Code")
Return
End If
' Create a temporary file.
Dim path As String = System.IO.Path.GetTempFileName( )
' Copy the selected code to clipboard (using VS.NET).
selection.Copy( )
' Instantiate a new Word document to 
' achieve HTML code formatting.
Dim oleDocument As Type = Type.GetTypeFromProgID("Word.Document")
Dim document As Object = Activator.CreateInstance(oleDocument)
document.ActiveWindow.Selection.PasteAndFormat(wdPasteDefault)
document.SaveAs(path, wdFormatFilteredHTML, False, ", True, ", _
False, False, False, False, False)
document.Close( )
document = Nothing
oleDocument = Nothing
' Open a new instance of Word.
Dim oleApplication As Type = _
Type.GetTypeFromProgID("Word.Application")
Dim application As Object = _
Activator.CreateInstance(oleApplication)
' Open the temporary document.
document = application.Documents.Open(path)
' Switch to the WebView mode within Word.
document.ActiveWindow.View.Type = wdWebView
' Select the whole document.
document.ActiveWindow.Selection.WholeStory( )
' Copy it to the clipboard.
document.ActiveWindow.Selection.Copy( )
' Close the document.
document.Close( )
document = Nothing
application = Nothing
oleApplication = Nothing
' Cleanup after ourselves.
IO.File.Delete(path)
End Sub
End Module

After you have added and saved this macro, you can then select a piece of text in the code editor and then double-click on this macro. You will see the hourglass for a couple of moments, the macro has to open Microsoft Word, which takes a few seconds. When the hourglass goes away, you will have the formatted HTML code in your clipboard. You can then go to your favorite blogging tool and paste the HTML directly into that tool. This macro works by copying the code from Word. This means that, when you paste the code, it has to be into an application that will understand the rich formatting. For instance, pasting this into the design view of a richtextbox will work perfectly; pasting into Notepad will not work.

13.6.2. Convert to HTML with an Add-in

Another way to get from code to HTML is through the use of a freely available add-in called CopySourceAsHTML. First, you will need to download and install the add-in. It can be downloaded from http://www.jtleigh.com/CopySourceAsHTML.

After downloading and installing the add-in, you will see a new item on the right-click menu called Copy Source as HTML. You can select text in Visual Studio and then click this item on the right-click menu. You will then see the dialog shown in Figure 13-15.

Using this dialog, you first select what type of language code you are copying, either C#, VB, or HTML/XML/ASPX. You can also configure the following options:

You can set whether the HTML should include line numbers and, if so, what number the add-in should start from.

This option allows you to turn on line coloring, similar to what you might find in a report in which every other line is colored to make it easier to read.

This option determines whether the add-in will embed its stylesheet in the document or reference an external stylesheet. If you are posting a large number of snippets, it might make sense to not include the stylesheet and instead reference one copy of it.

Since HTML treats tabs as whitespace, the add-in has to convert all of those tabs to spaces; this option determines how many spaces should replace each tab.

After you click the OK button, the HTML formatted text will be copied to your clipboard. You can then turn around and paste it into your blogging tool.

Both of these solutions are great ways to get the color formatting of Visual Studio out of the application and onto your web log.