Model View Controller A Pattern that Many People Think They Understand, But Has A Couple Meanings.

Slides:



Advertisements
Similar presentations
JQuery MessageBoard. Lets use jQuery and AJAX in combination with a database to update and retrieve information without refreshing the page. Here we will.
Advertisements

CS0004: Introduction to Programming Visual Studio 2010 and Controls.
1 Microsoft Access 2002 Tutorial 9 – Automating Tasks With Macros.
OOP Design Patterns Chapters Design Patterns The main idea behind design patterns is to extract the high level interactions between objects and.
© by Pearson Education, Inc. All Rights Reserved.
Visual Basic 2010 How to Program. © by Pearson Education, Inc. All Rights Reserved.2.
Visual Basic 2010 How to Program Reference: Instructor: Maysoon Bin Duwais slides Visual Basic 2010 how to program by Deitel © by Pearson Education,
Copyright 2004 Monash University IMS5401 Web-based Systems Development Topic 2: Elements of the Web (g) Interactivity.
Automating Tasks With Macros
THEMIS Science Software Training1July 2007 The THEMIS Graphical User Interface J. McTiernan 23-Jul-2007
1 Model View Controller. 2 Outline Review Definitions of MVC Why do we need it? Administiriva Changing the display Event flow Dragging at interactive.
Automating Tasks With Macros. 2 Design a switchboard and dialog box for a graphical user interface Database developers interact directly with Access.
CSC 160 Computer Programming for Non-Majors Lecture #7: Variables Revisited Prof. Adam M. Wittenstein
Object-Oriented Analysis and Design
Fundamentals of Programming in Visual Basic 3.1 Visual basic Objects Visual Basic programs display a Windows style screen (called a form) with boxes into.
Generics, Proxy, and The Compile Time Type Checking Debate You are either with us or against us. Please snarf the code for today’s class.
Graphical User Interfaces A Quick Outlook. Interface Many methods to create and “interface” with the user 2 most common interface methods: – Console –
BTEc unit 12 software development
Lecture 7: Objects and Interaction 1  Principles of Interactive Graphics  CMSCD2012  Dr David England, Room 718,  ex 2271 
Copyright 2007, Information Builders. Slide 1 Maintain & JavaScript: Two Great Tools that Work Great Together Mark Derwin and Mark Rawls Information Builders.
Microsoft Visual Basic 2012 Using Procedures and Exception Handling CHAPTER SEVEN.
KRAD makes it easy to handle HTML events in your webpage. Kuali University: Apply Now Lab 6: Fun with HTML Events Lab Objectives HTML Events – what are.
1 Direct Manipulation Proposal 17 Direct Manipulation is when physical actions are used instead of commands. E.g. In a word document when the user inputs.
Kenny Trytek Joe Briggie Abby Birkett Derek Woods Advisor: Simanta Mitra Client: Matt Good, Kingland Systems.
Department of Mechanical Engineering, LSUSession VII MATLAB Tutorials Session VIII Graphical User Interface using MATLAB Rajeev Madazhy
Introduction to Visual Basic. Quick Links Windows Application Programming Event-Driven Application Becoming familiar with VB Control Objects Saving and.
Web Programming: Client/Server Applications Server sends the web pages to the client. –built into Visual Studio for development purposes Client displays.
CS101 Introduction to Computing Lecture Programming Languages.
‘Tirgul’ # 7 Enterprise Development Using Visual Basic 6.0 Autumn 2002 Tirgul #7.
Add sound effects to a presentation Play a sound file In this lesson, you’ll learn how to insert a sound file of your own or a sound effect from the clip.
Software Design 4.1 Tell, Don't Ask l Tell objects what you want them to do, do not ask questions about state, make a decision, then tell them what to.
(c) University of Washington08-1 CSC 143 Models and Views Reading: Ch. 18.
XP New Perspectives on Microsoft Windows 2000 Professional Windows 2000 Tutorial 1 1 Microsoft Windows 2000 Professional Tutorial 1 – Exploring the Basics.
How to Run a Scenario In HP LoadRunner >>>>>>>>>>>>>>>>>>>>>>
Creating Graphical User Interfaces (GUI’s) with MATLAB By Jeffrey A. Webb OSU Gateway Coalition Member.
Grade Book Database Presentation Jeanne Winstead CINS 137.
Model View Controller MVC Web Software Architecture.
MIT 6.893; SMA 5508 Spring 2004 Larry Rudolph Lecture 4: Graphic User Interface Graphical User Interface Larry Rudolph MIT 6.893; SMA 5508 Spring 2004.
CSC 230 (Blum)1 Visual Basic 2005 Hello World Fall 2005 T. Blum.
XP New Perspectives on Microsoft Office Access 2003 Tutorial 10 1 Microsoft Office Access 2003 Tutorial 10 – Automating Tasks With Macros.
13-Dec-15 HTML Style Bloopers. 2 What is good style? Good style, like good taste, is partly--but only partly--a matter of opinion Bad style is frequently.
Visual Basic for Application - Microsoft Access 2003 Programming applications using Objects.
Lesson 4.  After a table has been created, you may need to modify it. You can make many changes to a table—or other database object—using its property.
JavaScript Challenges Answers for challenges
CIS Intro to JAVA Lecture Notes Set July-05 GUI Programming –TextField Action Listeners, JEditorPane action listeners, HTML in a JEditorPane,
Creating a GUI Class An example of class design using inheritance and interfaces.
 An essential supporting structure of any thing  A Software Framework  Has layered structure ▪ What kind of functions and how they interrelate  Has.
