Articles Example Fix

Author: amoshaviv

app/views/includes/head.jade

@@ -24,6 +24,7 @@ head
   link(rel='stylesheet', href='/css/common.css')
 
   link(rel='stylesheet', href='/css/views/index.css')
+  link(rel='stylesheet', href='/css/views/articles.css')
 
   //if lt IE 9
     script(src='http://html5shim.googlecode.com/svn/trunk/html5.js')

public/css/common.css

@@ -4,7 +4,7 @@
 }
 
 .content {
-    margin-top: 40px;
+    margin-top: 50px;
     width: 100%;
 }
 

public/css/views/articles.css

@@ -0,0 +1,11 @@
+h1 {
+	text-align: center;
+}
+
+ul {
+  list-style: none;
+}
+
+li:not(:last-child) {
+  border-bottom: 1px solid #ccc;
+}

public/js/controllers/articles.js

@@ -1,4 +1,5 @@
-function ArticlesController($scope, $routeParams, $location, Articles) {
+function ArticlesController($scope, $routeParams, $location, Global, Articles) {
+	$scope.global = Global;
 	$scope.articles = [];
 	$scope.article = {};
 

public/js/controllers/header.js

@@ -1,5 +1,15 @@
 function HeaderController($scope, $location, Global) {
 	$scope.global = Global;
+	$scope.menu = [
+		{
+			"title": "Articles",
+			"link": "articles"
+		},
+		{
+			"title": "Create New Article",
+			"link": "articles/create"
+		}
+	];
 
 	$scope.init = function() {
 

public/views/articles/create.html

@@ -1,15 +1,15 @@
 <section data-ng-controller="ArticlesController">
 	<form class="form-horizontal" data-ng-submit="create()">
 		<div class="control-group">
-			<label class="control-label" for="title">כותרת</label>
+			<label class="control-label" for="title">Title</label>
 			<div class="controls">
-				<input type="text" data-ng-model="title" id="title" placeholder="כותרת">
+				<input type="text" data-ng-model="title" id="title" placeholder="Title">
 			</div>
 		</div>
 		<div class="control-group">
-			<label class="control-label" for="content">תוכן</label>
+			<label class="control-label" for="content">Content</label>
 			<div class="controls">
-				<textarea data-ng-model="content" id="content" cols="30" rows="10" placeholder="תוכן"></textarea>
+				<textarea data-ng-model="content" id="content" cols="30" rows="10" placeholder="Content"></textarea>
 			</div>
 		</div>
 		<div class="control-group">

public/views/articles/list.html

@@ -7,4 +7,5 @@ <h2><a data-ng-href="#!/articles/{{article._id}}">{{article.title}}</a></h2>
 			<div>{{article.content}}</div>
 		</li>
 	</ul>
+	<h1 data-ng-hide="articles.length">No articles yet. <br> Why don't you <a href="/#!/articles/create">Create One</a>?</h1>
 </section>

public/views/articles/view.html

@@ -1,6 +1,6 @@
 <section data-ng-controller="ArticlesController" data-ng-init="findOne()">
 	<span>{{article.created | date:'medium'}}</span> /
 	<span>{{article.user.name}}</span>
-	<h2>{{article.title}}</h2>
+	<h2>{{article.title}} <a data-ng-show="global.user._id == article.user._id" href="/#!/articles/{{article._id}}/edit">edit</a></h2>
 	<div>{{article.content}}</div>
 </section>

public/views/header.html

@@ -1,7 +1,7 @@
 <div class="navbar-inner" data-ng-controller="HeaderController" data-ng-init="init()">
 	<ul class="nav">
 		<li><a class="brand" href="/">MEAN - A Modern Stack</a></li>
-		<li data-ng-repeat="item in menu" data-ng-show="global.user" data-ng-class="{active: isSelected(item)}"><a href="#/{{item.link}}">{{item.title}}</a></li>
+		<li data-ng-repeat="item in menu" data-ng-show="global.user" data-ng-class="{active: isSelected(item)}"><a href="#!/{{item.link}}">{{item.title}}</a></li>
 	</ul>
 	<ul class="nav pull-right" data-ng-hide="global.authenticated">
 		<li><a href="signup">Signup</a></li>