Gabe Sumner

Gabe Sumner

The RSS Feed URL cannot be found!
The remote server returned an error: (400) Bad Request.

Sitefinity "Format Code" Control

Posting code samples on web pages sucks.  Much of the nice formatting that makes code readable gets completely lost when you toss it into HTML.  What you end up with looks like modem line noise.

To combat this, I wanted to create a Sitefinity control that would easily allow me to post nicely formatted code samples to my web pages.  This ended up becoming a fairly complex project. 

First a bit about Sitefinity Control Designers.

This control uses a Sitefinity Control Designer to create a user friendly interface for updating the control.  If you want to understand Control Designers, then you should probably take a look at:

  • "The Sitefinity Developer's Manual" that comes with Sitefinity.
  • This thread on the Sitefinity Forums.

Control Designers aren't the easiest thing to get your head around.  To implement them, in conjuction with User Controls, you are looking at about 5 different files.  Here is a brief overview:

  • The UserControl - in this case this would be my FormatCode.ascx file and its associated FormatCode.cs codebehind file.  This is the actual user control that gets dragged & dropped onto a Sitefinity page. 
  • The Base Class for the UserControl - the UserControl has to inherit from this class.  This class is stored in the "App_Code" folder.  It gets compiled, referenced, and inherited.
  • The Control Designer - this is where all the Control Designer work gets done.  It handles presetting the fields and saving the properties.
  • The Control Designer Template - this is the template that contains the HTML and ASP.NET controls used for displaying the Control Designer.
  • The Control Designer Stylesheets - don't underestimate this thing.  By the time you get started you have many layers of Sitefinity stylesheets being applied to you.  Very little looked or worked like I expected. 

Sitefinity Control Designers are, in my opinion, a bit more complicated than they need to be.  I can't completely offer you an explaination into why all this stuff is needed.  Based on my experience, this is as simple as it gets though. 

How does Format Code work?

I have to give credit to Jean-Claude Manoli for creating the code that handles creating the HTML to display the nice formatted code.  You can get more information at the following link:  http://manoli.net/csharpformat/   Everything I have done here simply involves wrapping this CSharpFormat class.   

What does Format Code display?

Here is what the Format Code control does:

using System;
using System.Configuration;
using System.Text.RegularExpressions;
using System.Web;
using System.Web.UI;
using Telerik.Framework.Web.Design;
 
namespace GoonDocks.ControlBases
{
    [ControlDesigner("GoonDocks.Admin.ControlDesigners.FormatCodeControlDesigner, App_Code")]
    public class FormatCodeBase : UserControl
    {
        private string code = "";
        private string codeType = "c#";
        
        /// <summary>
        /// The actual source code.
        /// </summary>
        public string Code
        {
            get
            {
                return code;
            }
            set
            {
                code = value;
            }
        }
 
        /// <summary>
        /// The type of code we are storing (example: ASPX, C#, etc)
        /// </summary>
        public string CodeType
        {
            get
            {
                return codeType;
            }
            set
            {
                codeType = value;
            }
        }
 
        /// <summary>
        /// The method encodes plain text code for storage by Sitefinity.  Sitefinity
        /// only has the ability to save one line.  If there are line breaks then 
        /// they will be stripped when saved.  This will result in our code getting 
        /// screwed up when it gets saved.  This method encodes the string in a way 
        /// that our line breaks get retained.  When this property is fetched by
        /// Sitefinity we will need to Decode() the string so that we get our line
        /// breaks back.  Good times huh?
        /// </summary>
        /// <param name="newCode">The plain text code string.</param>
        public void Encode(string newCode)
        {
            string tempcode = newCode;
            tempcode = Regex.Replace(tempcode, @"&", "&amp;");
            
            // &r; and &n; is meaningless, in an HTML context.
            tempcode = Regex.Replace(tempcode, @"\r", "&r;");
            tempcode = Regex.Replace(tempcode, @"\n", "&n;");
            Code = tempcode;
        }
 
        /// <summary>
        /// This method decodes encoded code that is stored by Sitefinity.  Sitefinity
        /// is only able to save 1 line of text.  Line breaks get removed when a string
        /// property is stored by Sitefinity.  I'm encoding these strings before giving
        /// them to Sitefinity so that I can retain the line break.  When the strings
        /// are retrieved I have to Decode() them to get the line breaks back.
        /// </summary>
        /// <returns>Returns the Decoded string with line-breaks back in place</returns>
        public string Decode()
        {
            string tempcode = Code;
 
            // &r; and &n; is meaningless, in an HTML context.
            tempcode = Regex.Replace(tempcode, @"&r;", "\r");
            tempcode = Regex.Replace(tempcode, @"&n;", "\n");
            tempcode = Regex.Replace(tempcode, @"&amp;", "&");
            return tempcode;
        }
    }
}

Where can I download this control & the code?

I'm making all of my code available in the GoonDocks Sitefinity Controls.  Feel free to download, use, and abuse.


HostMySite.com   website uptime