Move Cursor Using the init.coffee


#1

Hey,
So, I have a simple command for entering the tag in html. Something like this

'custom:inserthtml': ->
  atom.workspace.getActiveTextEditor()?.insertText('<code></code>')

I have mapped this to ‘Ctrl+x’. However, what i was wanting to do now was have Ctrl+X enter and move the cursor to the middle of both tags so i could just start typing what i wanted to type. Is this possible?


#2

Yes, it’s possible. However, snippets already do what you want to do. A snippet <a href="$1">$2</a> will place the cursor on $1 the first time you press tab, then $2. Do you have a particular reason why you want to override the cut key?


#3

Sorry. Messed up there. I meant Alt+X. No specific reason to override the cut key. However, it would be fairly useful to use Alt-X since its an easy shortcut key for me.

I am fairly new to all this and just want to create a and then move to the middle of it. I haven’t modified atom before so it would be cool if you could point me as to how i would go about it.

I am however, gonna take a look at snippets and figure out how that words but would love your advice regardless. Thanks.


#4

I was dumb. You don’t actually have to make a snippet unless you want something special, because Atom’s autocomplete does it already. Just type a and then tab or enter. Then you can press tab again to put the cursor between the tags. But I’ll explain snippets to you because it’s a powerful tool for automation.

To make the snippet I posted (say you want all the links on your site to open in new windows), this is what you need to add to your snippets file (you can get to it via the menu or the snippets.cson file in your .atom folder):

".text.html":
  "Anchor":
    prefix: "a"
    body: "<a href=\"$1\" target=\"_blank\">$2</a>"

Since you’re new to this, I’ll break down how to read that. Indentation matters a lot in CoffeeScript. The unindented text is the “root” of the object, and represents a scope in the TextEditor (written here and in many places just like you write classes in CSS, so that’s easy). The text on the left of the colon is called the key, and the text on the right is the value. When a key is by itself and indented text follows, then everything on that next level of indentation is the value. You can have many different snippets under the same scope, as long as they have unique titles. The first indented line is the title of the snippet, which should be unique within that scope. The prefix is what you start typing, and the body is what it expands to when you’re finished. With that snippet, I can type a-tab and it expands to whatever’s in the body, in this case, <a href="" target="_blank"></a>, with the cursor between the first two quotes. Take care to escape any quotes inside quotes in your code files; the color coding will let you know that something is off.

The dollar signs are one of the best parts of snippets, because each press of the tab key moves the cursor to the next one. You can fill out a form only navigating with one key, which is great.

Here’s the manual page on snippets.


#5

Thanks mate, This truly helps. It seems really awesome right now and i am gonna try to get it to work. Hopefully all goes well.