From b94a6aa0d9b3d0236eb208557a0e509ba1e202df Mon Sep 17 00:00:00 2001 From: Arush Sehgal Date: Fri, 11 Oct 2013 01:42:47 -0700 Subject: [PATCH] introduced reasons why shopping online for clothes sucks to demonstrate easy refactoring --- .../app/scripts/controllers/master-detail.js | 47 ++++++++++++++++++- client/app/scripts/modules/data/Monsters.js | 18 ++++--- .../app/scripts/modules/directives/forms.js | 10 ++-- .../views/detail/about.list.bootstrap.html | 8 ++-- client/app/views/detail/crud.detail.edit.html | 6 +-- client/app/views/detail/crud.detail.html | 10 ++-- client/app/views/detail/crud.list.html | 44 +++++++++-------- 7 files changed, 99 insertions(+), 44 deletions(-) diff --git a/client/app/scripts/controllers/master-detail.js b/client/app/scripts/controllers/master-detail.js index 77109cd..6bbdc93 100644 --- a/client/app/scripts/controllers/master-detail.js +++ b/client/app/scripts/controllers/master-detail.js @@ -203,9 +203,52 @@ angular.module('demo') $scope.createMonster = function() { // new up the model - $scope.masterDetailCtrl.collection.addMonster('Joe', 'exploding feces').then(function() { - alert('OMG you created a monster named: ' + $scope.masterDetailCtrl.collection.first().get('name')); + var f1Drivers = [ + 'Sebastian Vettel', + 'Fernando Alonso', + 'Kimi Raikkonen', + 'Lewis Hamilton', + 'Mark Webber', + 'Nico Rosberg', + 'Felipe Massa', + 'Romain Grosjean', + 'Jenson Button', + 'Paul di Resta', + 'Nico Hulkenberg', + 'Adrian Sutil', + 'Sergio Perez', + 'Daniel Ricciardo', + 'Jean-Eric Vergne', + 'Pastor Maldonado', + 'Esteban Gutierrez', + 'Valtteri Bottas', + 'Jules Bianchi', + 'Charles Pic', + ]; + + var reasons = [ + 'Because what the hell is a: "through button bias cut front and centre back box pleat with hanger loop, finished with mitred button cuffs, bias cut spade chest pocket, contrast lined back yoke and curved hem." - (bensherman.com)', + 'On mobile? Forget about it', + 'They know I\'m a dude, but they keep emailing me chicks shoes! WTF', + 'I don\'t even wanna think about dealing with customer support or the lack thereof', + 'I don\'t have to pay to try clothes on in a store, so why do I have to pay to try 2 different sizes online?', + 'Because I know I\'m gonna get screwed with the returns', + 'Paid $80 for a shirt that doesn\'t fit because I lost the returns form', + 'Missed the returns window? Fuck you very much.', + 'Because they\'re banking on me to screw up the returns', + '"Oh sorry sir, didn\'t you read the terms?"', + 'What happens if it doesn\'t fit?', + 'Why pay for shipping when I can go to the mall?' + ]; + + var randomNumber = Math.floor(Math.random()*f1Drivers.length); + + var randomNumber2 = Math.floor(Math.random()*reasons.length); + + $scope.masterDetailCtrl.collection.addMonster(f1Drivers[randomNumber], reasons[randomNumber2]).then(function() { + + alert('You created a new object for: ' + $scope.masterDetailCtrl.collection.first().get('name')); }); diff --git a/client/app/scripts/modules/data/Monsters.js b/client/app/scripts/modules/data/Monsters.js index 413fbd1..d673127 100644 --- a/client/app/scripts/modules/data/Monsters.js +++ b/client/app/scripts/modules/data/Monsters.js @@ -10,10 +10,16 @@ angular.module('ExternalDataServices') this.set('name',name); return this; }, - setScaryMove: function(move) { - this.set('scaryMove',move); + setReason: function(reason) { + this.set('reason', reason); return this; }, + getName: function(name) { + return this.get('name'); + }, + getReason: function(reason) { + return this.get('reason'); + }, destroyParse:function(){ return ParseQueryAngular(this,{functionToCall:"destroy"}); } @@ -24,19 +30,19 @@ angular.module('ExternalDataServices') comparator: function(model) { return -model.createdAt.getTime(); }, - loadMonstersWithMove: function(move) { + loadMonstersWithName: function(name) { this.query = (new Parse.Query(Monster)); - + this.query.equalTo('name', name); // use the enhanced load() function to fetch the collection return this.load(); }, - addMonster: function(name, move) { + addMonster: function(name, reason) { // save request_id to Parse var _this = this; var monster = new Monster; monster.setName(name); - monster.setScaryMove(move); + monster.setReason(reason); // use the extended Parse SDK to perform a save and return the promised object back into the Angular world return monster.saveParse().then(function(data){ diff --git a/client/app/scripts/modules/directives/forms.js b/client/app/scripts/modules/directives/forms.js index 1e5fce9..4bf907e 100644 --- a/client/app/scripts/modules/directives/forms.js +++ b/client/app/scripts/modules/directives/forms.js @@ -17,7 +17,7 @@ angular.module('forms', []) scope.editedMonster = { name: null, - scaryMove: null + reason: null } scope.$watch('monsterToSave.attributes.name', function(name) { @@ -25,8 +25,8 @@ angular.module('forms', []) }) - scope.$watch('monsterToSave.attributes.scaryMove', function(scaryMove) { - scope.editedMonster.scaryMove = scaryMove; + scope.$watch('monsterToSave.attributes.reason', function(reason) { + scope.editedMonster.reason = reason; }) @@ -37,13 +37,13 @@ angular.module('forms', []) // put the form in a loading state var loadingContainer = $('#loadingContainer'); - addLoaderTo(loadingContainer, 'savingForm', 'Saving Monster'); + addLoaderTo(loadingContainer, 'savingForm', 'Saving'); element.find('button').attr('disabled','disabled'); // set the new attributes scope.monsterToSave.setName(scope.editedMonster.name); - scope.monsterToSave.setScaryMove(scope.editedMonster.scaryMove); + scope.monsterToSave.setReason(scope.editedMonster.reason); // perform the save diff --git a/client/app/views/detail/about.list.bootstrap.html b/client/app/views/detail/about.list.bootstrap.html index 662df43..f3eae11 100644 --- a/client/app/views/detail/about.list.bootstrap.html +++ b/client/app/views/detail/about.list.bootstrap.html @@ -5,7 +5,7 @@ Back -

SASS Twitter Bootstrap

+

Sass Bootstrap

@@ -19,10 +19,10 @@

-
+
-

Because who actually uses LESS?

+

Sass Bootstrap 2.3.2

@@ -30,7 +30,7 @@

Because who actually uses LESS?

- We use sass-bootstrap which is just a version of Bootstrap converted to SASS. + We use sass-bootstrap which is, believe it or not, Bootstrap converted to Sass.
diff --git a/client/app/views/detail/crud.detail.edit.html b/client/app/views/detail/crud.detail.edit.html index 2e81430..cc450bc 100644 --- a/client/app/views/detail/crud.detail.edit.html +++ b/client/app/views/detail/crud.detail.edit.html @@ -5,7 +5,7 @@ Back -

Edit Monster

+

Edit

@@ -30,9 +30,9 @@

- +
- +

diff --git a/client/app/views/detail/crud.detail.html b/client/app/views/detail/crud.detail.html index 6154ea0..c127130 100644 --- a/client/app/views/detail/crud.detail.html +++ b/client/app/views/detail/crud.detail.html @@ -5,7 +5,7 @@ List -

Monster Detail

+

Detail

Edit @@ -26,8 +26,8 @@

-

Monster's Name

- {{detailCtrl.current.get('name')}} +

Name

+ {{detailCtrl.current.getName()}}
@@ -36,8 +36,8 @@

Monster's Name

-

Scary Move

- {{detailCtrl.current.get('scaryMove')}} +

Reason

+ {{detailCtrl.current.getReason()}}

diff --git a/client/app/views/detail/crud.list.html b/client/app/views/detail/crud.list.html index b68d487..8bb38fb 100644 --- a/client/app/views/detail/crud.list.html +++ b/client/app/views/detail/crud.list.html @@ -16,9 +16,9 @@

CRUD

-
+
- Click the up top to create a new model! + Reasons why shopping online for clothes sucks
@@ -27,31 +27,37 @@

-
-
-
- Monster: +
+
+
+ Name: +
+
+
{{item.getName()}}
-
- {{item.get('name')}} -
-
-
-
-
- Scary Move: + +
+
+ Reason: +
+
+ {{item.getReason()}}
-
- {{item.get('scaryMove')}} -
+
+ +
+ +
+
+
-
+