L10: Model-View-Controller General application structure. User Interface: Role, Requirements, Problems Design patterns: Model – View – Controller, Observer/Observable.
When the program is first started a wizard will start to setup your Lemming App. Enter your company name and owner in the fields designated “Company Name”
Unit Testing & Code Coverage Please download and install EclEmma (link in resources section…I recommend Option 2) Also snarf the junit code for today’s.
Microsoft Visual C# 2010 Fourth Edition Chapter 3 Using GUI Objects and the Visual Studio IDE.
12-Jun-16 Event loops. 2 Programming in prehistoric times Earliest programs were all “batch” processing There was no interaction with the user Input Output.
Downloading and Installing GRASP-AF Workshop Ian Robson Information Analyst, North of England Cardiovascular Network.
Presented by Alexey Vedishchev Developing Web-applications with Grails framework American University of Nigeria, 2016 Intro To MVC Architecture.
Dive Into® Visual Basic 2010 Express
Development Environment
Event Loops and GUI Intro2CS – weeks
Documentation & Troubleshooting Guide
GUI Design and Coding PPT By :Dr. R. Mall.
Event loops 16-Jun-18.
Event Driven Programming
Event loops.
IBEX Client Migration to Eclipse 4
Event loops 17-Jan-19.
Event loops 17-Jan-19.
Event loops 8-Apr-19.
Model, View, Controller design pattern
Event loops.
Event loops.
Event loops 19-Aug-19.
Presentation transcript:

Model View Controller A Pattern that Many People Think They Understand, But Has A Couple Meanings

The Source of the Problem The “Model” We Want It to Be Completely Separate From the Other Thing Can potentially have several “views” – maybe a GUI interface and a web interface We want to test it independently Everyone agrees about this part. Please please please keep your model separate. If you do that, your design will be 90% of the way to being good.

Smalltalk-80 The very first GUI system. Also one of the first object-oriented languages.

A Completely Novel Problem If the right mouse button should be clicked here, what should it do?

Hmmm…seems like depends Click! 1.The user is clicking on a variety of different regions. Each reason has a different meaning. 2.Sometimes a click has a meaning for what we might think of as “the view” – it’s moving a window (say). It really has nothing related to taxes or whatever our program is meant to do. 3.Sometimes a click has a meaning for what me might think of “the model”. It means we should change the tax rate or load a file or whatever.

The View: Handles renderingThe Controller: Handles input An Exciting New Solution: The Controller The Model: Handles actual data The view gets updates using the observer pattern Updates the view based on input Updates the model based on input

The Controller Was Actually More Complex Than You Think

