Replace read and pagination functionality with Gist API

.gitignore

@@ -27,3 +27,6 @@ public/views
 # Dependency directory
 # https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
 node_modules
+
+# Angular config
+src/app/token.js

gulp/tasks/default.js

@@ -1,3 +1,3 @@
 var gulp = require("gulp");
 
-gulp.task("default", ["sass", "html", "webpack", "watch", "serve", "jshint", "csslint"]);
+gulp.task("default", ["sass", "html", "webpack", "watch", "serve", "jshint"]);

gulp/tasks/watch.js

@@ -5,5 +5,5 @@ gulp.task('watch', function() {
   gulp.watch(config.html.src, ["html"]);
   gulp.watch(config.javascript.src, ["webpack", "jshint"]);
   gulp.watch(config.sass.src, ["sass"]);
-  gulp.watch(config.sass.dest + "**/*.css", ["csslint"]);
+  // gulp.watch(config.sass.dest + "**/*.css", ["csslint"]);
 });

package.json

@@ -18,9 +18,11 @@
   "homepage": "https://github.com/hollislau/mean-stack-1",
   "dependencies": {
     "angular": "^1.4.7",
+    "angular-cookies": "^1.4.7",
     "angular-route": "^1.4.7",
     "body-parser": "^1.14.1",
     "express": "^4.13.3",
+    "github-api": "^0.10.6",
     "gulp": "^3.9.0",
     "gulp-csslint": "^0.2.0",
     "gulp-express": "^0.3.5",

src/app/blog/blog.ctrl.js

@@ -4,7 +4,7 @@ require("../app.js");
 
 (function () {
 
-  angular.module("intellyBlog").controller("BlogCtrl", ["BlogsService", "$routeParams", "$location", function (BlogsService, $routeParams, $location) {
+  angular.module("intellyBlog").controller("BlogCtrl", ["BlogsService", "$routeParams", "$http", "$filter", "$log", "$q", "$location", function (BlogsService, $routeParams, $http, $filter, $log, $q, $location) {
     var vm = this;
 
     vm.delete = deleteBlog;
@@ -14,9 +14,38 @@ require("../app.js");
     function initialize() {
       BlogsService
         .get($routeParams.blog_id)
+        .then(successHandler, errorHandler);
+    }
+
+    function successHandler (resp) {
+      var data = resp.data;
+      var blogObj = data.files.blog;
+
+      $http
+        .get(blogObj.raw_url)
         .then(function (resp) {
-          vm.blog = resp.data;
+          setBlogInfo(data, resp.data);
+        }, function (resp) {
+          $log.error("Could not request " + blogObj.raw_url, resp);
         });
+
+      $log.info("response", resp);
+    }
+
+    function errorHandler (resp) {
+      vm.error = resp.data;
+      $log.error("response", resp);
+    }
+
+    function setBlogInfo (gist, content) {
+      vm.blog = {
+        title: gist.description,
+        content: content,
+        author: gist.owner.login,
+        date: $filter("date")(gist.updated_at),
+        comments: gist.comments + " comments",
+        id: gist.id
+      };
     }
 
     function deleteBlog (blog) {

src/app/blogs/blogs.ctrl.js

@@ -1,25 +1,74 @@
 "use strict";
 
 require("../app.js");
+require("../filters/pager.filter.js");
 
 (function () {
 
-  angular.module("intellyBlog").controller("BlogsCtrl", ["BlogsService", function (BlogsService) {
+  angular.module("intellyBlog").controller("BlogsCtrl", ["BlogsService", "$http", "$filter", "$log", "$q", function (BlogsService, $http, $filter, $log, $q) {
     var vm = this;
 
     vm.blogs = [];
 
+    vm.pagination = {
+      currentPage: 1,
+      perPage: 2,
+      getOffset: function () {
+        return vm.pagination.currentPage * vm.pagination.perPage;
+      },
+      prevPage: function () {
+        vm.pagination.currentPage--;
+      },
+      nextPage: function () {
+        vm.pagination.currentPage++;
+      }
+    };
+
     initialize();
 
     function initialize () {
-      getBlogs();
+      BlogsService
+        .get()
+        .then(successHandler, errorHandler);
     }
 
-    function getBlogs () {
-      BlogsService.get().then(function (resp) {
-        vm.blogs = resp.data;
+    function successHandler (resp) {
+      var data = resp.data;
+
+      angular.forEach(data, function(gist) {
+        var blogObj = gist.files.blog;
+
+        if (angular.isDefined(blogObj)) {
+          $http
+            .get(blogObj.raw_url)
+            .then(function (resp) {
+              setBlogInfo(gist, resp.data);
+            }, function (resp) {
+              $log.error("Could not request " + blogObj.raw_url, resp);
+            });
+        }
       });
+
+      $log.info("response", resp);
     }
+
+    function errorHandler (resp) {
+      vm.error = resp.data;
+      $log.error("response", resp);
+    }
+
+    function setBlogInfo (gist, content) {
+      var blog = {
+        title: gist.description,
+        content: content,
+        author: gist.owner.login,
+        date: $filter("date")(gist.updated_at),
+        comments: gist.comments + " comments",
+        id: gist.id
+      };
+      vm.blogs.push(blog);
+    }
+
   }]);
 
 })();

src/app/blogs/blogs.service.js

@@ -1,18 +1,26 @@
 "use strict";
 
 require("../app.js");
+var token = require("../token.js");
 
 (function () {
 
   angular.module("intellyBlog").service("BlogsService", ["$http", function ($http) {
-    var urlRoot = "/api/blogs";
 
     var Blog = {
       get: function (id) {
         if (angular.isDefined(id)) {
-          return $http.get(urlRoot + "/" + id);
+          return $http.get("https://api.github.com/gists/" + id, {
+            headers: {
+              "Authorization": "token " + token.oauthToken,
+            }
+          });
         } else {
-          return $http.get(urlRoot);
+          return $http.get("https://api.github.com/users/hollislau/gists", {
+            headers: {
+              "Authorization": "token " + token.oauthToken,
+            }
+          });
         }
       },
       update: function (model) {

src/app/blogs/blogs_list.html

@@ -1,5 +1,5 @@
 <div class="posts l-posts">
-  <article class="blogs" ng-repeat="blog in vm.blogs">
+  <article class="blogs" ng-repeat="blog in vm.blogs|pager:vm.pagination">
     <h1 class="title">{{blog.title}}</h1>
     <p class="copy">{{blog.content}}</p>
     <div class="blog-post-footer">
@@ -8,10 +8,12 @@ <h1 class="title">{{blog.title}}</h1>
         <li>{{blog.date}}</li><span>•</span>
         <li>{{blog.comments}}</li>
       </ul>
-      <a href="#/blogs/{{blog._id}}" class="button">Read More</a>
+      <a href="#/blogs/{{blog.id}}" class="button">Read More</a>
     </div>
   </article>
   <div class="l-add">
     <a href="#/blogs/new" class="button">Add Post</a>
   </div>
+  <button type="button" ng-click="vm.pagination.prevPage()">Prev</button>
+  <button type="button" ng-click="vm.pagination.nextPage()">Next</button>
 </div>

src/app/filters/offset.filter.js

@@ -0,0 +1,10 @@
+require("../app.js");
+
+angular.module("intellyBlog").filter("offset", ["$filter", function ($filter) {
+  return function (input, start) {
+    if (input) {
+      start = parseInt(start, 10);
+      return input.slice(start);
+    }
+  };
+}]);

src/app/filters/pager.filter.js

@@ -0,0 +1,12 @@
+require("../app.js");
+require("./offset.filter.js");
+
+angular.module("intellyBlog").filter("pager", ["$filter", function ($filter) {
+  return function (results, pagerObj) {
+    var filteredResults;
+
+    filteredResults = $filter("offset")(results, pagerObj.getOffset());
+    filteredResults = $filter("limitTo")(filteredResults, pagerObj.perPage);
+    return filteredResults;
+  };
+}]);