Announce: The Box-Edit package


#1

From the readme …

box-edit

An Atom package to edit rectangular areas; supports short lines.

box-edit-demo

Box-edit provides for selecting and editing a box (rectangular area) of text in the Atom editor. When in box mode the Atom cursors disappear and a new red box cursor takes over. You can cut, paste, insert, etc., on a box instead of character strings. Box-edit supports virtual spaces to the right of lines which solves a problem found in rectangular selection tools that use Atom cursors/selections.

Features

  • A box can be selected, cut, and pasted anywhere, even to the right of lines.
  • Supports wrapped lines properly.
  • The box can be filled with any character, such as a space, to blank an area.
  • The box mode supports basic editor commands such as cut, copy, paste, and undo/redo.
  • A box can be turned into a character-based editor (an html textarea) which allows typing wrapped text into a rectangle. Useful for comments to the right of multiple lines.
  • When opening a box, Atom cursors are converted into a box, and when closing the box it is converted back into Atom selections. So by switching back and forth you can create Atom cursor-based rectangles like other packages do.

Usage

Installation Install box-edit using apm install box-edit.

Entering/Exiting Box Mode The command to toggle box mode on and off is box-edit:toggle which by default is bound to Alt-S. You can tell you are in box mode when the Atom selections disappear and a red box appears (unless it is outside of the visible area). The mouse cursor changes into a cross-hair.

Selecting When in box mode you can create a box by clicking and dragging the mouse. The box will be shown as a red rectangle. The support of arrow keys is planned for the future. You may select anywhere in the editor pane including to the right of line endings.

Single Clicking If you click without dragging then a zero-width box will be created. This is useful before inserting a box. You can also extend it to a bigger box using shift-click.

Extending Selection Shift-click will move the second corner of a box to the new point. This allows extending/shrinking a selection. If you wish to create a box that is taller/wider than the current screen then you must select one corner with a single-click, scroll the pane, and then shift-click to set the second corner.

Atom Selection Matching When you enter box-mode a new box will be created that surrounds all existing Atom selections. When exiting box mode the box will be converted into multiple Atom selections that match the box. This makes it easy to toggle back and forth while keeping the selection.

Rectangular Atom Selections If you enter box mode, select a box inside of text, and exit, you will have created a rectangular selection of Atom cursors. This mimics other Atom rectangular selection tools.

Selecting End Of Lines You can put Atom cursors at the end of multiple lines by entering box mode, creating an empty box past the end of the lines, and exiting box mode.

Box Editing You can perform rectangular editing without leaving box mode. The following commands are supported in box mode. At this time you cannot customize these bindings.

  • Any Unicode Character: Fill the box with the character.
  • Ctrl-C: Copy the enclosed text into the clipboard as lines.
  • Backspace or Delete: Delete the enclosed text and collapse the box.
  • Ctrl-X: Copy the text and then delete it.
  • Ctrl-V: Delete the text and insert the clipboard text. The box will change width to match the longest line.
  • Ctrl-A: Surround the entire editing area with the box.
  • Ctrl-Z: Undo the last edit. Can only go back to when box mode was entered.
  • Ctrl-Y: Redo an edit.
  • Enter: Replace the red box with a green one that allows entering and editing wrapped text in a rectangle. Uses an html textarea element.
  • Escape or Tab: If editing text in a green box then close the editor and go back to the red box. If in normal red box mode then exit box mode altogether.
  • Alt-S: The command box-edit:toggle (not necessarily Alt-S) will close box mode. It is useful in some situations to enter and exit quickly so pressing this key combo twice is an easy way to do it.

Status: Beta

This has been used in my personal editor for a short while. Use with caution. Reports of satisfaction, good and bad, would be appreciated. Email mark@hahnca.com or post problem reports to the issues section of https://github.com/mark-hahn/box-edit.

Known Problems:

  • After exiting box mode the cursor doesn’t change back until the mouse moves.
    (apparently this is a chrome bug, a lot of people complain)

To-Do

  • Add arrow-key support to allow keyboard-only selecting and editing.

License

Copyright Mark Hahn using the MIT license


Vertical text selection
Multiple Selections
#2

Atom doesn’t do this out of the box?! I really want to like atom but it’s very immature in it’s current state. Perhaps it will surpass Sublime Text some day but I don’t see that happening anytime soon. One way atom could improve upon st would be to have some sort of approval system for packages. The goal being to limit the duplicates. I already see this as becoming a mess. Users want to install a feature not deal with 20 packages that all do similar things.


#3

The core editor will probably never surpass sublime, but the editor combined with the community packages definitely will, maybe within a year or so. Atom 1.0 is only months old.

Sublime was not designed to be built on plugins. They are just add-ons. Atom is designed from the ground up to use packages. I know finding good packages is a pain, think NPM, but the work to find them will be worth it. Atom will evolve over time. Much faster than sublime will.


#4

Oh, btw, Sublime doesn’t offer anything near what this package does. Check it out.


#5

Months? Is that accurate? Surely not…


#6

It depends on where you count from. If you’re counting from v1.0, then yes, he’s correct, Atom is less than 5 months old at the time of this writing. If you count from the moment code was first typed, then Atom is years old.


#7

Out of the box, it does the “reverse”, ie. you can make a rectangular selection with the keyboard, not with the mouse.
Therefore, as you mentioned, there are several packages addressing this need. Which is a bit confusing… You need to read the descriptions attentively to see if the features fit you, and perhaps to give packages a try (avoid conflicts!).
This one seems interesting…


#8

Hi, I like this box-mode alot. Its nearly what I looked for, because I am looking for a replacement of nedit.

Do you know the rectangular working with nedit? I would like to get alle features included in box-mode.

Here is what nedit can do. I made a video to show the effect. Very handy is copy/paste just with mouse by dragging the copied box to another place.

What do I mean with “rectangular block editing”?

So C+LM = Ctrl (Strg on german Keyboard) and Left Mouse button for marking.

Within nedit, it exists very powerfull features with this marked block.
After with C+LM a block of the text is marked, you can

  • move the block with just MM (Middle Mouse) without keyboard
    and move away text which was at the target position of the movement
    press MM and move the text and release it to stop moving.

  • move the block with C+MM and replace the text which was at
    the position where you move th block to. The block at the
    origin gets replaced by white spaces.

  • copy the block with CS+MM (Ctrl+Shift+MiddleMouse) and replace the
    text which was at the position where you move the block to. The
    block at the origin stays the same, so really copy no deletion.

This is really powerfull and because we often edit large text-files,
where the data is aranged in column order, it is often used by us.

To show the capabilities of nedit I created a short 2min screencast with nedit and uploaded it ot youtube:

Alexander Bruns


Nedit like rectangular text editing
#9

Great tool. Thank you.

Additional feature suggestion: when typing chars, in case the width of the box is zero, it could insert a new column at the box position, filled with the typed char. This way, you could have the equivalent of a big vertical cursor that allows you to type text in multiple lines at the same time. A bit like what visual studio/eclipse/notepad++/etc… offer with their box selection modes.


#10

you could have the equivalent of a big vertical cursor

If you draw the box zero-width and then hit escape you do get that.


#11

Indeed… I didn’t notice this feature. Perfect! Your package fills every and each of my requirements. Thanks again.