diff --git a/app/config/apiMapping.js b/app/config/apiMapping.js
index b35e4862..69121135 100644
--- a/app/config/apiMapping.js
+++ b/app/config/apiMapping.js
@@ -251,6 +251,11 @@ var apiMapping = {
         submitRequest: {
             'endpoint': '/private/queue',
             'controller': 'services'
+        },
+        page: {
+            'endpoint': '/private/queue',
+            'controller': 'services',
+            'method': 'page'
         }
     },
     Notification: {
diff --git a/app/controllers/abstractIdeaController.js b/app/controllers/abstractIdeaController.js
index 132e730e..0c53c7ce 100644
--- a/app/controllers/abstractIdeaController.js
+++ b/app/controllers/abstractIdeaController.js
@@ -46,8 +46,10 @@ app.controller('AbstractIdeaController', function ($controller, $scope, FeatureP
 
     $scope.clearOverallCheckbox = function () {
         var overallCheckbox = angular.element('#overallCheckbox')[0];
-        overallCheckbox.indeterminate = false;
-        overallCheckbox.checked = false;
+        if(overallCheckbox) {
+            overallCheckbox.indeterminate = false;
+            overallCheckbox.checked = false;	
+        }
     };
 
     $scope.createFeatureProposal = function () {
diff --git a/app/controllers/featureProposalController.js b/app/controllers/featureProposalController.js
index 4509b1bb..4554fdf0 100644
--- a/app/controllers/featureProposalController.js
+++ b/app/controllers/featureProposalController.js
@@ -1,51 +1,75 @@
-app.controller('FeatureProposalController', function ($controller, $scope, Idea, FeatureProposal, FeatureProposalRepo, ProjectService) {
+app.controller('FeatureProposalController', function($controller, $scope, Idea, FeatureProposal, ProjectService) {
 
     angular.extend(this, $controller('AbstractIdeaController', {
         $scope: $scope
     }));
 
-    $scope.repo = FeatureProposalRepo;
-
     $scope.fpToDelete = {};
 
     $scope.ideaToAdd = {};
 
-    $scope.filters = [
-        {
-            gloss: 'Service',
-            property: 'service.name'
-        },
-        {
-            gloss: 'Title',
-            property: 'title'
-        },
-        {
-            gloss: 'Description',
-            property: 'description'
-        },
-        {
-            gloss: 'Submitted',
-            property: 'submitted'
-        },
-        {
-            gloss: 'Last Modified',
-            property: 'lastModified'
-        }
-    ];
+    $scope.weaverTable = {
+        repo: $scope.fpRepo,
+        columns: [{
+                gloss: 'Service',
+                property: 'service.name',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Title',
+                property: 'title',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Description',
+                property: 'description',
+                filterable: true,
+                sortable: false
+            },
+            {
+                gloss: 'Last Modified',
+                property: 'lastModified',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Submitted',
+                property: 'submitted',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Actions',
+                filterable: false,
+                sortable: false
+            }
+        ],
+        activeSort: [{
+                property: 'service.name',
+                direction: 'ASC'
+            },
+            {
+                property: 'lastModified',
+                direction: 'DESC'
+            }
+        ]
+    };
 
     $scope.removedIdeas = [];
 
-    $scope.tableParams = FeatureProposalRepo.getTableParams();
+    $scope.tableParams = $scope.fpRepo.getTableParams();
 
-    $scope.editFeatureProposal = function (fp) {
+    $scope.editFeatureProposal = function(fp) {
         $scope.fpData = fp;
         $scope.openModal('#editFpModal');
     };
 
-    $scope.removeIdea = function (idea) {
-        if ($scope.fpData.ideas.some(function (i) {
-            return i.id === idea.id;
-        })) {
+    $scope.removeIdea = function(idea) {
+        if ($scope.fpData.ideas.some(function(i) {
+                return i.id === idea.id;
+            })) {
             $scope.removedIdeas.push(new Idea(idea));
             $scope.forms.updateFp.$setDirty();
             $scope.fpData.dirty(true);
@@ -53,11 +77,11 @@ app.controller('FeatureProposalController', function ($controller, $scope, Idea,
         }
     };
 
-    $scope.updateFeatureProposal = function (fp) {
-        FeatureProposalRepo.update($scope.fpData).then(function (res) {
+    $scope.updateFeatureProposal = function(fp) {
+    	$scope.fpRepo.update($scope.fpData).then(function(res) {
             if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                 $scope.resetFeatureProposals();
-                for(var i in $scope.removedIdeas) {
+                for (var i in $scope.removedIdeas) {
                     var idea = $scope.removedIdeas[i];
                     idea.elevated = false;
                     idea.save();
@@ -67,27 +91,27 @@ app.controller('FeatureProposalController', function ($controller, $scope, Idea,
         });
     };
 
-    $scope.select = function (fp, modal) {
+    $scope.select = function(fp, modal) {
         $scope.fpData = fp;
         $scope.openModal(modal);
     };
 
-    $scope.submitFeatureProposal = function (fp) {
+    $scope.submitFeatureProposal = function(fp) {
         $scope.submitting = true;
-        ProjectService.submitFeatureProposal(fp).then(function () {
+        ProjectService.submitFeatureProposal(fp).then(function() {
             $scope.submitting = false;
             $scope.resetFeatureProposals();
         });
     };
 
-    $scope.confirmDeleteFp = function (fp) {
+    $scope.confirmDeleteFp = function(fp) {
         $scope.openModal('#deleteFpModal');
         $scope.fpToDelete = fp;
     };
 
-    $scope.deleteFp = function () {
+    $scope.deleteFp = function() {
         $scope.deleting = true;
-        $scope.fpToDelete.delete().then(function () {
+        $scope.fpToDelete.delete().then(function() {
             $scope.closeModal();
             $scope.deleting = false;
             $scope.fpToDelete = {};
diff --git a/app/controllers/ideaController.js b/app/controllers/ideaController.js
index ea139ed9..9456b3b3 100644
--- a/app/controllers/ideaController.js
+++ b/app/controllers/ideaController.js
@@ -1,36 +1,60 @@
-app.controller('IdeaController', function ($controller, $scope, $timeout, FeatureProposalRepo, Idea, IdeaRepo, ServiceRepo) {
+app.controller('IdeaController', function($controller, $scope, $timeout, FeatureProposalRepo, Idea, ServiceRepo) {
 
     angular.extend(this, $controller('AbstractIdeaController', {
         $scope: $scope
     }));
 
-    $scope.repo = IdeaRepo;
-
     $scope.ideaToDelete = {};
 
-    $scope.filters = [{
-            gloss: 'Service',
-            property: 'service.name'
-        },
-        {
-            gloss: 'Title',
-            property: 'title'
-        },
-        {
-            gloss: 'Description',
-            property: 'description'
-        },
-        {
-            gloss: 'Last Modified',
-            property: 'lastModified'
-        }
-    ];
+    $scope.weaverTable = {
+        repo: $scope.ideaRepo,
+        columns: [{
+                gloss: 'Service',
+                property: 'service.name',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Title',
+                property: 'title',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Description',
+                property: 'description',
+                filterable: true,
+                sortable: false
+            },
+            {
+                gloss: 'Last Modified',
+                property: 'lastModified',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Elevated',
+                property: 'elevated',
+                filterable: true,
+                sortable: true
+            }
+        ],
+        activeSort: [{
+                property: 'service.name',
+                direction: 'ASC'
+            },
+            {
+                property: 'lastModified',
+                direction: 'DESC'
+            }
+        ]
+    };
 
-    ServiceRepo.ready().then(function () {
+    ServiceRepo.ready().then(function() {
 
-        $scope.tableParams = IdeaRepo.getTableParams();
+        $scope.tableParams = $scope.ideaRepo.getTableParams();
 
-        $scope.resetIdeas = function () {
+        $scope.resetIdeas = function() {
             $scope.resetForms($scope.ideaData);
             $scope.ideaData = new Idea({
                 title: '',
@@ -44,9 +68,9 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
 
     });
 
-    $scope.createIdea = function () {
+    $scope.createIdea = function() {
         $scope.creating = true;
-        IdeaRepo.create($scope.ideaData).then(function (res) {
+        $scope.ideaRepo.create($scope.ideaData).then(function(res) {
             if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                 $scope.creating = false;
                 $scope.resetIdeas();
@@ -54,14 +78,14 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         });
     };
 
-    $scope.editIdea = function (idea) {
+    $scope.editIdea = function(idea) {
         $scope.ideaData = idea;
         $scope.openModal('#editIdeaModal');
     };
 
-    $scope.updateIdea = function () {
+    $scope.updateIdea = function() {
         $scope.updating = true;
-        IdeaRepo.update($scope.ideaData).then(function (res) {
+        $scope.ideaRepo.update($scope.ideaData).then(function(res) {
             if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                 $scope.updating = false;
                 $scope.resetIdeas();
@@ -69,23 +93,23 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         });
     };
 
-    $scope.confirmDelete = function (idea) {
+    $scope.confirmDelete = function(idea) {
         $scope.openModal('#deleteIdeaModal');
         $scope.ideaToDelete = idea;
     };
 
-    $scope.deleteIdea = function () {
+    $scope.deleteIdea = function() {
         $scope.deleting = true;
-        $scope.ideaToDelete.delete().then(function () {
+        $scope.ideaToDelete.delete().then(function() {
             $scope.closeModal();
             $scope.deleting = false;
             $scope.ideaToDelete = {};
         });
     };
 
-    $scope.elevateIdea = function (idea) {
+    $scope.elevateIdea = function(idea) {
         $scope.elevating = true;
-        FeatureProposalRepo.elevate(idea).then(function (res) {
+        FeatureProposalRepo.elevate(idea).then(function(res) {
             var apiRes = angular.fromJson(res.body);
             if (apiRes.meta.status === 'SUCCESS') {
                 $scope.elevating = false;
@@ -94,7 +118,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         });
     };
 
-    $scope.setOverallCheckbox = function () {
+    $scope.setOverallCheckbox = function() {
         var overallCheckbox = angular.element('#overallCheckbox')[0];
         if ($scope.selectedIdeas.length === 0) {
             overallCheckbox.indeterminate = false;
@@ -108,7 +132,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         }
     };
 
-    $scope.toggleSelectIdea = function (idea) {
+    $scope.toggleSelectIdea = function(idea) {
         if ($scope.isSelectedIdea(idea)) {
             $scope.removeIdeaFromSelected(idea);
         } else {
@@ -117,7 +141,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         $scope.setOverallCheckbox();
     };
 
-    $scope.toggleAll = function () {
+    $scope.toggleAll = function() {
         if ($scope.overallCheckboxValue || $scope.anyOnPageSelected()) {
             for (var i in $scope.ideasTableParams.data) {
                 var ii = $scope.ideasTableParams.data[i];
@@ -136,7 +160,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         $scope.setOverallCheckbox();
     };
 
-    $scope.anyOnPageSelected = function () {
+    $scope.anyOnPageSelected = function() {
         var anySelected = false;
         for (var i in $scope.ideasTableParams.data) {
             var idea = $scope.ideasTableParams.data[i];
@@ -148,7 +172,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         return anySelected;
     };
 
-    $scope.isSelectedIdea = function (idea) {
+    $scope.isSelectedIdea = function(idea) {
         var selected = false;
         for (var i in $scope.selectedIdeas) {
             if (idea.id === $scope.selectedIdeas[i].id) {
@@ -159,7 +183,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         return selected;
     };
 
-    $scope.removeIdeaFromSelected = function (idea) {
+    $scope.removeIdeaFromSelected = function(idea) {
         for (var i in $scope.selectedIdeas) {
             if (idea.id === $scope.selectedIdeas[i].id) {
                 $scope.selectedIdeas.splice(i, 1);
@@ -168,7 +192,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         }
     };
 
-    $scope.confirmElevateMultiple = function (ideas) {
+    $scope.confirmElevateMultiple = function(ideas) {
         $scope.fpData.ideas = ideas;
         $scope.fpData.title = ideas[0].title;
         $scope.fpData.description = ideas[0].description;
@@ -176,12 +200,12 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         $scope.openModal('#elevateMultipleModal');
     };
 
-    $scope.confirmAddIdea = function (idea) {
+    $scope.confirmAddIdea = function(idea) {
         $scope.ideaToAdd = idea;
         $scope.openModal('#confirmAddIdeaModal');
     };
 
-    $scope.addIdea = function (fp) {
+    $scope.addIdea = function(fp) {
         fp.ideas.push($scope.ideaToAdd);
         fp.dirty(true);
         $scope.updateFeatureProposal(fp);
@@ -190,7 +214,7 @@ app.controller('IdeaController', function ($controller, $scope, $timeout, Featur
         $scope.ideaToAdd = {};
     };
 
-    $scope.setSelectedFp = function (fp) {
+    $scope.setSelectedFp = function(fp) {
         $scope.selectedFp = fp;
     };
 
diff --git a/app/controllers/noteController.js b/app/controllers/noteController.js
index ac73b2cc..3e5a6573 100644
--- a/app/controllers/noteController.js
+++ b/app/controllers/noteController.js
@@ -1,10 +1,10 @@
-app.controller('NoteController', function ($controller, $scope, Note, NoteRepo, ServiceRepo) {
+app.controller('NoteController', function($controller, $scope, Note, NoteRepo, ServiceRepo) {
 
     angular.extend(this, $controller('AbstractScheduleController', {
         $scope: $scope
     }));
-
-    $scope.repo = NoteRepo;
+    
+    $scope.noteRepo = NoteRepo;
 
     $scope.services = ServiceRepo.getAll();
 
@@ -43,42 +43,72 @@ app.controller('NoteController', function ($controller, $scope, Note, NoteRepo,
         },
     ];
 
-    $scope.filters = [
-        {
-            gloss: 'Service',
-            property: 'service.name'
-        },
-        {
-            gloss: 'Title',
-            property: 'title'
-        },
-        {
-            gloss: 'Body',
-            property: 'body'
-        },
-        {
-            gloss: 'Type',
-            property: 'noteType'
-        },
-        {
-            gloss: 'Last Modified',
-            property: 'lastModified'
-        },
-        {
-            gloss: 'Pinned',
-            property: 'pinned'
-        },
-        {
-            gloss: 'Active',
-            property: 'active'
-        }
-    ];
+    $scope.weaverTable = {
+        repo: $scope.noteRepo,
+        columns: [{
+                gloss: 'Service',
+                property: 'service.name',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Title',
+                property: 'title',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Body',
+                property: 'body',
+                filterable: true,
+                sortable: false
+            },
+            {
+                gloss: 'Type',
+                property: 'noteType',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Last Modified',
+                property: 'lastModified',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Pinned',
+                property: 'pinned',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Active',
+                property: 'active',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Actions',
+                filterable: false,
+                sortable: false
+            }
+        ],
+        activeSort: [{
+                property: 'service.name',
+                direction: 'ASC'
+            },
+            {
+                property: 'lastModified',
+                direction: 'DESC'
+            }
+        ]
+    };
 
-    ServiceRepo.ready().then(function () {
+    ServiceRepo.ready().then(function() {
 
         $scope.tableParams = NoteRepo.getTableParams();
 
-        $scope.resetNotes = function () {
+        $scope.resetNotes = function() {
             if ($scope.noteData) {
                 $scope.noteData.refresh();
                 $scope.noteData.clearValidationResults();
@@ -101,44 +131,44 @@ app.controller('NoteController', function ($controller, $scope, Note, NoteRepo,
 
         $scope.resetNotes();
 
-        $scope.createNote = function () {
-            NoteRepo.create($scope.noteData).then(function (res) {
+        $scope.createNote = function() {
+        	$scope.noteRepo.create($scope.noteData).then(function(res) {
                 if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                     $scope.resetNotes();
                 }
             });
         };
 
-        $scope.editNote = function (note) {
+        $scope.editNote = function(note) {
             $scope.noteData = note;
             $scope.openModal('#editNoteModal');
         };
 
-        $scope.updateNote = function () {
-            NoteRepo.update($scope.noteData).then(function (res) {
+        $scope.updateNote = function() {
+        	$scope.noteRepo.update($scope.noteData).then(function(res) {
                 if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                     $scope.resetNotes();
                 }
             });
         };
 
-        $scope.editSchedule = function (note) {
+        $scope.editSchedule = function(note) {
             $scope.data = note;
             $scope.openModal('#editScheduleModal');
         };
 
-        $scope.resetSchedule = function () {
+        $scope.resetSchedule = function() {
             $scope.resetNotes();
         };
 
-        $scope.confirmDelete = function (note) {
+        $scope.confirmDelete = function(note) {
             $scope.openModal('#deleteNoteModal');
             $scope.noteToDelete = note;
         };
 
-        $scope.deleteNote = function () {
+        $scope.deleteNote = function() {
             $scope.deleting = true;
-            $scope.noteToDelete.delete().then(function () {
+            $scope.noteToDelete.delete().then(function() {
                 $scope.closeModal();
                 $scope.deleting = false;
                 $scope.noteToDelete = {};
diff --git a/app/controllers/serviceController.js b/app/controllers/serviceController.js
index e430d4f2..f113c106 100644
--- a/app/controllers/serviceController.js
+++ b/app/controllers/serviceController.js
@@ -1,4 +1,4 @@
-app.controller('ServiceController', function ($controller, $route, $scope, ProjectService, Service, ServiceRepo, NgTableParams) {
+app.controller('ServiceController', function($controller, $route, $scope, ProjectService, Service, ServiceRepo, NgTableParams) {
 
     angular.extend(this, $controller('AbstractScheduleController', {
         $scope: $scope
@@ -9,22 +9,77 @@ app.controller('ServiceController', function ($controller, $route, $scope, Proje
         type: "service",
         options: ['UP', 'DOWN', 'MAINTENANCE']
     };
-
+    
     $scope.serviceRepo = ServiceRepo;
 
-    $scope.services = ServiceRepo.getAll();
+    $scope.services = $scope.serviceRepo.getAll();
 
     $scope.forms = {};
 
     $scope.serviceToDelete = {};
 
-    ProjectService.getAll().then(function (projects) {
+    $scope.weaverTable = {
+        repo: $scope.serviceRepo,
+        columns: [{
+                gloss: 'Service',
+                property: 'name',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Status',
+                property: 'status',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Auto Updating',
+                property: 'isAuto',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Public',
+                property: 'isPublic',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Short List',
+                property: 'onShortList',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'URL',
+                property: 'serviceUrl',
+                filterable: true,
+                sortable: true
+            },
+            {
+                gloss: 'Project',
+                filterable: false,
+                sortable: false
+            },
+            {
+                gloss: 'Actions',
+                filterable: false,
+                sortable: false
+            }
+        ],
+        activeSort: [{
+            property: 'name',
+            direction: 'ASC'
+        }]
+    };
+
+    ProjectService.getAll().then(function(projects) {
         $scope.projects = projects;
 
-        $scope.getProject = function (service) {
+        $scope.getProject = function(service) {
             if (service.projectId && !service.project) {
                 service.project = {};
-                ProjectService.getById(service.projectId).then(function (project) {
+                ProjectService.getById(service.projectId).then(function(project) {
                     angular.extend(service, {
                         project: project
                     });
@@ -36,7 +91,7 @@ app.controller('ServiceController', function ($controller, $route, $scope, Proje
 
     });
 
-    $scope.resetServices = function () {
+    $scope.resetServices = function() {
         if ($scope.serviceData) {
             $scope.serviceData.refresh();
             $scope.serviceData.clearValidationResults();
@@ -59,65 +114,54 @@ app.controller('ServiceController', function ($controller, $route, $scope, Proje
 
     $scope.resetServices();
 
-    $scope.createService = function () {
+    $scope.createService = function() {
         if ($scope.serviceData.isAuto) {
             $scope.serviceData.status = 'UP';
         } else {
             $scope.serviceData.isAuto = false;
         }
-        ServiceRepo.create($scope.serviceData).then(function (res) {
+        $scope.serviceRepo.create($scope.serviceData).then(function(res) {
             if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                 $scope.resetServices();
             }
         });
     };
 
-    $scope.editService = function (service) {
+    $scope.editService = function(service) {
         $scope.serviceData = service;
         $scope.openModal('#editServiceModal');
     };
 
-    $scope.updateService = function () {
-        ServiceRepo.update($scope.serviceData).then(function (res) {
+    $scope.updateService = function() {
+    	$scope.serviceRepo.update($scope.serviceData).then(function(res) {
             if (angular.fromJson(res.body).meta.status === 'SUCCESS') {
                 $scope.resetServices();
             }
         });
     };
 
-    $scope.editSchedule = function (service) {
+    $scope.editSchedule = function(service) {
         $scope.data = service;
         $scope.openModal('#editScheduleModal');
     };
 
-    $scope.resetSchedule = function () {
+    $scope.resetSchedule = function() {
         $scope.resetServices();
     };
 
-    var buildTable = function () {
-        var allServices = ServiceRepo.getAll();
-        $scope.tableParams = new NgTableParams({
-            count: allServices.length
-        }, {
-            counts: [],
-            filterDelay: 0,
-            dataset: allServices
-        });
-    };
-
-    ServiceRepo.ready().then(function () {
-        buildTable();
-        $scope.tableParams.reload();
+    ServiceRepo.ready().then(function() {
+        $scope.tableParams = ServiceRepo.getTableParams();
+        $scope.resetServices();
     });
 
-    $scope.confirmDelete = function (service) {
+    $scope.confirmDelete = function(service) {
         $scope.openModal('#deleteServiceModal');
         $scope.serviceToDelete = service;
     };
 
-    $scope.deleteService = function () {
+    $scope.deleteService = function() {
         $scope.deleting = true;
-        $scope.serviceToDelete.delete().then(function () {
+        $scope.serviceToDelete.delete().then(function() {
             $scope.closeModal();
             $scope.deleting = false;
             ServiceRepo.remove($scope.serviceToDelete);
diff --git a/app/directives/weaverTableDirective.js b/app/directives/weaverTableDirective.js
index de0a19bc..81184192 100644
--- a/app/directives/weaverTableDirective.js
+++ b/app/directives/weaverTableDirective.js
@@ -1,116 +1,114 @@
-app.directive('weaverTable', function ($controller) {
-  return {
-      templateUrl: 'views/directives/tableControls.html',
-      restrict: 'E',
-      replace: false,
-      transclude: {
-        table: 'weaverTableElement',
-        controls: 'weaverTableControls',
-        modals: 'weaverTableModals'
-      },
-      scope: false,
-      link: function ($scope, element, attr) {
+app.directive('weaverTable', function() {
+    return {
+        templateUrl: 'views/directives/tableControls.html',
+        restrict: 'E',
+        replace: false,
+        transclude: {
+            table: 'weaverTableElement',
+            controls: 'weaverTableControls',
+            modals: 'weaverTableModals'
+        },
+        scope: {
+            weaverTable: "="
+        },
+        controller: ['$scope', function($scope) {
 
-        if($scope.filters) {
+            $scope.weaverTable.repo.getPageSettings().sort = [];
+
+            $scope.filters = $scope.weaverTable.columns.filter(function(column) {
+                return column.filterable;
+            });
 
             $scope.filter = $scope.filters[0];
 
-            $scope.activeFilters = $scope.repo.getPageSettings().filters;
+            $scope.activeFilters = $scope.weaverTable.repo.getPageSettings().filters;
 
             $scope.selectFilter = function(filter) {
                 $scope.filter = filter;
             };
-            
-            $scope.removeFilter = function (prop, v) {
+
+            $scope.removeFilter = function(prop, v) {
                 $scope.activeFilters[prop].splice($scope.activeFilters[prop].indexOf(v), 1);
-                if($scope.activeFilters[prop].length === 0) {
+                if ($scope.activeFilters[prop].length === 0) {
                     delete $scope.activeFilters[prop];
                 }
-                $scope.repo.getTableParams().reload();
+                $scope.weaverTable.repo.getTableParams().reload();
             };
-            
+
             $scope.applyFilter = function(filter) {
-                if($scope.activeFilters[filter.property]) {
+                if ($scope.activeFilters[filter.property]) {
                     $scope.activeFilters[filter.property].push(filter.value);
                 } else {
                     $scope.activeFilters[filter.property] = [filter.value];
                 }
-                $scope.repo.getTableParams().reload();
+                $scope.weaverTable.repo.getTableParams().reload();
                 delete $scope.filter.value;
             };
 
             $scope.lookupGloss = function(prop) {
-                for(var i in $scope.filters) {
+                for (var i in $scope.filters) {
                     var filter = angular.copy($scope.filters[i]);
-                    if(filter.property === prop) {
+                    if (filter.property === prop) {
                         return filter.gloss;
                     }
                 }
             };
 
-        }
-
-        var activeSort = $scope.repo.getPageSettings().sort = [{
-            property: 'service.name',
-            direction: 'ASC'
-        }, {
-            property: 'lastModified',
-            direction: 'DESC'
-        }];
+            var activeSort = $scope.weaverTable.repo.getPageSettings().sort = $scope.weaverTable.activeSort;
 
-        $scope.unsorted = function(prop) {
-            for(var i in activeSort) {
-                var sort = activeSort[i];
-                if(sort.property === prop) {
-                    return false;
+            $scope.weaverTable.unsorted = function(prop) {
+                for (var i in activeSort) {
+                    var sort = activeSort[i];
+                    if (sort.property === prop) {
+                        return false;
+                    }
                 }
-            }
-            return true;
-        };
-        
-        $scope.asc = function(prop) {
-            for(var i in activeSort) {
-                var sort = activeSort[i];
-                if(sort.property === prop && sort.direction === 'ASC') {
-                    return true;
+                return true;
+            };
+
+            $scope.weaverTable.asc = function(prop) {
+                for (var i in activeSort) {
+                    var sort = activeSort[i];
+                    if (sort.property === prop && sort.direction === 'ASC') {
+                        return true;
+                    }
                 }
-            }
-            return false;
-        };
-        
-        $scope.desc = function(prop) {
-            for(var i in activeSort) {
-                var sort = activeSort[i];
-                if(sort.property === prop && sort.direction === 'DESC') {
-                    return true;
+                return false;
+            };
+
+            $scope.weaverTable.desc = function(prop) {
+                for (var i in activeSort) {
+                    var sort = activeSort[i];
+                    if (sort.property === prop && sort.direction === 'DESC') {
+                        return true;
+                    }
                 }
-            }
-            return false;
-        };
-        
-        $scope.toggleSort = function(prop) {
-            var asc = true;
-            for(var i in activeSort) {
-                var sort = activeSort[i];
-                if(sort.property === prop) {
-                    if(sort.direction === 'ASC') {
-                        sort.direction = 'DESC';
-                    } else {
-                        activeSort.splice(i, 1);
+                return false;
+            };
+
+            $scope.weaverTable.toggleSort = function(prop) {
+                var asc = true;
+                for (var i in activeSort) {
+                    var sort = activeSort[i];
+                    if (sort.property === prop) {
+                        if (sort.direction === 'ASC') {
+                            sort.direction = 'DESC';
+                        } else {
+                            activeSort.splice(i, 1);
+                        }
+                        asc = false;
+                        break;
                     }
-                    asc = false;
-                    break;
                 }
-            }
-            if(asc) {
-                activeSort.push({
-                    property: prop,
-                    direction: 'ASC'
-                });
-            }
-            $scope.repo.getTableParams().reload();
-        };
+                if (asc) {
+                    activeSort.push({
+                        property: prop,
+                        direction: 'ASC'
+                    });
+                }
+                $scope.weaverTable.repo.getTableParams().reload();
+            };
 
-      }
-  };
+        }]
+    };
 });
\ No newline at end of file
diff --git a/app/repo/serviceRepo.js b/app/repo/serviceRepo.js
index 927a5141..872efa75 100644
--- a/app/repo/serviceRepo.js
+++ b/app/repo/serviceRepo.js
@@ -1,7 +1,54 @@
-app.repo("ServiceRepo", function ServiceRepo($q, $timeout, WsApi) {
+app.repo("ServiceRepo", function ServiceRepo($q, $timeout, WsApi, Service, TableFactory) {
 
     var serviceRepo = this;
 
+    serviceRepo.getPageSettings = function () {
+        return table.getPageSettings();
+    };
+
+    serviceRepo.getTableParams = function () {
+        return table.getTableParams();
+    };
+
+    serviceRepo.fetchPage = function (pageSettings) {
+        angular.extend(serviceRepo.mapping.page, {
+            'data': pageSettings ? pageSettings : table.getPageSettings()
+        });
+        return WsApi.fetch(serviceRepo.mapping.page);
+    };
+
+    var safePage = function(resolve) {
+        serviceRepo.fetchPage().then(function (response) {
+            var page = angular.fromJson(response.body).payload.PageImpl;
+            serviceRepo.empty();
+            serviceRepo.addAll(page.content);
+            if (table.getPageSettings().pageNumber > 1 && table.getPageSettings().pageNumber > page.totalPages) {
+                table.setPage(page.totalPages);
+                safePage(resolve);
+            } else {
+                resolve(page);
+            }
+        });
+    };
+
+    serviceRepo.page = function () {
+        return $q(function (resolve) {
+            safePage(resolve);
+        });
+    };
+
+    var table = TableFactory.buildTable({
+        pageNumber: sessionStorage.getItem('services-page') ? sessionStorage.getItem('services-page') : 1,
+        pageSize: sessionStorage.getItem('services-size') ? sessionStorage.getItem('services-size') : 10,
+        direction: 'DESC',
+        properties: ['name'],
+        filters: {},
+        counts: [5, 10, 25, 50, 100],
+        page: serviceRepo.page,
+        data: serviceRepo.getContents(),
+        name: 'services'
+    });
+
     var checkCreateNotes = function (service) {
         if (service.notes === undefined) {
             service.notes = [];
@@ -169,6 +216,7 @@ app.repo("ServiceRepo", function ServiceRepo($q, $timeout, WsApi) {
     WsApi.listen(serviceRepo.mapping.createListen).then(null, null, function (response) {
         $timeout(function () {
             serviceRepo.reset();
+            table.getTableParams().reload();
         }, 250);
     });
 
diff --git a/app/views/checkbox.html b/app/views/checkbox.html
new file mode 100644
index 00000000..e05627b4
--- /dev/null
+++ b/app/views/checkbox.html
@@ -0,0 +1 @@
+<input id="overallCheckbox" type="checkbox" ng-click="toggleAll()"/>
\ No newline at end of file
diff --git a/app/views/detail/service/ideas.html b/app/views/detail/service/ideas.html
index dc037bcc..e40699ae 100644
--- a/app/views/detail/service/ideas.html
+++ b/app/views/detail/service/ideas.html
@@ -5,7 +5,7 @@
 
   <table ng-table="ideasTableParams" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped idea-table">
     <tr ng-repeat="idea in $data">
-      <td width="30" header="'views/ng-table/checkbox.html'">
+      <td width="30" header="'views/checkbox.html'">
         <input class="idea-checkbox" type="checkbox" ng-click="toggleSelectIdea(idea)" ng-checked="isSelectedIdea(idea)"/>
       </td>
       <td title="'Title'">{{idea.title}}</td>
diff --git a/app/views/directives/tableControls.html b/app/views/directives/tableControls.html
index d1bc7d07..36f753f1 100644
--- a/app/views/directives/tableControls.html
+++ b/app/views/directives/tableControls.html
@@ -1,3 +1,18 @@
+<script type="text/ng-template" id="customTableHeader">
+<tr>
+  <th ng-repeat="column in weaverTable.columns">
+  	<span>{{column.gloss}}
+  		<span
+  			ng-if="column.sortable"
+			ng-click="weaverTable.toggleSort(column.property)"
+    		class="sort-control glyphicon"
+    		ng-class="{'unsorted': weaverTable.unsorted(column.property), 'asc': weaverTable.asc(column.property), 'desc': weaverTable.desc(column.property)}">
+    	</span>
+  	</span>
+  </th>
+</tr>
+</script>
+
 <div ng-if="filters">
   <div class="management-control">
       <div class="row">
diff --git a/app/views/directives/thContents.html b/app/views/directives/thContents.html
new file mode 100644
index 00000000..50ada862
--- /dev/null
+++ b/app/views/directives/thContents.html
@@ -0,0 +1,7 @@
+<span>{{sortable[property]}}
+  <span
+    ng-click="toggleSort(property)"
+    class="sort-control glyphicon"
+    ng-class="{'unsorted': unsorted(property), 'asc': asc(property), 'desc': desc(property)}">
+  </span>
+</span>
\ No newline at end of file
diff --git a/app/views/management/featureProposals.html b/app/views/management/featureProposals.html
index 819e2950..25cbe92c 100644
--- a/app/views/management/featureProposals.html
+++ b/app/views/management/featureProposals.html
@@ -1,23 +1,13 @@
 <div class="management-table" ng-controller="FeatureProposalController">
 
-  <weaver-table>
+  <weaver-table weaver-table="weaverTable">
 
     <weaver-table-controls>
       <button class="btn btn-default view-action-button pull-right" ng-click="openModal('#addFpModal')">Add Feature Proposal</button>
     </weaver-table-controls>
 
     <weaver-table-element>
-      <table ng-table="tableParams" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped fp-table">
-        <thead>
-          <tr>
-            <th><span>Service<span ng-click="toggleSort('service.name')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('service.name'), 'asc': asc('service.name'), 'desc': desc('service.name')}"></span></span></th>
-            <th><span>Title<span ng-click="toggleSort('title')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('title'), 'asc': asc('title'), 'desc': desc('title')}"></span></span></th>
-            <th><span>Description</span></th>
-            <th><span>Last Modified<span ng-click="toggleSort('lastModified')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('lastModified'), 'asc': asc('lastModified'), 'desc': desc('lastModified')}"></span></span></th>
-            <th><span>Submitted<span ng-click="toggleSort('submitted')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('submitted'), 'asc': asc('submitted'), 'desc': desc('submitted')}"></span></span></th>
-            <th><span>Actions</span></th>
-          </tr>
-        </thead>
+      <table ng-table="tableParams" template-header="customTableHeader"  template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped fp-table">
         <tbody>
           <tr ng-repeat="fp in $data">
             <td title="'Service'"><a href="{{'service/' + fp.service.id + '/detail/'}}">{{fp.service.name}}</a></td>
diff --git a/app/views/management/ideas.html b/app/views/management/ideas.html
index 7afcec46..974a3a76 100644
--- a/app/views/management/ideas.html
+++ b/app/views/management/ideas.html
@@ -1,27 +1,17 @@
 <div class="management-table" ng-controller="IdeaController">
 
-  <weaver-table>
+  <weaver-table weaver-table="weaverTable">
 
     <weaver-table-controls>
       <button class="btn btn-default view-action-button pull-right" ng-click="openModal('#addIdeaModal')">Add Idea</button>
     </weaver-table-controls>
 
     <weaver-table-element>
-      <table ng-table="tableParams" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped idea-table">
-        <thead>
-          <tr>
-            <th><span>Service<span ng-click="toggleSort('service.name')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('service.name'), 'asc': asc('service.name'), 'desc': desc('service.name')}"></span></span></th>
-            <th><span>Title<span ng-click="toggleSort('title')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('title'), 'asc': asc('title'), 'desc': desc('title')}"></span></span></th>
-            <th><span>Description</span></th>
-            <th><span>Last Modified<span ng-click="toggleSort('lastModified')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('lastModified'), 'asc': asc('lastModified'), 'desc': desc('lastModified')}"></span></span></th>
-            <th><span>Elevated<span ng-click="toggleSort('elevated')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('elevated'), 'asc': asc('elevated'), 'desc': desc('elevated')}"></span></span></th>
-            <!-- <th><span>Actions</span></th> -->
-          </tr>
-        </thead>
+      <table ng-table="tableParams" template-header="customTableHeader" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped idea-table">
         <tbody>
           <tr ng-repeat="idea in $data">
             <td><a href="{{'service/' + idea.service.id + '/detail/'}}">{{idea.service.name}}</a> <span ng-if="idea.schedules.length > 0">(scheduled)</span></td>
-            <td><a href="{{'idea/' + idea.id + '/detail/'}}">{{idea.title}}</a></td>
+            <td>{{idea.title}}</td>
             <td>{{idea.description}}</td>
             <td>{{idea.lastModified | date : 'medium'}}</td>
             <td>{{idea.elevated}}</td>
diff --git a/app/views/management/notes.html b/app/views/management/notes.html
index 3960502d..cfc31634 100644
--- a/app/views/management/notes.html
+++ b/app/views/management/notes.html
@@ -1,25 +1,13 @@
 <div class="management-table" ng-controller="NoteController">
 
-  <weaver-table>
+  <weaver-table weaver-table="weaverTable">
 
     <weaver-table-controls>
       <button class="btn btn-default view-action-button pull-right" ng-click="openModal('#addNoteModal')">Add Note</button>
     </weaver-table-controls>
 
     <weaver-table-element>
-      <table ng-table="tableParams" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped note-table">
-        <thead>
-          <tr>
-            <th><span>Service<span ng-click="toggleSort('service.name')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('service.name'), 'asc': asc('service.name'), 'desc': desc('service.name')}"></span></span></th>
-            <th><span>Title<span ng-click="toggleSort('title')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('title'), 'asc': asc('title'), 'desc': desc('title')}"></span></span></th>
-            <th><span>Body</span></th>
-            <th><span>Type<span ng-click="toggleSort('noteType')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('noteType'), 'asc': asc('noteType'), 'desc': desc('noteType')}"></span></span></th>
-            <th><span>Last Modified<span ng-click="toggleSort('lastModified')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('lastModified'), 'asc': asc('lastModified'), 'desc': desc('lastModified')}"></span></span></th>
-            <th><span>Pinned<span ng-click="toggleSort('pinned')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('pinned'), 'asc': asc('pinned'), 'desc': desc('pinned')}"></span></span></th>
-            <th><span>Active<span ng-click="toggleSort('active')" class="sort-control glyphicon" ng-class="{'unsorted': unsorted('active'), 'asc': asc('active'), 'desc': desc('active')}"></span></span></th>
-            <th><span>Actions</span></th>
-          </tr>
-        </thead>
+      <table ng-table="tableParams" template-header="customTableHeader" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped note-table">
         <tbody>
           <tr ng-repeat="note in $data">
             <td><a href="{{'service/' + note.service.id + '/detail/'}}">{{note.service.name}}</a> <span ng-if="note.schedules.length > 0">(scheduled)</span></td>
diff --git a/app/views/management/services.html b/app/views/management/services.html
index 6bb8855b..33da5de6 100644
--- a/app/views/management/services.html
+++ b/app/views/management/services.html
@@ -1,32 +1,38 @@
 <div class="management-table" ng-controller="ServiceController">
 
-  <div class="management-control clearfix">
-    <div class="row">
-      <div class="col-md-12">
-        <button class="btn btn-default view-action-button pull-right" ng-click="openModal('#addServiceModal')">Add Service</button>
-      </div>
-    </div>
-  </div>
+  <weaver-table weaver-table="weaverTable">
 
-  <table ng-table="tableParams" show-filter="false" class="table table-bordered table-striped service-table">
-    <tr ng-repeat="service in services track by service.id">
-      <td title="'Service'"><a href="{{'service/' + service.id + '/detail/'}}">{{service.name}}</a> <span ng-if="service.schedules.length > 0">(scheduled)</span></td>
-      <td title="'Status'">{{service.status}}</td>
-      <td ng-if="service.isAuto" ng-attr-title="{{service.serviceUrl}}"><a href="{{service.serviceUrl}}">{{service.serviceUrl}}</a></td>
-      <td ng-if="!service.isAuto" title="'Auto Updating'">{{service.isAuto}}</td>
-      <td title="'Public'">{{service.isPublic}}</td>
-      <td title="'Short List'">{{service.onShortList}}</td>
-      <td title="'Project'">{{getProject(service).name}}</td>
-      <td class="actions-column text-center" title="'Actions'">
-        <span class="glyphicon glyphicon-pencil" title="edit" ng-click="editService(service)"></span>
-        <span class="glyphicon glyphicon-time" title="schedule" ng-click="editSchedule(service)"></span>
-        <span class="glyphicon glyphicon-trash" title="delete" ng-click="confirmDelete(service)"></span>
-      </td>
-    </tr>
-  </table>
+    <weaver-table-controls>
+      <button class="btn btn-default view-action-button pull-right" ng-click="openModal('#addServiceModal')">Add Service</button>
+    </weaver-table-controls>
 
-  <modal modal-id="addServiceModal" modal-view="views/modals/addServiceModal.html" modal-header-class="modal-header-primary" wvr-modal-backdrop="static"></modal>
-  <modal modal-id="deleteServiceModal" modal-view="views/modals/deleteServiceModal.html" modal-header-class="modal-header-danger" wvr-modal-backdrop="static"></modal>
-  <modal modal-id="editServiceModal" modal-view="views/modals/editServiceModal.html" modal-header-class="modal-header-primary" wvr-modal-backdrop="static"></modal>
-  <modal modal-id="editScheduleModal" modal-view="views/modals/editScheduleModal.html" modal-header-class="modal-header-primary" wvr-modal-backdrop="static"></modal>
-</div>
+    <weaver-table-element>
+      <table ng-table="tableParams" template-header="customTableHeader" template-pagination="views/customPaginationControls.html" show-filter="false" class="table table-bordered table-striped service-table">
+        <tbody>
+          <tr ng-repeat="service in $data">
+            <td title="'Service'"><a href="{{'service/' + service.id + '/detail/'}}">{{service.name}}</a> <span ng-if="service.schedules.length > 0">(scheduled)</span></td>
+            <td title="'Status'">{{service.status}}</td>
+            <td title="'Auto Updating'">{{service.isAuto}}</td>
+            <td title="'Public'">{{service.isPublic}}</td>
+            <td title="'Short List'">{{service.onShortList}}</td>
+            <td title="'URL'">{{service.serviceUrl}}</td>
+            <td title="'Project'">{{getProject(service).name}}</td>
+            <td class="actions-column text-center" title="'Actions'">
+              <span class="glyphicon glyphicon-pencil" title="edit" ng-click="editService(service)"></span>
+              <span class="glyphicon glyphicon-time" title="schedule" ng-click="editSchedule(service)"></span>
+              <span class="glyphicon glyphicon-trash" title="delete" ng-click="confirmDelete(service)"></span>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </weaver-table-element>
+
+    <weaver-table-modals>
+      <modal modal-id="addServiceModal" modal-view="views/modals/addServiceModal.html" modal-header-class="modal-header-primary" wvr-modal-backdrop="static"></modal>
+      <modal modal-id="deleteServiceModal" modal-view="views/modals/deleteServiceModal.html" modal-header-class="modal-header-danger" wvr-modal-backdrop="static"></modal>
+      <modal modal-id="editServiceModal" modal-view="views/modals/editServiceModal.html" modal-header-class="modal-header-primary" wvr-modal-backdrop="static"></modal>
+      <modal modal-id="editScheduleModal" modal-view="views/modals/editScheduleModal.html" modal-header-class="modal-header-primary" wvr-modal-backdrop="static"></modal>
+    </weaver-table-modals>
+  </weaver-table>
+
+</div>
\ No newline at end of file
diff --git a/app/views/management/users.html b/app/views/management/users.html
index 3a2611e1..fcbf66a4 100644
--- a/app/views/management/users.html
+++ b/app/views/management/users.html
@@ -29,8 +29,8 @@ <h3 class="panel-title">Users</h3>
               <td>{{thisUser.role}}</td>
               <td>
                 <select ng-if="(isAdmin())" ng-model="thisUser.role" ng-change="updateRole(thisUser)" class="form-control">
-									<option ng-repeat="role in allowableRoles(thisUser.role)">{{role}}</option>
-								</select>
+                  <option ng-repeat="role in allowableRoles(thisUser.role)">{{role}}</option>
+                </select>
               </td>
             </tr>
           </tbody>
@@ -39,5 +39,4 @@ <h3 class="panel-title">Users</h3>
     </div>
   </div>
 
-
 </div>
\ No newline at end of file
diff --git a/app/views/modals/addNoteModal.html b/app/views/modals/addNoteModal.html
index fba0fb13..5a1b6429 100644
--- a/app/views/modals/addNoteModal.html
+++ b/app/views/modals/addNoteModal.html
@@ -6,6 +6,7 @@ <h3 class="modal-title">Add Note</h3>
 </div>
 
 <form ng-submit="createNote()" name="forms.create" novalidate>
+
   <validationmessage results="noteRepo.getValidationResults()"></validationmessage>
 
   <div class="modal-body">
diff --git a/app/views/modals/detail/service/addFpModal.html b/app/views/modals/detail/service/addFpModal.html
index 028b52d9..d4a0951f 100644
--- a/app/views/modals/detail/service/addFpModal.html
+++ b/app/views/modals/detail/service/addFpModal.html
@@ -6,7 +6,7 @@ <h3 class="modal-title">Add Feature Proposal</h3>
   </div>
   
   <form ng-submit="createFeatureProposal()" name="forms.createFp" novalidate>
-    <validationmessage results="ideaRepo.getValidationResults()"></validationmessage>
+    <validationmessage results="fpRepo.getValidationResults()"></validationmessage>
   
     <div class="modal-body">