Framer Studio editor improvements

[koenbok]

I'm working on a bunch of editor issues and I wanted to track and discuss them here. Please remember that a lot of editor features are personal preference so for efficiency sake I'm going to default to Sublime behaviour by default (please discuss instances where you think there is a good reason to deviate).

Shortlist

• [x] Check missing autocomplete words
• [x] Improve code highlighting (more like on the site, ->)
• [x] Fix moveWordLeft/Right text expansion
• [ ] Shift tab should also outdent (just like cmd-[)
• [x] Fix more "Script error" instances
• [x] Make the gutter numbers more reliable
• [x] Improve text coloring on scrolling
• [x] Perf (convert to ARC, get latest updates)
• [x] Fix deleteWordBackward

Wontfix

• No default selection in autocomplete (both Sublime and XCode do this, I added option-enter to ignore)
• More advanced expand/unexpand behaviour with shift. Sublime keeps showing the caret on selection so you can grow/shrink a selection with option-shift-left/right

Hardtofix (big features/ideas)

• Code folding
• Handling multiple files
• Multiple selection editing
• Tabs to spaces (and reverse)

[koenbok]

I bet @uxdiogenes has some comments here :-) Ping.

[uxdiogenes]

Hah, like 90% of mine are issues with CMD+arrows, CMD+shift+arrows, alt+arrows, and alt+shift+arrows. e.g. (let's say | is the cursor, and underscores before the text is actually spaces):

___home|.visible Alt+shift+Left arrow should select to ___|home|.visible, instead it |___home|.visible

[koenbok]

Yes that is fixed in the upcoming release.

[uxdiogenes]

Is that in release? I still got it. Also:

home.visible|.test Alt+shift+left arrow should select to home.|visible|.test, instead it home|.visible|.test

[uxdiogenes]

___home|.visible CMD+Left arrow should move to ___|home.visible, instead it moves to |___home.visible

___home|.visible CMD+shift+Left arrow should select to ___|home.visible, instead it selects to |___home|.visible

[koenbok]

No I still have to ship it :-)

First one is fixed, second one is hard because _ is a word character as in you want this to work:

my_home|.visible CMD+Left arrow |my_home|.visible

[uxdiogenes]

Sorry, that's confusing, I used underscores because github was making my spaces look like they disappeared. Pretend those ___ prefixes are actually spaces or tabs.

[koenbok]

Ah yes, then fixed :-)

[uxdiogenes]

Well then! Awesome. We'll see if more comes up after the next release :).

[koenbok]

Don't suggest the same word with different caps:

[tehfailsafe]

New to framer studio, but one thing that keeps tripping me up is duplicating closing elements like ) or ". For example when I write method arguments, pressing ( generates () for me like sublime, but when I try to close it using ) I end up with ()).

[koenbok]

You can disable this under View > Insert Closing Character.

[uxdiogenes]

One thing that is nice about how sublime handles that situation is that it will prevent the insertion of the duplicate closing character if the cursor is on the left side of it.

[tehfailsafe]

Got it, disabled for now, thanks!

Last one that is pretty minor is cmd-enter creating a new line without breaking the current line. Is that an option I missed somewhere as well?

[peteschaffner]

@tehfailsafe You can get that behavior in FS (and most native text views on OS X) by adding the following lines to ~/Library/KeyBindings/DefaultKeyBinding.dict:

// Insert and move to blank line below (Command Enter)
"@\U000D" = (moveToEndOfParagraph:, insertNewline:);
// Insert and move to blank line above (Command Shift Enter)
"@$\U000D" = (moveToBeginningOfParagraph:, moveLeft:, insertNewline:);

[koenbok]

Dang, I did not even know about this.

[edchao]

Adding to the list. I would love to have dragging an image into the visual panel paste the code snippet at the location where my cursor is currently at rest.

ps. code folding still my #1!

[jordandobson]

Yes. Code folding I really need that quite a bit. On Wed, Jan 13, 2016 at 3:25 PM Ed Chao [email protected] wrote:

Adding to the list. I would love to have dragging an image into the visual panel paste the code snippet at the location where my cursor is currently at rest.

ps. code folding still my #1 https://github.com/koenbok/Framer/issues/1!

— Reply to this email directly or view it on GitHub https://github.com/koenbok/Framer/issues/175#issuecomment-171470297.

[tehfailsafe]

On top of folding, has anyone tried setting up a build process like webpack to watch files and re-bundle framer.js? Modules are awesome and I'd love to see live code updates from atom directly inside of studio by simply starting an npm script or something.

[jornvandijk]

We have some ideas around code folding. We'll start working on those after we land the next big studio release. If you have implementation ideas too, let me know.

[molavec]

Hi. In framer, I use a lot copy paste more than make functions getting a code more easy to find where change it (Folding helps a lot top keep clear code). I could be awesome that include Expand Selection to Word (cmd+D) functionality. It is faster than "Find/replace".

Thanks

[molavec]

Another thing is include Camel Case recognition with Alt + Back Arrow and Alt + Forward Arrow

[IanBellomy]

Curious about this: "wontfix: More advanced expand/unexpand behaviour with shift. Sublime keeps showing the caret on selection so you can grow/shrink a selection with option-shift-left/right"

Do that refer to :

Cat.food|.taste()

Shift+Option+left: Cat.|food|.taste()

Shift+Option+left: |Cat.food|.taste()

Shift+Option+right: |Cat.food.taste|() opposed to Cat.|food|.taste()

Is the existing behavior preferred? I don't think I've encountered it before (Sublime and elsewhere) and it throws me all the time; makes an accidental over-selection un-undoable.