brewman/brewman/static/scripts/angular_directive.js

'use strict';

var overlord_directive = angular.module('overlord.directive', []);
overlord_directive.directive('fadey', function () {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var duration = 500;
            element = jQuery(element);
            element.hide();
            element.fadeIn(duration)

            scope.destroy = function (complete) {
                element.fadeOut(duration, function () {
                    if (complete) {
                        complete.apply(scope);
                    }
                });
            };

        }
    };
});

overlord_directive.directive('ngGrowl', ['growl', '$parse', function (growl, $parse) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var options = {
                dismiss_function: attrs["toClose"]
            };
            growl.show(element, scope, options);
        }
    };
}]);

overlord_directive.directive('aceEditor', ['$parse', function ($parse) {
    var ACE_EDITOR_CLASS = 'ace-editor';

    function loadAceEditor(element, mode) {
        var editor = ace.edit(element);
        editor.session.setMode("ace/mode/" + mode);
        return editor;
    }


    function valid(editor) {
        return (Object.keys(editor.getSession().getAnnotations()).length == 0);
    }

    return {
        restrict: 'A',
        require: '?ngModel',
        transclude: true,
        template: '<div class="transcluded" ng-transclude></div><div class="' + ACE_EDITOR_CLASS + '"></div>',
        link: function (scope, element, attrs, ngModel) {
            var language = attrs['aceEditor'] || 'markdown',
                editorElement = element.find('.' + ACE_EDITOR_CLASS)[0],
                editor = loadAceEditor(editorElement, language);

            scope['ace'] = editor;
            editor.setTheme('ace/theme/chrome');
            $(editorElement).css("height", "250px");
            $(editorElement).css("border", "1px solid #ddd");
            $(editorElement).css("border-radius", "4px");

            if (!ngModel) return; // do nothing if no ngModel

            var getter = $parse(attrs['ngModel']);
            var setter = getter.assign;

            editor.getSession().setValue(getter(scope));
            scope.$watch(attrs['ngModel'], function (newValue) {
                if (editor.getValue() !== newValue) {
                    editor.getSession().setValue(newValue);
                }
            });

            editor.getSession().on('change', function () {
                if (valid(editor)) {
//                    ngModel.$setViewValue(editor.getValue());
                    setter(scope, editor.getValue());
                    scope.$apply();
                }
            });
        }
    };
}]);

overlord_directive.directive('chosen', ['$parse', function ($parse) {
    var linker = function (scope, element, attrs) {
        var model = attrs['ngModel'],
            list = attrs['chosen'],
            createFunction = attrs['createFunction'],
            options = {};

        if (typeof createFunction !== 'undefined') {
            options['create_option'] = function (data) {
                var fn = $parse(attrs['createFunction'] + '("' + data + '")');
                scope.$apply(function () {
                    fn(scope);
                });
            };
        }
        scope.$watch(list, function () {
            element.trigger('liszt:updated');
        }, true);

        /* Added this in so that you could preselect items */
        scope.$watch(model, function () {
            element.trigger("liszt:updated");
        }, true);

        element.chosen(options);
    };

    return {
        restrict: 'A',
        link: linker
    };
}]);

overlord_directive.directive('keypress', [function () {
    return function (scope, element, attrs) {
        var attribute = scope.$eval(attrs.keypress || '{}');
        for (var k in attribute) {
            (function (k) {
                Mousetrap.bind(k, function () {
                    return attribute[k](scope, element);
                });
            })(k);
        }
    };
}]);

overlord_directive.directive('onReturn', function () {
    return function (scope, elm, attrs) {
        elm.bind("keypress", function (event) {
            if (event.which === 13) {
                scope.$apply(attrs.onReturn);
            }
        });
    };
});

overlord_directive.directive('tanSse', ['$parse', function ($parse) {
    return{
        restrict: 'EM',
        link: function ($scope, element, attrs) {
            var url = attrs.url,
                subScope = $scope.$new(),
                statusSetter = $parse($scope.status).assign;
            $scope.$on('$destroy', function () {
                subScope.close();
                subScope.$destroy();
            });

            subScope.source = new EventSource(url);
            subScope.source.onopen = function (e) {
                statusSetter($scope, 'Open');
                subScope.$emit('sse:open');
            };
            subScope.source.onmessage = function (e) {
                var data = JSON.parse(e.data);
                subScope.$emit('sse:message', data);
            };
            subScope.source.onerror = function (e) {
                statusSetter($scope, 'Closed');
                subScope.$emit('sse:error');
            };
            source.addEventListener('message', function (e) {
                console.log(e.data);
            }, false);
        }
    };
}]);