new server examples -- blog and upload

robynitp · Dec 5, 2014 · 5f7afda · 5f7afda
1 parent e316fef
commit 5f7afda
Show file tree

Hide file tree

Showing 10 changed files with 197 additions and 0 deletions.
diff --git a/10-server-side/11-servi-file-uploads/form.html b/10-server-side/11-servi-file-uploads/form.html
@@ -0,0 +1,11 @@
+<html>
+<head>
+  <title>Upload</title>
+</head>
+<body>
+<form method="post" action="/upload" enctype="multipart/form-data">
+    <input type="file" name="file">
+    <input type="submit" name="submit" value="submit">
+</form>
+</body>
+</html>
diff --git a/10-server-side/11-servi-file-uploads/upload.js b/10-server-side/11-servi-file-uploads/upload.js
@@ -0,0 +1,23 @@
+/*
+
+Adapted from:
+https://github.com/antiboredom/servi-ide/tree/master/examples/file-uploads
+*/
+var servi = require('servi');
+var app = new servi(true);
+port(3003);
+start();
+
+serveFiles('uploads');
+
+route('/', form);
+function form(request){
+    request.serveFile('form.html');
+}
+
+route('/upload', upload);
+function upload(request) {
+    var file = request.files.file;
+    uploadFile(file, "uploads");
+    request.respond('<img src="' + file.name  + '">');
+}
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/public/style.css b/10-server-side/12-servi-blog-templates-db-uploads/public/style.css
@@ -0,0 +1,49 @@
+body {
+  font: 16px sans-serif;
+  background-color: #eee;
+  width: 600px;
+  margin: auto;
+  line-height: 1.4;
+}
+
+a {
+  color: #ff0046;
+  text-decoration: none;
+}
+
+h2 {
+  padding:0;
+  margin:0;
+}
+
+.entry {
+  border-bottom: 1px dashed #ccc;
+  padding: 20px 0;
+}
+
+.entry img {
+  max-width: 600px;
+  margin-bottom: 10px;
+}
+
+textarea, input {
+  display: block;
+  width: 100%;
+  font: 16px sans-serif;
+  padding: 5px;
+  border: 1px solid #ccc;
+  margin-bottom: 10px;
+}
+
+textarea {
+  height: 200px;
+}
+
+input[type=submit] {
+  background-color: 0;
+  color: #fff;
+}
+
+input[type=file] {
+  border: 0;
+}
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/server.js b/10-server-side/12-servi-blog-templates-db-uploads/server.js
@@ -0,0 +1,52 @@
+/*
+
+Adapted from:
+https://github.com/antiboredom/servi-ide/tree/master/examples/blog
+
+*/
+var servi = require('servi');
+var app = new servi(true);
+port(3002);
+start();
+
+var database = useDatabase('blog');
+serveFiles('public');
+
+route('/', home);
+route('/new', newEntry);
+route('/entries/:id', showEntry);
+
+function home(request) {
+    var data = database.find({});
+    data.sort({ date: -1 });
+    data.exec(function(err, entries){
+        request.render('templates/home.html', {entries: entries});
+    });
+}
+
+function newEntry(request) {
+  if (request.method == GET) {
+    request.render('templates/form.html');
+  }
+
+  else if (request.method == POST) {
+    var image = request.files.image;
+    uploadFile(image, "public/uploads");
+
+    var blogEntry = {
+        content: request.fields.content,
+        title: request.fields.title,
+        date: new Date(),
+        image: image.name
+    }
+    database.insert(blogEntry);
+    request.redirect('/');
+  }
+}
+
+function showEntry(request) {
+  var id = request.params.id;
+  database.findOne({'_id': id}, function(err, theEntry){
+     request.render('templates/blogpost.html', {entry: theEntry}); 
+  });
+}
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/templates/.tmpscript b/10-server-side/12-servi-blog-templates-db-uploads/templates/.tmpscript
@@ -0,0 +1,17 @@
+var servi = require('/Users/sam/Dropbox/school/spring_2014/servi/app/servi.js');var app = new servi();
+
+
+<% include head.html %>
+<% posts.forEach(function(post){ %>
+  <div class="post">
+    <h2><a href="/posts/<%= post._id %>"><%= post.title %></a></h2>
+    <div class="post-content">
+      <%= post.content %>
+    </div>
+  </div>
+<% }) %>
+<% include foot.html %>
+
+
+
+if (typeof run === 'function') app.defaultRoute(run);start();
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/templates/blogpost.html b/10-server-side/12-servi-blog-templates-db-uploads/templates/blogpost.html
@@ -0,0 +1,11 @@
+<% include head.html %>
+<div class="entry">
+  <h2><a href="/entries/<%= entry._id %>"><%= entry.title %></a></h2>
+  <% if (entry.image) { %>
+    <img src="/uploads/<%= entry.image %>">
+  <% } %>
+  <div class="entry-content">
+    <%= entry.content %>
+  </div>
+</div>
+<% include foot.html %>
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/templates/foot.html b/10-server-side/12-servi-blog-templates-db-uploads/templates/foot.html
@@ -0,0 +1,2 @@
+</body>
+</html>
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/templates/form.html b/10-server-side/12-servi-blog-templates-db-uploads/templates/form.html
@@ -0,0 +1,11 @@
+<% include head.html %>
+<form method="post" action="/new" enctype="multipart/form-data">
+  <label for="title">Title</label>
+  <input type="text" name="title">
+  <label for="image">Image</label>
+  <input type="file" name="image">
+  <label for="content">Content</label>
+  <textarea name="content"></textarea>
+  <input type="submit" value="Post">
+</form>
+<% include foot.html %>
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/templates/head.html b/10-server-side/12-servi-blog-templates-db-uploads/templates/head.html
@@ -0,0 +1,8 @@
+<html>
+  <head>
+    <link rel="stylesheet" href="/style.css" type="text/css" />
+    <title>My Blog</title>
+  </head>
+  <body>
+  <h1>My Blog</h1>
+  <p><a href="/new">New Entry</a></p>
diff --git a/10-server-side/12-servi-blog-templates-db-uploads/templates/home.html b/10-server-side/12-servi-blog-templates-db-uploads/templates/home.html
@@ -0,0 +1,13 @@
+<% include head.html %>
+<% entries.forEach(function(entry){ %>
+  <div class="entry">
+    <h2><a href="/entries/<%= entry._id %>"><%= entry.title %></a></h2>
+    <% if (entry.image) { %>
+      <img src="/uploads/<%= entry.image %>">
+    <% } %>
+    <div class="entry-content">
+      <%= entry.content %>
+    </div>
+  </div>
+<% }) %>
+<% include foot.html %>