The TodoMVC "rosetta stone" app - implemented using Object Oriented Controllers. This diagram shows the event flow, visualised using using literate code mapping.
Notice how effective colours are in following the event flow.
The role of the App - this is important and mostly overlooked. Whilst it is fine to wire Controllers directly to model instances, you will also need to create a more centralised class - the "App" to hold business logic which manipulates the model. The App can also hold "view state" like the state of the "filter" in this Todo application.
GUI events from DOM and
Internal events from model and other controllers
their job is to handle the gui encoding/decoding and then delegate as soon as possible to the model or to the app.
The Model is dumb and doesn't know about GUI of course, nor about app.
The App holds refs to models and creates controllers.
The wiring/registering/listening of controllers to events happens in controllers themselves, though could potentially be centralised and done by the App.
The App can hold visual model state e.g. current 'filter'
Controllers point back to app, in order to get at this state if needed.
There will be a more detailed article on Medium to accompany this diagram, later in 2020. The code is open source on Github.
Modules being visualised
List of repository modules/files being visualised in the above diagram: