superdesk-ui-framework 6.1.0-dev1 → 7.0.0-dev-hg0

package/app/scripts/carousel.js

@@ -1,137 +0,0 @@
-/* eslint-disable */
-/* global _ */
-
-CarouselDirective.$inject = [];
-function CarouselDirective() {
-    return {
-        scope: {
-            currentStep: '=',
-            finish: '&',
-            model: '='
-        },
-        template: require('../template/carousel.html'),
-        transclude: true,
-        controllerAs: 'ctrl',
-        controller: ['$scope', '$document',
-            function ($scope, $document) {
-                var self = this;
-
-                $scope.selectedStep = null;
-                $scope.pageIndex = 0;
-                $scope.steps = [];
-
-                $scope.goTo = function (step) {
-                    unselectAll();
-                    $scope.selectedStep = step;
-                    $scope.pageIndex = _.indexOf($scope.steps, step);
-                    if (!_.isUndefined($scope.currentStep)) {
-                        $scope.currentStep = step.code;
-                    }
-                    step.selected = true;
-                };
-
-                this.addStep = function (step) {
-                    $scope.steps.push(step);
-                    $scope.$watch('currentStep', function (stepCode) {
-                        if (stepCode && ($scope.selectedStep && $scope.selectedStep.code !== stepCode
-                                || !$scope.selectedStep)) {
-                            $scope.goTo(_.find($scope.steps, {code: stepCode}));
-                        }
-                    });
-
-                    if (!$scope.selectedStep) {
-                        this.goTo(0);
-                    }
-                };
-
-                this.goTo = function (step) {
-                    var stepTo;
-
-                    if (_.isNumber(step)) {
-                        stepTo = $scope.steps[step];
-                    } else {
-                        stepTo = _.find($scope.steps, {code: step});
-                    }
-                    $scope.goTo(stepTo);
-                };
-
-                this.next = function () {
-                    var index = _.indexOf($scope.steps, $scope.selectedStep);
-
-                    if (index === $scope.steps.length - 1) {
-                        this.finish();
-                    } else {
-                        $scope.goTo($scope.steps[index + 1]);
-                    }
-                };
-
-                this.previous = function () {
-                    var index = _.indexOf($scope.steps, $scope.selectedStep);
-
-                    if (index > 0) {
-                        $scope.goTo($scope.steps[index - 1]);
-                    }
-                };
-
-                this.finish = function () {
-                    if ($scope.finish) {
-                        $scope.finish();
-                    }
-                };
-
-                function unselectAll() {
-                    _.each($scope.steps, function (step) {
-                        step.selected = false;
-                    });
-                    $scope.selectedStep = null;
-                }
-
-                $document.bind('keydown', function (e) {
-                    if (e.keyCode === 37) {
-                        $scope.$applyAsync(function () {
-                            self.previous();
-                        });
-                    } else if (e.keyCode === 39) {
-                        $scope.$applyAsync(function () {
-                            self.next();
-                        });
-                    }
-                });
-
-                $scope.$on('$destroy', function () {
-                    $document.unbind('keydown');
-                });
-
-            }
-        ],
-        link: function (scope, elem) {
-            scope.$watch('model', function () {
-                if (scope.model) {
-                    elem.show();
-                } else {
-                    elem.hide();
-                }
-            });
-        }
-    };
-}
-
-CarouselStepDirective.$inject = [];
-function CarouselStepDirective() {
-    return {
-        scope: {
-            code: '@'
-        },
-        template: '<div class="sd-carousel__page" ng-show="selected" ng-transclude></div>',
-        transclude: true,
-        replace: true,
-        require: '^sdCarousel',
-        link: function (scope, elem, attr, carousel) {
-            carousel.addStep(scope);
-        }
-    };
-}
-
-angular.module('superdesk-ui.carousel', [])
-        .directive('sdCarousel', CarouselDirective)
-        .directive('sdCarouselStep', CarouselStepDirective);

package/app/scripts/check.js

