Extending Selection Embedding with CodeRush

In my last post, I showed you around some of the Selection Embeddings that ship with CodeRush. 

Like many CodeRush features, Selection Embeddings are user extensible. In this post I’m going to show you around the options for Selection Embedding and how you can make your own custom Selection Embeddings.

As an Example:

Let’s imagine you have some text in a HTML file that looks like this…

… and that you’d like to have it look like this

That’s the Selection Embedding we’re going to create.

Options

In order to create or alter a Selection Embedding, you need to access the corresponding options page.

• Press Ctrl+Shift+Alt+O and the Options screen will appear.
• Select Editor \ Selections \ Embedding from the tree of pages on the left.

You will be presented with the Selection Embedding configuration page.

Ensure you have the correct language settings for the file you want to target. This dropdown is at the bottom of the page.

Since this time we’re going to create a HTML Selection Embedding, we’ll select HTML from the language drop down.

Next press the green plus symbol at the top left of the page. You’ll be presented with a template for a new Selection Embedding.

Let’s walk through the various parts of configuring your new selection embedding available on this page.

Naming

The Caption field represents the text value which you will see on the Code \ Embed Selection submenu.

The Name field is used if you wish to bind the embedding to a shortcut later on.

Set the Name and Caption of our embedding to ‘Unordered List ‘

Style offers 5 alternate styles of selection embedding.

With Style 1 you are able to enter text for the Top, Bottom, Left and Right of your selection.

• Text entered for left and right will be repeated for each line of your selection.
• Text entered for Top and Bottom, will be added above and below your selection.

In Style 2 you are able to enter text for the Top and Bottom of your selection.

• Text entered for Top and Bottom, will be added above and below your selection .

In Style 3 you are able to enter text for the Left and Right of your selection.

• Text entered for Left and Right will be repeated for each line of your selection.

In Style 4 things change a little:

• The Top Text is moved to the Left of the Top line of your selection replacing the Left text from Style 3 and Style 1.
• The Bottom text is moved to the Right of the Bottom line of your selection replacing the Right text from Style 3 and Style 1.
• Note how text which will appear in the Bottom Left and Top Right sections, is copied in the screenshot from the appropriate Middle Line text.

Style 5

In Style 5

Set the Style of our Selection Embedding to ‘Style 1’

Text Options

If you select a style with Left and Right Text (any style except Style 2) then the following set of options will be enabled

These options specify where you would like the Left and Right text to be placed relative to the selection they wrap. Experiment with these and see what a difference they can make to your Embeddings.

In our case choose ‘Start of code’ and ‘End of code’ respectively.

The last options allow you to enter TextCommands and StringProviders into your Embedding to produce numerous effects when the expansion happens.

We don’t need these options for our selection embedding, but it’s worth knowing they’re here.

The last part of the configuration is the most important. You need to specify the various pieces of text that will surround your selection.

You’re fully configured Selection Embedding, should look something like this:

Click Ok, and you’re done.

Once you have completed the previous steps, all you have to do is

• Select your text
  
  
• Hit your CodeRush\Refactor key and Select Unordered List from the Embedding menu.
  

and CodeRush does the rest.

As I’ve stated many times before. One of the best features of CodeRush is it’s extensibility. If the features don’t ship out of the box just the way you like them, you can adjust, configure and augment to your hearts content.

Feel free to share any custom Selection Embedding ideas in the comments below.