Model View Controller

1. Model View Controller INF 123 – Software architecture tdebeauv@uci.edu

2. MVC and separation of concerns • Model • State and logic • View • Display state to user • Controller • Translate user inputs into model logic • Simple, yet so many variants …

3. Outline • Vanilla MVC • Reactive MVC • Web MVC • Game MVC

4. Vanilla MVC

5. Vanilla MVC • Model • Unaware of the view(s) and controller(s) • View • Display only when notified by the controller • Aware of the model’s structure • Controller • Aware of the model’s structure • (Only works when receiving user inputs)

6. MVC != main and subroutines * There may be multiple views or controllers, but only one model.

7. Reactive MVC

8. Reactive MVC • Model • Smarter than usual: must be aware of the view(s) • Takes half of the controller’s job away • View • Register for notifications from the model • Only called by the model • Controller • Only updates the model • No more notifying the view

9. Reactive programming (low level) b = 1 c = 2 a = b + c print a # 1+2=3 b = 4 print a # 4+2=6 !!

10. Observer pattern (OO design pattern) • Most languages are non-reactive • So they need a design pattern

11. Observer pattern • A pattern frequently used for GUI widgets • Lower-level of abstraction (code) than MVC (overall system structure) • In reactive MVC, the view observes the model

12. Web MVC

13. Web MVC • Model • Usually very little logic (DB, data access objects, …) • Views • A puppet in the controller’s hands • Controller • Select which view will do the rendering • Fetch data from the model, and give it to the view • In other words: map each user input to a view, not to a model logic

14. Model 2/EJB-JSP-servlet • 2000s: Java is the rage • Mixes Java (server) and HTML (client)  <p>Counting to three:</p> <% for (inti=1; i<4; i++) { %> <p> This number is <%= i %>. </p> <% } %> <p>OK.</p> • 2010s: JavaScript is the rage, goodbye JSP!

15. Web MVC • HTML in your Java/python/C# • Or C#/python/Java in your HTML • Either way: not good

16. If you’re interested … • iOS Cocoa MVC • Enterprise Java Bean – Java Server Page – Servlet • ASP.NET MVC, Spring MVC, … • http://msdn.microsoft.com/en-us/library/dd381412%28VS.98%29.aspx • http://docs.spring.io/spring/docs/current/spring-framework-reference/html/mvc.html

17. Game MVC

18. Game MVC • Vanilla MVC where the loop wakes up everyone • Treat the loop/clock as a controller and you have vanilla MVC

19. Main loop m = Model() c = Controller(model) v = View(model) while not m.game_over: sleep(0.02) c.poll() m.update() v.display()

20. Model API m = Model() c = Controller(model) v = View(model) while not m.game_over: sleep(0.02) c.poll() m.update() v.display()

21. Controller API m = Model() c = Controller(model) v = View(model) while not m.game_over: sleep(0.02) c.poll() m.update() v.display()

22. View API m = Model() c = Controller(model) v = View(model) while not m.game_over: sleep(0.02) c.poll() m.update() v.display()

23. More refs • http://bowling-bash.blogspot.com/2011/09/mvc-for-games.html