@@ -1,99 +0,0 @@
-/* eslint-disable */
-
-sdCheck.$inject = ['$parse'];
-function sdCheck($parse) {
-    return {
-        require: 'ngModel',
-        replace: true,
-        transclude: true,
-        template: '<span class="sd-check__wrapper">' +
-                '<span class="sd-checkbox"></span><label ng-transclude></label></span>',
-        link: function ($scope, element, attrs, ngModel) {
-            $scope.testId = attrs.testId || '';
-
-            var label = element.find('label'),
-                    checkbox = element.find('span'),
-                    isChecked = $parse(attrs.ngChecked)($scope);
-
-            if (isChecked) {
-                if (attrs.type === 'radio') {
-                    ngModel.$setViewValue(attrs.ngValue);
-                }
-
-                if (attrs.ngTrueValue) {
-                    ngModel.$setViewValue(attrs.ngTrueValue);
-                }
-
-                ngModel.$setViewValue(!ngModel.$viewValue);
-            }
-
-            ngModel.$render = function () {
-                render(label, checkbox, ngModel.$viewValue);
-            };
-
-            $scope.$watch(attrs.ngModel, function () {
-                render(label, checkbox, ngModel.$viewValue);
-            });
-
-            element.on('click', function () {
-                if (attrs.disabled) {
-                    return false;
-                }
-
-                $scope.$apply(function () {
-                    if (attrs.type === 'radio') {
-                        return ngModel.$setViewValue(attrs.ngValue);
-                    }
-
-                    if (attrs.ngTrueValue) {
-                        return ngModel.$setViewValue(ngModel.$viewValue ===
-                                attrs.ngTrueValue ? attrs.ngFalseValue : attrs.ngTrueValue);
-                    }
-
-                    return ngModel.$setViewValue(!ngModel.$viewValue);
-                });
-            });
-
-            function render(label, checkbox, value) {
-                if (attrs.type === 'radio') {
-                    value = ngModel.$viewValue === attrs.ngValue;
-                    checkbox.addClass('sd-checkbox--radio');
-                }
-
-                if (attrs.ngTrueValue) {
-                    value = ngModel.$viewValue === attrs.ngTrueValue;
-                }
-
-                if (attrs.disabled) {
-                    checkbox.addClass('sd-checkbox sd-checkbox--disabled');
-                    label.addClass('sd-label--disabled');
-                }
-
-                if (attrs.icon) {
-                    checkbox.html('<i class="icon-' + attrs.icon + '">').append(label).addClass('sd-checkbox sd-checkbox--button-style');
-                }
-
-                checkbox.toggleClass('checked', !!value).attr('checked', !!value);
-
-                if (attrs.labelPosition !== 'inside') {
-                    label.toggleClass('label--active', !!value);
-                }
-            }
-
-            // CHECKBOX STYLING
-            if (attrs.labelPosition === 'inside') {
-                checkbox.html(label).addClass('sd-checkbox sd-checkbox--button-style');
-
-                if (attrs.icon) {
-                    checkbox.prepend('<i class="icon-' + attrs.icon + '">');
-                }
-
-            } else if (attrs.labelPosition === 'left') {
-                label.after(checkbox);
-            }
-        }
-    };
-}
-
-angular.module('superdesk-ui.check', [])
-        .directive('sdCheck', sdCheck);

package/app/scripts/circularProgress.js

@@ -1,55 +0,0 @@
-/* eslint-disable */
-
-sdCircularProgress.$inject = [];
-function sdCircularProgress() {
-    return {
-        scope: {
-            value: '=',
-            error: '=',
-            counter: '='
-        },
-        template: require('../template/circular-progress.html'),
-        link: function (scope, element) {
-            let elem = $(element).find('.progress-svg');
-
-            let width = elem.outerWidth();
-            let strokeWidth = parseInt(elem.find('circle').css('strokeWidth'));
-
-            setTimeout(() => {
-                elem.find('circle').css('transition', 'stroke-dashoffset ease-in-out .3s');
-            }, 500);
- 
-            scope.radius = (width / 2) - (strokeWidth / 2);
-            scope.circumference = 2 * Math.PI * scope.radius;
-
-            scope.$watch('error', (val) => {
-                if (val) {
-                    element.addClass('error');
-                    scope.status = 'error';
-                } else {
-                    element.removeClass('error');
-                    delete scope.status;
-                }
-            });
-                
-            scope.$watch('value', () => {
-                if (!scope.value || scope.value < 0) {
-                    scope.value = 0;
-
-                } else if (scope.value >= 100) {
-                    scope.value = 100;
-                    element.addClass('completed');
-                    scope.status = 'completed';
-                } else {
-                    element.removeClass('completed');
-                    delete scope.status;
-                }
-
-                scope.dashOffset = scope.circumference * (1 - (scope.value / 100));
-            });
-        }
-    };
-}
-
-angular.module('superdesk-ui.circularProgress', [])
-        .directive('sdCircularProgress', sdCircularProgress);

