guywaldman/vscode-prismo

Visual Studio Code plugin to beautify your titles, sections and separators.

Prismo for VSCode

Visual Studio Code extension to beautify your titles, sections and separators.

Marketplace | GitHub

---

Motivation

Prismo is a small, lightweight extension with a very simple premise: it offers assistance in separating your source code into convenient, structured sections.

I like neat and clean source code. Generally, decorated titles in source code (as pretty as they may be) can be obtrusive and even sometimes obnoxious to work with for other developers skimming through your code in the future.

However, in some cases, well-placed titles can add structure to your source code (especially on projects where large files cannot be avoided). This is where Prismo shines.

You may be familiar with my previous plugins that achieved similar goals - AutoSect for Atom and Prismo for vim.

Note: full-width spanning titles can be obtrusive and are recommended to be used with caution. In some instances, in my opinion, they can be helpful. An option to configure the width on all title variations is available as width (0 for full width).

Features

• Can comment out a line or several lines into a title
• Formatting is highly configurable (width, dash, format, casing) , and is available in three variations (normal, light, hair)
• Commenting format can be user-defined
• Ability to add regions by selection
• For languages not registered by VSCode by default (read: language identifiers), the user will specify the format of their choosing

Features to be Added

• Ability to configure, for each level, whether the width should be absolute or relative (and take indentation into consideration)
• Ability to configure, for each level, whether the title should be padded on the left and whether the title should be padded on the right
• Decorations?

Top-Level Configuration

prismo.commentPatterns

This is a top-level configuration object containing a mapping of a language identifier to its respective commenting pattern, with the title represented by %s. For example, a row containing hello world and the commenting pattern #%s# could be commented like so: # --- hello world --- #. For a language not existing in the extension's presets, the user will have to input the appropriate commenting pattern and it will be saved in this object.

Example configuration:

{
  "python": "#%s",
  "javascript": "//%s"
}

Level-specific Configuration

There are three variations/levels:

• Normal: This title is the regular title you would get when calling > Prismo: Decorate Title. By default, it spans across the entire document and should be used for top-level separation.
• Light + Hair: These title variations are for subtitles.

You can customize the configurations per level, meaning prismo.normal contains the configurations for the top-level titles and prismo.light and prismo.hair contain the same types of options.

prismo.normal, prismo.light and prismo.hair are all objects containing the following properties:

• dash (string): Type of dash decorating the title, i.e. - -> --- TITLE --- or ~ -> ~~~ TITLE ---
• padding (number): Length of the padding surrounding the title text.
• shouldUppercase (boolean): Whether the title should be uppercased.
• width (number): Width of the title.

However, they have different defaults.

Default Configurations Per Level

• prismo.normal:

  • dash: "-"
  • padding: 1
  • shouldUppercase: true
  • width: 0 (full width)

• prismo.light:

  Same as prismo.normal, except:

  • width: 40
  • shouldUppercase: false

• prismo.hair:

  Same as prismo.normal, except:

  • width: 30
  • shouldUppercase: false

Regions

Use Prismo -> Regionize to add regions to your source code. Similarly to comments, it draws its patterns from prismo.regionPatterns configuration.

Is planned to be more configurable in the future.

vscode-prismo's Issues

full width doesn't work if returned ruler width value is 0

was totally sold on the full width section thing when i saw the screenshot

didn't work out of the box though, the ruler width was zero so the math was off.
looked into it and saw you're returning the first value from the ruler positions array
i changed it to make sure the value is not zero, opened a pr #3

Feature Request: Colored Titles

The user will be able to configure colors for their titles (similarly to the todo-highlight extension).

The pattern could possibly be similar to: <dash><padding><title<padding><dash>

Feature: Region Sectioning

VSCode, among other code editors, allows the use of region for folding.

The user will be able to execute a command for selecting multiple lines, entering the desired title, and adding comments for making it a region.

i.e. selecting:

const obj = { foo: 'bar' }
console.log(obj.foo)

and entering myTitle would replace the selected lines into something like:

// ------- myTitle -------

//#region myTitle
const obj = { foo: 'bar' }
console.log(obj.foo)
//#endregion myTitle