Design

Mockup

https://app.moqups.com/axel.vonarnim@fortiss.org/XY9iUeXpzB/view/page/a9eac1d81

Class and Module Design

The overall design follows a standard Model-View-Controller design pattern, slightly extended by mediators, a command stack, and assets interactions (cf. glossary bellow). Source of inspiration: http://hecodes.com/2016/07/using-mvc-pattern-for-building-complex-three-js-applications/

Glossary

• Asset: An asset contain the graphical representation (mesh, material, transforms, textures, ...)
• Commands: A command is an operation which should be applied on the model. A command should be revertible. A stack of command is stored to deal cleanly with the Undo/Redo operations.
• Mediator: A mediator is responsible in listening the model modification and apply any change on the corresponding ThreeJS objects and HTML DOM.
• Part: A part is an object added to the robot container - equivalent to the Webots PROTO instance
• Robot: The main container, always present.
• Template: Contains the description of the part parameters (is it a root node, what are its open slots, what types are accepted, are there other parameters, etc.) - equivalent to the Webots PROTO