|
@@ -45,12 +45,14 @@ the _Model_ just observe and manipulate contents of the _ViewModel_.
|
|
|
|
|
|
More precisely:
|
|
|
|
|
|
-1. You provide the class for _ViewModel_ (`TrappedCounter` / `TrappedTodo`
|
|
|
+1. **ViewModel.** You provide the class for _ViewModel_ (`TrappedCounter` / `TrappedTodo`
|
|
|
in the examples). You can build it any way you wish, it has to be able to hold
|
|
|
all the data _ViewModel_ may need to hold. It can also hold some methods
|
|
|
for manipulation of these data, which is good for the example, but
|
|
|
in real project this should be the responsibility of _Model_.
|
|
|
-1. `Trapped` uses [`Axxord`][axxord] to implement a _blackboard_ pattern - in which
|
|
|
+1. **anApp start.** You should set up the blackboard in app startup method.
|
|
|
+(`CounterApp >> start` / `TodoApp >> start` in the examples).
|
|
|
+`Trapped` uses [`Axxord`][axxord] to implement a _blackboard_ pattern - in which
|
|
|
many external observers (called specialists) observe the data object
|
|
|
(called blackboard), make partial changes and react to them. To do that,
|
|
|
you must send `axxord:` to _ViewModel_ instance with an instance of `Axon`
|
|
@@ -62,24 +64,29 @@ to the blackboard, that is, the _ViewModel_).
|
|
|
In Todo example, one trivial specialist is created as well,
|
|
|
which observes for changes in todos and updates their remaining number.
|
|
|
In real world, it should be in _Model_ with other specialists.
|
|
|
-1. You write HTML and annotate the elements
|
|
|
+1. **index.html.** You write HTML and annotate the elements
|
|
|
with the data-binding expressions (attribute `data-trap`)
|
|
|
in which you describe what data to bind to (_path_)
|
|
|
and how to process it in the way to the user or from the user
|
|
|
(_processors_).
|
|
|
-1. Since you will likely use some non-trivial processors in HTML,
|
|
|
+1. **App package.** Since you will likely use some non-trivial processors in HTML,
|
|
|
(or in code via API which is also possible), your app package
|
|
|
should import 'trapped/Trapped-Processors'.
|
|
|
-1. When initializing the page, you must call `Trapped start: anArray`
|
|
|
+1. **anApp start.** When initializing the page, you must call `Trapped start: anArray`
|
|
|
where _anArray_ should contain instances of all blackboards (most often
|
|
|
-you will only have one, `blackboard` in the examples)
|
|
|
-that are intended to be used (`smalltalk.Trapped._start_([blackboard]);` JavaScript statement
|
|
|
-in HTML page in the examples).
|
|
|
-1. From that point on, you should only modify or watch data of the blackboard
|
|
|
+you will only have one, `viewModel` in the examples)
|
|
|
+that are intended to be used (`Trapped start: { viewModel }` final statement
|
|
|
+ of `start` method in the examples).
|
|
|
+1. **model** From that point on, you should only modify or watch data of the blackboard
|
|
|
using Axxord API. For the example, try this is Counter example:
|
|
|
-`blackboard axes: #((value)) transform: [ :old | console log: old. 2 * old ]`
|
|
|
+`(Trapped current byName: 'TrappedCounter')
|
|
|
+axes: #((value)) transform: [ :old | console log: old. 2 * old ]`
|
|
|
or this in the Todo example:
|
|
|
-`blackboard axes: #((todos) 1 done) transform: [ :state | state not ]`.
|
|
|
+`(Trapped current byName: 'TrappedTodo')
|
|
|
+axes: #((todos) 1 done) transform: [ :state | state not ]`.
|
|
|
+Of course, in real app, the model would be passed the view model instance
|
|
|
+and use it directly, not using `Trapped >> byName:` to read
|
|
|
+its blackboard registry.
|
|
|
|
|
|
[axxord]: https://lolg.it/herby/Axxord
|
|
|
|