WebFund 2013F: Tutorial 7: Difference between revisions

From Soma-notes
No edit summary
 
(7 intermediate revisions by the same user not shown)
Line 3: Line 3:
* What node functionality has been omitted from this application relative to the other ones we have covered this term?
* What node functionality has been omitted from this application relative to the other ones we have covered this term?
* How would you get this application to run?
* How would you get this application to run?
* Where are functions being defined?  Called?
* What is the control flow of this application?  How does control pass between the browser and the application server?  What functions are called at each stage?
The midterm will primarily cover this code.  So this is your chance to prepare.  Good luck!
The midterm will primarily cover this code.  So this is your chance to prepare.  Good luck!


Line 20: Line 22:
}
}
</source>
</source>


===app.js===
===app.js===
<source line lang="javascript">
<source line lang="javascript">
var express = require('express'), http = require('http'),
var express = require('express'), http = require('http'),
     path = require('path'), app = express();
     app = express();


var i, theRoom, loggedInUsers = {};
var i, theRoom, loggedInUsers = {};
Line 59: Line 62:
app.set('views', __dirname);
app.set('views', __dirname);
app.set('view engine', 'jade');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.cookieParser('COMP2406 is confusing!'));
app.use(express.cookieParser('COMP2406 is confusing!'));
app.use(express.session());
app.use(express.session());
app.use(app.router);
if ('development' == app.get('env')) { app.use(express.errorHandler()); }


app.get('/', index);
app.get('/', index);
Line 80: Line 79:
</source>
</source>


===index.jade===
===room.jade===
<source line lang="javascript">
<source line lang="html4strict">
doctype 5
doctype 5
html
html
Line 97: Line 96:
       button(type="submit") Quit
       button(type="submit") Quit
</source>
</source>


===index.jade===
===index.jade===
<source line lang="javascript">
<source line lang="html4strict">
doctype 5
doctype 5
html
html

Latest revision as of 15:56, 18 October 2013

Today you should spend your time understanding the following code. This is a complete node application. Consider the following:

  • What does each line do? Specifically, what errors/loss of functionality would you lose if you remove any line?
  • What node functionality has been omitted from this application relative to the other ones we have covered this term?
  • How would you get this application to run?
  • Where are functions being defined? Called?
  • What is the control flow of this application? How does control pass between the browser and the application server? What functions are called at each stage?

The midterm will primarily cover this code. So this is your chance to prepare. Good luck!

package.json

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.4.0",
    "jade": "*"
   }
}


app.js

var express = require('express'), http = require('http'),
    app = express();

var i, theRoom, loggedInUsers = {};
var rooms = { activeRooms: ['sickbay', 'engineering'],
              engineering: { title: "Engineering", roomExits: ['sickbay'] },
              sickbay: { title: "Sickbay", roomExits: ['engineering'] } };

function index(req, res) {
    if (req.session.player) {
        res.redirect("/" + req.session.currentRoom);
    } else {
        res.render('index', { title: 'COMP 2406 Small Adventure Demo', 
                              error: req.query.error }); }}

function start(req, res) {
    req.session.player = req.body.player;
    res.redirect("/engineering") }

function quit(req, res) {
    req.session.destroy();
    res.redirect("/"); }

function makeRoomHandler(name, contents) {
    handler = function(req, res) {
        if (req.session.player) {
            req.session.currentRoom = name;
            res.render("room.jade", {title: contents.title,
                                     roomExits: contents.roomExits,
                                     player: req.session.player});
        } else { res.redirect("/"); }}
    return handler; }

app.set('port', process.env.PORT || 3000);
app.set('views', __dirname);
app.set('view engine', 'jade');
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.cookieParser('COMP2406 is confusing!'));
app.use(express.session());

app.get('/', index);
app.post("/start", start);
app.post("/quit", quit);
for (i = 0; i<rooms.activeRooms.length; i++) {
    theRoom = rooms.activeRooms[i];
    app.get('/' + theRoom,
            makeRoomHandler(theRoom, rooms[theRoom])); }

http.createServer(app).listen(app.get('port'), function(){
    console.log('Express server listening on port ' + app.get('port')); });

room.jade

doctype 5
html
  head
    title= title
  body
    h1= title
    p You're on a ship, player.
    p Go to:
    ul
      each theExit in roomExits
        li
          a(href= theExit) #{theExit}
    form(action="/quit", method="post")
      button(type="submit") Quit


index.jade

doctype 5
html
  head
    title= title
  body
    h1= title
    p Welcome to the #{title}
    p Please choose your player name
    div
      form(action="/start", method="post")
          div
            input(type="text", name="player")          
            label.add-on(for="player") Player Name
          button(type="submit") Start