Add 'test connection' button for manage service view.

Gruntfile.js

@@ -36,7 +36,7 @@ module.exports = function (grunt) {
         tasks: ['wiredep']
       },
       js: {
-        files: ['<%= yeoman.app %>/scripts/{,*/}*.js'],
+        files: ['<%= yeoman.app %>/scripts/{,*/}*.js', '<%= yeoman.app %>/admin_components/**/*.js'],
         tasks: ['newer:jshint:all'],
         options: {
           livereload: '<%= connect.options.livereload %>'

app/admin_components/adf-services/dreamfactory-services.js

@@ -350,7 +350,7 @@ angular.module('dfServices', ['ngRoute', 'dfUtility'])
         };
     }])
 
-    .directive('dfServiceDetails', ['MOD_SERVICES_ASSET_PATH', '$q', 'dfApplicationData', 'dfNotify', 'dfObjectService', function (MOD_SERVICES_ASSET_PATH, $q, dfApplicationData, dfNotify, dfObjectService) {
+    .directive('dfServiceDetails', ['MOD_SERVICES_ASSET_PATH', '$q', '$http', 'dfApplicationData', 'dfNotify', 'dfObjectService', 'INSTANCE_URL', function (MOD_SERVICES_ASSET_PATH, $q, $http, dfApplicationData, dfNotify, dfObjectService, INSTANCE_URL) {
 
         return {
 
@@ -504,6 +504,32 @@ angular.module('dfServices', ['ngRoute', 'dfUtility'])
                     return data;
                 };
 
+
+                scope.testServiceConnection = function () {
+
+                    var url = INSTANCE_URL.url + '/' + scope.serviceInfo.name + '/_schema';
+
+                    var messageOptions = {
+                        module: 'Services',
+                        provider: 'dreamfactory'
+                    };
+
+                    $http.get(url).then(function (response) {
+                        messageOptions.type = 'success';
+                        messageOptions.message = 'Test connection succeeded.';
+                        dfNotify.success(messageOptions);
+
+                    }, function (reject) {
+                        messageOptions.type = 'error';
+                        messageOptions.message = reject.data.error.message;
+                        dfNotify.error(messageOptions);
+                    });
+                };
+
+                scope.isServiceTypeDatabase = function () {
+                    return scope.selectedSchema.group == 'Database';
+                };
+
                 scope.saveService = function () {
 
                     // merge data from UI into current edit record

app/admin_components/adf-services/views/df-service-details.html

@@ -44,6 +44,10 @@
                        type="submit"
                        value="Save and Close"
                        data-ng-click="selections.saveAndClose=true"/>
+                <button data-ng-if="!newService && selectedSchema && selectedSchema.config_schema && isServiceTypeDatabase()"
+                       class="btn btn-default btn-primary save-service-btn"
+                       type="button"
+                       data-ng-click="testServiceConnection()">Test Connection</button>
                 <button data-ng-if="selectedSchema && selectedSchema.config_schema"
                         id="services_details_cancel"
                         type="button"

dist/admin_components/adf-services/views/df-service-details.html

@@ -1 +1 @@
-<div> <!-- Form Title --> <df-details-header data-new="newService" data-api-name="'Service'" data-name="service.record.name"></df-details-header> <form data-ng-submit="saveOrUpdateService(saveAndClose)" autocomplete="off"> <ul class="nav nav-tabs" data-role="tablist"> <li class="active"><a showtab href="#info" id="info-tab">Info</a></li> <li><a showtab href="#config" id="config-tab" ng-click="refreshServiceConfigEditor()">Config</a></li> <li> <a showtab href="#service-definition" id="service-definition-tab" ng-click="refreshServiceDefEditor()">Service Definition</a> </li> </ul> <div class="tab-content" style="margin-top: 20px"> <div id="info" class="tab-pane active"> <df-large-help data-options="dfLargeHelp.basic"></df-large-help> <df-service-info></df-service-info> </div> <div id="config" class="tab-pane"> <df-large-help data-options="dfLargeHelp.config"></df-large-help> <df-service-config></df-service-config> </div> <div id="service-definition" class="tab-pane"> <df-large-help data-options="dfLargeHelp.serviceDefReadOnly" data-ng-hide="isServiceDefEditable"></df-large-help> <df-large-help data-options="dfLargeHelp.serviceDef" data-ng-hide="!isServiceDefEditable"></df-large-help> <df-service-definition></df-service-definition> </div> </div> <!-- /.tab-content --> <div class="form-group"> <div> <input data-ng-if="selectedSchema && selectedSchema.config_schema" id="services_details_save" class="btn btn-default btn-primary save-service-btn" type="submit" value="Save" data-ng-click="selections.saveAndClose=false"> <input data-ng-if="!newService && selectedSchema && selectedSchema.config_schema" id="services_details_save_close" class="btn btn-default btn-primary save-service-btn" type="submit" value="Save and Close" data-ng-click="selections.saveAndClose=true"> <button data-ng-if="selectedSchema && selectedSchema.config_schema" id="services_details_cancel" type="button" class="btn btn-default" data-ng-click="cancelEditor()">Close</button> </div> </div> </form> </div> 
+<div> <!-- Form Title --> <df-details-header data-new="newService" data-api-name="'Service'" data-name="service.record.name"></df-details-header> <form data-ng-submit="saveOrUpdateService(saveAndClose)" autocomplete="off"> <ul class="nav nav-tabs" data-role="tablist"> <li class="active"><a showtab href="#info" id="info-tab">Info</a></li> <li><a showtab href="#config" id="config-tab" ng-click="refreshServiceConfigEditor()">Config</a></li> <li> <a showtab href="#service-definition" id="service-definition-tab" ng-click="refreshServiceDefEditor()">Service Definition</a> </li> </ul> <div class="tab-content" style="margin-top: 20px"> <div id="info" class="tab-pane active"> <df-large-help data-options="dfLargeHelp.basic"></df-large-help> <df-service-info></df-service-info> </div> <div id="config" class="tab-pane"> <df-large-help data-options="dfLargeHelp.config"></df-large-help> <df-service-config></df-service-config> </div> <div id="service-definition" class="tab-pane"> <df-large-help data-options="dfLargeHelp.serviceDefReadOnly" data-ng-hide="isServiceDefEditable"></df-large-help> <df-large-help data-options="dfLargeHelp.serviceDef" data-ng-hide="!isServiceDefEditable"></df-large-help> <df-service-definition></df-service-definition> </div> </div> <!-- /.tab-content --> <div class="form-group"> <div> <input data-ng-if="selectedSchema && selectedSchema.config_schema" id="services_details_save" class="btn btn-default btn-primary save-service-btn" type="submit" value="Save" data-ng-click="selections.saveAndClose=false"> <input data-ng-if="!newService && selectedSchema && selectedSchema.config_schema" id="services_details_save_close" class="btn btn-default btn-primary save-service-btn" type="submit" value="Save and Close" data-ng-click="selections.saveAndClose=true"> <button data-ng-if="!newService && selectedSchema && selectedSchema.config_schema && isServiceTypeDatabase()" class="btn btn-default btn-primary save-service-btn" type="button" data-ng-click="testServiceConnection()">Test Connection</button> <button data-ng-if="selectedSchema && selectedSchema.config_schema" id="services_details_cancel" type="button" class="btn btn-default" data-ng-click="cancelEditor()">Close</button> </div> </div> </form> </div> 

dist/index.html

@@ -2,7 +2,7 @@
       <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
     <![endif]--> <!-- Add your site or application content here --> <div id="dreamfactoryApp" data-ng-controller="MainCtrl" df-popup-login> <div id="popup-login-container"></div> <!-- Top level Nav --> <df-top-level-nav-std data-options="topLevelNavOptions"></df-top-level-nav-std> <div data-ng-if="showAdminComponentNav" style="margin: 10px auto"> <!-- Component nav and title --> <div class="container-fluid"> <div class="row"> <div class="col-xs-12"> <df-component-title></df-component-title> <df-component-nav data-options="componentNavOptions"></df-component-nav> </div> </div> </div> </div> <!-- Rendering Context --> <div class="container-fluid"> <div class="row"> <div class="col-xs-12"> <div class="row"> <div data-ng-view=""></div> </div> </div> </div> </div> <!--<df-main-loading></df-main-loading>--> <div id="mask"></div> </div> <!--[if lt IE 9]>
     <script src="scripts/oldieshim.d41d8cd9.js"></script>
-    <![endif]--> <script src="scripts/vendor.ef0c91cf.js"></script> <script src="scripts/app.3f689440.js"></script> <!-- other deps --> <script src="vendor/ace/ace.js"></script> <script src="vendor/ace/mode-javascript.js"></script> <script src="vendor/ace/mode-json.js"></script> <script src="vendor/ace/mode-yaml.js"></script> <!--Begin Comm100 Live Chat Code--> <div id="comm100-button-219"></div> <script type="text/javascript"> var Comm100API=Comm100API||{};
+    <![endif]--> <script src="scripts/vendor.ef0c91cf.js"></script> <script src="scripts/app.c72da043.js"></script> <!-- other deps --> <script src="vendor/ace/ace.js"></script> <script src="vendor/ace/mode-javascript.js"></script> <script src="vendor/ace/mode-json.js"></script> <script src="vendor/ace/mode-yaml.js"></script> <!--Begin Comm100 Live Chat Code--> <div id="comm100-button-219"></div> <script type="text/javascript"> var Comm100API=Comm100API||{};
         Comm100API.status = "init";
         Comm100API.showChat = function (bool) {
             var sel = $("#comm100-button-219");