Commit Graph

287 Commits

Author SHA1 Message Date
Kaz Wesley
17152e4e00
Hotkey to display GPU debug info (#6188) 2023-04-04 12:32:16 +02:00
Paweł Grabarz
3fcbef35cf
do not override default shape alignment in macro (#6170) 2023-04-03 12:34:27 +02:00
Paweł Grabarz
18f7f03304
bump shader tools version and use distribution install by default (#6164)
Update shader tools to new version. Notably, this release contains spirv-cross with fixed issue https://github.com/KhronosGroup/SPIRV-Cross/issues/2129.

# Important Notes
Spirv-cross has no versioning that we could use to specify requirements for using system-wide installed versions. Instead, we have to download the prebuilt distribution by default, so we can rely on known good versions. The usage of binaries in PATH can still be enabled with a build flag, but it is discouraged due to severity of the bug and no easy way of detecting it. If the project is built with buggy shader tools version, the application will run, but it will be visually slightly broken in unexpected ways.
2023-04-01 13:04:36 +00:00
Paweł Grabarz
08f28998ab
remove content_origin property from layout (#6155)
Simplified layout algorithm by removing `content_origin`, and instead treating `(0.0, 0.0)` as origin point in every layout object. This change allows overflowing containers that are within auto-layout. The parent element will no longer be moved within the grid cell when its children overflow it.

![image](https://user-images.githubusercontent.com/919491/228926310-b0117570-9f83-4687-8f8c-3fc778ff7d3c.png)

# Important Notes
When implementing this change, I have found that when object's size was modified without ever touching its position, that change was not being picked up in the "modified children" list, and `on_updated` was never triggered. Because some sprites now are bottom-left aligned, that is now a common case and was reproducible on the auto-layout example scene. I ended up fixing it by introducing another dirty flag for `computed_size` changes. Right now that flag is applied very broadly (on each layout update), but in the future we might make it more precise by actually checking if the size was changed in the process.

I believe that this might also be a fix for #5095, as I cannot reproduce it anymore with those changes.
2023-04-01 11:48:01 +00:00
Paweł Grabarz
d89de84988
add alignment setting per shape system (#6087)
- Added alignment configuration option for shape systems. That allows creating bottom-left aligned sprites, which will behave much more naturally inside auto-layouts.
- Added support for alignment in manual layouts. When alignment is set, the manual layout will position the child node at the respective border of its bounding box. The size of aligned node will not be affected. The difference from auto-layout alignment is that each node is aligned individually, and it is not affected by its siblings. This allows for constructing more complicated responsive layouts that don't necessarily follow the grid, without creating wrapper auto-layout elements for each child.


![layout-anim-and-alignment](https://user-images.githubusercontent.com/919491/227951742-7a7fd48a-7d07-4e19-b824-8c136e3fb381.gif)
2023-03-30 14:10:36 +00:00
Stijn ("stain") Seghers
ef45b6eb0d
Make tooltips more visually pleasing (#6097)
Closes #6059: visually centering text and adding a longer delay before showing tooltips. See the commit messages for details.

![Recording 2023-03-28 at 09 43 17](https://user-images.githubusercontent.com/607786/228164744-5a3ae878-11ab-4cdd-8fdf-93bdf4fe84fe.gif)
2023-03-30 08:51:31 +00:00
Paweł Grabarz
99a6f8f2f9
Decouple node edit mode from ports (#5983)
Implements #5919

Apart from some fixed glitches, no visual differences are present. This is mostly a refactor.

- Decoupled node edit mode code from existing port implementation, so ports can easily be replaced in the near future without affecting edit functionality.
- Connected ports and widgets are now always hidden in edit mode. Previously in some situations the colored shapes were incorrectly displayed at wrong positions during editing.
- When entering edit mode, the text cursor is placed at the correct location corresponding to clicked code, compensating for shift introduced by argument placeholders.

# Important Notes
There is a remaining known issue with incoming edges being placed at incorrect places during edit mode, sometimes even outside of the node. This issue is also present in develop. It doesn't make sense to resolve it now, as we are planning to rewrite the ports tree very soon. It will be fixed with that rewrite.
2023-03-29 11:16:31 +00:00
Wojciech Daniło
3f7c4a47da
Refactoring mouse events. (#6078) 2023-03-28 04:41:25 +02:00
Stijn ("stain") Seghers
b977b5ac01
Add tooltips to the action bar (#6035)
Implements #5933: adding tooltips to the buttons next to nodes.

To make the UI consistent, I've added tooltips to the `ToggleButton` class directly, since whenever you have an icon button, it seems helpful to have a tooltip.

`ToggleButton` is only used for the profiling button in the top-right corner and the buttons next to nodes. The output context switch button [isn't implemented yet](https://github.com/enso-org/enso/issues/5929), but once it is, adding a tooltip should be one-liner.

![Recording 2023-03-22 at 17 21 58](https://user-images.githubusercontent.com/607786/226972920-81033b37-001f-49eb-9fc6-453120f01760.gif)
2023-03-27 17:02:06 +00:00
Adam Obuchowicz
866a58a0cf
Layout fixes (#6066) 2023-03-25 02:28:35 +01:00
Wojciech Daniło
ca0779c46b
Implementation of EnsoGL predefined Rectangle shape. (#6033) 2023-03-23 06:47:13 +01:00
Ilya Bogdanov
1b30a5275f
Cursor aware Component Browser (#5770)
Closes #5220

This PR implements the cursor-aware behavior of the CB, as described in [pivotal issue](https://www.pivotaltracker.com/n/projects/2539304/stories/183521918)


https://user-images.githubusercontent.com/6566674/221807206-39f93cb4-8253-421d-a33a-33ac0aa56e54.mp4


https://user-images.githubusercontent.com/6566674/223124947-259153ca-e656-4349-87b5-47c06fd21af2.mp4

# Important Notes
- The `intended_method` of the node's metadata is marked as deprecated, and all usages are removed.
- It seems *all usages of Scala parser are removed from IDE*. We no longer use it to parse documentation for snippets.

This is how the snippets docs look now:

<img width="410" alt="Screenshot 2023-02-28 at 13 18 11" src="https://user-images.githubusercontent.com/6566674/221808028-d69c54e4-2842-4f1c-aa16-781d3f7765a1.png">
2023-03-22 17:10:37 +00:00
Wojciech Daniło
abb0b447d5
Improving Performance Monitor (#5895) 2023-03-21 09:17:54 +01:00
Kaz Wesley
c9806496ee
Rendering improvement/debugging support (#6019)
Some small improvements relating to rendering:

- Add a debug option: `-debug.pixel-read-period`. This can be used to measure the performance impact of checking the pointer location on different hardware. [On my development box, it makes no difference to performance.] (Closes #5490).
- Unbind pixel pack buffers after each use. This is recommended practice. It has no performance impact on my machine, and allows SpectorJS to run (`-debug.enable-spector`). (Closes #5941).

Also, simplify the profiling CLI: the `profile.load-profile` and `profile.save-profile` options have been renamed to `profile.load`/`profile.save`; `profile.save` now has a default filename, so you can capture a profile at any time in Electron with Ctrl+Alt+P and it will be written to `profile.json`.
2023-03-21 06:34:24 +00:00
Ilya Bogdanov
c7da4df742
Apply enso-formatter (#6006)
Somebody forgot to apply `./run fmt` before committing to develop, so now we have a lot of whitespace changes in files.

# Important Notes
See https://github.com/enso-org/enso/issues/5166
2023-03-20 21:45:28 +00:00
Michael Mauderer
7a40ccc3ea
Fix wrong placement of nodes created from dropped files. (#5906)
Right now, we use the cursor position to determine the target position for dropped items. However, it seems that during dragging of files, we do not always receive mouse events, thus cannot update the cursor position. To avoid this, this PR refactors the functionality to use the location of the drop event, instead of the last known cursor position.

Fixes #5237.

https://user-images.githubusercontent.com/1428930/224735951-9cd6ff62-a749-4ff3-8437-c0bee3c0dd05.mp4
2023-03-17 20:52:13 +00:00
Nikita Pekin
e9d6d03c67
Cognito auth 3/7 - add registration (#5864)
3rd PR for IDE/Cloud authorization with cognito. This PR introduces registration templates + flows + amplify wrappers for registering & confirming user registration.

Login + Set Username + Forgot Password flows are to be added in next PRs to keep the changes reviewable.
2023-03-17 15:26:59 +00:00
Paweł Grabarz
9234d742cb
support custom widget entry labels (#5705)
Implements #5640 and #5650

It made sense for me to implement those two together, as I wanted to make sure that the necessary widget API changes will support custom entry values for both dynamic and static data.

- Added support for custom dropdown labels defined on the method annotations
- Added shortening of static dropdown values, which resolves

| dynamic dropdown - custom labels | static dropdown - automatic shortening |
|-|-|
|![image](https://user-images.githubusercontent.com/919491/220117241-8682736e-d750-4eeb-b9bb-cd6cfce42356.png)|![image](https://user-images.githubusercontent.com/919491/220117412-05ad7f4a-3ccf-468b-a976-c52395a497e2.png)|

# Important Notes
During implementation I had multiple data update order issues caused by FRP network forming a diamond shape. Two inputs that are often updated together were combined with `all` combinator, and that was further fed into the dropdown. This caused two updates to propagate through the whole network, and one of them was immediately outdated. To fix this and similar future scenarios, I've added an `next_tick` FRP node. It buffers the incoming events until the next browser microtask, preserving only the last received event. Currently if it is called inside a `requestAnimationFrame` callback, the effects of that processing will only be rendered in the next frame. Later this can be mitigated by delaying the rendering logic until the microtask queue is empty.
2023-03-17 10:06:32 +00:00
Paweł Buchowski
d77d08358e
remove package-lock.json from gitignore; add unitl-now ignored files (#5954) 2023-03-15 16:54:38 +01:00
Kaz Wesley
e171fba301
New documentation parser (#5917)
Implement new Enso documentation parser; remove old Scala Enso parser.

Performance: Total time parsing documentation is now ~2ms.

# Important Notes
- Doc parsing is now done only in the frontend.
- Some engine tests had never been switched to the new parser. We should investigate tests that don't pass after the switch: #5894.
- The option to run the old searcher has been removed, as it is obsolete and was already broken before this (see #5909).
- Some interfaces used only by the old searcher have been removed.
2023-03-15 15:43:51 +00:00
Paweł Buchowski
6f29262f90
Cognito auth 2/7 - add authorization app (#5798)
2nd PR for IDE/Cloud authorization with cognito. This PR introduces boilerplate react app + some amplify code to fetch the access token + username of the currently logged in user, if they are already authenticated.

Registration + Login + Set Username + Forgot Password flows are to be added in next PRs to keep the changes reviewable.
2023-03-15 11:54:16 +00:00
Kaz Wesley
362840ee9a
Fix a font specification. Fixes #5912. (#5939) 2023-03-14 22:48:52 +01:00
Paweł Buchowski
09cb39cb4b
fix npx typecript errors (#5937)
Fix some errors in old code that blocks some PRs.
2023-03-14 20:10:10 +00:00
Michael Mauderer
8201c1c845
Change order of objects to avoid scrollbar over visualisation chooser (#5843)
Fixes the scrollbar of the text visualization overlaying the visualization chooser.  Fixes #5089
Also fixes the scrollbar not overlaying the visualization action bar.

https://user-images.githubusercontent.com/1428930/223997913-3a9c84ae-6675-4f8e-b2e2-99c9e9c98565.mp4
2023-03-14 13:27:37 +00:00
Paweł Grabarz
6c596f8760
triangle indicator for dropdowns (#5859)
Closes #5854

Switches dropdown activation indicator to a triangle shape, and moved it to the horizontal center of a port.
![image](https://user-images.githubusercontent.com/919491/223765985-ec2175b7-7b44-45fd-88ff-543e8c08538f.png)

# Important Notes
Modified triangle SDF to be exact. That way the grow operation behaves as expected, rounding the corners. Other than that, it produces the same bound shape at 0 distance.
2023-03-11 07:12:18 +00:00
Kaz Wesley
023d8ac239
Precompute MSDFs (#5811)
Precompute MSDFs for all ASCII glyphs; after this, we no longer spend any time on MSDF computations when loading or interacting with the example projects.

Also shader precompilation (during build) is now parallel; if you have many cores and an SSD, it's now practically instant.

Closes #5722.

# Important Notes
- The *dynamic-assets* mechanism now used for MSDF data and shaders is versatile, and could be used to pre-seed any other computation-intensive runtime caches.
2023-03-10 12:59:56 +00:00
Adam Obuchowicz
0f1d591bc1
Allow fractional pixel ratio in CacheShapesPass (#5820)
Fixes #5807 

When implementing [cached icons in the Component Browser](#5779), I assumed pixel_ratio may be only integral (1.0 on normal machines and 2.0 on Retina), but I forgot Windows by default scales its UI by 1.25, breaking the icons entirely.
2023-03-10 10:41:53 +01:00
Paweł Grabarz
73487adce9
Named arguments support in IDE (#5774)
Added support for named arguments in IDE.

https://user-images.githubusercontent.com/919491/223681303-4c716639-d06e-4e33-aa22-6ebca2801b01.mp4


Named arguments are now recognized in node expressions. The function argument placeholders are rendered around series of named arguments. Insertion and deletion of arguments either by connection dragging or by widget selection will cause arguments around to be rewritten into appropriate form, such that the meaning of the expression doesn't change. We no longer need to introduce any wildcards (`_`) in argument positions when editing an argument list of a resolved method.
![image](https://user-images.githubusercontent.com/919491/223682460-143eb6d7-5ac9-4732-9520-71216cbbe58f.png)

For unresolved function calls, the old behaviour remains, as we don't have data about argument names or their desired order.
2023-03-09 21:23:25 +00:00
Kaz Wesley
b74debb151
Remove glyph FRP (#5725)
Implements #5724. Cuts `new_glyph` time in half. I'm looking in to the remainder of the time...
2023-03-06 23:16:52 +00:00
Michał Wawrzyniec Urbańczyk
ee981d2052
Reworked ide watch and ide start commands (#5634)
This PR changes build script's `ide watch` and `ide start` commands, so they don't use `electron-builder` to package. Instead, they invoke `electron` directly, significantly reducing time overhead.

`ide watch` will now start Electron process, while continuously rebuilding gui and the client in the background. Changes can be puilled by reloading within the electron, or closing the electron and letting it start once again. To stop, the script should be interrupted with `Ctrl+C`.
2023-03-02 23:00:47 +01:00
Adam Obuchowicz
0575c8d71a
Use cached icons in Component Browser (#5779)
Closes #5189

The component browser uses cached icons, both on the cached list and the navigator panel. It reduced the number of draw calls by 18.
2023-03-02 14:51:42 +00:00
Adam Obuchowicz
d1a0f5a543
Filling cached shapes with a different color. (#5752)
Fixes #5188

Added a new method `ShapeOps::recolorize` which changes color depending on values on r, g, b channels. It should be explained more in the docs. It will allow us using colored cached icons in the Component Browser.
2023-02-27 10:38:47 +00:00
Adam Obuchowicz
625172a6d2
Cached Shape Parameter (#5685)
Fixes #5023

This PR adds the ability to add a parameter to shapes defined, with `shape!` macro being a reference to a cached shape.

The API and results may be read [in the example scene](33b6f5937e/lib/rust/ensogl/example/cached-shape/src/lib.rs)

It also contains many other changes, required to have it working:
* We render cached shapes to texture in a different mode than normal shapes: the alpha channel is replaced with information about signed distance. That allows us using cached shapes as normal shapes, i.e. translate them, add to other shapes etc.
* We initialize and arrange shapes as a part of Word initialization, not in pass.
* We keep and blend colors in RGBA instead of LCHA - this is preparation for replacing colors in the next task, and also speeds up our shaders a bit.

The code was refactored in the process: the cached-shape related things were moved to a single module.
2023-02-23 11:18:48 +00:00
Kaz Wesley
dd3ee76ce7
Eager shader compilation (#5606) 2023-02-22 00:29:48 +01:00
Ilya Bogdanov
19beb01cf3
Open Project Dialog (#5607)
Closes #5022

This is basically a reimplementation of the Open Project Dialog that was present in the IDE a while ago. Now it uses the modern shiny `grid-view` instead of the old rusty `list-view`.

https://user-images.githubusercontent.com/6566674/219052041-ff99aa37-249c-4a63-93a5-5acd6b221dc8.mp4
2023-02-20 14:47:48 +00:00
Wojciech Daniło
663ed1e07e
Fixing Electron runner (#5633) 2023-02-19 01:37:58 +01:00
Kaz Wesley
2acc61d0b1
Optimize opening dropdown (#5688)
* Profiling

* Defer rendering hidden Text
2023-02-18 11:31:57 -08:00
Paweł Grabarz
6b14ec5a63
Dynamic dropdown support (#4072)
Implementation of https://www.pivotaltracker.com/story/show/184012743

https://user-images.githubusercontent.com/919491/214082311-cf49e43c-1d1f-4654-903c-a4224cd954d8.mp4

This is also a step towards more general widget support. The widget metadata is queried using `Meta.get_annotation` method through a dedicated visualization. For now only `Single_Choice` case is handled, and always all suggestions are is returned.

# Important Notes
There are limitations as to which node segments receive a widget. Only chain method calls are supported now (`thing.method` syntax), and only outside of lambda scope. Widgets in lambdas will require support for visualisations of lambda subexpressions, which is currently missing in the engine. The IDE technically tries to place the widgets there, but the data never arrives. It should work once the engine support is added.

This PR includes a mock for `Meta.get_annotation` call that only supports `Table.at` method. Real implementation is a separate task that is already in progress.
2023-02-04 00:50:24 +00:00
Michael Mauderer
349cc210e0
Bump rustc to nightly-2023-01-12 (#4053)
Bump rustc nightly-2022-08-30 and fix new errors and lints.
https://www.pivotaltracker.com/story/show/184229094
2023-02-02 23:05:25 +00:00
Michał Wawrzyniec Urbańczyk
29582b7ee1
Fix for the cargo-installed build script usage. (#4096)
Use both current directory and current exe location for deducing the repository root location.
2023-02-02 20:34:20 +01:00
Ilya Bogdanov
89dc7a5726
Mark nodes with yellow stripes if their evaluation produced warnings (#4101)
[Task](https://www.pivotaltracker.com/story/show/184237388)

Nodes with warnings are highlighted with yellow stripes. Colors for dataflow errors and panics also changed.


https://user-images.githubusercontent.com/6566674/216285009-9d29eb84-f663-4f2e-a6c8-4c4f593bd1ef.mp4
2023-02-02 17:03:46 +00:00
Adam Obuchowicz
a103c8d82f
Cached_shape macro rendered to special texture. (#4089)
This PR contains the first implementation of `cached_shape!` macro, which should help us with reducing draw calls in our application.

```rust
mod icon1 {
use super::*;
ensogl_core::cached_shape! { 32 x 32;
() {
let shape = Circle(16.px()).fill(color::Rgba::green());
shape.into()
}
}
}

mod icon2 {
use super::*;
ensogl_core::cached_shape! { 202 x 312;
() {
let shape = Rect((200.px(), 310.px())).fill(color::Rgba::red());
shape.into()
}
}
}
```

The above code creates two cached shapes. They are similar to normal shapes (created with `shape!` macro), except that:
1. they do not allow for any parametrization
2. They are rendered at the application start to the special texture with cached shapes.

The texture will be used in next PRs to cache all Component Browser icons on the texture and draw all of them just by single, fast draw call. In the future, more shapes can be cached, further reducing draw calls and making them simple.

# Important Notes
The results are presented in `cached_shapes` debug scene: there are two shapes displayed and a scaled cached texture is displayed in the background.
2023-02-01 17:58:20 +00:00
Wojciech Daniło
ce5b078130
Dependency cleaning (#4092) 2023-01-27 23:39:37 +01:00
Ilya Bogdanov
9e4dd9d708
Documentation display delay and hovered item preview caption (#4075)
This PR adds a configurable delay before displaying documentation ([task](https://www.pivotaltracker.com/story/show/183970872)) and a "hovered item preview" caption on top of the panel when you hover some not-selected entry. ([task](https://www.pivotaltracker.com/story/show/183970838)). The caption design will be adjusted in a future PR with a style update.


https://user-images.githubusercontent.com/6566674/214233481-10550fcf-a106-4b11-b5a2-15283745cbbf.mp4
2023-01-27 01:34:35 +00:00
Wojciech Daniło
da84e34b9a
Shaders precompilation (#4003) 2023-01-27 01:09:09 +01:00
Michael Mauderer
38906b39da
Implement Lazy Text Visualisation. (#3910)
Implements [#183453466](https://www.pivotaltracker.com/story/show/183453466).

https://user-images.githubusercontent.com/1428930/203870063-dd9c3941-ce79-4ce9-a772-a2014e900b20.mp4

# Important Notes
* the best laziness is used for `Text` type, which makes use of its internal representation to send data
* any type will first compute its default string representation and then send the content of that lazy to the IDE
* special handling of files and their content will be implemented in the future
* size of the displayed text can be updated dynamically based on best effort information: if the backend does not yet know the full width/height of the text, it can update the IDE at any time and this will be handled gracefully by updating the scrollbar position and sizes.
2023-01-24 20:55:36 +00:00
Paweł Grabarz
a5df4d4716
handle compiler job cancelation in shader cache (#4061)
This is a followup to https://github.com/enso-org/enso/pull/4046#pullrequestreview-1248164069.

- Compiler job cancelation is now handled - the cache entry will be cleared or the job will be resumed if there is still demand.
- The compilation awaiting process has been rewritten to not use polling. The "read cache" job is now only used to dispatch known valid reads. It is always completed within a single run cycle.
- Changed shader struct to use `ImString` for storing code, so it can be cheaply cloned. This is now common, as we are cloning it from cache.
2023-01-20 10:27:18 +00:00
Kaz Wesley
662992eb37
Replace tracing (#4017)
Logging: Replace tracing with an efficient logging implementation, with 0-runtime cost for disabled log levels. (https://www.pivotaltracker.com/story/show/183755412)

Profiling: Support submitting `profiler` events to the User Timing Web API, so that measurements can be viewed directly in the browser. (https://www.pivotaltracker.com/story/show/184003550)

# Important Notes
Logging interface:
- The macros (`warn!`, etc.) now take standard `format_args!` arguments (the tracing implementations accepted a broader syntax).
- Compile-time log levels can now be set through the CLI, like so:
`./run ide start --log-level=trace --uncollapsed-log-level=info`

Profiling:
- The hotkey Ctrl+Alt+Shift+P submits all `profiler` events logged since the application was loaded to the Web API, so that they can then be viewed with the browser's developer tools. Note that standard tools are not able to represent async task lifetimes or metadata; this is a convenient interface to a subset of `profiler` data.
- As an alternative interface, a runtime flag enables continuous measurement submission. In the browser it can be set through a URL parameter, like http://localhost:8080/?emit_user_timing_measurements=true. Note that this mode significantly impacts performance.
2023-01-16 20:31:01 +00:00
Paweł Grabarz
1578ed093a
Defer dropdown view initialization until opened and cache shaders between layers (#4046)
Fixes https://www.pivotaltracker.com/story/show/184216698

Reduced impact of node dropdown widgets on load times by deferring creation of grid views until each widget is opened. This also improves node editing time, as the dropdowns are not recreated immediately.

This approach of lazy initialization now caused a significant lag when opening the dropdown. Two major causes of the lag spike is glyph generation (msdfgen, `new_glyph`) and shader compilation (happened every time, because each dropdown has unique layer stack). To reduce the impact of that, the shader compiler now caches the shaders based on generated shader source. Glyph creation hasn't been changed and is still slow. The startup performance is now roughly where it was before introducing widgets.
2023-01-13 15:30:38 +00:00
Paweł Grabarz
fe1cf9a9ce
Basic dropdown widget integration (#4013)
Implements https://www.pivotaltracker.com/n/projects/2539304/stories/184023445

Added a dropdown widget to graph node for all span tree nodes that have tag values present. When an option is selected, the controller receives a partial expression update, which targets specific crumbs of the expression (similar to how edge endpoint updates work).


https://user-images.githubusercontent.com/919491/210219931-8ae418fd-3ac4-44a5-abea-9e670f15cdf9.mp4

# Important Notes
Right now the dropdown widget is recreated every time the node is edited, including a dropdown option being selected. This causes it to close every time. I wanted to get around that by diffing span trees, but I wasn't able to do it in useful way. Additionally, current implementation of node input expression view heavily relies on being reinitialized from scratch every time. This led to more necessary changes than I was comfortable with for this task. I believe it will be easier to implement it as part of more complete widget support, especially after dynamic data support, as we will have proper widget type information.
2023-01-11 14:32:25 +00:00
Paweł Grabarz
4042b5b237
Grid-view based dropdown component (#3985)
Implements https://www.pivotaltracker.com/n/projects/2539304/stories/184023380

Dropdown component. Planned to be used in nodes as a single and multiple selection widget, both for static and dynamically loaded values. Initial support is focused on static data, with limited support for dynamic sources. Notably, loading states are not supported yet. Full support for that is planned to be added later with widget lazy-loading.

- Supports single and multiple selections.
- Dedicated API for providing a static list of all entries.
- Range-based query API for dynamically loading data as it is scrolled (only basic support - will need more work for proper async lazy-loading).
- Internal entry cache and query batching to avoid querying data one by one (the batching for now is very basic, will have to be improved for proper lazy-loading).
- Automatic dropdown width adjustment based on the entry label lengths, up to a set max allowed value.
- Open and close animation.
- Keyboard support for focusing and selecting entries.

![image](https://user-images.githubusercontent.com/919491/207866293-de2e3fef-c93b-48cc-8253-11c186d223fd.png)

# Important Notes
Implementing the dropdown on top of grid-view have uncovered some assumptions around grid-view layers. It was assumed to always be a part of the component browser. Removing that assumption required a mechanism for propagating camera update information through layer tree. This is now implemented using a `camera_parent` layer field. Ideally each layer should simply have at most a single parent, and camera inheritance would follow that. That refactor turned out to be quite involved, so right now the simpler temporary solution is introduced in order to not delay this PR further.
2022-12-22 18:19:40 +00:00
Wojciech Daniło
be17f31dbf
Fixing set_size regression. (#3995) 2022-12-20 12:42:31 +01:00
Galin Bajlekov
4b28f8f8f0
Visual indication of outdated VCS snapshot (#3950)
This PR provides a visual indication of whether the project's current state differs from the most recent snapshot saved in the VCS. The project name displayed in the IDE changes to a darker text to indicate that the VCS snapshot is outdated, and back to a lighter text when the current project state corresponds to the last saved VCS snapshot.

https://user-images.githubusercontent.com/117099775/208088438-20dfc2aa-2a7d-47bf-bc12-3d3dff7a4974.mp4

The outdated project snapshot indicator is set when:
* A node is moved.
* A node is added or removed.
* The text editor is used to edit the text.
* The project is auto-saved, and the auto-saved project state does not correspond to the last saved snapshot in the VCS.

The outdated project snapshot indicator is cleared when:
* A new project snapshot is successfully saved using `ctrl+s`.
* The project is auto-saved, and the auto-saved project state is confirmed to correspond to the last saved snapshot in the VCS. This occurs, for example, when a project change is undone and the project is reverted to the last saved snapshot state.

The auto-save events do not occur immediately after a project change but have a short delay, thus the VCS status update is affected by the same delay when triggered by an auto-save event.
2022-12-19 21:22:33 +00:00
Wojciech Daniło
06cfafca09
Auto Layouts (#3937) 2022-12-19 02:16:54 +01:00
Ilya Bogdanov
285959835f
Scroll the documentation panel when it is hovered by the mouse (#3968)
[Task link](https://www.pivotaltracker.com/story/show/183970810).

Now documentation panel is being scrolled when only hovered by the cursor (you don't need to click on it beforehand).

Tested on macOS with both the touchpad and the mouse.

https://user-images.githubusercontent.com/6566674/206667769-04aae6b2-91ff-4877-bf10-8c0f0c4c5873.mp4
2022-12-14 16:37:04 +00:00
Michał Wawrzyniec Urbańczyk
965d1ff28b
Bump wasm-bindgen (#3971)
This PR brings wasm-bindgen (and related crates) to the latest version. I've also removed patching code, so future updates should be much easier.
2022-12-13 22:20:25 +01:00
Galin Bajlekov
b2b60612d7
Numeric slider component enhancement (#3885)
This is an enhancement of the `Slider` component implemented in #3852. It adds the following features:
* Tooltips and precision change hints
* Selectable slider limit behaviors
* Textual slider value editing
* Vertical slider layout

#### Tooltips

An information tooltip can now be added to a slider, it is shown when the mouse hovers over the component. Additionally, a pop-up indicating the slider's precision appears when the slider's precision has been adjusted.

https://user-images.githubusercontent.com/117099775/206148098-3b4dc059-18aa-4200-9ee0-5d4382363810.mp4

#### Slider limits

The previous slider implementation clamped the adjusted value to the slider's minimum/maximum limits. Now the following behaviors are available:
* Hard limits: Clamp the value to a range within the slider's limits.
* Soft limits: The value can extend beyond the slider's limits. When this occurs, an overflow indicator will be displayed on the side of the limit that is exceeded.
* Adaptive limits: The value can extend beyond the slider's limits. When this occurs, the exceeded limit will temporarily be adjusted to double the slider's range. This will be performed iteratively until the value falls within the extended limits. When a limit is extended and the value is adjusted to fit a smaller range, the extended limit will be iteratively halved until only the necessary range is covered. The slider's extended limits will never shrink to a range smaller than the original range.

These behaviors can be set to the lower and upper limits of a slider independently.

https://user-images.githubusercontent.com/117099775/206148139-6149c91d-ef49-4e2d-97f6-71084f52591c.mp4

#### Textual editing

The slider's value can now be entered through a text input field. Double-click to edit the slider's current value. To confirm the edit press `enter`, or press `escape` to cancel the edit. If an invalid value is entered on confirmation the slider will revert to its value before the edit. The slider's precision will be adjusted based on the number of decimal places of the value entered.

https://user-images.githubusercontent.com/117099775/206148170-d3fa4c82-6e73-4b1c-9be9-cb99979f7b70.mp4

#### Vertical layout

The slider component now supports a vertical layout. In this case value adjustment is performed by a vertical mouse movement, and a horizontal movement adjusts the slider's precision. The slider's track now fills the component in a vertical direction, and the slider's label is displayed near the top end of the component.

https://user-images.githubusercontent.com/117099775/206148211-0f176aaf-bc1b-45e2-afd7-0d28391aafcb.mp4

#### Scroll bar mode

The slider component supports two indicator modes:
* `Track`: The component is filled with a colored bar from the lower limit (empty) to the upper limit (full) dependent on the slider's value.
* `Thumb`: The component contains a rounded indicator that moves along the slider from one end to the other, indicating the slider's value proportionally to the slider's limits. The width of the indicator is configurable.
In addition, the value text, text entry, and precision adjustment can be turned off to provide a scroll bar appearance when used with the `Thumb` indicator.

https://user-images.githubusercontent.com/117099775/206148261-ae291073-85e9-4082-9f91-39b65fecdc0f.mp4

#### Example scene shortcuts

The example scene contains two shortcuts in order to evaluate the dynamic addition and removal of the slider components:
* `CTRL+D` drops all the slider components that are added to the scene.
* `CTRL+A` adds a new set of example slider components to the scene.
2022-12-12 08:53:19 +00:00
Ilya Bogdanov
82dabd329d
Show default mouse cursor over documentation panel (#3951)
[Task link](https://www.pivotaltracker.com/story/show/183970777)

The default mouse cursor is now displayed over the documentation panel.


https://user-images.githubusercontent.com/6566674/205954491-177fcc01-7e15-4a5c-825e-c0b02be527cc.mp4
2022-12-08 18:50:19 +00:00
Paweł Grabarz
054e9c4694
Fix disappearing text labels when entering edit mode (#3945)
Fixes regression https://www.pivotaltracker.com/n/projects/2539304/stories/183895961

# Important Notes
The root cause of the issue was a missing deref before `flavor()` call. The autoderef doesn't work there, because the `ShapeSystemFlavorProvider` trait is implemented for all types, including `Ref`. We should reconsider if blanket default impl is a good idea, as this is a very scary footgun.

Apart from that, the cleanup of layer elements was not handling systems with same ID but different flavors correctly. That could cause text to disappear when given layer had text of multiple fonts, and all shapes of one of them got removed. Now the element is removed from layer only when all systems sharing given system ID have no more instances to render.
2022-12-08 13:35:29 +00:00
Ilya Bogdanov
410204a3d9
Update component browser design (#3935)
A continuation and replacement for #3832

This PR updates the design of the component browser to match the latest Figma design file.


<img width="588" alt="Screenshot 2022-12-02 at 16 52 51" src="https://user-images.githubusercontent.com/6566674/205297344-d8d46e68-8c46-4e5a-b7f5-5e23014df23f.png">


https://user-images.githubusercontent.com/6566674/205297307-659c633c-a977-4c9f-9903-db72958895b7.mp4

# Important Notes
- Invalid color of the section navigator highlight is caused by a regression [#183915546](https://www.pivotaltracker.com/story/show/183915546)
2022-12-05 17:43:27 +00:00
Kaz Wesley
b58470145c
Widgets: improve scalability in some cases (#3920)
Fix issues noted here: https://github.com/enso-org/enso/pull/3678#issuecomment-1273623924
- Time complexity of an operation during line-redrawing scaled quadratically with number of lines in a change; now linear.
- Time complexity of adding `n` selections to a group was `O(n^2)`. Now it is `O(n log n)`, even if the selections are added one by one.

Also fix a subtle bug I found in `Group::newest_mut`: It returned a mutable reference that allowed breaking the *sorted* invariant of the selection group. The new implementation moves the element to invalidated space before returning a reference (internally to `LazyInvariantVec`), so that if it is mutated it will be moved to its correct location.

### Important Notes

New APIs:
- `NonEmptyVec::extend_at` supports inserting a sequence of elements at a location, with asymptotically-better performance than a series of `insert`s. (This is a subset of the functionality of `Vec::splice`, a function which we can't safely offer for `NonEmptyVec`).
- `LazyInvariantVec` supports lazily-restoring an invariant on a vector. For an invariant such as *sorted* (or in this case, *sorted and merged*), this allows asymptotically-better performance than maintaining the invariant with each mutation.
2022-11-30 13:36:28 +01:00
Michael Mauderer
c7c555314a
Bump rustc nightly-2022-11-22 (#3911) 2022-11-30 03:16:25 +01:00
Michał Wawrzyniec Urbańczyk
6b25cfa91f
Build hotfix (#3916) 2022-11-25 14:05:57 +01:00
Wojciech Danilo
e8ac7e7048 fixes 2022-11-25 08:01:08 +01:00
Wojciech Daniło
d60e3835f2
Display object refactoring (#3877) 2022-11-25 07:49:52 +01:00
Galin Bajlekov
4ae2cb1e2a
Numeric slider component with variable precision (#3852)
This `Slider` component allows adjusting a numeric value with the mouse. The value is increased or decreased by clicking on the component and dragging it to the left or right.

The `Slider` has a configurable default value. `Ctrl`+clicking on the component resets its value to that default. When the value is moved away from the default, the value is printed in **bold**.

The `Slider` precision is increased or decreased by clicking the component and dragging upward or downward. This precision influences how quickly the value changes when the mouse moves horizontally, the steps in which the value is incremented or decremented, and the number of digits used to display the value. There is a margin around the component within which the precision is not changed. Beyond this margin, the precision is increased or decreased in powers of 10 (e.g. `0.1` -> `0.01` -> `0.001` when moving the mouse downwards, or `0.1` -> `1.0` -> `10.0` when moving the mouse upwards). The margin and distance between consecutive steps along the vertical axis are configurable.

The value of the `Slider` is limited to a configurable range, and cannot be adjusted beyond that range. A colored bar fills the component to indicate the current value within the range.

#### Video demonstration

https://user-images.githubusercontent.com/117099775/202244982-2f6f419d-7281-41f6-8607-7e492ad25b46.mp4

#### Future additions
This is the first iteration of the `Slider` component. Additional features are planned for the future:
* Textual editing of the value.
* Improved visual feedback on precision changes.
* Additional out-of-range behaviors.
2022-11-24 15:37:03 +00:00
Michael Mauderer
9361cfe3ff
Implement TextGridView (#3819)
Implements [#83453449](https://www.pivotaltracker.com/story/show/183453449).

https://user-images.githubusercontent.com/1428930/197791213-f2e0ec69-5fe0-4482-aaaa-673ca5fcacc9.mp4

# Important Notes
* refactors some part of the visualization API to allow integration of EnsoGL UI components that require access to an `Applciation` struct (instead of just a `Scene` which was available before)
* extends the JS API mock library
2022-11-18 18:52:28 +00:00
Paweł Grabarz
88e40479d1
Rust compile time optimizations (#3873) 2022-11-15 14:09:39 +01:00
Wojciech Daniło
77934e09f7
Focus management (#3863) 2022-11-14 10:09:49 +01:00
Wojciech Daniło
cee7f27dc1
Text rendering quality improvements. (#3855) 2022-11-08 19:15:05 +01:00
Paweł Grabarz
ed384bddb9
add scroll overshoot bounce animation (#3836)
Implements https://www.pivotaltracker.com/n/projects/2539304/stories/183390749

https://user-images.githubusercontent.com/919491/198984088-9c4f03db-922f-4503-83fa-f0301a11239e.mp4

# Important Notes
- The overshoot bounce animation is implemented as a animation-like FRP mixin. It is currently defined using `define_endpoints` macro, but should be migrated to `define_endpoints_2` as soon as it supports "frp mixins" - definitions that extend external networks.
2022-11-07 10:50:47 +00:00
Wojciech Daniło
48ce68cda1
Wip/wdanilo/text shape system single scene 183406745 (#3776) 2022-11-03 08:35:06 +01:00
Paweł Grabarz
418120f16c
box Application to reduce component struct sizes (#3839)
Wrap big and commonly copied `Application` struct into `Rc` to avoid large structure sizes for all widgets.

The `Application`  struct by itself takes 704 bytes, measured by `size_of::<Application>()`. This structure is very often directly copied into components and widgets. Most notably, the generic `Widget` struct contains it. There are also cases, where structs (especially various `Model`s) contain multiple other child widgets directly, and end up indirectly copying the application multiple times.

All of `Application` clones are logical references (via `CloneRef`), so wrapping it into extra `Rc` doesn't change semantics in any way, but makes all structs that clone it way smaller. This reduces the amount of `memcpy`s and overall volume of allocated memory.

Measurement of a few example structs:

Before change:
```
size_of Application: 704 B
size_of Scrollbar: 712 B
size_of Scrollbar Model: 1576 B
```

After change:
```
size_of Application: 4 B
size_of ApplicationData: 704 B
size_of Scrollbar: 12 B
size_of Scrollbar Model: 176 B
```

Ideally we would not need to clone application reference into each component, but that's out of scope of this PR since it requires a lot more effort.
2022-11-02 16:01:50 +00:00
Paweł Grabarz
d7954bf6da
Scrollbar LMB click and hold scrolling (#3824) 2022-10-26 20:20:44 +02:00
Mateusz Czapliński
81e5e77ae8
A caption when hovering the marketplace button on the left bar of Component Browser (#3783)
When hovering the mouse pointer over the Marketplace button on the left bar of the Component Browser, show a caption informing that the Marketplace will be available soon.

https://www.pivotaltracker.com/story/show/182613789

#### Visuals

The video below demonstrates the caption shown when hovering the Marketplace button on the left bar of the Component Browser. It shows the caption disappearing after a hardcoded time, or when the mouse pointer is moved away from the button.







https://user-images.githubusercontent.com/273837/196195809-45a712e1-ad86-47d8-99ff-1475a0b74c6e.mov

# Important Notes
- The "Label" visual component was fixed. Previously, the width calculation of the background was not synchronized correctly with the text width. As a result, a zero-width background was displayed when a Label was shown for the first time.
2022-10-19 16:07:40 +00:00
Adam Obuchowicz
148d32e4c3
Component Browser with Grid View (#3766)
This PR introduced an overhauled Component List Panel implementation, making use of the efficient EnsoGL grid view component. Also, it delivers a couple of new features:
* A part of the new design: there are no more section headers in grid, instead groups are "glued" together. The local scope section is under "popular" (old "favorites").
* The keyboard management inside grid works.
* there is a mouse hover highlight
* selecting the lowest entry in section when jumping with navigation bar.
* accepting input as-is with cmd/ctrl + Enter.

https://user-images.githubusercontent.com/3919101/194561890-fffb9b41-2f0d-4357-8d9a-5038a6bcb023.mp4


### Important Notes

**What is not implemented:**
* [Focus management between panels.](https://www.pivotaltracker.com/story/show/180872763) The grid is always focused. To accept the current input, use ctrl+Enter shortcut.
* [Proper handling of selection when having empty space on the right and pressing right arrow.](https://www.pivotaltracker.com/story/show/183487880)
* When entering a module, its name is not added to the input as described in the design doc. Will be a part of [this User Story](https://www.pivotaltracker.com/story/show/181058321).

**Known issues**
* [the selection, especially in the local scope section, has sometimes an undesirable offset](https://www.pivotaltracker.com/story/show/183487730). The cause is known, but not so easy to fix.
* The inserted nodes are often producing errors. The Browser's inherits the outdated understanding of the language from old Node Searcher, and it does not include new form of imports, static methods etc. Those all will be fixed as a part of [this User Story](https://www.pivotaltracker.com/story/show/181058321).
* The performance is improved, but still not ideal, due to problems in [text areas](https://www.pivotaltracker.com/story/show/183406745).
* To scroll the documentation panel, you must first click on it.
2022-10-14 12:42:59 +02:00
Michał Wawrzyniec Urbańczyk
ad69eeb4ad
Build script merge (#3743)
Merged the build script into main repository. Some related cleanups.
2022-10-10 23:38:48 +02:00
Dmitry Bushev
ff987212ce
fix: rust fmt (#3758) 2022-10-04 17:09:58 +02:00
Wojciech Danilo
5971faa53c Fixes 2022-10-04 15:29:35 +02:00
Wojciech Daniło
61546a7ade
Wip/wdanilo/widgets 182746060 (#3678) 2022-10-04 04:51:27 +02:00
Ilya Bogdanov
0d74ab6124
Breadcrumbs integration (#3720)
[ci no changelog needed]
[Task link](https://www.pivotaltracker.com/story/show/182675703)

This PR implements the actual integration of the breadcrumbs panel with the component list panel. A special breadcrumbs controller (`controller::searcher::breadcrumbs`) is tracking the currently opened module with a list of its parents. The searcher presenter uses the API of the controller to sync the displayed list of breadcrumbs with the controller state.


https://user-images.githubusercontent.com/6566674/193064122-7d3fc4d6-9148-4ded-a73e-767ac9ac83f8.mp4

# Important Notes
- There is an `All` breadcrumb displayed at all times at the beginning of the list. It will be replaced with a section name as part of [Section Title on Component Browser's Breadcrumbs Panel](https://www.pivotaltracker.com/story/show/182610561) task.
- I changed the implementation of `project::main_module_id`, `project::QualifiedName::main_module`, and `API::main_module` so that they are logically connected which each other.
- I adjusted the Breadcrumbs View to avoid "appearance" animation glitches when opening new modules. `set_entries` was replaced with the `set_entries_from` endpoint.
2022-10-03 10:54:09 +00:00
Kaz Wesley
106bb0a044
profiling graphs: fall back to demo data (#3746)
When running the profiling run-graph and flamegraph demo scenes, if a profile file is not found in the directory served over http, fall back to generating demo data.
2022-09-30 06:45:31 +00:00
Michał Wawrzyniec Urbańczyk
6a56ceb147
Disable wasm-opt for all the entry point crates (#3734)
This PR disables the wasm-opt optimization in the crates that can be used as WASM entry points. Unfortunately, wasm-pack does not allow for disabling wasm-opt through a command line flag, so we have to disable it by setting an appropriate flag in each Cargo.toml.
2022-09-23 22:01:06 +02:00
Mateusz Czapliński
7dc971f4bb
GridView auto-scrolling when navigating with keyboard (#3687)
When a GridView is navigated using the keyboard, scroll it to display the newly selected entry.

https://www.pivotaltracker.com/story/show/182593635

#### Visuals

See below for a video demonstrating automatic scrolling of the GridView when arrow keys are pressed on the keyboard. The first video below shows the default scrolling behavior in a GridView without headers.

Note:
- When the Grid View is scrolled, the mouse hover highlight moves away from the mouse position. This is not a new regression, the behavior is the same in the `develop` branch (e.g. when scrolling using the mouse).



https://user-images.githubusercontent.com/273837/190183984-91f7808c-3606-43f8-bcda-ac4d5f84e00f.mov



The video below shows the behavior in a GridView with headers when the GridView is first scrolled to its top-left corner. The following guidance from the Design Doc is enabled and showcased:

> Users can change the selected component by pressing the arrow keys. The Focus does not move up if it does not have to (in most cases, the focus is located in the second row from the bottom). Instead, the component list scrolls down if there are enough entries.

https://user-images.githubusercontent.com/273837/189151546-e50aaf22-6f4d-41cb-809f-60038305745f.mov

The next video shows the behavior in the same GridView as in the previous example when the GridView is first scrolled away from any of its boundary entries. Notably, scrolling happens only when the selection is moved using the keyboard arrow keys, not when changing the selection using the mouse. This behavior is based on a discussion with @wdanilo on Discord.

https://user-images.githubusercontent.com/273837/189151974-d992be93-f61f-4e9f-9f4c-dfe260bbec5b.mov
2022-09-21 17:41:20 +00:00
Adam Obuchowicz
50c8ecc255
Component Browser Entry (#3718)
This PR contains an entry definition for Grid View to be used inside Component List Panel View. The Example grid view with the entry definition may be seen on new_component_list_panel_view debug scene.

https://user-images.githubusercontent.com/3919101/190663278-23c35ab0-f426-4001-8128-df7147aafb9e.mp4

# Important Notes
* The styling is not detailed yet due to time constraints (I want to move to integration this grid view to Component Panel List ASAP) and the fact that I could not get new mplus1 font working with text Area.
* Implementing this required adding a "contour offset" feature to the Grid View.
2022-09-21 14:10:16 +00:00
Ilya Bogdanov
a771e40002
Component browser breadcrumbs (#3686)
[ci no changelog needed]

[Task link](https://www.pivotaltracker.com/story/show/181445628).

This PR implements a Breadcrumbs panel for the new component browser.
The Breadcrumbs is a horizontal list of text labels separated by a special icon and has an optional ellipsis icon at the end.
It is implemented using the new GridView component.

Video:

Demo of adding new breadcrumbs, scrolling behavior, and selecting breadcrumbs with the mouse.


https://user-images.githubusercontent.com/6566674/189199432-77807cef-00dc-4abe-b95c-b17a536f59f6.mp4

Demo of selecting breadcrumbs with keyboard shortcuts:


https://user-images.githubusercontent.com/6566674/189199603-53e55335-73ba-4ed7-8291-4455144c06aa.mp4

# Important Notes
- This PR implements an old interaction of the design of the component browser. The new design of the breadcrumbs can not be easily integrated into the current look of the component browser, so we would need to update styles later. It should be a relatively simple task. *The implementation uses color from the new design though. (but not fonts and sizes)*
- I found a bug in the grid view implementation that causes panics at runtime in some conditions. The reason is triggering FRP endpoints while constructing new entries. This issue is fixed in the PR.
2022-09-19 09:21:52 +00:00
Mateusz Czapliński
5cd94d0126
GridView selection keyboard navigation. (#3657)
Add support for moving the selection in a Grid View using the keyboard.

https://www.pivotaltracker.com/story/show/182585789

#### Visuals

See below for videos showcasing GridView selection keyboard navigation in the `grid_view` debug scene. In the videos, messages in the Developer Console can be observed. When a keypress would result in the selection being moved out of the GridView, the selection is not moved and a message is emitted in the Developer Console instead, showcasing an FRP output signal emitted on such event. Please note that the videos are recorded with the tracing level changed to `DEBUG`. In a default build, the tracing level is set to `WARN`, and the messages visible in the videos are not displayed in the Developer Console.

https://user-images.githubusercontent.com/273837/188483972-89d79f7b-1303-457b-869f-282e0809a755.mov

https://user-images.githubusercontent.com/273837/188484294-e9b6461c-a84f-4817-9447-d792f2ebdbb5.mov

The following video shows moving the selection between "regular" entries and header entries. It also shows a current usability limitation of the selection keyboard navigation feature, such that the Grid is not scrolled when the selection leaves the visible part of the Grid, and the selection may thus disappear from view.

https://user-images.githubusercontent.com/273837/188485238-29a82b27-de2f-4cf8-a2e7-ff8c3f41478d.mov

# Important Notes
- Keyboard navigation only works when a GridView has focus.
- Selection keyboard navigation only works if the selection was already set to some entry beforehand.
- If keyboard navigation would move selection outside of the grid, the selection movement is canceled and an FRP event is emitted.
2022-09-14 16:50:35 +00:00
Dmitry Bushev
f233ea66b3
Use Mplus1 font (#3688)
Use Mplus1 font in the welcome screen.

# Important Notes
#### Before:
![ide-causten](https://user-images.githubusercontent.com/357683/188605189-b37d4545-7b35-469f-8497-b026d1ce2e75.png)

#### After
![ide-mplus1](https://user-images.githubusercontent.com/357683/188605262-b46597b8-a622-4740-9b78-17a2f71ddaa1.png)
2022-09-09 12:47:34 +00:00
Wojciech Daniło
4b96b4887c
Better fonts support. (#3616) 2022-08-27 00:25:34 +02:00
Adam Obuchowicz
d4142cfee3
Grid View Headers (#3656) 2022-08-24 16:36:23 +02:00
Ilya Bogdanov
8c504bd4b0
Grid View with variable column widths (#3651)
[ci no changelog needed]
[Task link](https://www.pivotaltracker.com/story/show/182955595)

This PR implements variable column widths in the new Grid View component. We need this feature to quickly implement various parts of the UI, including the breadcrumbs panel of the component browser.

There are two ways to change the width of the specific column:
1. "From the outside", using the `set_column_width` endpoint of the Grid View
2. "From the inside", using the `override_column_width` endpoint of the EntryFrp.

Both ways work similarly, but the latter is helpful for our breadcrumbs implementation, as it allows for entry to decide on the width of the column by its content.

See the screencast with three grid views. The top-left one has every even column shrunk by GridView API. Every grid view has a second column extended by EntryFrp API.


https://user-images.githubusercontent.com/6566674/185060985-7b7df076-c659-41fa-977a-22875493f8d4.mp4
2022-08-23 13:28:00 +00:00
Ilya Bogdanov
698a6a0674
Left align component browser to the edited node (#3636)
[ci no changelog needed]

[Task link](https://www.pivotaltracker.com/story/show/181870555)

This PR changes the relative position of the edited node in such a way that it is left-aligned to the component browser window. This change reflects the most recent version of the [design doc](https://github.com/enso-org/design/blob/main/epics/component-browser/design.md#overview)

<img width="1157" alt="Screenshot 2022-08-08 at 19 15 47" src="https://user-images.githubusercontent.com/6566674/183454192-81960e0a-ab69-43a4-b7df-d13320a9d16d.png">

As an additional change, the FRP implementation of the `Camera2d` was extended with a new output (screen dimensions) and fixed. With the old implementation, there was a possibility of panic at runtime because of non-exclusive borrows of `RefCell`. The FRP event for camera position was emited inside the scope with a mutable `RefCell` borrow. Any attempt to borrow the camera one more time (e.g., by calling one of the getters, such as `zoom()`) caused panic at runtime.
2022-08-09 23:03:54 +00:00
Adam Obuchowicz
7f8190e663
Grid view selection and hover (#3622)
This PR adds a new variant of selection, where the mouse-hovered entry is highlighted and may be selected by clicking.

In the video below, we have three grid views with slightly different settings:
* In the left-top corner, both hover and selection highlight is just a shape under the label. Such a grid view does not require additional layers (when compared to non-selectable grid view).
* In the left-bottom corner the hover is normal shape, but selection is a _masked layer_ which allows us to have different text color. This setting requires three more layers to render.
* In the right-top corner, both hover and selection are displayed in the masked layer, creating 6 additional layers.

https://user-images.githubusercontent.com/3919101/181514178-f243bfeb-f2dd-4507-adc3-5344ae0579b7.mp4
2022-08-01 10:54:42 +00:00
Ilya Bogdanov
987333e1d3
Component Browser Section Navigator (left bar) (#3553)
[ci no changelog needed]
[Task link](https://www.pivotaltracker.com/story/show/181433641)

This PR adds a left bar with section navigation buttons to the Searcher List Panel. The buttons are implemented as a list view with an adjusted style.

https://user-images.githubusercontent.com/6566674/179517378-dba00f41-d32e-4ffb-a4d9-3cd376b3e781.mp4
2022-07-20 06:35:26 +00:00
Adam Obuchowicz
7fa4e5e369
Grid View with Scrolling (#3588)
**Note**: This PR also contains content of previous Grid View PR. We decided to discard the previous, because this one did some refactoring of old one, and it's not a big addition.

Added a scrollable::GridView component, which just embeds the GridView in ScrollArea. Also, re-worked the idea of text layers.

https://user-images.githubusercontent.com/3919101/179020359-512ee127-c333-4f86-bff5-f1cb4154e03c.mp4
2022-07-19 08:39:23 +00:00
Adam Obuchowicz
b0d627a797
Component list panel integration (#3530)
This PR contains all work for finishing integration of first Component List Panel in the IDE:
* It adds a stub for the whole Component Browser View. The documentation panel is re-used from the old searcher.
* It has the presenter implementation, integrating the view with Hierarchical Component List from the controller.
* It extends the View API, so the integration is possible, making use of Component Group Set wrapper.
* The selection integration was also merged into this PR, because it depended on the API extension mentioned above. However, we should avoid such practice in the future.

https://user-images.githubusercontent.com/3919101/177816427-8c4285b4-8941-4048-a400-52f4acf77a9f.mp4

# Important Notes
There are some known issues, to-be-fixed in the future.
* The performance is bad. It should be improved with new text::Area, and the decent one shall come with [GridView inside component browser](https://www.pivotaltracker.com/story/show/182561072)
* There is no keyboard navigation. It should also be delivered with [GridView](https://www.pivotaltracker.com/story/show/182561072).
* The Favorites section is not [filtered out by node source type](https://www.pivotaltracker.com/story/show/182661634).
2022-07-14 12:00:52 +00:00
Mateusz Czapliński
c1aa4aac87
Embedded-fonts crate should contain constants with font names. (#3403)
Add constants for font names. This reduces the number of "magic strings" and helps avoid typos in font names in the codebase.

https://www.pivotaltracker.com/story/show/181908872

[ci no changelog needed]
2022-07-12 09:05:10 +00:00
Mateusz Czapliński
d950499a90
Pan camera to created nodes. (#3552)
If a node created by the user gets placed off-screen, the screen's camera is panned to make the node visible.

https://www.pivotaltracker.com/story/show/181188687

#### Visuals

A screencast showing a number of node creation scenarios when the camera is panned to the newly created node, including when zoomed out.



https://user-images.githubusercontent.com/273837/177169716-50a12b0a-c742-4b01-9766-56206e7938b9.mov

# Important Notes
- Camera is panned also if the node is only partially visible, or if there's not enough free space visible around the node. The specific amount of free space that needs to be visible around a newly created node is configured in the theme.
- If the screen area is so small that the node cannot be fully fit in it (either horizontally or vertically), showing the left and top boundaries of the node's area takes priority over showing the corresponding opposite edges.
2022-07-06 10:33:35 +00:00
Michael Mauderer
1b0312b446
Avoid patching the file msdfgen_wasm.js more than once. (#3560)
Adds a fix for a build issue where the `msdfgen_wasm.js` file gets patched multiple times, which breaks the build.
[ci no changelog needed]
2022-07-04 19:07:52 +00:00
Mateusz Czapliński
2b2563a395
Implement trivial placeholder icons for all 5 Component Browser entry kinds. (#3557)
Implement simple placeholder icons for all entry kinds supported in the Suggestion Database. The icons are planned to be used in Component Browser as default icons for entries. This is intended to allow visually distinguishing different entry kinds.

The following additional fixes and tweaks are applied:
 - Icons previously using only 1 color from the theme now use the color provided through shape parameters instead.
 - The `data_science` and `network` icons now use only the 2 colors provided through shape parameters.
 - The `join` icon has its shape and colors modified and uses only the 2 colors provided through shape parameters.
 - The demo scene now parametrizes icon shapes using colors from the Component Browser Design Doc.

https://www.pivotaltracker.com/story/show/182584322

#### Visuals

Original contents of the demo scene before the PR:

<img width="2197" alt="x-orig" src="https://user-images.githubusercontent.com/273837/176669422-ee2e14c7-9ef4-42fd-acb7-ae3be6b68587.png">



Final contents of the demo scene after the PR:

<img width="2201" alt="x2-final" src="https://user-images.githubusercontent.com/273837/176668720-6f1685fd-f7e6-44d7-85f5-f6a6d6789644.png">
2022-07-04 16:36:27 +02:00
Michael Mauderer
e6b7d5b8fc
List Panel View Part 2 (#3537)
Design, integration and bugfix update for the List Panel View.

![image](https://user-images.githubusercontent.com/1428930/175554745-c4887d55-a885-4299-878b-4727f09a7520.png)

![image](https://user-images.githubusercontent.com/1428930/175554906-837db815-948d-4407-8233-10a15e4198b3.png)

![image](https://user-images.githubusercontent.com/1428930/175555165-bcbe5138-8e5c-416e-886b-c72df361d743.png)


[ci no changelog needed]
2022-07-04 14:08:31 +00:00
Michael Mauderer
655793aa78
Component List Panel View (#3495) 2022-06-22 16:39:32 +01:00
Ilya Bogdanov
71b3a9f40a
New selection box implementation for component groups (#3520)
[Task link](https://www.pivotaltracker.com/story/show/182194574).
[ci no changelog needed]

This PR implements a new selection box that will replace an old (not really working) one in the component browser. The old selection box wasn't working well with the headers of the component groups, so we were forced to make a much harder implementation.

The new implementation duplicates some visual components and places them in a separate layer. Then, a rectangular mask cuts off everything that is not "selected". This way:
- We have more control over what the selected entries should look like.
- We can easily support the multi-layer structure of the component groups with headers.
- We avoid problems with nested masks that our renderer doesn't support at the moment.

To be more precise, we duplicate the following:
- Background of the component group becomes the "fill" of the selection.
- Entries text and icons - we can alter them easily.
- Header background and header text. By placing them in separate scene layers we ensure correct rendering order.

https://user-images.githubusercontent.com/6566674/173657899-1067f538-4329-44f9-9dc2-78c8a4708b5a.mp4

# Important Notes
- This PR implements the base of our future selection mechanism, selecting entries with a mouse and keyboard still has several issues that will be fixed in the future tasks.
- The scrolling behavior will also be improved in future tasks. Right we only restrict the selection box position so that it never leaves the borders of the component group.
- I added a new function to `add` shapes to new layers in a non-exclusive way (we had only `add_exclusive`) before. I have no idea how we didn't use this feature before even though we mention it a lot in the docs.
- The demo scene restricts the position of the selection box for one-column component groups but does not for the wide component group.
2022-06-15 14:21:30 +00:00
Kaz Wesley
b756fc48d1
Symbol unregistration (#3507)
Remove a `Symbol`from the `SymbolRegistry` when its `SpriteSystem` is dropped.

This fixes the remaining buffer leak (after #3504) in https://www.pivotaltracker.com/story/show/181943457

# Important Notes
- The `SymbolRegistry` now assigns unique `SymbolId`s, so that we can tell if a `SymbolId` refers to a `Symbol` that has already been unregistered (this shouldn't happen, but it's not statically-obvious that it doesn't, so if it occurs we shouldn't misbehave).
- Also fix a bug in how `buffer_count` was tracked (we were decrementing more than incrementing!).
2022-06-15 03:54:59 +00:00
Ilya Bogdanov
c602404b1a
Multi Component Group Wrapper (#3473)
[ci no changelog needed]

This PR implements a new helper for the future Component Browser - `component_group::multi::Wrapper`. It propagates FRP events from multiple component groups and ensures that only a single component group is focused at all times.

See the updated component group demo scene (console logs shows propagated FRP events from all component groups):


https://user-images.githubusercontent.com/6566674/172359141-8ea6f1ba-e357-4c1b-852a-adb4d5207e03.mp4


- Fixed a `define_endpoints_2!` macro. FRP endpoints for `focus` events weren't connected properly.
- List View now uses an overlay shape to catch mouse events, it allows much easier implementation of `is_header_selected` in the component group.
2022-06-08 11:06:36 +00:00
Mateusz Czapliński
656d6e7660
Virtual Component Groups in the Hierarchical Action List (1/2) (#3488)
Parse the Engine's response containing Virtual Component Groups and store the results in a field of the Execution Context type.

https://www.pivotaltracker.com/story/show/181865548

# Important Notes
- This PR implements the subtask 1 of 2 in the ["Virtual Component Groups in the Hierarchical Action List" task](https://www.pivotaltracker.com/story/show/181865548).

[ci no changelog needed]
2022-06-03 17:18:20 +00:00
Adam Obuchowicz
66693ad642
Hierarchical Action List vel Component List. (#3501)
This PR introduces a new structure delivered by Searcher Controller: The Component List.

The Component list is hierarchical, and its structure reflects how the components are displayed in Component Browser - only "submodule" section at this point, other sections will be covered in next tasks.

This does not introduce anything visual; the structures are tested in unit tests.
2022-06-03 15:06:31 +00:00
Kaz Wesley
bd60a20bd3
Profiling workflows (#3475)
Define some workflows for batch-mode profiling.

Implemented:
- collapse nodes
- create node
- enter collapsed node
- new project
- open visualization

They can currently be built and run with a command like:
`./run.sh ide build --profiling-level=debug && dist/ide/linux-unpacked/enso --entry-point profile --workflow create_node --save-profile out.json`

And the data can be displayed with:
`dist/ide/linux-unpacked/enso --entry-point profiling_run_graph --load-profile out.json`

Demo of recording and viewing a profile with a command-line one-liner:

https://user-images.githubusercontent.com/1047859/169954795-2d9520ca-84f9-45d2-b83a-5063ebe6f718.mp4

See: https://www.pivotaltracker.com/story/show/182195399.

# Important Notes
- When defining workflows, two helpers are enough to allow us to tell when the action is really done: `Fixture::compile_new_shaders`, and `Fixture::backend_execution`. Often, it is appropriate to await both, but it depends on the task.
- The shader compiler is now driven by a `Controller`; while the `Compiler` is reset if context is lost, the `Controller`'s state survives context loss.
- A new `--load-profile` option supports specifying a profile by path when running `profiling_run_graph`.
- Drop the `with_same_start` profiler interface; we ended up preferring a child profiler convention, and this interface was not implemented compatibly with the stricter data model we've had since the introduction of `profiler::data`.
- Fix the noisy `rustfmt` output.
2022-06-01 18:01:16 +00:00
Adam Obuchowicz
d07246d84c
Fix depth-ordering update (#3486)
There are two dirty flags in layers: depth_order_dirty and element_depth_order_dirty - one marking changed in Layer, second marking change in one of sublayers. The depth_order_dirty has a proper callback for setting element_depth_order_dirty of its parent. However, the latter did not propagate up.
I fixed it by adding callback for element_depth_order_dirty which sets the depth_order_dirty of the parent.

# Important Notes
* The question to @wdanilo : is it possible, that I can propagate dirty directly to element_depth_order_dirty, without setting depth_order_dirty? As far as I understand the code, it would also work (and we would omit some unnecessary updates).
* I tried to leave some logs, but I don't feel how to do that: the tooling I used was very specific, only the concrete ids of symbols and layers were logged, and I don't know how to generalize it.
2022-05-30 10:32:43 +00:00
Adam Obuchowicz
eef0738f63
Component Group Entry with icons and text highlighting. (#3459)
This PR extends the Component Group Entry with icon and option to highlight the text. Here the convert has highlighted "con".

https://user-images.githubusercontent.com/3919101/169046537-4f8b823c-322e-40dc-8abb-24d1d7092341.mp4


### Important Notes

Although this PR includes effort for adjusting Component Group style to better reflect the design, it is not entirely finished: the selection still works badly and will be fixed in another PR.
2022-05-24 09:48:19 +02:00
Michał Wawrzyniec Urbańczyk
14a01c4635
New IDE build script (#3466) 2022-05-23 04:16:04 +02:00
Ilya Bogdanov
4ebf637fd4
Fully visible group name in partially scrolled Component Group View (#3447)
[ci no changelog needed]

[Task link](https://www.pivotaltracker.com/story/show/181725003)

This PR implements a fully visible component group header while scrolling the group (using the ScrollArea).
The header moves in sync with scrolling movements (using new `set_header_pos` FRP input), so it looks like the component group is scrolled. ScrollArea masks the "scrolled" entries above the header. This design allows a fully visible header even though our renderer doesn't support nested layers masking yet.

The screencast:

https://user-images.githubusercontent.com/6566674/168320360-2c2017b2-0ef5-42ce-9c79-82b9641c1d73.mp4


The most recent one, with the updated demo scene from develop:


https://user-images.githubusercontent.com/6566674/168555268-8552c4b0-f887-4388-89a1-e65ddf668be6.mp4

# Important Notes
- I fixed the API of the list view so now it supports non-hardcoded scene layers (previously it did not). I also believe it was implemented incorrectly.
- I've found a [pretty weird bug](https://www.pivotaltracker.com/story/show/182193824): the component group inside the ScrollArea is invisible unless I add some arbitrary shape to the scroll area content. I use a `transparent_circle` for this purpose in the demo scene. The bug is probably related to masking the sublayers, though I wasn't able to reproduce it properly on a simpler example.
- The selection box is removed from the demo scene as agreed with @farmaazon . The correct implementation has proven to be much harder than I expected, and we will implement another approach in a separate PR.
- I also modified the `shadow::Parameters` so that it uses `Var`s instead of plain values.
2022-05-17 13:52:08 +00:00
Michael Mauderer
fd3c316636
Fix default text color not being applied correctly. (#3456) 2022-05-17 09:57:40 +01:00
Michael Mauderer
0b34346c19
Improve profiling for UI interactions v2. (#3451)
* Extends the instrumentation of the code base and upgrades some FRPs to the newer API macro.
* Extends the run-graph demo scene to specify a profile via URL without recompilation.
* Fixes labels in the flame graph demo scene.
* Fixes an issue with loading profiles that contains escaped characters.

# Important Notes
* no longer contains the upgrade of the `text::View` to `define_endpoints_2`. This should be fixed as part of the text rendering rewrite.

[ci no changelog needed]
2022-05-16 12:28:50 +00:00
Mateusz Czapliński
b7cf493f7d
Component Group View colors parametrization (#3434)
Parametrize the colors used in a Component Group view based on a single color passed to an FRP input.

Customizing the colors of a Component Group will be needed for the larger Component Group List panel. This customization will work as a visual hint for the User, helping them to distinguish different Component Groups in the panel. A single input color will be configured for every Component Group in the `package.yaml` file (see the Design Doc). Therefore, all shades of the color required by the Component Group view must be calculated from this single input color.

https://www.pivotaltracker.com/story/show/181725039

#### Visuals

The following screencast of the `component_group` debug scene shows how all required shades of color are calculated from a single input color. It also shows a new "dimmed" display mode of the Component Group. The debug scene does not support selecting entries in a "dimmed" Component Group, as this is not required by the Design Doc.


https://user-images.githubusercontent.com/273837/168074651-bf3d5ea5-99b0-4b69-9934-ad8565ffc54e.mov






The following is a screenshot of the Node Searcher, to demonstrate that it still works correctly:

<img width="623" alt="Screenshot 2022-05-09 at 17 13 01" src="https://user-images.githubusercontent.com/273837/167441109-e9a47b5a-45a2-4172-85ed-c593e43e02d6.png">

# Important Notes
- A new type `Params` was added in the `list_view::entry::Entry` trait. This was needed to allow passing FRP information to entries separately for every ListView instance.
- Note: `style_prefix` and `max_width_px` parameters of the `list_view::entry::Entry::new` function may get moved into the new `Params` type in the future. To save time, this was not attempted in this PR, as agreed with @farmaazon.

[ci no changelog needed]
2022-05-13 08:38:43 +00:00
Kaz Wesley
d4d725ade6
Fix blink when adding node (#3448)
Fix blink when adding node
2022-05-12 16:17:29 -07:00
Michael Mauderer
d24f0f7ebb
Revert "Improve profiling for UI interactions. (#3437)" (#3449)
This reverts commit e6133444ce.
2022-05-13 00:18:57 +02:00
Michael Mauderer
e6133444ce
Improve profiling for UI interactions. (#3437)
* Extends the instrumentation of the code base and upgrades some FRPs to the newer API macro.
* Extends the run-graph demo scene to specify a profile via URL without recompilation.
* Fixes labels in the flame graph demo scene.
* Fixes an issue with loading profiles that contains escaped characters.

# Important Notes
[ci no changelog needed]
2022-05-12 15:05:01 +00:00
Ilya Bogdanov
1c8aa26f90
Wide Componet Group List (#3409)
[ci no changelog needed]

[Task link](https://www.pivotaltracker.com/story/show/181414466)

This PR brings a new UI component: Wide Component Group. This is a three-column headerless container similar to Component Group. See the updated `component-group` demo scene:


https://user-images.githubusercontent.com/6566674/166933866-e5bee142-5176-4a02-bc18-a5bfd96ccbe2.mp4
2022-05-12 09:30:00 +00:00
Kaz Wesley
0e904b2256
Profiling batch mode (#3428)
Implement a command that launches the application, runs a series of steps (a "workflow"), writes a profile to a file, and exits.

See: [#181775808](https://www.pivotaltracker.com/story/show/181775808)

# Important Notes
- The command to capture run and profile is used like: `./run profile --workflow=new_project --save-profile=out.json`. Defining some more workflows (collapse nodes, create node and edit value) comes next; they are implemented with the same infrastructure as the integration-tests.
- The `--save-profile` option can also be used when profiling interactively; when the option is provided, capturing a profile with the hotkey will write a file instead of dumping the data to the devtools console.
- If the IDE panics, the error message is now printed to the console that invoked the process, as well as the devtools console. (If a batch workflow fails, this allows us to see why.)
- New functionality (writing profile files, quitting on command, logging to console) relies on Electron APIs. These APIs are implemented in `index.js`, bridged to the render process in `preload.js`, and wrapped for use in Rust in a `debug_api` crate.
2022-05-10 19:34:40 +00:00
Kaz Wesley
71adb7e0a4
Drop render-profile; obsoleted by profiling-run-graph. (#3438) 2022-05-09 13:29:14 -07:00
Mateusz Czapliński
ffe6700901
Parametrize font in List View via styles (#3427)
Make it possible to parametrize the font in different instances of `ListView` via styles. This makes it possible for the Component Group view to use a `ListView` with `list_view::entry::Label` underneath with a different visual style than the default `ListView` used in other places in the IDE.

https://www.pivotaltracker.com/story/show/182033743

#### Visuals

This feature allows the Component Group visual component to use a proportional font for its entries, as seen in the `component_group` debug scene:

<img width="180" alt="Screenshot 2022-05-02 at 14 50 46" src="https://user-images.githubusercontent.com/273837/166236411-1d139114-b099-4a10-8d44-48713d155d1e.png">


The other instances of ListView still use a monospaced font as before:

<img width="152" alt="Screenshot 2022-04-29 at 14 45 57" src="https://user-images.githubusercontent.com/273837/165950535-6cffd0df-d84e-4f74-8d48-3114aea9fc68.png">

<img width="629" alt="Screenshot 2022-04-29 at 14 46 35" src="https://user-images.githubusercontent.com/273837/165950578-0439d078-0224-4138-b38f-4bb799b004aa.png">

The `text_area` debug scene works correctly:

<img width="340" alt="Screenshot 2022-04-29 at 14 46 12" src="https://user-images.githubusercontent.com/273837/165950564-fbbde201-c5ad-448e-af3d-8a7494757932.png">

# Important Notes
- Parsing `String` values into `style::Data` should now be done through the `FromStr` trait, instead of the `TryFrom<String>` trait as previously. (Note: the `String::parse` function in the Rust standard library uses the `FromStr` trait underneath.)

[ci no changelog needed]
2022-05-04 10:44:57 +00:00
Kaz Wesley
ce78f9825d
New profiling format (#3413)
* New JSON profile format.

* Use string-table optimization for labels in JSON format.

* Use TimeOffset header to render beanpoles

* Log RPC messages sent to the backend.

* Display RPC requests on graph

* Simplify metadata-logging interface.
2022-05-03 10:54:48 -07:00
Michael Mauderer
8f99014477
Implement multi-process message visualisation. (#3423)
Implements a visualization that is integrated with our GUI profiling visualization for the multiprocess data implemented in #3395

https://user-images.githubusercontent.com/1428930/165915395-c850c7b2-1cc5-4eb0-8f21-37565d113b1e.mp4

The visualization shows a horizontal line for Engine, Language Server and GUI and renders arrows for each message passed between them. Information about the message is revealed on hover.

# Important Notes
* this PR refactors the tooltip mechanism. Note that this has not been in active use anywhere else, as tooltips for node received a custom implementation and the tooltip that was previously implemented was used nowhere else yet.

[ci no changelog needed]
2022-05-03 09:40:27 +00:00
Adam Obuchowicz
8041fe0e49
Selectable Header in Component Group View. (#3418)
* The List View component was refactored: it allows for hiding the internal selection widget, and exposes information where the widget should be placed. This allows us to create selection widget in component list panel, so it can be animated between component groups and sections.
* Fixed some warnings when checking WASM code.
* Adjusted the style of Component Group View a little, so it better reflects the design doc. Still not ideal, because the list_view has some weird design regarding padding, but I don't want to stuck in some bigger refactoring.

I will add a video in a few minutes.

# Important Notes
https://user-images.githubusercontent.com/3919101/165507826-60329f9e-7de3-4eb2-9271-292e45568cb2.mov
2022-04-30 14:48:52 +00:00
Ilya Bogdanov
bb6a5bac02
Clipping in the Scroll Area (reverting a revert) (#3420)
[ci no changelog needed]

This is fixed copy of already reviewed #3384

[Task link](https://www.pivotaltracker.com/story/show/181413200)

This PR implements content clipping for the ScrollArea component.

List of changes:
- Implemented `InstanceWithAttachedLayer` abstraction that allows creating additional sublayers for our components. In the future, this abstraction can be used for text rendering as well (right now text rendering requires additional hardcoded layers).
- Fixed `complex-shape-system` demo scene by removing `node_searcher_mask` layer.
- Fixed `SublayersModel::remove` - it was not clearing the `layer_placement` hashmap.
- Implemented disabling the wheel scrolling in `Navigator`, and refactored it to reduce the number of functions arguments by introducing a `NavigatorSettings` struct.

Video (`scroll_area` demo):


https://user-images.githubusercontent.com/6566674/164506455-e177a7a7-9f1c-4f50-888f-112423cebbe4.mp4

# Important Notes
- `InstanceWithAttachedLayer` is implemented in such a way that it allows an extension in the future - namely to use it to simplify text rendering. The implementation might be simplified though.
2022-04-27 17:11:49 +00:00
Ilya Bogdanov
88ec8c4774
Revert "Clipping in the ScrollArea (#3384)" (#3419)
This reverts commit 6ba40a7a56.
2022-04-27 15:24:15 +02:00
Ilya Bogdanov
6ba40a7a56
Clipping in the ScrollArea (#3384)
[ci no changelog needed]

[Task link](https://www.pivotaltracker.com/story/show/181413200)

This PR implements content clipping for the ScrollArea component.

List of changes:
- Implemented `InstanceWithAttachedLayer` abstraction that allows creating additional sublayers for our components. In the future, this abstraction can be used for text rendering as well (right now text rendering requires additional hardcoded layers).
- Fixed `complex-shape-system` demo scene by fixing `node_searcher_mask` layer.
- Fixed `SublayersModel::remove` - it was not clearing the `layer_placement` hashmap.
- Implemented disabling the wheel scrolling in `Navigator`, and refactored it to reduce the number of functions arguments by introducing a `NavigatorSettings` struct.

Video (`scroll_area` demo):


https://user-images.githubusercontent.com/6566674/164506455-e177a7a7-9f1c-4f50-888f-112423cebbe4.mp4

# Important Notes
- `InstanceWithAttachedLayer` is implemented in such a way that it allows an extension in the future - namely to use it to simplify text rendering. The implementation might be simplified though.
2022-04-27 11:35:30 +00:00
Kaz Wesley
d59710c3cd
Multi-process profiles. (#3395)
See: [#181837344](https://www.pivotaltracker.com/story/show/181837344).

I've separated this PR from some deeper changes I'm making to the profile format, because the changeset was getting too complex. The new APIs and tools in this PR are fully-implemented, except the profile format is too simplistic--it doesn't currently support headers that are needed to determine the relative timings of events from different processes.

- Adds basic support for profile files containing data collected by multiple processes.
- Implements `api_events_to_profile`, a tool for converting backend message logs (#3392) to the `profiler` format so they can be merged with frontend profiles (currently they can be merged with `cat`, but the next PR will introduce a merge tool).
- Introduces `message_beanpoles`, a simple tool that diagrams timing relationships between frontend and backend messages.

### Important Notes
- All TODOs introduced here will be addressed in the next PR that defines the new format.
- Introduced a new crate, `enso_profiler_enso_data`, to be used by profile consumers that need to refer to Enso application datatypes to interpret metadata.
- Introduced a `ProfileBuilder` abstraction for writing the JSON profile format; partially decouples the runtime event log structures from the format definition.
- Introducing the conversion performed for `ProfilerBuilder` uncovered that the `.._with_same_start!` low-level `profiler` APIs don't currently work; they return `Started<_>` profilers, but that is inconsistent with the stricter data model that I introduced when I implemented `profiler_data`; they need to return profilers in a created, unstarted state. Low-level async profilers have not been a priority, but once #3382 merges we'll have a way to render their data, which will be really useful because async profilers capture *why* we're doing things. I'll bring up scheduling this in the next performance meeting.
2022-04-21 16:44:03 +02:00
Ilya Bogdanov
ea33387836
Update electron-builder to v23.0.6 (#3410)
[ci no changelog needed]

[Task link](https://www.pivotaltracker.com/story/show/181944234).

It fixes the build issue on Mac OS 12.3.1 that is caused by removed `/usr/bin/python` executable.

Also applied `enso-formatter` to the sources.

# Important Notes
We're basically updating for one major `electron-builder` release - from `v22` to `v23`. I didn't spot anything in the changelog that could affect us. See features + breaking changes excerpt:

```
Features:

- feat(msi): add fileAssociation support for MSI target (https://github.com/electron-userland/electron-builder/pull/6530)
- feat(mac): ElectronAsarIntegrity in electron@15 - See: https://github.com/electron/electron/pull/30667 (https://github.com/electron-userland/electron-builder/issues/6506 https://github.com/electron-userland/electron-builder/issues/6507)
- feat(snap): add lzo to Snap compression options (also as new default) (https://github.com/electron-userland/electron-builder/pull/6201) Upgraded app-builder-bin dependency required newer version of Go
- feat(msi): support assisted installer for MSI target (https://github.com/electron-userland/electron-builder/pull/6550)

Breaking changes:

- Removing Bintray support since it was sunset. Ref: https://jfrog.com/blog/into-the-sunset-bintray-jcenter-gocenter-and-chartcenter/
- Fail-fast for windows signature verification failures. Adding -LiteralPath to update file path to disregard injected wildcards
- Force strip path separators for backslashes on Windows during update process
- Authentication for local mac squirrel update server
- Disabled advertised shortcuts, since MSIs with advertised Start Menu shortcuts that have a
Shortcut Property fails to install when deployed machine-wide via GPO but works fine in all
other contexts. Admins using advertisement must apply an MST to re-enable it. See https://github.com/electron-userland/electron-builder/issues/6508.
- Removing optional NSIS icon ID from config and generating it automatically to synchronize IDs with Advertised Shortcuts and future features
```
2022-04-21 11:36:32 +00:00
Michael Mauderer
e8342b04c3
Integrate Ensogl stats with profiling framework (#3388)
Add logging of EnsoGL performance stats to the profiling framework. Also extends the visualization in the debug scene to show an overview of the performance stats. We now render a timeline of blocks that indicate by their colour the rough FPS range we are in:

https://user-images.githubusercontent.com/1428930/162433094-57fbb61a-b502-43bb-8815-b7fc992d3862.mp4

# Important Notes
[ci no changelog needed]

Needs to be merged after https://github.com/enso-org/enso/pull/3382 as it requires some changes about metadata logging from there. That is why this PR is currently still in draft mode and based on that branch.
2022-04-21 09:38:26 +00:00
Michael Mauderer
24e0f33d8e
Backend Communication Profiling (#3382) 2022-04-19 13:30:29 +02:00
Wojciech Daniło
7d1af95745
Fixing regression - mouse buttons were not distinguished properly. (#3401) 2022-04-15 16:08:30 +02:00
Wojciech Daniło
d5d5d3aac5
Render on demand. (#3397) 2022-04-14 22:28:38 +02:00
Wojciech Daniło
fbe28db1d7
Revert "Revert "Fixed rate animation loop fixes"" (#3399) 2022-04-14 19:58:53 +02:00
Mateusz Czapliński
e75df61b2c
Component Group View with static header and without icons (#3373)
Add an initial version of the visual component for displaying the Component Group View. The component contains a header (for displaying the Group Name) and a list of labels (for displaying the component names).

https://www.pivotaltracker.com/story/show/181724889


#### Visuals

A screenshot from a debug scene demonstrating the component:

<img width="251" alt="Screenshot 2022-04-13 at 20 07 56" src="https://user-images.githubusercontent.com/273837/163243304-21c3ad78-4813-4368-b3bb-844d979da699.png">



Screenshots from other debug scenes (`list_view` and `text_area`), demonstrating that the other components still display correctly:

<img width="202" alt="Screenshot 2022-04-13 at 20 08 56" src="https://user-images.githubusercontent.com/273837/163243428-de9dc1c7-5a9f-45e0-9325-db60cece9768.png">


<img width="403" alt="Screenshot 2022-04-13 at 20 08 48" src="https://user-images.githubusercontent.com/273837/163243432-895061d9-5bd9-4349-8679-eb63b0f6724d.png">


A screenshot of the Node Searcher's list, showing that long entries in a ListView are now truncated, and an ellipsis character is added in place of removed characters:


<img width="651" alt="Screenshot 2022-04-13 at 20 10 16" src="https://user-images.githubusercontent.com/273837/163243664-5b671969-7aa0-4bef-8fd2-825602d85848.png">

# Important Notes
- Adding support for the text truncation feature in `ListView` required some changes in the`list_view::Entry`-related APIs.
- An embedded font was added (DejaVuSans-Bold) for use in the Component Group View debug scene, and 5 unused embedded fonts were removed.
2022-04-14 10:37:40 +00:00
Wojciech Daniło
0ab46bc6f8
Revert "Fixed rate animation loop fixes (#3396)" (#3398) 2022-04-13 19:56:35 +02:00
Wojciech Daniło
7a9ca10bb1
Fixed rate animation loop fixes (#3396) 2022-04-13 19:05:58 +02:00
Adam Obuchowicz
8ca4e2b003
SDF-based mechanism for making letters bold (#3385)
Fixes [181641027](https://www.pivotaltracker.com/story/show/181641027). There are new methods of text::Area for making some letters bolder, without moving them nor any other letters in the line.

Tested on DejaVuSans text:
![image](https://user-images.githubusercontent.com/3919101/162199723-524f7560-535f-4c98-bcb4-6b760ad8cb04.png)
![image](https://user-images.githubusercontent.com/3919101/162199806-e6582c56-3071-4653-8ad2-114df86cd6b7.png)
![image](https://user-images.githubusercontent.com/3919101/162199880-1836e902-8663-4696-bcb7-2b15c3c243c6.png)

On MacOS:
<img width="824" alt="Screenshot 2022-04-07 at 14 54 40" src="https://user-images.githubusercontent.com/3919101/162203730-ffda3096-7aab-443f-a45a-bfa18784ba36.png">
<img width="379" alt="Screenshot 2022-04-07 at 14 54 52" src="https://user-images.githubusercontent.com/3919101/162203751-f5ca2e26-fdb6-4521-9821-999111b80ac0.png">
<img width="160" alt="Screenshot 2022-04-07 at 14 54 58" src="https://user-images.githubusercontent.com/3919101/162203769-3c367f81-67bb-48aa-994c-42eeb131017e.png">
2022-04-12 17:39:08 +00:00
Wojciech Daniło
6b7622dd45
Multi-frame shader compilation (#3378) 2022-04-12 17:56:38 +02:00
Kaz Wesley
b32fedacd9
Profiling: intervals tool and devtools-file generator (#3359)
* Profiling: intervals tool

* devtools profile generator

* docs

* ignore open intervals, because devtools does

* intervals tool: show interval counts

* Re-add a doc comment. Was accidentally deleted.

* Implement review.

* DURATION_FLOOR_MS

* Rename methods that apply a profile's contents to self

* Description of chrome format

* Link to profile.json format documentation is design doc

* Implement profiling-level switch described in design doc

* lint
2022-04-11 06:08:09 -07:00
Ilya Bogdanov
fb52c1a9a2
Applying Magnet Alignment Algorithm to newly opened Component Browser (#3366)
[Task link](https://www.pivotaltracker.com/story/show/181076594)

This PR enables new node position adjustment using the Magnet Alignment algorithm for the following cases:

- When creating node with (+) button without nodes selected
- When creating node with "Mouse pointer dictated placement." not under the source node
- When the node is pushed left due to lack of space - only horizontally

The size of the `alignment area` around node is slightly enlarged, so that it's impossible to create a node that is being too close to other nodes.

Videos with AC demonstration:

https://user-images.githubusercontent.com/6566674/160565491-818b1705-43f8-41ab-abad-047031b2f9e5.mp4


https://user-images.githubusercontent.com/6566674/160565501-d2d4ea85-68c7-4385-9681-701ab86fdd98.mp4


https://user-images.githubusercontent.com/6566674/160565535-9cbeadfe-397b-4cf8-802a-1ec4148a70a2.mp4
2022-04-05 11:22:29 +00:00
Adam Obuchowicz
e5a7420b5a
The EnsoGL Component abstraction with special dropping behavior (#3322)
In this branch:
* The workaround for cursor-not-being-updated-after-closing-searcher bug (discovered while testing #3278) is reverted.
* The proper fix was introduced: created an abstraction for EnsoGL component, which, when dropping, will not immediately drop the FRP network and model, but instead put it into the Garbage Collector. The Collector ensures, that all "component hiding" effects and events will be handled, and drops FRP network and model only after that.
* I run clippy for wasm32 target out of curiosity. There was one warning, and I fixed it on this branch.
2022-04-04 15:55:55 +00:00
Mateusz Czapliński
3c5f8d714a
Placement of newly opened Component Browser when nodes are selected (#3361)
When a new node is created with the <kbd>TAB</kbd> key or by clicking the `(+)` on-screen button while multiple nodes are selected, place the new node below all the selected nodes. (Previously, the new node was placed below the node that was selected earliest.)

Additionally, when placing a new node below an existing non-error node with a visualization enabled, place the new node below the visualization. (Previously, the new node was placed to the left of the visualization.)

https://www.pivotaltracker.com/story/show/180887079

#### Visuals

The following screencast demonstrates the feature on various arrangements of selected nodes, with visualization enabled and disabled.

https://user-images.githubusercontent.com/273837/159971452-148aa4d7-c0f3-4b48-871a-a2783989f403.mov

The following screencast demonstrates that new nodes created by double-clicking an output port of a node with visualization enabled are now placed below the visualization:

https://user-images.githubusercontent.com/273837/160107733-e3f7d0f9-0161-49d1-8cbd-06e18c843a20.mov

# Important Notes
- Some refactorings that were needed for this PR were ported from the #3301 PR:
- the code responsible for calculating the positions of new nodes was moved to a separate module (`new_node_position`);
- the `free_place_finder` module was made a submodule of the `new_node_position` module, due to the latter being its only user.
2022-03-31 20:17:04 +00:00
Mateusz Czapliński
b8a5e22ef8
Placement of newly opened Component Browser dictated by the mouse pointer. (#3301)
Use a new algorithm for placement of new nodes in cases when:

- a) there is no selected node, and the `TAB` key is pressed while the mouse pointer is near an existing node (especially in an area below an existing node);
- b) a connection is dragged out from an existing node and dropped near the node (especially in an area below the node).

In both cases mentioned above, the new node will now be placed in a location suggested by an internal algorithm, aligned to existing nodes. Specifically, the placement algorithm used is similar to when pressing `TAB` with a node selected.

For more details, see: https://www.pivotaltracker.com/story/show/181076066

# Important Notes
- Visible visualizations enabled with the "eye icon" button are treated as part of a node. (In case of nodes with errors, visualizations are not visible, and are not treated as part of a node.)
2022-03-31 14:16:28 +00:00
Ilya Bogdanov
e9f3b2327e
GraphEditor Unit Tests (#3352)
[ci no changelog needed]

This PR adds a few simple unit tests for GraphEditor, that can be used as an example of native Unit Tests.

Covered:
1. Creating nodes
- By internal API
- By using a TAB shortcut
- By using (+) button
- By dropping edge
2. Connecting two nodes with an edge

Some APIs were extended to allow their testing.

Usage of `glyph::System` in `text/component/area` was disabled by conditional compilation, as this code can't be used in native code due to JS dependencies.
2022-03-30 12:49:07 +00:00
Wojciech Daniło
fbd80ad4a3
Allowing EnsoGL mouse to interact with more than 4096 sprites (#3369) 2022-03-30 04:50:55 +02:00
Mateusz Czapliński
7152e0d44d
Revert "Allowing EnsoGL mouse to interact with more than 4096 sprites at the same time. (#3351)" (#3368)
This reverts commit 546c333269.
2022-03-29 11:24:28 +02:00
Wojciech Daniło
546c333269
Allowing EnsoGL mouse to interact with more than 4096 sprites at the same time. (#3351) 2022-03-29 04:15:08 +02:00
Kaz Wesley
bec7a58a28
Build and memoize a GLSL prelude (#3365)
Saves ~375 ms during startup.
2022-03-25 17:49:26 -07:00