Skip to content

Commit 2628586

Browse files
jmdobryjmdobry
committed
Added frontend.
1 parent ba11b52 commit 2628586

File tree

13 files changed

+203
-5
lines changed

13 files changed

+203
-5
lines changed

‎client/angular/app.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
angular.module('app', ['ngRoute', 'js-data'])
2+
.config(function ($locationProvider, DSHttpAdapterProvider) {
3+
DSHttpAdapterProvider.defaults.basePath = '/api';
4+
$locationProvider.html5Mode(true).hashPrefix('!');
5+
})
6+
.run(function ($rootScope) {
7+
$rootScope.login = function () {
8+
window.location = '/auth/github';
9+
};
10+
$rootScope.$on('$routeChangeSuccess', function ($event, next) {
11+
$rootScope.path = next.$$route.originalPath.substr(1).split('/')[0];
12+
});
13+
});

‎client/angular/favicon.ico

32.2 KB
Binary file not shown.

‎client/angular/index.html

+60-4
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,72 @@
33
<head>
44
<base href="/">
55
<meta charset="utf-8">
6-
<title>js-data</title>
6+
<title>js-data + Angular</title>
77
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
88
<meta name="fragment" content="!"/>
99
<meta name="Description" content="js-data example app"/>
1010
<meta name="viewport" content="width=device-width, initial-scale=1.0">
11-
<link rel="stylesheet" type="text/css" href="css/codetrain.css">
12-
11+
<link href="http://bootswatch.com/yeti/bootstrap.css" rel="stylesheet" type="text/css"/>
12+
<link href="http://bootswatch.com/assets/css/bootswatch.min.css" rel="stylesheet" type="text/css"/>
1313
<link rel="shortcut icon" href="/favicon.ico">
1414
</head>
1515
<body>
16-
It works!
16+
<div class="container">
17+
<div class="navbar navbar-default navbar-fixed-top">
18+
<div class="container">
19+
<div class="navbar-header">
20+
<a href="/" class="navbar-brand">js-data + Angular Example</a>
21+
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
22+
<span class="icon-bar"></span>
23+
<span class="icon-bar"></span>
24+
<span class="icon-bar"></span>
25+
</button>
26+
</div>
27+
<div class="navbar-collapse collapse" id="navbar-main">
28+
<ul class="nav navbar-nav">
29+
<li data-ng-class="{ active: !path }">
30+
<a href="/">Home</a>
31+
</li>
32+
<li data-ng-class="{ active: path === 'posts' }">
33+
<a href="/posts">Posts</a>
34+
</li>
35+
<li data-ng-if="!loggedInUser">
36+
<a href="" data-ng-click="login()">Login with Github</a>
37+
</li>
38+
<li data-ng-if="loggedInUser">
39+
<a href="">Hi <strong data-ng-bind="loggedInUser.displayName || loggedInUser.username"></strong>!</a>
40+
</li>
41+
</ul>
42+
43+
<ul class="nav navbar-nav navbar-right">
44+
<li>
45+
<a href="https://github.com/js-data/js-data-examples" target="_blank">Code on Github</a>
46+
</li>
47+
<li>
48+
<a href="https://groups.io/org/groupsio/jsdata" target="_blank">Mailing List</a>
49+
</li>
50+
<li>
51+
<a href="https://www.js-data.io" target="_blank">js-data.io</a>
52+
</li>
53+
</ul>
54+
55+
</div>
56+
</div>
57+
</div>
58+
<div class="container" data-ng-view></div>
59+
</div>
60+
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
61+
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
62+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular.min.js"></script>
63+
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.13/angular-route.min.js"></script>
64+
<script src="https://github.com/js-data/js-data/releases/download/1.3.0/js-data.min.js"></script>
65+
<script src="https://github.com/js-data/js-data-angular/releases/download/2.1.0/js-data-angular.min.js"></script>
66+
<script src="app.js"></script>
67+
<script src="models/post.model.js"></script>
68+
<script src="models/user.model.js"></script>
69+
<script src="routes/home/home.js"></script>
70+
<script src="routes/posts/posts.js"></script>
71+
<script src="routes/posts/posts.controller.js"></script>
72+
<script src="routes/posts/newPost.controller.js"></script>
1773
</body>
1874
</html>

‎client/angular/models/post.model.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
angular.module('app')
2+
.factory('Post', function (DS) {
3+
return DS.defineResource({
4+
name: 'post',
5+
endpoint: 'posts'
6+
});
7+
})
8+
.run(function (Post) {
9+
});

