On Chromium 35, the screen seems to be full-screen painting on a Cinema
Display every few frames, causing frame rates to drop from 60 to 30 when
autoscrolling with the cursor. Increasing the overdraw avoids this.
Previously, each editor observed font-related config values on its own
and applied inline styles to honor them. This made it difficult to style
the editor like a normal element with CSS.
Moving this to a global stylesheet that targets editors via the .editor
selector means that the font size setting can be overridden in specific
contexts, such as when using mini editors.
Previously, font styling was always explicitly assigned via the config.
This commit is the first step in basing the font styling of the editor
on the styles assigned via CSS. This will allow the editor's
font-family, font-size, and line-height to be assigned via CSS just like
they are for any other element, which will make it easier to style mini
editors.
We still need to switch the font settings to adjust a global stylesheet
rather than updating inline styles on each editor individually.
In 444c18be34, I stopped polling the DOM
when an update was pending to prevent delay of the next animation frame.
Unfortunately, we rely on synchronously polling the DOM when an editor
view is attached to perform the initial measurement of the default char
width, which is required to position the wrap guide.
In componentWillMount, observing the config was requesting an update,
causing us to skip this synchronous update at attachment time and
position the wrap guide wrong.
This prevents update requests that occur before mount from pausing the
polling that we perform on attachment, restoring correct function to the
wrap guide.
In Chrome 31, setImmediate was yielding better behavior. But now Chrome
35 seems to behave more smoothly when we use requestAnimationFrame, and
the delay for keystrokes is non-existent.
This prevents a flicker that occurred on theme changes when we just
detected this via polling. I'm going to leave the polling as a catch-all
in case the editor is styled inline in some way.
We sample both the background color of the editor and the gutter. If the
gutter has an actual background color, we use it. Otherwise we fall back
to the same background as the editor.
This ensures lines have an opaque background that matches whatever the
editor is styled as, but avoids the need to apply the .editor-colors
class to the .lines div. That approach fell down when people were
setting the background color via means other than .editor-colors, such
as styling mini editors via the .editor.mini selector in the settings
view.
Enable sync updates and manually invoke the pollDOM function on the
component when we call hide/show on the wrapper view. This ensures that
we perform initial measurements when showing the editor for the first
time.
Previously, these measurements were always performed when the editor
component was mounted. This didn't work in situations where the
component was mounted in a non-visible state. This commit includes a
visibility check in the resize polling we were already doing, kicking
off the measurement process as soon as the editor is visible.
This doesn't seem to adversely affect the scroll experience, and it's
much simpler. I want to avoid preventing the default action of
mousewheel events if they don't actually lead to scrolling, and making
the behavior synchronous will make that a lot easier.
This makes the actions that we perform in the poll loop explicit, and
will prevent the accumulation of polling-related behavior in the
::measureScrollView method.
This allows the line height to be styled via CSS. I would actually
like to allow all these properties to be assigned via CSS rather than
explicitly via the settings view, but that can be deferred until the
old editor is removed.
The goal is to make the editor behave like a standard block-level
element.
The horizontal behavior is simple: we stretch horizontally to fill our
container.
The vertical behavior is more nuanced. If an explicit height is assigned
on the wrapper view, we honor that height. But if no explicit height is
assigned, the editor stretches vertically so that its contents are
visible.
This prepares us to support mini editors, which need to be 1-line tall
without an explicit height assignment.
Previously, I was just remeasuring characters whenever the stylesheets
changed. I think there were situations in which the model changed, then
I remeasured characters prior to updating the view to match the model,
causing DOM exceptions. This switches the approach to only ever measure
characters after an update, ensuring the view always matches the model.