angular.module('fluro').directive('heroUnit', function() {
    return {
        restrict: 'E', //Look for an element eg. <bootstrap-top-nav>
        replace: true, //Replace the element with our directive template
        template: '<div class=hu><div class=hu-outer><div class=hu-inner ng-transclude></div></div><div class=hu-background ng-switch=background._type><fluro-video ng-params={autoplay:1} ng-model=background ng-switch-when=video></fluro-video><div class=img style="background-image: url({{$root.asset.imageUrl(background._id, 1200)}})" ng-switch-default><img ng-src="{{$root.asset.imageUrl(background._id, 1200)}}" preload-image></div></div></div>', //This will be replaced with the html on the right hand side
        transclude:true,
        scope: {
            background:"="
        }
    };
});