‎client/angular/models/user.model.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
angular.module('app')
2+
.factory('User', function ($rootScope, $q, DS, DSHttpAdapter) {
3+
var User = DS.defineResource({
4+
name: 'user',
5+
endpoint: 'users'
6+
});
7+
8+
User.getLoggedInUser = function () {
9+
var deferred = $q.defer();
10+
11+
if ($rootScope.loggedInUser) {
12+
deferred.resolve($rootScope.loggedInUser);
13+
} else {
14+
DSHttpAdapter.GET('/api/users/loggedInUser').then(function (response) {
15+
var user = response.data;
16+
if (user) {
17+
user = User.createInstance(user);
18+
$rootScope.loggedInUser = user;
19+
$rootScope.loggedIn = true;
20+
$rootScope.loggedInUserId = user.id;
21+
User.inject($rootScope.loggedInUser);
22+
return deferred.resolve(user);
23+
} else {
24+
$rootScope.loggedInUser = null;
25+
$rootScope.loggedIn = false;
26+
$rootScope.loggedInUserId = null;
27+
return deferred.resolve(null);
28+
}
29+
}, function (data) {
30+
if (data.status === 401) {
31+
return deferred.resolve(null);
32+
} else {
33+
return deferred.reject(data);
34+
}
35+
});
36+
}
37+
38+
return deferred.promise;
39+
};
40+
41+
return User;
42+
})
43+
.run(function (User) {
44+
User.getLoggedInUser();
45+
});

‎client/angular/routes/home/home.html

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<div>
2+
<h1 class="page-header">Home</h1>
3+
<p>
4+
Hiya! This is an example application that shows how to use js-data with Angular.
5+
</p>
6+
</div>

‎client/angular/routes/home/home.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
angular.module('app').config(function ($routeProvider) {
2+
$routeProvider
3+
.when('/', {
4+
templateUrl: 'routes/home/home.html'
5+
});
6+
});

‎client/angular/routes/posts/newPost.controller.js

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
angular.module('app')
2+
.controller('NewPostCtrl', function ($scope, Post) {
3+
$scope.create = function () {
4+
$scope.processing = true;
5+
return Post.create($scope.post).finally(function () {
6+
$scope.processing = false;
7+
});
8+
};
9+
});

‎client/angular/routes/posts/newPost.html

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<div>
2+
<h1 class="page-header">
3+
New Post
4+
</h1>
5+
6+
<form id="new-post-form" name="new-post-form" data-ng-submit="create()">
7+
<div class="form-group">
8+
<label class="form-control" for="title">Title</label>
9+
<input type="text" required data-ng-disabled="processing" id="title" name="title" data-ng-model="post.title"
10+
class="form-control"/>
11+
</div>
12+
<div class="form-group">
13+
<label class="form-control" for="content">Content</label>
14+
<textarea required data-ng-disabled="processing" id="content" name="content" data-ng-model="post.content"
15+
class="form-control"></textarea>
16+
</div>
17+
<div class="form-group">
18+
<button type="submit">Publish Post</button>
19+
</div>
20+
</form>
21+
</div>

‎client/angular/routes/posts/posts.controller.js

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
angular.module('app')
2+
.controller('PostsCtrl', function ($scope, Post) {
3+
Post.bindAll(null, $scope, 'posts');
4+
});

‎client/angular/routes/posts/posts.html

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<div>
2+
<h1 class="page-header">Posts</h1>
3+
<div data-ng-repeat="post in posts track by post.id">
4+
{{ post }}
5+
</div>
6+
</div>

‎client/angular/routes/posts/posts.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
angular.module('app').config(function ($routeProvider) {
2+
$routeProvider
3+
.when('/posts/new', {
4+
templateUrl: 'routes/posts/newPost.html',
5+
controller: 'NewPostCtrl'
6+
})
7+
.when('/posts', {
8+
templateUrl: 'routes/posts/posts.html',
9+
controller: 'PostsCtrl',
10+
resolve: {
11+
posts: function (Post) {
12+
return Post.findAll();
13+
}
14+
}
15+
});
16+
});

‎server/rethinkdb/app/app.js

+8-1
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,6 @@ exports.createServer = function () {
7979
app.use(cookieParser());
8080
app.use(bodyParser.urlencoded({ extended: true }));
8181
app.use(methodOverride());
82-
console.log(path.join(__dirname, config.PUBLIC));
8382
app.set('views', path.join(__dirname, config.PUBLIC));
8483
app.set('view engine', 'ejs');
8584
app.engine('html', require('ejs').renderFile);
@@ -119,6 +118,14 @@ exports.createServer = function () {
119118
.put(ensureAuthenticated, safeCall(posts.updateOneById))
120119
.delete(ensureAuthenticated, safeCall(posts.deleteOneById));
121120

121+
app.get('/api/users/loggedInUser', function (req, res) {
122+
if (req.isAuthenticated()) {
123+
return res.json(req.user);
124+
} else {
125+
res.send();
126+
}
127+
});
128+
122129
app.get('/auth/github', passport.authenticate('github'));
123130
app.get('/auth/github/callback', passport.authenticate('github', { failureRedirect: '/login' }), function (req, res) {
124131
res.redirect('/');

0 commit comments

Comments
 (0)