WebFund 2013F: Tutorial 7: Difference between revisions

From Soma-notes
No edit summary
No edit summary
 
(12 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!


===package.json===
===package.json===
<source line lang="javascript">
<source line lang="javascript">
{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.4.0",
    "jade": "*"
  }
}
</source>
</source>


Line 12: Line 26:
===app.js===
===app.js===
<source line lang="javascript">
<source line lang="javascript">
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')); });
</source>
</source>


 
===room.jade===
===index.jade===
<source line lang="html4strict">
<source line lang="javascript">
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
</source>
</source>




===room.jade===
===index.jade===
<source line lang="javascript">
<source line lang="html4strict">
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
</source>
</source>

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