Fast Code Creation and Formatting with Non-Code Editors

01/05/2017 by Chris Toohey

Disclaimer

This isn't a tip or trick that I would normally share, but I was doing a screenshare recently while helping someone with code and this technique garnered a "wow - I never thought to do that!" So if they've never considered it, perhaps you haven't either.

Am I absolutely certain there's a cleaner, faster way of doing this? Sure. Will I be shocked if someone comments that a particular keyboard combination that I'm honestly too busy coding / too lazy to lookup will remove one or more steps from this technique? Awesome, please share with the rest of the class!

Am I hoping this simple example gets your thinking about how you can more easily spin your code? That's the real goal here: taking a technique and applying the "I don't have to live in the IDE" of it against your task list.

At the end of the day, that's what I'm ultimately shooting for here...

OK, now that I've covered the "Um... seriously?" reactions and adequately downplayed this topic, let's cover this technique!

Use Case

For an IBM Domino XPages application that I'm working on, I have a simple SSJS function that builds all of the keywords for the various dropdowns across my forms, views, and anywhere a list of label|value options are needed. This SSJS function -- getItemOptions() -- creates a blank array and uses the key argument which is evaluated via a JavaScript Switch statement to get the given contents for that array. Simply put, I hit the correct match for key, and I push label|value options into that to-be-returned array (rArray). By default, I sort my rArray and quickly add a "blank" first-value via rArray.unshift("|"). If I don't want to sort/unshift, I simply force a return rArray(); from within my switch.

Here's an example of the getItemOptions() function:

A few things to point out in the above example:

1. You don't need the uiDoc stuff. That's more of a standard that I throw in based on my particular needs in the app I copied this code from.
2. The reference to utilities.wrapNotesDocument() on Line 10 calls this OpenNTF XSnippet which - along with other useful snippets - I've added to an "utilities" object literal function "library".
3. Yeah, this could be cleaner with better recycling for that "record-type" case starting on Line 27. It's an abstracted, quick-and-dirty example.

... so that's all fine and good, but what's the point of this article?

Well, the formatting on those "piped" options is consistent, with rArray.push(" + whatever label + | + whatever value + ");, and it's easy enough to copy/paste/repeat per line if you're just doing 7 or so lines of options... but what if you were listing something relatively static (so it wouldn't be worth storing as a list / collection elsewhere) but lengthy enough to make this a painful process? Think of States in the US. You can grab an alphabetized list of all states in the US on Wikipedia, but manipulating that content to match your function format could be a time-consuming task.

-- and I have a simple technique that will drastically reduce that time.

Non-Code Editor Formatting

In order to keep everything on screen, I'm actually going to use a 7-line example.

... and to be completely honest with you, I did all of the screencaps before I thought of the 50 US States example, and really don't want to have to redo them.

So let's take a look at the various status values one of my example documents can have:

Application sidebar navigation displaying a list of statuses we can use for our options code.

So I'll copy my status keywords list directly from my sidebar navigation here, and open Microsoft Excel (or your spreadsheet editor of choice), and paste the plain text value from your clipboard into Columns B and D.

In cell A1, you'll add the following: rArray.push("

In cell C1, you'll add your pipe: |

In cell E1, you'll close the option: ");

Note: Microsoft Excel, et al, will try to help you here and most likely will strip that quotation character from the E1 cell since there's no apparent ending quotation character. You'll want to go back and add it/make sure it's there.

After you use AutoFill to make columns A, C, and E fill the rows length from your values from columns B and D, you'll have something that looks like this:

Status option rows in Microsoft Excel

Highlight your spreadsheet and copy the contents to your system clipboard. Then launch your preferred text editor. For this example, I'm using Notepad, but Notepad++, Sublime Text, and others will work just as well.

Raw / Unformatted code in Notepad

You'll notice that the pasted content from Excel kept it's column formatting by adding a horizontal tab character (ASCII 9, Unicode U+0009) between the columns of a given row. Our goal is to remove those tabs.

Selected tab character in Notepad

Simply highlight one of the tab characters and copy it to your system clipboard.

Replacing tab characters in Notepad with blank/null

Open the Replace dialog in your preferred text editor - Notepad, as shown, can be accessed via Ctrl+H - and paste the previously-copied tab character into the "Find what"/from field. Make sure the "Replace with"/to field is blank, and click "Replace All".

Clean formatted status options in Notepad

... and that's pretty much it.

You can now copy the contents of your text editor into your IDE (in this case, Domino Designer's SSJS Editor) and you're good to go!

Clean formatted status options in Domino Designer SSJS Editor

Conclusion

Now this sounds like an overly-complicated process... and if you had 3 options, it kinda is. But it's a lot faster quite frankly than writing those 7 lines our line-by-line. And it's perhaps even overly-complicated if you had to write our 50 US states as options matching this syntax.

Consider, however, how much of your code is repeated content with a few -- very minor -- variances.

Throwing the beginning chunk (Column A), a middle chunk (Column C), and a closing chunk (Column E) of code into your preferred spreadsheet app might just help you speed up your code creation and formatting. You shouldn't feel restricted to your IDE to create your code, markup, or whatever text-based content you're generating.

And who knows, perhaps you know Microsoft Excel well enough to create a simple template that you can paste a list of labels and values into and have it auto-format your code for you. That'd be something that could speed up your development, couldn't it??