contact message errors and success message
3 измененных файлов с 76 добавлено и 3 удалено
+ 66
- 0
app/scripts/controllers/contact.js
@@ -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
@@ -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
@@ -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 |
|