Skip to content

Instantly share code, notes, and snippets.

@CodeVachon
Created June 9, 2015 17:44
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save CodeVachon/a02cb84ace8d5d3687f0 to your computer and use it in GitHub Desktop.
Save CodeVachon/a02cb84ace8d5d3687f0 to your computer and use it in GitHub Desktop.
Activity Board Step 1
var
express = require('express'),
app = express(),
server = require('http').Server(app),
io = require('socket.io')(server)
;
app.use( express.static(__dirname + '/public') );
server.listen(3030, function(){
console.log('listening on *:3030');
});
<html>
<head>
<title>Activity Board</title>
<script src="/socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script src="http://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/js/materialize.min.js"></script>
<script>
var socket = io();
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.96.1/css/materialize.min.css">
<style>
.ui-state-default { background-color: #fee; }
.ui-state-hover { background-color: #ffe; }
.bordered td { border: 1px #333 solid; }
</style>
</head>
<body>
<div class="container">
<h1>Activity Board</h1>
<table class="bordered" id="activity-board">
<thead>
<tr>
<th>Waiting</th>
<th>In Progress</th>
<th>Testing</th>
<th>Done</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="4">
<a href="#" class="waves-effect waves-light btn add-package">Add Package</a>
</td>
</tr>
</tfoot>
<tbody>
<tr>
<td class="step1"></td>
<td class="step2"></td>
<td class="step3"></td>
<td class="step4"></td>
</tr>
</tbody>
</table>
</div>
<div id="addActivity" class="modal modal-fixed-footer">
<div class="modal-content">
<h4>Add Activity</h4>
<form>
<div class="input-field col s12">
<input id="addActivity-name" type="text" class="validate">
<label for="addActivity-name">Activity</label>
</div>
</form>
</div>
<div class="modal-footer">
<a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat btn-save">Save</a>
<a href="#!" class="modal-action modal-close waves-effect waves-red btn-flat btn-cancel">Cancel</a>
</div>
</div><!-- close #addActivity.modal -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment