directives.js

app.directive('tableSortButtons', function () {
    return {
        restrict: 'E',
        scope: {
            predicate: '='
        },
        replace: true,
        template: '<div class="btn-group pull-right">' +
                        '<button type="button" class="btn btn-default btn-xs" ng-click="asc()"><span class="glyphicon glyphicon-chevron-up"></span></button>' +
                        '<button type="button" class="btn btn-default btn-xs" ng-click="desc()"><span class="glyphicon glyphicon-chevron-down"></span></button>' +
                '</div>',
        link: function (scope, elem, attrs) {
            scope.asc = function () {
                scope.predicate = attrs.attribute;
            };
            scope.desc = function () {
                scope.predicate = '-' + attrs.attribute;
            };
        }
    };
});

app.directive('buttonUploader', function () {
    return {
        restrict: 'E',
        link: function (scope, elem, attrs) {
            elem.bind('click', function () {
                elem.find('input')[0].click();
            });
        }
    };
});

app.directive('singleImage', function () {
    return {
        restrict: 'A',
        scope: {
            image: '='
        },
        link: function (scope, elem, attrs) {
            elem.bind('change', function (event) {
                var files = event.target.files;
                scope.$apply(function () {
                    scope.image = files[0];
                });
            });
        }
    };
});

app.directive('logoImage', function () {
    return {
        restrict: 'A',
        scope: {
            shop: '='
        },
        link: function (scope, elem, attrs) {
            var reader = new FileReader();
            reader.onload = function (event) {
                elem.attr('src', event.target.result);
            };
            scope.$watch('shop.logo', function (newValue) {
                if (typeof newValue !== 'undefined' && newValue instanceof Blob) {
                    reader.readAsDataURL(newValue);
                }
            });
        }
    };
});

app.directive('basicUploader', function () {
    return {
        restrict: 'A',
        link: function (scope, elem, attrs) {
            elem.bind('change', function (event) {
                var files = event.target.files;
                scope.$apply(function () {
                    var i;
                    for (i = 0; i < files.length; i++) {
                        scope.temporaryImages.push(files[i]);
                    }
                });
            });
        }
    };
});

app.directive('tempImage', function () {
    return {
        restrict: 'A',
        link: function (scope, elem, attrs) {
            var reader = new FileReader();
            reader.onload = function (event) {
                elem.attr('src', event.target.result);
            };
            reader.readAsDataURL(scope.image);
        }
    };
});

app.directive('dropZone', function () {
    return {
        restrict: 'A',
        link: function (scope, elem, attrs) {
            elem.bind('dragover', function (event) {
                event.stopPropagation();
                event.preventDefault();
                event.dataTransfer.dropEffect = 'copy';
            });
            elem.bind('drop', function (event) {
                event.stopPropagation();
                event.preventDefault();

                var files = event.dataTransfer.files;
                var i, len = files.length;
                for (i = 0; i < len; i++) {
                    scope.$apply(function () {
                        var file = files[i];
                        file.progress = 0;
                        scope.temporaryImages.push(file);
                    });
                }
            });
        }
    };
});

app.directive('discreteBar', function () {
    return {
        restrict: 'E',
        scope: {
            data: '='
        },
        link: function (scope, elem, attrs) {
            scope.$watch('data', function (data) {
                if (typeof data !== 'undefined') {
                    nv.addGraph(function() {
                        var chart = nv.models.discreteBarChart().
                            margin({left: 100, bottom: 100}).
                            x(function(d) { return d.label }).
                            y(function(d) { return d.value }).
                            staggerLabels(true).
                            tooltips(true).
                            showValues(true).
                            transitionDuration(350);
                        chart.xAxis.axisLabel(attrs.xlabel).tickFormat(function (d) {
                            return d3.time.format('%x')(new Date(d));
                        });
                        chart.yAxis.axisLabel(attrs.ylabel);
                        d3.select(elem[0]).select('svg').
                            datum(data).
                            call(chart);
                        nv.utils.windowResize(chart.update);
                        return chart;
                    });
                }
            });
        }
    }
});