Hi,
Towards the end of last year we worked on GT Connector, a new kind of interface that allows us to exercise and test the limits (or the lack thereof) of Bloc.
It looks like this:
You can see it in action here:
https://twitter.com/feenkcom/status/936109463462965248
In the current implementation, the Connector allows us to navigate and connect example methods. The focus is not on examples, but on the connections. We used examples because the engine was already around and offered us a nice use case. We want to extend it in the near future to other kinds of objects.
There are a couple of things that are worth noting:
• The editor works live, and the connection points appear and disappear as you type.
• The layout of the editor elements is based on a tree-based graph layout that only works with constrains (no actual visible edges between the editor elements).
• The editor works live, so adding new elements to the scene properly rearranges the scene.
• But, perhaps, the most exciting part is the fact that the lines connect an element from inside the text editor element with another that lives outside of the editor element.
All these validate the architecture of Bloc of having exactly one rendering tree. It was not an obvious goal a couple of years ago, but we are really happy that it works.
To put it in perspective, let's compare this with the html world. Text is text is rendered through the DOM tree. If you want graphics you might use something like SVG which comes with its own tree. However, these are two distinct worlds, and you cannot go from one to another, or at least not easily. This is the case in most engines we looked at.
Why is this important? One thing we learn in the Smalltalk world is that covering the same space with less concepts opens up a whole dimension of creativity that is simply not possible outside of it.
The goal with Bloc is to enable new kinds of user interfaces. As we are late to the game of modern interfaces, even though the field was invented in Smalltalk, our only chance to take the lead again is to rethink the model.
Let's look at the Connector again. In most user interfaces we have panes on the outside, and visuals confined within the boundaries of those panes. Interestingly, we can trace this pattern to the very first Smalltalk interfaces. In the Connector interface we have no boundaries with text and visualization being intertwined to form a new kind of workflow.
Talking about workflows, we now have two distinct and novel ways to explore examples: one is Connector, and the other one is the expandable code editor. For example, the scene from above looks like this in the example expanding editor:
Both of these interfaces are not found in other infrastructures, and yet they were both inexpensive to implement in Bloc.
We believe this will have a deep impact for all sorts of interfaces, and especially for the IDE. If you are interested in more details related to the IDE, take a look at the following paper from 2015:
http://scg.unibe.ch/archive/papers/Girb15b-PervasiveSoftwareVisualizations.…
Please let us know what you think.
Cheers,
The feenk team
--
www.tudorgirba.comwww.feenk.com
"What is more important: To be happy, or to make happy?"
Hi,
I saw this test failure in Moose.
REPConcernTest>>testDefaults
self assert: REPConcern new label = #REPConcern.
This comes from
Name: Arki-Reporter-Core-TudorGirba.24
Author: TudorGirba
Time: 30 December 2017, 11:32:57.176429 pm
UUID: 2944c23a-f71d-0d00-88a2-a4180f45ebf9
Ancestors: Arki-Reporter-Core-GuillaumeLarcheveque.23
improve label
Since it seems intentional, I will update the test to this:
REPConcernTest>>testDefaults
self assert: REPConcern new label = 'REP Concern'.
self assert: REPConcern new explanation = 'REP Concern'.
--
Cyril Ferlicot
https://ferlicot.fr
Hi,
Happy New Year!
We were asked about the roadmap of Bloc several times. It is a perfectly reasonable request given that Bloc is supposed to offer the UI infrastructure for the future of Pharo.
However, I was reluctant to provide one because we do not really have a classic roadmap. When we develop Bloc and GT we think in terms of experiments and examples that we want to play with to get us to our goal. Features are a consequence of that. This approach allowed us on multiple occasions to stumble across functional possibilities that we would have not been able to think about before seeing the experiments. It also works the other way around: as we move ahead, we sometime discover modeling problems and we sometimes chase them all the way down.
Having said that, we can specify the next examples and experiments that we consider for the next months. Here they are:
• Drag and drop that can be customized on an instance basis. In the process, revisit event management and explore making it use Announcements. Use this for the diagramming engine.
• Scrollbar for infinite list and the scalable element.
• Apply layout once. For example, this would allow us to apply a layout but still be able to drag elements in custom positions without disturbing the others. The first application is in the context of creating diagrams and visualizations.
• Apply layout with animation. For example, in Connector, a new example should be spawned and moved to its position through a smooth animation. This will also allow us to play with the concept of animation and MVVM.
• Introduce the concept of elevation. This is important for scenes in which we have overlapping elements that are not part of the composition tree. For example, in Connector, the lines connect inner elements inside the text, but they belong to the root. such as a visualization (but not only). For this to work, we need a better element traversing structure.
• Experiment with theming. The theming mechanism should be instance specific with per-widget defaults, and the theme values should ideally be injected in the widgets. The CSS implementation from Glenn is one direction. As developing and maintaining themes can be a nightmare in the long run, the theming mechanism to provide debugging tools.
• Experiment with delegating animations through the model. Typical MVVM or MVC focus on the behavior of an interaction. We want to get smooth live interfaces and the animation logic should be influence-able by the model. For example, hovering over a button, enlarges the button with extra details about the action.
• Basic widgets: list, input box, button, radio button, checkbox, menu, dropdown menu, toggling button, tabs, toolbar.
• Table and tree widgets.
• Pager interface (similar to the one in the current inspector) with resizable panes.
Have fun,
The feenk team
--
www.tudorgirba.comwww.feenk.com
"Presenting is storytelling."
I have:
```
a fastTree
act: [ :tree :projects | projects add. tree update ] iconName: #add on: $n
entitled: 'New Project';
…
```
The tree does not get updated with the new project, but if I close the
browser and reopen it is up to date. Ideas?
-----
Cheers,
Sean
--
Sent from: http://forum.world.st/Moose-f1310756.html
Hoi,
What is the best way for an object to delegate one or more GTInspector
views to other objects?
I have been using a pattern like this:
gtInspectorFooIn: composite
<gtInspectorPresentationOrder: 5>
otherObject gtInspectorFooIn: composite
but I am wondering whether there is a better way, and also whether this
method is valid (I've occasionally seen odd behavior, like Inspector panes
disappearing after I "Refresh", and I wonder if I could be somehow
confusing the model or if this is not relevant.)
also: Supposing this pattern is valid, is there an easy way to override the
title of the view(s) added by otherObject?
Howdy,
I have written a bunch of GTInspector extensions and I would like to get
error handling under control.
I have errors occuring in a few different contexts such as:
- Running gtInspectorFooIn: method
- Running display: block for a view
- Running column:evaluated: block for a table
and at the moment the symptoms are quite different e.g. Debugger dialog or
big red morphic error box.
How do other people handle errors in their views?
I feel like there are two approaches that would be ideal at different
times. The "user friendly" way would be to flag errors and keep them out of
the way -- e.g. skip views that error, skip table rows/columns/cells that
error, etc. The "developer friendly" way would be to hit the debugger as
early as possible in order to make a fix.
Thoughts / tips / links welcome :)
Cheers!
-Luke (still having a great time hacking inspector extensions)
The following won't display the action button unless the commented code is
un-commented:
browser transmit to: #list; andShow: [:a |
a list
"title: 'Filter and named action ';"
act: [:list | list update] iconName: #add on: $n entitled: 'Update' ].
Known issue?
-----
Cheers,
Sean
--
Sent from: http://forum.world.st/Moose-f1310756.html
Hi,
We are happy to announce GT Mondrian, a graph visualization engine built on top of Bloc.
It is similar to the original Mondrian and the Mondrian from Roassal, but it is different in that it is built directly out of Bloc elements. This is interesting because it allows us to combine typical widgets with visualizations. The other interesting thing about it is that it validates the design of Bloc: right now, the implementation has 509 lines of code (excluding graph-specific layouts). The goal is to make visualization a first class citizen and an integral part of the IDE.
The key ingredient that made this happen is that Bloc can now treat graph layouts, such as tree or force based, behave under the same rules as typical widget layouts, such as grid or flow. The challenge comes from the fact that a graph layout depends on the notion of edges between elements, and we did not want to have elements know about edges in the core of Bloc.
The solution was to split the typical edge implementation in graph visualization libraries into two distinct concepts:
• Line is an element that draws the connections.
• Edge defines constraints imposed by connections between elements.
Thus, edges form constraints, and constraints are what layouts deal with. That is one reason why elements in bloc have the ability of defining layout-specific constraints. Using this, we can nicely define edges between elements as a plugin to Bloc, but still be able to connect arbitrary elements. What's more, it turns out that we need constraints for other layouts as well. For example, an element in a grid layout might specify the span.
The API of GT Mondrian is similar to the one from Roassal, but there are a few differences as well. These are described in the Pillar documentation available in the GitHub repo.
The best way to experience GT Mondrian and its documentation is to load the GToolkit as described here:
https://github.com/feenkcom/gtoolkit
If you download the GT code through Iceberg, the documentation can be experienced live by inspecting:
'./pharo-local/iceberg/feenkcom/gtoolkit-visualizer/doc/mondrian/index.pillar' asFileReference
Cheers,
The feenk team
--
www.tudorgirba.comwww.feenk.com
"Quality cannot be an afterthought."