Home Explore Help
Register Sign In
jamesperet
/
portfolio-go
Watch 1
Star 0
Fork 0

Browse Source
contact message errors and success message

James Peret 8 years ago
parent
9c2c15f3d4
commit
1e752e4497
3 changed files with 76 additions and 3 deletions
Show Diff Stats
  1. 66 0
      app/scripts/controllers/contact.js
  2. 7 2
      app/scripts/services/mandrill.js
  3. 3 1
      app/views/contact.html

+ 66 - 0
app/scripts/controllers/contact.js
View File 

@@ -12,6 +12,10 @@ angular.module('goApp.contact', ['ngFx', 'ngAnimate', 'goApp.data', 'mandrill'])
12 12
13 13 
     'use strict';
14 14
15 
+    $scope.showError = false;
16 
+    $scope.showSuccess = false;
17 
+    $scope.showSubmit = true;
18 
+
15 19 
     console.log('> Loading Contact Page');
16 20 
     $mixpanel.track('Page View', { "Page": "Contact" });
17 21 
 
@@ -31,6 +35,13 @@ angular.module('goApp.contact', ['ngFx', 'ngAnimate', 'goApp.data', 'mandrill'])
31 35 
       console.log("> Sending message from " + msgData.name)
32 36 
       Mandrill.sendMail(msgData);
33 37 
       $mixpanel.track('Messsage Sent', { "Name": msgData.name, "email": msgData.email });
38 
+      if(!$scope.$$phase) {
39 
+        $scope.$apply(function(){
40 
+          $scope.showSubmit = false;
41 
+        });
42 
+      } else {
43 
+        $scope.showSubmit = false;
44 
+      }
34 45 
     }
35 46
36 47 
     // FadeIn
 
@@ -46,5 +57,60 @@ angular.module('goApp.contact', ['ngFx', 'ngAnimate', 'goApp.data', 'mandrill'])
46 57 
       },800);
47 58 
     };
48 59
60 
+    $rootScope.$on('email_sent:error', function(data) {
61 
+      if(!$scope.$$phase) {
62 
+        $scope.$apply(function(){
63 
+          $scope.showError = true;
64 
+          $scope.showSubmit = false;
65 
+          $timeout(function(){
66 
+            if(!$scope.$$phase) {
67 
+              $scope.$apply(function(){
68 
+                $scope.showError = false;
69 
+                $scope.showSubmit = true;
70 
+              });
71 
+            }
72 
+          },5000);
73 
+        });
74 
+      }
75 
+    });
76 
+
77 
+    $rootScope.$on('email_sent:success', function(data) {
78 
+      if(!$scope.$$phase) {
79 
+        $scope.$apply(function(){
80 
+          $scope.showSuccess = true;
81 
+          $scope.msgData.name = "";
82 
+          $scope.msgData.email = "";
83 
+          $scope.msgData.message = "";
84 
+          $timeout(function(){
85 
+            if(!$scope.$$phase) {
86 
+              $scope.$apply(function(){
87 
+                $scope.showSuccess = false;
88 
+                $scope.showSubmit = true;
89 
+              });
90 
+            } else {
91 
+              $scope.showSuccess = false;
92 
+              $scope.showSubmit = true;
93 
+            }
94 
+          },5000);
95 
+        });
96 
+      } else {
97 
+        $scope.showSuccess = true;
98 
+        $scope.msgData.name = "";
99 
+        $scope.msgData.email = "";
100 
+        $scope.msgData.message = "";
101 
+        $timeout(function(){
102 
+          if(!$scope.$$phase) {
103 
+            $scope.$apply(function(){
104 
+              $scope.showSuccess = false;
105 
+              $scope.showSubmit = true;
106 
+            });
107 
+          } else {
108 
+            $scope.showSuccess = false;
109 
+            $scope.showSubmit = true;
110 
+          }
111 
+        },5000);
112 
+      }
113 
+    });
114 
+
49 115
50 116 
   }]);

+ 7 - 2
app/scripts/services/mandrill.js
View File 

@@ -6,7 +6,7 @@ angular.module('mandrill', [])
6 6 
   "use strict";
7 7
8 8 
   this.sendMail = function(msgData) {
9 
-
9 
+
10 10 
     var messagePost = {
11 11 
       key: "m14Wkh0PhF74K2cTvxWPHA",
12 12 
       message:  {
 
@@ -27,9 +27,14 @@ angular.module('mandrill', [])
27 27 
     console.log(messagePost);
28 28 
     $http.post('https://mandrillapp.com/api/1.0/messages/send.json', { key: messagePost.key, message: messagePost.message })
29 29 
     .success(function(data, status, headers, config){
30 
-      $rootScope.$broadcast('email:sent');
30 
+      $rootScope.$broadcast('email_sent:success');
31 31 
       console.log("> Message sent succesfully!")
32 32 
       console.log(data)
33 
+    }).
34 
+    error(function(data, status, headers, config) {
35 
+      $rootScope.$broadcast('email_sent:error');
36 
+      console.log("> There was an error whule sending the Message.")
37 
+      console.log(data)
33 38 
     });
34 39 
   };
35 40

+ 3 - 1
app/views/contact.html
View File 

@@ -10,7 +10,9 @@
10 10 
           <p><span>Email:</span> <input type="email" ng-model="msgData.email" id="userEmail" required></p>
11 11 
           <p><span>Mensagem:</span></p>
12 12 
           <p><textarea type="text" ng-model="msgData.message" id="userMessage" required rows="10"></textarea></p>
13 
-          <input class="btn" type="submit" ng-click="sendMessage(msgData)" value="Enviar" id="SubmitBtn">
13 
+          <p><input class="btn" type="submit" ng-click="sendMessage(msgData)" value="Enviar" id="SubmitBtn" ng-show="showSubmit"></p>
14 
+          <p><span ng-show="showError">Ocorreu um erro ao enviar a sua mensagem. Por favor tente novamente.</span></p>
15 
+          <p><span ng-show="showSuccess">Mensagem enviada com successo.</span></p>
14 16 
         </form>
15 17
16 18