Bike 2.0 (Preview 235)

[jessegrosjean]

• Improved block quote styling
• Improved block selection styling
• Changed mergeDistance style property to mergable
• Fixed crash when Option-Return in line with spaces
• Fixed editor.transaction API to return result of passed closure
• Fixed block selection to show selection for all rows, not just ends

Lots of work on styling internals that enables new rounded styles for block selection and blockquote rows. Also refined decoration animations to stay in better sync with text content.

Download:

• Downloads
• Extensions API
• Known Bugs

[jessegrosjean]

Here’s an experimental style demo that uses new mergable for rows:

Jesse Grosjean (@jessegrosjean@mastodon.social)

[complexpoint]

Pleasingly quietened and organic feel to the indenting edge of multiple row selections

( one left edge rather than many – less distracting to the eye )

( wouldn’t have occurred to me )

[jessegrosjean]

@complexpoint

one left edge rather than many – less distracting to the eye

Yeah, just a demo at this point, but I’ve always wondered what it would feel like to highlight the outline structure this way in a full theme. Block selection now gives a somewhat similar effect in the default theme. Highlights the outline structure much more then before I think.

Core style rule to enable this effect is:

row(`.*`, (editor, row) => {
  row.padding = new Insets(0, 0, 0, 28)
  row.text.padding = new Insets(5, 5, 5, 5)
  row.decoration('background', (background, layout) => {
    background.anchor.x = 0
    background.anchor.y = 0
    background.x = layout.leadingContent
    background.y = layout.top
    background.width = layout.width.offset(layout.leadingContent.scale(-1))
    background.height = layout.text.bottom.minus(layout.top).offset(row.text.margin.bottom)
    background.color = Color.systemGreen().withFraction(0.7, Color.black())
    background.corners.radius = 6
    background.mergable = true
    background.zPosition = -2
  })
})

[Gorgonzola]

Haven’t yet tested things extensively, but just a little feedback:

• Maybe would be nicer to have row highlighting without those lines in between by default?

• ⌃+O is a system command that usually splits the line at the cursor but keeps the caret in the original row. In Bike 2.0 it does something strange, it adds a new empty row beneath the current one (without splitting it), and then snaps the cursor to the end of the original row. This seems to work fine in Bike 1.0.
• I don’t quite see the difference between ⌘+Return and ⌥+Return. Seems like they do the same thing, which is to trigger New row command?

[jessegrosjean]

@Gorgonzola

Maybe would be nicer to have row highlighting without those lines in between by default?

There are a few reasons that I like them at the moment:

1. I want to show distinction between text and block mode. They help make it clear that you are in block mode… selecting entire rows.
2. The line border in general makes it possible to have a lighter selection color, while still allowing the selection to be distinct and easily visible.
3. Maybe most important … not possible in current implementation to have line border, but no internal borders, for row level decorations… but even so I think I would still keep them for reason #1

Reserver the right to change my mind at any point!

It is possible to just turn the border lines off (if you have bike-extension-kit installed) by modifying the default bike-style.ts style like this:

...
style.layer('selection', (row, run, caret, viewport, include) => {
  row(`.selection() = block`, (editor, row) => {
    let values = computeValues(editor)
    row.decoration('selection', (background, layout) => {
      ...
      // background.border.color = values.selectionColor
      background.border.color = Color.none()

@Gorgonzola

• ⌃+O is a system command that usually splits the line at the cursor but keeps the caret in the original row. In Bike 2.0 it does something strange, it adds a new empty row beneath the current one (without splitting it), and then snaps the cursor to the end of the original row. This seems to work fine in Bike 1.0.

Thanks, fixed for next release.

@Gorgonzola

I don’t quite see the difference between ⌘+Return and ⌥+Return. Seems like they do the same thing, which is to trigger New row command?

They will be different in next release. There is a core cocoa command insertNewlineIgnoringFieldEditor that is trigged by system in both Control+O and Option+Return cases. I had implemented that command as “New Row”, but I now see it’s generally supposed to work just like insertNewLine in non-field text editors.

In my current option this option looks good too, but I like the lines version a little better.

I still need to revisit all the keybindings for splitting/inserting rows in Bike 2.0, but I’ve at least fixed the above issues for next release.

[complexpoint]

Not sure whether you are planning this for Bike 2 osascript (or the extension kit ?),
but I do enjoy the document.showTitleBar boolean property in the Bike 1 interface.

FWIW it enables me to toggle a working outline into a zero-distraction form, with even the titlebar hidden (while for example, the working Bike file is positioned full hight in the central 50% of the screen width, and background is hidden by something like the HazeOver app )

[complexpoint]

Possibly by design, but I noticed myself doing a brief double-take in the Bike 2 (235) View menu options (expecting but not seeing Hide) for the Inspector.

Whereas the Sidebar option toggles:

View > Show Sidebar ⇄ View >HideSidebar

the two toggle states for the Inspector share the same label (Show but no Hide)

View > Show Inspector ⇄ View > Show Inspector

[jessegrosjean]

Thanks, I’ve fixed menu label for next release.

I need to think more about showTitleBar. I mostly added that for making screencasts, since it breaks a lot of standard UI. I might add for same purpose in same way again, or I might try to build something similar that’s a little more designed for daily use. Not ready to think much about that yet, but keep letting me know you want it

[complexpoint]

@jessegrosjean

it breaks a lot of standard UI

Understood.

( I’ve found it useful, but perhaps it’s not worth a highish cost like that )

[jessegrosjean]

@complexpoint

( I’ve found it useful, but perhaps it’s not worth a highish cost like that )

It’s not so much the cost, but that particular implementation is difficult to make generally useful.

I have been thinking of adding a new button to the menu bar for easier on/off click management of the sidebar/inspector/statusbar. Clicking the button would show a popover. Looking a bit like the popover you see when you mouse over the green button in standard windows now.

Maybe some sort of focus toggle could show in that popover. It wouldn’t be quite “hide entire menu bar”, but it could tweek things, such as make it transparent, hide most of the buttons, etc.

Haven’t started any implementation, but that’s what I think I would like instead. If I don’t get to it, I’ll probably add back the script property, might still add it back, but not for next release anyway