The Original Model View Controller A Good Idea Separated the Model from everything else The Controller handled User Input, but also was this smart object that knew about both the “Model” and the “View” And also how you built GUIs in Smalltalk (think of it as like Swing)

…but we don’t often think about GUIs in the same way today Our GUIs are collections of interacting “widgets”. We don’t usually think in terms of targeting mouse clicks but in terms of handling “events” like buttons being pressed.

How Does the Role of the Controller Change? 1.The controller needs to be (more/less) aware of updating the view. That is, it needs to be (more/less) aware of handling things like list box scrolling. 2.The controller needs tobe (more/less) aware of sub-widgets. That is, it needs to be (more/less) aware of creating (say) 8 different buttons and how they all should change the model (or view)

When you’re dealing with aggregated pre-built widgets You generally stop caring about details of input (e.g. where the mouse is) You generally have a ton of complexity setting up those pre-built widgets The “view” to the extent it is made by pre- built widgets, can’t know anything about your model

Model/View/Mediator The Model: Handles actual data The Mediator (a.k.a. Controller) : Sets Up and Maintains Relationship Between The View and Model. Often with tons of observers. The “View”: Just a bunch of glued- together widgets from a widget library

So We’re Done Right? The “New” MVC: Model View Mediator The Old MVC: Model View Controller

The “New” MVC: Model View Mediator This is potentially a terrible design

Two Scenarios You’ve got a banking application. The Model handles details of withdraws, deposits, etc. Consider these two situations: 1.The bank discovers that customers accidentally omit a period in their withdrawls. So they enter 7500 instead of dollars. A decision is made to pop up a warning dialog to ask them to confirm withdrawals of over 1000 dollars. Where should the code for bringing up this dialog go? 2.The bank discovers some customers have really old monitors and can’t use the new high resolution app. So we’re going to have two GUIs “standard” and “low-rez”. As the app starts, the resolution gets checked and the decision is made. M=1 V=2 C=3

The “New” MVC: Model View Mediator Coupled to both the view and model. Has a tendency to get fat. view-1/

The “New” MVC: Model View Mediator view-1/ Use lots of fancy design here to keep this extra thin

Keeping it Thin Try this scenario: – You’ve built two interfaces to Tivoo, a text based on that works on the console and a Java GUI one in Swing. – Think about selecting a file. Imagine that the file has a parse error. In the GUI version, you want to bring up a new window with the entire offending file in a scroll pane, the bad line highlighted. In the text version, you want to display the 2 lines around the offending line, with the line highlighted in a different text color – Think about what classes and functions exist in the model, the view, and the controller – How can you handle this in a way that’s generic: try { tivooParser.parseXML(document); } catch (ParserError p) { //what should go here //hint – I’ll want to call the controller //hint – we want as much in the model as possible, as much // in the view as possible }

The “New” MVC: Model View Mediator view-1/ Custom GUI Code, But Still Leaves As Much of the Thinking as Possible to the Model

Calendar – Detecting Too Near 1.The Calendar widget itself should not know about being “too near”. Instead, after a particular event is dropped on the calendar, the controller should run “validateNearness” on the calendar and pop up an error message if the nearness is violated. 2.The Calendar widget should not know about nearness, but should have an idea of “event drop problem” and “time to highlight with color”. As the user drags an event around the calendar, the controller should run “validatePossibleEventTime” and “getOptimalTime” on the model. Then the controller sets the highlights on the various parts of the calendar to indicate problems. 3.The Calendar widget should know about nearness, but it should query the model for (given a particular event) what it should highlight as the maximum nearness and time to highlight as optimal. 4.The Calendar widget should know about nearness, what the optimal distance between events is, and highlight it as the user moves and creates events. But it should get the values it uses for the maximum nearness and optimal distance from the model as it starts up.

Model View Coolthing

The “New” MVC: Model View Mediator Written in HTML/Javascript with embedded Ruby that uses fully featured Ruby objects from model Ruby on Rails Handles URL parsing, redirection, authentication, and also provides a “service friendly” interface Built to the service friendly interface. Returns Ruby objects from database

So We’re Done Right? The “New” MVC: Model View Mediator The Old MVC: Model View Controller THIN DUMB