diff --git a/amanda_keogh/app/index.html b/amanda_keogh/app/index.html
index 86b26d3..0c7800d 100644
--- a/amanda_keogh/app/index.html
+++ b/amanda_keogh/app/index.html
@@ -52,9 +52,9 @@
{{morderor.name}}
-
+
-
+
diff --git a/amanda_keogh/app/js/morderors/controllers/morderors_controller.js b/amanda_keogh/app/js/morderors/controllers/morderors_controller.js
index 0d2120a..d9e974d 100644
--- a/amanda_keogh/app/js/morderors/controllers/morderors_controller.js
+++ b/amanda_keogh/app/js/morderors/controllers/morderors_controller.js
@@ -25,10 +25,11 @@ module.exports = function(app) {
};
$scope.create = function(morderor) {
- $http.post('api/morderors', morderor)
+ $http.post('/api/morderors', morderor)
.then(function(res) {
$scope.morderors.push(res.data);
$scope.newMorderor = {};
+ console.log('morderor created');
}, function(err) {
console.log(err.data);
});
@@ -41,12 +42,12 @@ module.exports = function(app) {
console.log('morderor updated.');
}, function(err) {
console.log(err.data);
- })
+ });
};
$scope.remove = function(morderor) {
$scope.morderors.splice($scope.morderors.indexOf(morderor), 1);
- $http.delete('api/morderors/' + morderor._id)
+ $http.delete('/api/morderors/' + morderor._id)
.then(function(res) {
console.log('morderor removed!');
}, function(err) {
@@ -56,7 +57,7 @@ module.exports = function(app) {
};
$scope.refresh = function(morderor) {
- $http.get('api/morderors/' + morderor._id)
+ $http.get('/api/morderors/' + morderor._id)
.then(function(res) {
console.log('refresh!');
$scope.morderors[$scope.morderors.indexOf(morderor)] = res.data[0];
diff --git a/amanda_keogh/app/sass/_base.scss b/amanda_keogh/app/sass/_base.scss
new file mode 100644
index 0000000..18d2269
--- /dev/null
+++ b/amanda_keogh/app/sass/_base.scss
@@ -0,0 +1,9 @@
+body {
+ color: $black;
+ background-color: $background-color;
+ font-family: 'Open Sans', sans-serif;
+}
+
+form {
+ background-color: $accent-color;
+}
diff --git a/amanda_keogh/app/sass/_config.scss b/amanda_keogh/app/sass/_config.scss
new file mode 100644
index 0000000..bbedf21
--- /dev/null
+++ b/amanda_keogh/app/sass/_config.scss
@@ -0,0 +1,8 @@
+$blue: #51c1bc;
+$white: #f6f4f0;
+$black: #646464;
+$yellow: #e5a919;
+
+$background-color: $white;
+$accent-color: $blue;
+$second-accent: $yellow;
diff --git a/amanda_keogh/app/sass/layout.scss b/amanda_keogh/app/sass/_layout.scss
similarity index 80%
rename from amanda_keogh/app/sass/layout.scss
rename to amanda_keogh/app/sass/_layout.scss
index a6be255..6959e3c 100644
--- a/amanda_keogh/app/sass/layout.scss
+++ b/amanda_keogh/app/sass/_layout.scss
@@ -1,9 +1,6 @@
header {
- background-color: #51c1bc;
+ background-color: $accent-color;
padding: 1.5em;
- h1 {
- margin: 0px;
- }
}
@media all and (min-width: 420px) {
diff --git a/amanda_keogh/app/sass/modules.scss b/amanda_keogh/app/sass/_modules.scss
similarity index 83%
rename from amanda_keogh/app/sass/modules.scss
rename to amanda_keogh/app/sass/_modules.scss
index a59dbff..3f4f9eb 100644
--- a/amanda_keogh/app/sass/modules.scss
+++ b/amanda_keogh/app/sass/_modules.scss
@@ -1,6 +1,6 @@
.morderor {
margin: 25px;
- border: 1px solid #646464;
+ border: 1px solid $black;
padding: 1em;
text-align: center;
}
@@ -21,10 +21,6 @@ form[name="newMorderorForm"] {
text-align: center;
}
-.form-button {
- margin-top: 10px;
-}
-
.vs-box {
padding-top: 25px;
padding-bottom: 25px;
diff --git a/amanda_keogh/app/sass/reset.scss b/amanda_keogh/app/sass/_reset.scss
similarity index 100%
rename from amanda_keogh/app/sass/reset.scss
rename to amanda_keogh/app/sass/_reset.scss
diff --git a/amanda_keogh/app/sass/state.scss b/amanda_keogh/app/sass/_state.scss
similarity index 100%
rename from amanda_keogh/app/sass/state.scss
rename to amanda_keogh/app/sass/_state.scss
diff --git a/amanda_keogh/app/sass/application.scss b/amanda_keogh/app/sass/application.scss
new file mode 100644
index 0000000..353fb7e
--- /dev/null
+++ b/amanda_keogh/app/sass/application.scss
@@ -0,0 +1,7 @@
+@import 'config';
+@import 'buttons/buttons';
+@import 'reset';
+@import 'base';
+@import 'layout';
+@import 'modules';
+@import 'state';
diff --git a/amanda_keogh/app/sass/base.scss b/amanda_keogh/app/sass/base.scss
deleted file mode 100644
index 7f0d07e..0000000
--- a/amanda_keogh/app/sass/base.scss
+++ /dev/null
@@ -1,17 +0,0 @@
-body {
- color: #646464;
- background-color: #f6f4f0;
- font-family: 'Open Sans', sans-serif;
-}
-
-button {
- background-color: #e5a919;
- color: #f6f4f0;
- padding: 1em;
- border: 1px solid #646464;
- border-radius: 5px;
-}
-
-form {
- background-color: #51c1bc;
-}
diff --git a/amanda_keogh/app/sass/buttons/_buttons.scss b/amanda_keogh/app/sass/buttons/_buttons.scss
new file mode 100644
index 0000000..67b0296
--- /dev/null
+++ b/amanda_keogh/app/sass/buttons/_buttons.scss
@@ -0,0 +1,22 @@
+@import 'mixins';
+
+%button-defaults {
+ border: 1px solid $black;
+ border-radius: 5px;
+}
+
+button {
+ @extend %button-defaults;
+ @include button($second-accent, $white, "large");
+}
+
+.form-button {
+ @extend button-defaults;
+ @include button($second-accent, $white, "small");
+ margin-top: 10px;
+}
+
+.delete-button {
+ @extend button-defaults;
+ @include button(#ff0000, $white, "small");
+}
diff --git a/amanda_keogh/app/sass/buttons/_mixins.scss b/amanda_keogh/app/sass/buttons/_mixins.scss
new file mode 100644
index 0000000..0685aa5
--- /dev/null
+++ b/amanda_keogh/app/sass/buttons/_mixins.scss
@@ -0,0 +1,21 @@
+@mixin button-size($size) {
+ @if $size == "small" {
+ font-size: .75em;
+ padding: .5em;
+ }
+ @else if $size == "large" {
+ font-size: 1.2em;
+ padding: .75em;
+ }
+}
+
+@mixin button($background, $color, $size) {
+ @include button-size($size);
+ background-color: $background;
+ color: $color;
+
+ &:hover,
+ &:active {
+ background-color: lighten($background, 8%);
+ }
+}
diff --git a/amanda_keogh/gulpfile.js b/amanda_keogh/gulpfile.js
index e2002f1..9af6504 100644
--- a/amanda_keogh/gulpfile.js
+++ b/amanda_keogh/gulpfile.js
@@ -41,8 +41,8 @@ gulp.task('webpack:test', function() {
.pipe(gulp.dest('test/client/'));
});
-gulp.task('webpack:sass', function() {
- return gulp.src(['app/sass/reset.scss', 'app/sass/base.scss', 'app/sass/layout.scss', 'app/sass/modules.scss', 'app/sass/state.scss'])
+gulp.task('sass', function() {
+ return gulp.src(['app/sass/**/*.scss'])
.pipe(sourcemaps.init({loadMaps: true}))
.pipe(sass().on('error', sass.logError))
.pipe(concatCss('styles.min.css'))
@@ -51,7 +51,7 @@ gulp.task('webpack:sass', function() {
.pipe(gulp.dest('build/'));
})
-gulp.task('build:dev', ['static:dev', 'webpack:dev', 'webpack:sass']);
+gulp.task('build:dev', ['static:dev', 'webpack:dev', 'sass']);
/* * * * * * * * * * * * * * * * * *
LINT TASKS
@@ -99,7 +99,7 @@ gulp.task('mocha', function() {
gulp.task('buildWatch', function() {
gulp.watch(htmlFiles, ['static:dev']);
gulp.watch('app/js/**/*.js', ['build:dev']);
- gulp.watch('app/sass/**/*.sass', ['webpack:sass']);
+ gulp.watch('app/sass/**/*.scss', ['sass']);
});
// backend
diff --git a/amanda_keogh/test/client/morderor_controller_tests.js b/amanda_keogh/test/client/morderor_controller_tests.js
index 62452f4..475b49e 100644
--- a/amanda_keogh/test/client/morderor_controller_tests.js
+++ b/amanda_keogh/test/client/morderor_controller_tests.js
@@ -35,19 +35,58 @@ describe('morderors controller', function() {
});
it('should add to the morderors array with GETall', function() {
- $httpBackend.expectGET('/api/morderors').respond(200, [{_id: 1, name: 'testthing', verb: 'testaction'}]);
+ $httpBackend.expectGET('/api/morderors').respond(200, [{_id: 1, name: 'getall test', verb: 'testaction'}]);
$scope.getAll();
$httpBackend.flush();
- expect($scope.morderors[0].name).toBe('testthing');
+ expect($scope.morderors[0].name).toBe('getall test');
});
- it('should post a new bear', function() {
- $httpBackend.expectPOST('/api/morderors', {name: 'testthing', verb: 'testaction'}).respond(200, {name: 'differenttestthing'});
+ it('should post a new morderor', function() {
+ $httpBackend.expectPOST('/api/morderors', {name: 'testthing', verb: 'testaction'}).respond(200, {name: 'post test'});
expect($scope.morderors.length).toBe(0);
- $scope.create({name: 'testthing'});
+ $scope.create({name: 'testthing', verb:'testaction'});
$httpBackend.flush();
- expect($scope.morderors[0].name).toBe('differenttestthing');
- })
+ expect($scope.morderors[0].name).toBe('post test');
+ expect($scope.newMorderor.name).toBe(undefined);
+ });
+
+ it('should edit a morderor', function() {
+ // test that "editing" property is changed
+ $httpBackend.expectPUT('/api/morderors/test', {_id: 'test', name: 'a test?', verb: 'no really', editing: false}).respond(200, {name: 'put test'});
+ $scope.update({_id: 'test', name: 'a test?', verb: 'no really'});
+ $httpBackend.flush();
+ });
+ });
+
+ //tests which require a dummy morderer in list
+ describe('delete, refresh', function() {
+ beforeEach(angular.mock.inject(function(_$httpBackend_, $rootScope) {
+ $httpBackend = _$httpBackend_;
+ $scope = $rootScope.$new();
+ $ControllerConstructor('IntroController', {$scope: $scope});
+ $scope.morderors = [{_id: 'test', name: 'test name', verb: 'test verb'}];
+ }));
+
+ afterEach(function() {
+ $httpBackend.verifyNoOutstandingExpectation();
+ $httpBackend.verifyNoOutstandingRequest();
+ });
+
+ it('should delete a morderor', function() {
+ $httpBackend.expectDELETE('/api/morderors/test').respond(200);
+ $scope.remove({_id: 'test'});
+ $httpBackend.flush();
+ expect($scope.morderors[0]).toBe(undefined);
+ });
+
+ it('should refresh the current list with new information', function() {
+ $httpBackend.expectGET('/api/morderors/test').respond(200, [{_id: 'test', name: 'super diff'}]);
+ $scope.refresh($scope.morderors[0]);
+ $httpBackend.flush();
+ expect($scope.morderors[0].name).toBe('super diff');
+ });
});
+
+
})