Skip to content

Commit

Permalink
Upload tutorial notes for Week #10
Browse files Browse the repository at this point in the history
  • Loading branch information
mtyiu committed Mar 26, 2016
1 parent 1fa04fd commit 9ed7137
Show file tree
Hide file tree
Showing 28 changed files with 312 additions and 24 deletions.
63 changes: 63 additions & 0 deletions js/jsonp-1.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
$( function() {
var timeout = null
var account = null
var latestOnly = true

var query = function() {
$.ajax( {
url : 'http://52.76.12.160:41400/jsonp/1' + ( $( '#account' ).val() != '' ? '/' + $( '#account' ).val() : '' ),
jsonp : 'callback',
dataType : 'jsonp',
success : function( data ) {
var html = ''
var sid = []
for ( var d in data ) {
html += '<tr'
if ( sid.indexOf( data[ d ].s ) !== -1 ) {
html += ' class="not-latest"'
} else {
html += ' class="latest"'
sid.push( data[ d ].s )
}
html += (
'>' +
'<td>' + data[ d ].i + '</td>' +
'<td>' + data[ d ].t + '</td>' +
'<td>' + data[ d ].s + '</td>' +
'<td>' + data[ d ].h + '</td>' +
'</tr>'
)
}
if ( html == '' )
html = '<tr><td colspan="4"><p class="text-center lead">No records</p></td></tr>'

$( '#list' ).html( html )

$( '#show-latest' ).change()

$( '#submission' ).html( $( '.latest' ).length )
$( '#percent' ).html( ( $( '.latest' ).length / 63 * 100 ).toFixed( 1 ) )

timeout = setTimeout( query, 2000 )
}
} )
}
query()

var filter = function( e ) {
e.preventDefault()
clearTimeout( timeout )
account = $( '#account' ).val() != '' ? $( '#account' ).val() : null
query()
}
$( '#filter-form' ).submit( filter )
$( '#account' ).blur( filter )

$( '#show-latest' ).change( function() {
latestOnly = this.checked
if ( latestOnly )
$( '.not-latest' ).hide()
else
$( '.not-latest' ).show()
} )
} )
2 changes: 1 addition & 1 deletion js/jsonp.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ $( function() {

var query = function() {
$.ajax( {
url : 'http://52.76.12.160:41400/jsonp/1' + ( $( '#account' ).val() != '' ? '/' + $( '#account' ).val() : '' ),
url : 'http://52.76.12.160:41400/jsonp/2' + ( $( '#account' ).val() != '' ? '/' + $( '#account' ).val() : '' ),
jsonp : 'callback',
dataType : 'jsonp',
success : function( data ) {
Expand Down
2 changes: 1 addition & 1 deletion json/metadata.json
Original file line number Diff line number Diff line change
Expand Up @@ -36,5 +36,5 @@
}
],
"created" : "14 January 2016",
"lastModified" : "17 March 2016"
"lastModified" : "26 March 2016"
}
1 change: 1 addition & 0 deletions json/news.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
[
{ "date" : "Mar 26", "content" : "The tutorial notes for Week #10 are uploaded." },
{ "date" : "Mar 17", "content" : "The tutorial recordings for Week #9 are uploaded." },
{ "date" : "Mar 16", "content" : "The tutorial recordings for Week #9 are uploaded." },
{ "date" : "Mar 14", "content" : "Update tutorial schedule." },
Expand Down
60 changes: 40 additions & 20 deletions json/tutorials.json
Original file line number Diff line number Diff line change
Expand Up @@ -229,7 +229,7 @@
"week" : 9,
"date" : "17 March 2016",
"theme" : "Assignment 2: Back-end development & Node.js",
"display" : true,
"display" : false,
"topics" : [
{
"title" : "YouTube IFrame Player API",
Expand Down Expand Up @@ -277,29 +277,55 @@
"week" : 11,
"date" : "29 March 2016 (Lecture Time)",
"theme" : "Assignment 2: Node.js, Express, WebSocket & Socket.IO",
"display" : false,
"display" : true,
"topics" : [
{
"title" : "Learning the Basics of Node.js",
"note" : "Continued...Please find the download link in Week #9."
},
{
"title" : "Express Web Framework",
"downloads" : null
"outline" : [
"What is Express?",
"Getting started",
"Routing",
"Using middleware",
"Miscellaneous"
],
"downloads" : [
{ "type" : "pdf", "name" : "Download Notes", "link" : "tutorials/9/express.pdf" },
{ "type" : "zip", "name" : "Example Code", "link" : "tutorials/9/example_code.zip" },
{ "type" : "github", "name" : "Example Code", "link" : "https://github.com/mtyiu/csci4140-spring16/tree/gh-pages/tutorials/9/example_code" }
],
"recommendation" : {
"The Unbelievable History of the Express JavaScript Framework" : "http://thefullstack.xyz/history-express-javascript-framework/"
}
},
{
"title" : "WebSocket and Socket.IO",
"downloads" : null,
"recommendations" : [
{ "name" : "N-Mario", "href" : "https://cherrry.github.io/N-Mario" },
{ "name" : "GitHub (Client Side)", "href" : "https://github.com/cuhk-csci4140/N-Mario" },
{ "name" : "GitHub (Server Side)", "href" : "https://github.com/cuhk-csci4140/Node-Mario" },
{ "name" : "Video", "href" : "https://www.youtube.com/watch?v=cPkCh6Z9aQ4" }
"title" : "Building a chat room with Socket.IO in 20 minutes",
"outline" : [
"What is WebSocket?",
"What is Socket.IO?",
"Building a chat room with Socket.IO in 20 minutes",
"Lab 1: Display chat room UI",
"Lab 2: Integrate Socket.IO",
"Lab 3: Single chat room",
"Lab 4: Multiple chat rooms",
"Namespaces and rooms in Socket.IO",
"Socket.IO in Assignment 2"
],
"downloads" : [
{ "type" : "pdf", "name" : "Download Notes", "link" : "tutorials/9/websocket-socket-io.pdf" },
{ "type" : "zip", "name" : "Example Code", "link" : "https://github.com/mtyiu/socket-io-chat/archive/master.zip" },
{ "type" : "github", "name" : "Example Code", "link" : "https://github.com/mtyiu/socket-io-chat" },
{ "type" : "html", "name" : "Demo Page", "link" : "https://socket-io-chatroom.herokuapp.com/" }
]
},
{
"title" : "Deploying Node.js Applications on Heroku",
"downloads" : null
"downloads" : [
{ "type" : "pdf", "name" : "Download Notes", "link" : "tutorials/9/deploy-nodejs-heroku.pdf" }
]
}
]
},
Expand Down Expand Up @@ -341,7 +367,7 @@
},
{
"title" : "Submission Guideline",
"downloads" : [ { "type" : "link", "name" : "View Notes (HTML)", "link" : "https://github.com/mtyiu/csci4140-spring16/blob/gh-pages/tutorials/2/git/README.md" } ]
"downloads" : [ { "type" : "link", "name" : "View Notes (MD)", "link" : "https://github.com/mtyiu/csci4140-spring16/blob/gh-pages/tutorials/2/git/README.md" } ]
}
]
},
Expand All @@ -360,13 +386,7 @@
{
"week" : 14,
"date" : "21 April 2016",
"theme" : "Backbone.js & RESTful APIs",
"display" : false,
"topics" : [
{
"title" : "Developing Backbone.js Applications",
"note" : "Continued...Please find the download link in Week #13."
}
]
"theme" : "To be determined",
"display" : false
}
]
88 changes: 88 additions & 0 deletions status-1.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
if (window.location.protocol != 'http:' )
window.location.href = 'http:' + window.location.href.substring( window.location.protocol.length );
</script>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/font-awesome.min.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
<link href="favicon.png" rel="icon" type="image/png" />
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<script src="js/ga.js"></script>
<script src="js/jquery.min.js"></script>
<style>
@media (min-width: 992px) {
.checkbox {
text-align: right;
padding-right: 10px;
}
}
</style>
<title>CSCI 4140: Open-Source Software Project Development - Submission Status</title>
</head>
<body>
<div class="container">
<header>
<h3>
<small>CSCI 4140<span class="visible-sm-inline visible-md-inline visible-lg-inline">: Open-Source Software Project Development</span> (Spring 2016)</small><br />
<span>Assignment 1: Web Instagram</span> - Submission Status
</h3>
<p><strong>Deadline: 23:59, 2016 March 16 (Wed)</strong></p>
<p><strong>Number of submissions:</strong> <span id="submission">0</span> / 63 (<span id="percent"></span>%)</p>
<hr />
</header>

<div class="row">
<div class="col-sm-6">
<form class="form-inline" id="filter-form">
<div class="form-group">
<label for="account" style="padding-right: 10px;">Filter by GitHub Account:</label>
<input type="text" class="form-control" id="account" value="" />
</div>
<button type="submit" class="btn btn-default">Filter</button>
</form>
<div class="visible-xs visible-sm"><br /></div>
</div>
<div class="col-sm-6">
<div class="checkbox">
<label>
<input type="checkbox" id="show-latest" checked /> Show Latest Submissions Only
</label>
</div>
</div>
</div>
<hr />

<div class="table-responsive">
<table class="table table-hover">
<thead>
<th width="10%">#</th>
<th width="30%">Submission Time</th>
<th width="20%">Student ID</th>
<th width="40%">Latest Commit</th>
</thead>
<tbody id="list">
<tr>
<td colspan="4"><p class="text-center lead">Loading...</p></td>
</tr>
</tbody>
</table>
</div>

<p class="text-muted">
<strong>Note:</strong> We only accept submission at the <code>master</code> branch.
</p>
</div>
<script src="js/bootstrap.min.js"></script>
<script src="js/jsonp-1.js"></script>
<script src="js/custom.js"></script>
</body>
</html>
4 changes: 2 additions & 2 deletions status.html
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,9 @@
<header>
<h3>
<small>CSCI 4140<span class="visible-sm-inline visible-md-inline visible-lg-inline">: Open-Source Software Project Development</span> (Spring 2016)</small><br />
<span>Assignment 1: Web Instagram</span> - Submission Status
<span>Assignment 2: Youtube Remote</span> - Submission Status
</h3>
<p><strong>Deadline: 23:59, 2016 March 16 (Wed)</strong></p>
<p><strong>Deadline: 23:59, 2016 April 17 (Sun)</strong></p>
<p><strong>Number of submissions:</strong> <span id="submission">0</span> / 63 (<span id="percent"></span>%)</p>
<hr />
</header>
Expand Down
Binary file added tutorials/9/deploy-nodejs-heroku.pdf
Binary file not shown.
Binary file added tutorials/9/example_code.zip
Binary file not shown.
1 change: 1 addition & 0 deletions tutorials/9/example_code/README.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Please run "npm install" before executing the application.
11 changes: 11 additions & 0 deletions tutorials/9/example_code/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{
"name": "ExpressDemo",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node server.js"
},
"dependencies": {
"express": "~4.11.1"
}
}
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 8 additions & 0 deletions tutorials/9/example_code/public/stylesheets/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
body {
padding: 50px;
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}

a {
color: #00B7FF;
}
11 changes: 11 additions & 0 deletions tutorials/9/example_code/routes/alice.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
var router = require( 'express' ).Router();

router.get( '/', function( request, response ) {
response.send( '[/alice] Home' );
});

router.get( '/whoami', function( request, response ) {
response.send( '[/alice/whoami] I am Alice!' );
});

module.exports = router;
11 changes: 11 additions & 0 deletions tutorials/9/example_code/routes/bob.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
var router = require( 'express' ).Router();

router.get( '/', function( request, response ) {
response.send( '[/bob] Home' );
});

router.get( '/whoami', function( request, response ) {
response.send( '[/bob/whoami] I am Bob!' );
});

module.exports = router;
47 changes: 47 additions & 0 deletions tutorials/9/example_code/server.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
var express = require( 'express' );
var app = express();

app.use( express.static( __dirname + '/public' ) );

// Set up root-level routes
// ------------------------
app.get( '/', function ( request, response ) {
response.send( 'Hello World!' );
} );

app.get( '/preview', function ( request, response ) {
response.sendFile( __dirname + '/views/player.html' );
} );

app.get( '/message/:message', function ( request, response ) {
response.send( 'The message: ' + request.params.message );
} );

app.get( '/room/:id([0-9]+)', function ( request, response ) {
response.send( 'The room number is: ' + request.params.id );
} );

// Demonstrating Jade templating engine
// ------------------------------------
app.set( 'views', __dirname + '/views' );
app.set( 'view engine', 'jade' );
app.get( '/hi', function ( request, response ) {
response.render( 'index',
{ title: 'Hey', message: 'Hello there!' } );
} );

// Load external routes
// --------------------
var alice = require( './routes/alice' );
var bob = require( './routes/bob' );
app.use( '/alice', alice );
app.use( '/bob', bob );


// Start the server
// ----------------
var server = app.listen( 4140, function () {
var host = server.address().address;
var port = server.address().port;
console.log( 'Listening at http://%s:%s', host, port );
} );
6 changes: 6 additions & 0 deletions tutorials/9/example_code/views/error.jade
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
extends layout

block content
h1= message
h2= error.status
pre #{error.stack}
5 changes: 5 additions & 0 deletions tutorials/9/example_code/views/index.jade
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
html
head
title!= title
body
h1!= message
Loading

0 comments on commit 9ed7137

Please sign in to comment.