Allow mailTo to be configurable

Part of #485

webadmin/src/views/email.html

@@ -27,18 +27,32 @@
 </div>
 
 <!-- Test email sent -->
-<div class="modal fade" id="testEmailSent" tabindex="-1" role="dialog">
+<div class="modal fade" id="testEmailModal" tabindex="-1" role="dialog">
   <div class="modal-dialog">
     <div class="modal-content">
       <div class="modal-header">
-        <h4 class="modal-title">Test Email Sent</h4>
+        <h4 class="modal-title">Send test email</h4>
       </div>
       <div class="modal-body">
-        A test email was sent to {{ user.email }}. Please check the inbox of this account and verify the email was delivered.
-      </div>
-      <div class="modal-footer">
-        <button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>
+          <form name="testEmailForm" role="form" novalidate ng-submit="testEmail.submit()" autocomplete="off">
+              <fieldset>
+                  <p class="has-error text-center" ng-show="testEmail.error">{{ testEmail.error.generic }}</p>
+
+                  <div class="form-group" ng-class="{ 'has-error': testEmail.error.key }">
+                      <label class="control-label" for="inputTestEmailKey">Email to</label>
+                      <input type="text" class="form-control" ng-model="testEmail.mailTo" id="inputTestMailTo" name="mailTo" ng-disabled="testEmail.busy" placeholder="Email address">
+                  </div>
+
+                  <input class="ng-hide" type="submit" ng-disabled="testEmailForm.$invalid"/>
+              </fieldset>
+          </form>
       </div>
+      <div class="modal-footer ">
+        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
+        <button type="submit" class="btn btn-outline btn-success pull-right" ng-click="testEmail.submit()" ng-disabled="testEmail.$invalid || testEmail.busy">
+            <i class="fa fa-circle-o-notch fa-spin" ng-show="testEmail.busy"></i><span>Send</span>
+        </button>
+    </div>
     </div>
   </div>
 </div>
@@ -260,9 +274,11 @@
           </div>
         </div>
 
+        <br/>
+
         <div class="row">
           <div class="col-xs-12">
-            <button class="btn btn-primary pull-left" ng-click="sendTestEmail()">Send Test Email</button>
+            <button class="btn btn-primary pull-left" ng-click="testEmail.show()">Send Test Email</button>
           </div>
         </div>
       </div>

webadmin/src/views/email.js

@@ -164,12 +164,44 @@ angular.module('Application').controller('EmailController', ['$scope', '$locatio
         }
     };
 
-    $scope.sendTestEmail = function () {
-        Client.sentTestMail($scope.user.email, function (error) {
-            if (error) return console.error(error);
+    $scope.testEmail = {
+        busy: false,
+        error: {},
 
-            $('#testEmailSent').modal('show');
-        });
+        mailTo: '',
+
+        clearForm: function () {
+            $scope.testEmail.mailTo = '';
+        },
+
+        show: function () {
+            $scope.testEmail.error = {};
+            $scope.testEmail.busy = false;
+
+            $scope.testEmail.mailTo = $scope.user.email;
+
+            $('#testEmailModal').modal('show');
+        },
+
+        submit: function () {
+            $scope.testEmail.error = {};
+            $scope.testEmail.busy = true;
+
+            Client.sentTestMail($scope.testEmail.mailTo, function (error) {
+                $scope.testEmail.busy = false;
+
+                if (error) {
+                    if (error.statusCode === 402) {
+                        $scope.testEmail.error.generic = error.message;
+                    } else {
+                        console.error(error);
+                    }
+                    return;
+                }
+
+                $('#testEmailModal').modal('hide');
+            });
+        }
     };
 
     function getMailConfig() {