angular
    .module('ngVibrant')
    .directive('vibrant', vibrant);

function vibrant($vibrant) {
    var directive = {
        restrict: 'A',
        scope: {
            vibrant: '=' //Model
        },
        link: link
    };

    return directive;

    function link(scope, element) {
        scope.vibrant = [];
        element.on('load', function() {
            var swatches = $vibrant(element[0]);
            scope.vibrant = swatches;
        });
    }
}

@@ -134,16 +134,17 @@
 rict: 'A
+E
 ',%0A     
@@ -171,28 +171,81 @@
     
-vibrant: '=' //Model
+model: '=ngModel', //Model%0A            url: '@?',%0A            color: '@?'
 %0A   
@@ -334,16 +334,23 @@
  element
+, attrs
 ) %7B%0A    
@@ -363,22 +363,259 @@
 ope.
-vibrant = %5B%5D;%0A
+model = %5B%5D;%0A        if (angular.isDefined(attrs.url)) %7B%0A            $vibrant.get(attrs.url).then(function(swatches) %7B%0A                scope.model = angular.isDefined(attrs.color) ? swatches%5Battrs.color%5D : swatches;%0A            %7D);%0A        %7Delse %7B%0A    
     
@@ -658,24 +658,28 @@
             
+    
 var swatches
@@ -689,16 +689,24 @@
 $vibrant
+.vibrant
 (element
@@ -727,23 +727,82 @@
     
+    
 scope.
-vibrant =
+model = angular.isDefined(attrs.color) ? swatches%5Battrs.color%5D :
  swa
@@ -812,24 +812,38 @@
 es;%0A        
+  
+  
 %7D);%0A
+        %7D%0A
     %7D%0A%7D%0A

Allow usage as Attribute and Element, map swatches to ng-model and added url and color attributes