Pony.fm/resources/assets/scripts/app/directives/src-loader.coffee

angular.module('ponyfm').directive 'pfmSrcLoader', () ->
    (scope, element, attrs) ->
        size = attrs.pfmSrcSize || 'normal'
        element.css {opacity: .5}

        update = (val) ->
            element.attr 'src', '/images/icons/loading_' + size + '.png'

            image = element.clone()
            image.removeAttr 'pfm-src-loader'
            image.removeAttr 'pfm-src-size'

            # If the given value is null, don't bother trying to
            # load something - it will result in an HTTP error.
            if val
                image[0].onload = ->
                    element.attr 'src', val
                    element.css {opacity: 0}
                    element.animate {opacity: 1}, 250

                image[0].src = val

        update scope.$eval attrs.pfmSrcLoader

        scope.$watch attrs.pfmSrcLoader, update