HiveBrain v1.2.0
Get Started
← Back to all entries
patternjavascriptMinor

A hotel greeter named Alfred

Submitted by: @import:stackexchange-codereview··
0
Viewed 0 times
hotelalfredgreeternamed

Problem

Is there any way of improving this code? (Here's a JSFiddle with an example and comments)

Example: A hotel greeter can greet guests and accepts tips, but it's impossible to see the total of tips a greeter has received.


    
    
    
        

            []___  
           /    /\     O 
          /____/__\   /|\
          |[][]||||   / \
                     ALFRED

        
        Arrive at Hotel
        Tip Alfred $10
        
        var HOTEL, alfred;
        HOTEL = {}; // Namespace
        (function (HOTEL) {
            // Reuseable controller
            var controllerPrototype = {
                greet: function () {
                    this.model.view.innerHTML = '"' + this.model.greeting + '"';
                },
                acceptTip: function (tip) {
                    this.model.tips += tip;
                    this.model.view.innerHTML = '"' + this.model.thankyou + '"';
                }
            };
            // Create a new greeter
            HOTEL.newGreeter = function (view) {
                var controller = Object.create(controllerPrototype);
                controller.facet = function () {
                    var args, method;
                    method = arguments[0];
                    args = 2 
    


Goals:

  • Keep it DRY



  • Keep it MVC



  • Make sure anyone with access to a "greeter" can never manipulate the view or model directly.



Limitations:

  • To avoid clutter, avoid type checking to avoid simple errors unless it is necessary to guarantee integrity.



Some specific thoughts:

  • Is there a better way of passing model and view into the controller?



  • Is there a better way of communicating with the controller?



  • Is there a good way of making a more general view?



  • Any other improvements?

Solution

From the comments, I guess you would like a theoretical review ;)

-
This:

Arrive at Hotel
Tip Alfred $10


in my mind should be wired by the controller, that is, the linking of UI elements to data and UI changes

-
This:

greet: function () {
    this.model.view.innerHTML = '"' + this.model.greeting + '"';
},


has your controller access data straight in your view, updating the DOM. This is wrong in my mind. The view should have functions that the controller can call with either the model as a parameter or already passed in advance.

-
Object.create(controllerPrototype);

-
Not that it truly matters but, method === "model" will not catch new String('model')

-
args = [].slice.call(arguments, 1); works as well as the ternary

All in all, I think this could use some more polishing.

Code Snippets

<button onclick="javascript:alfred('greet')">Arrive at Hotel</button>
<button onclick="javascript:alfred('acceptTip', 10)">Tip Alfred $10</button>
greet: function () {
    this.model.view.innerHTML = '"' + this.model.greeting + '"';
},

Context

StackExchange Code Review Q#54515, answer score: 6

Revisions (0)

No revisions yet.