Browse Source

model -> viewModel. README fixes.

Herbert Vojčík 6 years ago
parent
commit
425a5dd5f7

+ 18 - 11
README.md

@@ -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
 

+ 6 - 6
example-counter/src/Trapped-Counter.js

@@ -21,24 +21,24 @@ selector: "start",
 protocol: "startup",
 fn: function (){
 var self=this,$self=this;
-var model;
+var viewModel;
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
 return $core.withContext(function($ctx1) {
 //>>excludeEnd("ctx");
-model=$recv($globals.TrappedCounter)._new();
+viewModel=$recv($globals.TrappedCounter)._new();
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
 $ctx1.sendIdx["new"]=1;
 //>>excludeEnd("ctx");
-$recv(model)._axxord_($recv($globals.SimpleAxon)._new());
-$recv($globals.Trapped)._start_([model]);
+$recv(viewModel)._axxord_($recv($globals.SimpleAxon)._new());
+$recv($globals.Trapped)._start_([viewModel]);
 return self;
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
-}, function($ctx1) {$ctx1.fill(self,"start",{model:model},$globals.CounterApp)});
+}, function($ctx1) {$ctx1.fill(self,"start",{viewModel:viewModel},$globals.CounterApp)});
 //>>excludeEnd("ctx");
 },
 //>>excludeStart("ide", pragmas.excludeIdeData);
 args: [],
-source: "start\x0a\x09| model |\x0a\x09model := TrappedCounter new.\x0a\x09model axxord: SimpleAxon new.\x0a\x09Trapped start: { model }",
+source: "start\x0a\x09| viewModel |\x0a\x09viewModel := TrappedCounter new.\x0a\x09viewModel axxord: SimpleAxon new.\x0a\x09Trapped start: { viewModel }",
 referencedClasses: ["TrappedCounter", "SimpleAxon", "Trapped"],
 //>>excludeEnd("ide");
 messageSends: ["new", "axxord:", "start:"]

+ 4 - 4
example-counter/src/Trapped-Counter.st

@@ -7,10 +7,10 @@ Object subclass: #CounterApp
 !CounterApp methodsFor: 'startup'!
 
 start
-	| model |
-	model := TrappedCounter new.
-	model axxord: SimpleAxon new.
-	Trapped start: { model }
+	| viewModel |
+	viewModel := TrappedCounter new.
+	viewModel axxord: SimpleAxon new.
+	Trapped start: { viewModel }
 ! !
 
 !CounterApp class methodsFor: 'startup'!

+ 7 - 7
example-todo/src/Trapped-Todo.js

@@ -21,7 +21,7 @@ selector: "start",
 protocol: "startup",
 fn: function (){
 var self=this,$self=this;
-var model,axon;
+var viewModel,axon;
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
 return $core.withContext(function($ctx1) {
 //>>excludeEnd("ctx");
@@ -30,7 +30,7 @@ $1=$recv($globals.TrappedTodo)._new();
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
 $ctx1.sendIdx["new"]=1;
 //>>excludeEnd("ctx");
-model=$recv($globals.Axolator)._on_($1);
+viewModel=$recv($globals.Axolator)._on_($1);
 axon=$recv($globals.SimpleAxon)._new();
 $recv(axon)._addInterest_($recv($globals.TrappedPosition)._interestOn_block_([["todos"], nil],(function(){
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
@@ -45,7 +45,7 @@ $recv((function(){
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
 return $core.withContext(function($ctx2) {
 //>>excludeEnd("ctx");
-return $recv(model)._axes_transform_([["todos"]],(function(){
+return $recv(viewModel)._axes_transform_([["todos"]],(function(){
 return [$globals.HashedCollection._newFromPairs_(["text","learn trapped","done",true]),$globals.HashedCollection._newFromPairs_(["text","build a trapped app","done",false])];
 
 }));
@@ -53,16 +53,16 @@ return [$globals.HashedCollection._newFromPairs_(["text","learn trapped","done",
 }, function($ctx2) {$ctx2.fillBlock({},$ctx1,2)});
 //>>excludeEnd("ctx");
 }))._valueWithTimeout_((2000));
-$recv(model)._axxord_(axon);
-$recv($globals.Trapped)._start_([model]);
+$recv(viewModel)._axxord_(axon);
+$recv($globals.Trapped)._start_([viewModel]);
 return self;
 //>>excludeStart("ctx", pragmas.excludeDebugContexts);
-}, function($ctx1) {$ctx1.fill(self,"start",{model:model,axon:axon},$globals.TodoApp)});
+}, function($ctx1) {$ctx1.fill(self,"start",{viewModel:viewModel,axon:axon},$globals.TodoApp)});
 //>>excludeEnd("ctx");
 },
 //>>excludeStart("ide", pragmas.excludeIdeData);
 args: [],
-source: "start\x0a\x09| model axon |\x0a\x09model := Axolator on: TrappedTodo new.\x0a    axon := SimpleAxon new.\x0a\x09\x0a\x09axon addInterest: (TrappedPosition\x0a\x09\x09interestOn: #((todos) nil)\x0a\x09\x09block: [ axon changed: #((remaining)) ]).\x0a\x0a    [ model axes: #((todos)) transform: [{\x0a        #{'text'->'learn trapped'. 'done'->true}.\x0a        #{'text'->'build a trapped app'. 'done'->false}\x0a    }]] valueWithTimeout: 2000.\x0a\x0a\x09model axxord: axon.\x0a\x09Trapped start: { model }",
+source: "start\x0a\x09| viewModel axon |\x0a\x09viewModel := Axolator on: TrappedTodo new.\x0a    axon := SimpleAxon new.\x0a\x09\x0a\x09axon addInterest: (TrappedPosition\x0a\x09\x09interestOn: #((todos) nil)\x0a\x09\x09block: [ axon changed: #((remaining)) ]).\x0a\x0a    [ viewModel axes: #((todos)) transform: [{\x0a        #{'text'->'learn trapped'. 'done'->true}.\x0a        #{'text'->'build a trapped app'. 'done'->false}\x0a    }]] valueWithTimeout: 2000.\x0a\x0a\x09viewModel axxord: axon.\x0a\x09Trapped start: { viewModel }",
 referencedClasses: ["Axolator", "TrappedTodo", "SimpleAxon", "TrappedPosition", "Trapped"],
 //>>excludeEnd("ide");
 messageSends: ["on:", "new", "addInterest:", "interestOn:block:", "changed:", "valueWithTimeout:", "axes:transform:", "axxord:", "start:"]

+ 5 - 5
example-todo/src/Trapped-Todo.st

@@ -7,21 +7,21 @@ Object subclass: #TodoApp
 !TodoApp methodsFor: 'startup'!
 
 start
-	| model axon |
-	model := Axolator on: TrappedTodo new.
+	| viewModel axon |
+	viewModel := Axolator on: TrappedTodo new.
     axon := SimpleAxon new.
 	
 	axon addInterest: (TrappedPosition
 		interestOn: #((todos) nil)
 		block: [ axon changed: #((remaining)) ]).
 
-    [ model axes: #((todos)) transform: [{
+    [ viewModel axes: #((todos)) transform: [{
         #{'text'->'learn trapped'. 'done'->true}.
         #{'text'->'build a trapped app'. 'done'->false}
     }]] valueWithTimeout: 2000.
 
-	model axxord: axon.
-	Trapped start: { model }
+	viewModel axxord: axon.
+	Trapped start: { viewModel }
 ! !
 
 !TodoApp class methodsFor: 'startup'!