chris-lin · seanlin0324 · Aug 9, 2012 · Aug 13, 2012 · Aug 13, 2012
diff --git a/app.js b/app.js
@@ -1,7 +1,7 @@
 /**
  * Module dependencies.
  */
- 
+
 var express = require('express')
   , stylus = require('stylus')
   , nib = require('nib')
@@ -10,8 +10,8 @@ var express = require('express')
 var app = module.exports = express.createServer();
 
 // mongoose setup
-require( './db' );  
-  
+require( './db' );
+
 // autoentication setup
 var auth = require( './auth' );
 
@@ -31,7 +31,7 @@ var compile = function (str, path) {
 // Configuration
 app.configure(function(){
   app.set('views', __dirname + '/views');
-  app.set('view engine', 'jade');
+  app.set('view engine', 'ejs');
   app.use(express.favicon());
   app.use(express.logger());
   app.use(express.cookieParser());
@@ -40,14 +40,14 @@ app.configure(function(){
   app.use(express.session({secret: 'nodeTWParty'}) );
   app.use(everyauth.middleware() );
   app.use(app.router);
-  
-  // Insert Stylus middleware before creating static with Express  
+
+  // Insert Stylus middleware before creating static with Express
   app.use(stylus.middleware({
     src: __dirname + '/src/public'
     , dest: __dirname + '/public'
     , compile: compile
   }));
-  
+
   // 必須要放在stylus下面 stylus才會有效
   app.use(express.static(__dirname + '/public'));
 });
@@ -56,17 +56,17 @@ app.configure(function(){
 // Routes
 
 app.get('/', routes.index);
-app.post( '/create', auth.requireLogin, routes.create );
+app.get( '/create', routes.create );
 app.get( '/destroy/:id', auth.requireLogin, routes.destroy );
 app.get( '/edit/:id', auth.requireLogin, routes.edit );
 app.post( '/update/:id', auth.requireLogin, routes.update );
 
 
 app.listen(3000, function(){
-  
+
   // Start SocketIO after app is initialized
   app.sockets = require('./socket')(app);
-  
-  
+
+
   console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);
 });
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "dependencies": {
     "express": "2.5.9",
-    "jade": ">= 0.0.1",
+    "ejs": ">= 0.0.1",
     "stylus": ">= 0.0.1",
     "nib": ">= 0.0.1",
     "socket.io": ">= 0.0.1",
@@ -17,6 +17,6 @@
     "start": "app.js"
   },
   "engines": {
-    "node": "0.6.x"
+    "node": "0.8.5"
   }
 }
diff --git a/public/css/create.css b/public/css/create.css
@@ -0,0 +1,5 @@
+.create-block {
+    margin:0 auto;
+    max-width: 350px;
+    text-align: center;
+}
diff --git a/public/css/geany_run_script.sh b/public/css/geany_run_script.sh
diff --git a/public/css/login.css b/public/css/login.css
@@ -0,0 +1,43 @@
+body {
+    padding-top: 30px;
+    padding-bottom: 20px;
+}
+.login-block {
+    margin:0 auto;
+    max-width: 350px;
+    text-align: center;
+}
+
+.login-block > #register-btn{
+    color: #fff;
+}
+
+.login-form {
+    text-align: center;
+}
+
+.login-form > .title {
+    width: 230px;
+    margin:5px auto;
+    font-size: 1.5em;
+    line-height:1.5;
+    font-family: open Hei;
+    text-align: center;
+}
+
+.login-form > input{
+    font-size: 1em;
+    margin:5px auto;
+    width: 230px;
+}
+
+.login-form > button{
+    font-size: 1em;
+    line-height:1.5;
+    margin:5px auto;
+    width: 230px;
+}
+
+.login-form > #login-btn{
+    width: 230px;
+}
diff --git a/public/css/style.css b/public/css/style.css
@@ -1,4 +1,4 @@
-body{padding:50px;font-size:16px}
+body{padding:30px auto;font-size:16px;background-color:#3a3e4e}
 a{color:#195073}
 h1{text-align:center;font-size:2em}
 .hd{width:95%;margin:0 auto;}

diff --git a/public/css/style.css.bak b/public/css/style.css.bak
diff --git a/public/index.html b/public/index.html
@@ -0,0 +1,100 @@
+<!doctype html>
+<html>
+	<head>
+		<meta http-equiv="Content-Type" content="text/html" charset="utf-8" />
+		<meta name="viewport" content="width=device-width initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+    <link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
+		<title>Test</title>
+    <script src="lib/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
+    <script src="js/init.js" type="text/javascript"></script>
+	</head>
+	<body>
+    <div class="navbar navbar-fixed-top">
+      <div class="navbar-inner">
+        <div class="container-fluid">
+          <div class="nav-collapse">
+            <ul class="nav">
+              <a class="btn btn-info active" href="#">
+                <i class="icon-pencil"></i> 修改
+              </a>
+              <a class="btn btn-info" href="#">
+                <i class="icon-trash"></i> 刪除
+              </a>
+              <a class="btn btn-info" href="#">
+                <i class="icon-cog"></i> 回前台
+              </a>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div class="container-fluid">
+      <div class="row-fluid">
+        <div class="span3">
+          <div class="well sidebar-nav">
+            <ul class="nav nav-list">
+              <li class="nav-header">Sidebar</li>
+              <li class="active"><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li class="nav-header">Sidebar</li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li class="nav-header">Sidebar</li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+              <li><a href="#">Link</a></li>
+            </ul>
+          </div><!--/.well -->
+        </div><!--/span-->
+        <div class="span9">
+          <div class="hero-unit">
+            <h1>Hello, world!</h1>
+            <p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
+            <p><a class="btn btn-primary btn-large">Learn more &raquo;</a></p>
+          </div>
+          <div class="row-fluid">
+            <div class="span4">
+              <h2>Heading</h2>
+              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+              <p><a class="btn" href="#">View details &raquo;</a></p>
+            </div><!--/span-->
+            <div class="span4">
+              <h2>Heading</h2>
+              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+              <p><a class="btn" href="#">View details &raquo;</a></p>
+            </div><!--/span-->
+            <div class="span4">
+              <h2>Heading</h2>
+              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+              <p><a class="btn" href="#">View details &raquo;</a></p>
+            </div><!--/span-->
+          </div><!--/row-->
+          <div class="row-fluid">
+            <div class="span4">
+              <h2>Heading</h2>
+              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+              <p><a class="btn" href="#">View details &raquo;</a></p>
+            </div><!--/span-->
+            <div class="span4">
+              <h2>Heading</h2>
+              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+              <p><a class="btn" href="#">View details &raquo;</a></p>
+            </div><!--/span-->
+            <div class="span4">
+              <h2>Heading</h2>
+              <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+              <p><a class="btn" href="#">View details &raquo;</a></p>
+            </div><!--/span-->
+          </div><!--/row-->
+        </div><!--/span-->
+      </div><!--/row-->
+
+	</body>
+</html>
diff --git a/public/js/init.js b/public/js/init.js
@@ -0,0 +1,5 @@
+window.onload = init;
+
+function init(){
+    //~ alert("hello");
+}
diff --git a/readme.md b/readme.md
@@ -1,4 +1,4 @@
-# Ossii chatroom Demo
+# Ossii chatroom 
 
 Ossii chatroom
 
@@ -7,11 +7,11 @@ Ossii chatroom
 
 * [Express](https://github.com/visionmedia/express)
 * [Socket.io](https://github.com/learnboost/socket.io)
-* [Jade](https://github.com/visionmedia/jade)
+* [Ejs](https://github.com/visionmedia/ejs)
 * [Stylus](https://github.com/learnboost/stylus)
 * [Nib](https://github.com/visionmedia/nib)
 
 ## Frontend stuffs:
 
 * [jQuery](http://jquery.com/)
-* [MomentJS](http://momentjs.com/)
+* [MomentJS](http://momentjs.com/)
diff --git a/routes/index.js b/routes/index.js
@@ -9,13 +9,15 @@ var utils    = require( 'connect' ).utils;
 var everyauth= require( 'everyauth' );
 
 exports.index = function ( req, res, next ){
-  console.log("hhhh")
+
   console.log(req.url)
   console.log(req.loggedIn)
-
+
+  //res.sendfile();
+
   res.render( 'index', {
-	  title : 'OSSII chat Demo',
-	  todos : []
+      title : 'OSSII Chat',
+      todos : []
   });
 
   //~ Todo.
@@ -24,7 +26,7 @@ exports.index = function ( req, res, next ){
     //~ sort( 'updated_at', -1 ).
     //~ run( function ( err, todos ){
       //~ if( err ) return next( err );
-//~ 
+//~
       //~ res.render( 'index', {
           //~ title : 'Express Todo Example',
           //~ todos : todos
@@ -33,7 +35,11 @@ exports.index = function ( req, res, next ){
 };
 
 exports.create = function ( req, res, next ){
-	console.log("abcdefghijklmnopqrstuvwxyz")
+    console.log("abcdefghijklmnopqrstuvwxyz")
+    res.render( 'create', {
+        title : 'OSSII Chat - Create',
+    });
+    /*
   new Todo({
       //user_id    : req.cookies.user_id,
       user_id    : req.user.id,
@@ -44,6 +50,7 @@ exports.create = function ( req, res, next ){
 
     res.redirect( '/' );
   });
+  */
 };
 
 exports.destroy = function ( req, res, next ){