package/app/scripts/dropdown.js

@@ -1,248 +0,0 @@
-/* eslint-disable */
-
-sdDropdown.$inject = ["$window"];
-function sdDropdown($window) {
-    return {
-        link: function (scope, elem) {
-            var menu = elem.children(".dropdown__menu");
-
-            var settings = {
-                    isTopOriented: menu.hasClass("dropdown--dropup"),
-                    isRightOriented: menu.hasClass("dropdown--align-right"),
-                    isInlineOrientedRight: elem.hasClass("dropdown--dropright"),
-                    isInlineOrientedLeft: elem.hasClass("dropdown--dropleft"),
-                },
-                button;
-
-            function closeToBottom() {
-                return button && button.offset()
-                    ? checkEnvironment().bottom <=
-                          menu.outerHeight() + button.outerHeight()
-                    : false;
-            }
-
-            function closeToTop() {
-                return button && button.offset()
-                    ? checkEnvironment().top <=
-                          menu.outerHeight() + button.outerHeight()
-                    : false;
-            }
-
-            function closeToLeft() {
-                return checkEnvironment().left < menu.outerWidth();
-            }
-
-            function closeToRight() {
-                return button && button.offset()
-                    ? $window.innerWidth -
-                          button.offset().left -
-                          button.outerWidth() <=
-                          menu.outerWidth()
-                    : false;
-            }
-
-            function checkEnvironment() {
-                let container = false;
-
-                if (elem.parents("#authoring-container").length) {
-                    container = "#authoring-container";
-                } else if (elem.parents(".modal__body").length) {
-                    container = ".modal__body";
-                }
-
-                return {
-                    top: container
-                        ? button.offset().top - $(container).offset().top
-                        : button.offset().top,
-                    left: container
-                        ? elem.offset().left - $(container).offset().left
-                        : elem.offset().left,
-                    bottom: container
-                        ? $(container).innerHeight() - button.offset().top
-                        : $window.innerHeight -
-                          (button.offset().top - $window.scrollY),
-                };
-            }
-
-            elem.bind("click", doTheMath);
-
-            if (elem.hasClass("dropdown--hover")) {
-                elem.bind("mouseover", doTheMath);
-            }
-
-            function doTheMath() {
-                button =
-                    elem.find(".dropdown__toggle") ||
-                    elem.find(".dropdown-toggle") ||
-                    elem.find("[dropdown__toggle]");
-
-                // Check if menu is near bottom edge
-                if (closeToBottom()) {
-                    elem.addClass("dropdown--dropup");
-                } else {
-                    elem.removeClass("dropdown--dropup");
-                }
-
-                // Check if menu is near top edge
-                if (closeToTop()) {
-                    elem.removeClass("dropdown--dropup");
-                }
-
-                // Check if menu is near left edge
-                if (closeToLeft()) {
-                    settings.isInlineOrientedRight ||
-                    settings.isInlineOrientedLeft
-                        ? elem
-                              .removeClass("dropdown--dropleft")
-                              .addClass("dropdown--dropright")
-                        : menu.removeClass("dropdown--align-right");
-                }
-
-                // Check if menu is near right edge
-                if (closeToRight()) {
-                    settings.isInlineOrientedRight ||
-                    settings.isInlineOrientedLeft
-                        ? elem
-                              .addClass("dropdown--dropleft")
-                              .removeClass("dropdown--dropright")
-                        : menu.addClass("dropdown--align-right");
-                }
-
-                if (closeToLeft() && closeToRight()) {
-                    settings.isInlineOrientedRight ||
-                    settings.isInlineOrientedLeft
-                        ? elem
-                              .removeClass("dropdown--dropleft")
-                              .removeClass("dropdown--dropright")
-                        : menu.removeClass("dropdown--align-right");
-                }
-
-                // If neither, return to initial state
-                if (!closeToLeft() && !closeToRight()) {
-                    if (settings.isInlineOrientedRight) {
-                        elem.addClass("dropdown--dropright").removeClass(
-                            "dropdown--dropleft"
-                        );
-                    } else if (settings.isInlineOrientedLeft) {
-                        elem.addClass("dropdown--dropleft").removeClass(
-                            "dropdown--dropright"
-                        );
-                    } else if (settings.isRightOriented) {
-                        menu.addClass("dropdown--align-right");
-                    } else {
-                        menu.removeClass("dropdown--align-right");
-                    }
-                }
-            }
-        },
-    };
-}
-
-sdDropdownAppendToBody.$inject = ["$window", "$timeout"];
-function sdDropdownAppendToBody($window, $timeout) {
-    return {
-        require: "dropdown",
-        link: function (scope, elem, attr, ctrl) {
-            var button = elem.find("[dropdown__toggle]"),
-                topOffset = 48;
-
-            function closeToRight(menu, inline) {
-                return (
-                    $window.innerWidth - elem.offset().left <
-                    menu.outerWidth() + (inline ? button.outerWidth() : 0)
-                );
-            }
-
-            function closeToTop(menu) {
-                return (
-                    button.offset().top <
-                    menu.outerHeight() + button.outerHeight()
-                );
-            }
-
-            function closeToBottom(menu) {
-                return (
-                    $window.innerHeight -
-                        (button.offset().top - $window.scrollY) <
-                    menu.outerHeight() + button.outerHeight()
-                );
-            }
-
-            scope.$watch(ctrl.isOpen, function (isOpen) {
-                if (!isOpen) {
-                    return false;
-                }
-
-                var style = {
-                    display: isOpen ? "block" : "none",
-                    top: elem.offset().top + button.outerHeight(),
-                    left: elem.offset().left,
-                    opacity: 1,
-                };
-
-                scope.$evalAsync(function () {
-                    ctrl.dropdownMenu.css({ opacity: 0, display: "none" });
-                });
-
-                $timeout(
-                    function () {
-                        scope.$applyAsync(function () {
-                            // Check if menu is near bottom edge
-                            if (closeToBottom(ctrl.dropdownMenu)) {
-                                style.top =
-                                    elem.offset().top -
-                                    ctrl.dropdownMenu.outerHeight();
-                            } else {
-                                style.top =
-                                    elem.offset().top + button.outerHeight();
-                            }
-
-                            // Check if element is right aligned
-                            if (elem.hasClass("dropdown--align-right")) {
-                                style.left =
-                                    elem.offset().left -
-                                    ctrl.dropdownMenu.outerWidth() +
-                                    button.outerWidth();
-                            }
-
-                            // Check if menu is near right edge
-                            if (closeToRight(ctrl.dropdownMenu)) {
-                                style.left =
-                                    elem.offset().left -
-                                    ctrl.dropdownMenu.outerWidth() -
-                                    15;
-                            }
-
-                            // Check if menu is near top and bottom edge
-                            if (
-                                closeToTop(ctrl.dropdownMenu) &&
-                                !elem.hasClass("dropdown--dropup")
-                            ) {
-                                style.top = topOffset;
-                                style.left = !closeToRight(
-                                    ctrl.dropdownMenu,
-                                    true
-                                )
-                                    ? elem.offset().left + button.outerWidth()
-                                    : elem.offset().left -
-                                      ctrl.dropdownMenu.outerWidth() -
-                                      15;
-                            }
-
-                            // Apply modified css to dropdown menu element
-                            ctrl.dropdownMenu.css(style);
-                        });
-                    },
-                    150,
-                    false
-                );
-            });
-        },
-    };
-}
-
-angular
-    .module("superdesk-ui.dropdown", [])
-    .directive("dropdown", sdDropdown)
-    .directive("dropdownAppendToBody", sdDropdownAppendToBody);
-