Make possible passing a promise as a site key.

Author: ITachiLab

src/directive.js

@@ -4,11 +4,11 @@
 
     var app = ng.module('vcRecaptcha');
 
-    app.directive('vcRecaptcha', ['$document', '$timeout', 'vcRecaptchaService', function ($document, $timeout, vcRecaptcha) {
+    app.directive('vcRecaptcha', ['$document', '$timeout', 'vcRecaptchaService', '$q', function ($document, $timeout, vcRecaptcha, $q) {
 
         return {
             restrict: 'A',
-            require: "?^^form",
+            require: '?^^form',
             scope: {
                 response: '=?ngModel',
                 key: '=?',
@@ -27,11 +27,16 @@
             link: function (scope, elm, attrs, ctrl) {
                 scope.widgetId = null;
 
-                if(ctrl && ng.isDefined(attrs.required)){
+                if (ctrl && ng.isDefined(attrs.required)) {
                     scope.$watch('required', validate);
                 }
 
                 var removeCreationListener = scope.$watch('key', function (key) {
+                    // Abort if undefined or null
+                    if (ng.isUndefined(key) || key === null) {
+                        return;
+                    }
+
                     var callback = function (gRecaptchaResponse) {
                         // Safe $apply
                         $timeout(function () {
@@ -43,19 +48,20 @@
                         });
                     };
 
-                    vcRecaptcha.create(elm[0], {
-
-                        callback: callback,
-                        key: key,
-                        stoken: scope.stoken || attrs.stoken || null,
-                        theme: scope.theme || attrs.theme || null,
-                        type: scope.type || attrs.type || null,
-                        lang: scope.lang || attrs.lang || null,
-                        tabindex: scope.tabindex || attrs.tabindex || null,
-                        size: scope.size || attrs.size || null,
-                        badge: scope.badge || attrs.badge || null,
-                        'expired-callback': expired
-
+                    // Accept a promise, or resolve immediately if the value is a bare string
+                    $q.resolve(key).then(function (resolved) {
+                        return vcRecaptcha.create(elm[0], {
+                            callback: callback,
+                            key: resolved,
+                            stoken: scope.stoken || attrs.stoken || null,
+                            theme: scope.theme || attrs.theme || null,
+                            type: scope.type || attrs.type || null,
+                            lang: scope.lang || attrs.lang || null,
+                            tabindex: scope.tabindex || attrs.tabindex || null,
+                            size: scope.size || attrs.size || null,
+                            badge: scope.badge || attrs.badge || null,
+                            'expired-callback': expired
+                        });
                     }).then(function (widgetId) {
                         // The widget has been created
                         validate();
@@ -64,50 +70,49 @@
 
                         scope.$on('$destroy', destroy);
 
-                        scope.$on('reCaptchaReset', function(event, resetWidgetId){
-                          if(ng.isUndefined(resetWidgetId) || widgetId === resetWidgetId){
-                            scope.response = "";
-                            validate();
-                          }
-                        })
-
+                        scope.$on('reCaptchaReset', function (event, resetWidgetId) {
+                            if (ng.isUndefined(resetWidgetId) || widgetId === resetWidgetId) {
+                                scope.response = '';
+                                validate();
+                            }
+                        });
                     });
 
                     // Remove this listener to avoid creating the widget more than once.
                     removeCreationListener();
                 });
 
                 function destroy() {
-                  if (ctrl) {
-                    // reset the validity of the form if we were removed
-                    ctrl.$setValidity('recaptcha', null);
-                  }
+                    if (ctrl) {
+                        // reset the validity of the form if we were removed
+                        ctrl.$setValidity('recaptcha', null);
+                    }
 
-                  cleanup();
+                    cleanup();
                 }
 
-                function expired(){
+                function expired() {
                     // Safe $apply
                     $timeout(function () {
-                        scope.response = "";
+                        scope.response = '';
                         validate();
 
                         // Notify about the response availability
-                        scope.onExpire({ widgetId: scope.widgetId });
+                        scope.onExpire({widgetId: scope.widgetId});
                     });
                 }
 
-                function validate(){
-                    if(ctrl){
+                function validate() {
+                    if (ctrl) {
                         ctrl.$setValidity('recaptcha', scope.required === false ? null : Boolean(scope.response));
                     }
                 }
 
-                function cleanup(){
-                  vcRecaptcha.destroy(scope.widgetId);
+                function cleanup() {
+                    vcRecaptcha.destroy(scope.widgetId);
 
-                  // removes elements reCaptcha added.
-                  ng.element($document[0].querySelectorAll('.pls-container')).parent().remove();
+                    // removes elements reCaptcha added.
+                    ng.element($document[0].querySelectorAll('.pls-container')).parent().remove();
                 }
             }
         };