all files / stepper-base/ stepper-base.js

100% Statements 103/103
96.97% Branches 64/66
86.36% Functions 19/22
100% Lines 97/97
18 statements, 7 functions, 29 branches Ignored     
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163                454×                                       126×           139×   139× 138×     107× 107× 107× 107× 107× 107× 107× 21×     17×     107× 11×   107× 86×     86× 86× 86× 86× 86×     80×   86×   86× 86×     82× 82×                                    
/* istanbul ignore next */ 
var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
/* istanbul ignore next */ 
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
define(["require", "exports", "@syncfusion/ej2-base"], function (require, exports, ej2_base_1) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var PROGRESSVALUE = '--progress-value';
    var StepStatus;
    (function (StepStatus) {
        StepStatus["NotStarted"] = "NotStarted";
        StepStatus["InProgress"] = "InProgress";
        StepStatus["Completed"] = "Completed";
    })(StepStatus = exports.StepStatus || (exports.StepStatus = {}));
    var Step = (function (_super) {
        __extends(Step, _super);
        function Step() {
            return _super !== null && _super.apply(this, arguments) || this;
        }
        __decorate([
            ej2_base_1.Property('')
        ], Step.prototype, "cssClass", void 0);
        __decorate([
            ej2_base_1.Property(false)
        ], Step.prototype, "disabled", void 0);
        __decorate([
            ej2_base_1.Property('')
        ], Step.prototype, "iconCss", void 0);
        __decorate([
            ej2_base_1.Property(null)
        ], Step.prototype, "isValid", void 0);
        __decorate([
            ej2_base_1.Property('')
        ], Step.prototype, "label", void 0);
        __decorate([
            ej2_base_1.Property(false)
        ], Step.prototype, "optional", void 0);
        __decorate([
            ej2_base_1.Property(StepStatus.NotStarted)
        ], Step.prototype, "status", void 0);
        __decorate([
            ej2_base_1.Property('')
        ], Step.prototype, "text", void 0);
        return Step;
    }(ej2_base_1.ChildProperty));
    exports.Step = Step;
    var StepperOrientation;
    (function (StepperOrientation) {
        StepperOrientation["Horizontal"] = "Horizontal";
        StepperOrientation["Vertical"] = "Vertical";
    })(StepperOrientation = exports.StepperOrientation || (exports.StepperOrientation = {}));
    var StepperBase = (function (_super) {
        __extends(StepperBase, _super);
        function StepperBase(options, element) {
            return _super.call(this, options, element) || this;
        }
        StepperBase.prototype.preRender = function () {
        };
        StepperBase.prototype.getModuleName = function () {
            return 'stepperBase';
        };
        StepperBase.prototype.getPersistData = function () {
            return this.addOnPersist([]);
        };
        StepperBase.prototype.render = function () {
        };
        StepperBase.prototype.updateOrientaion = function (wrapper) {
            if (wrapper.classList.contains('e-horizontal') || wrapper.classList.contains('e-vertical')) {
                wrapper.classList.remove('e-horizontal', 'e-vertical');
            }
            if (!(ej2_base_1.isNullOrUndefined(this.orientation))) {
                wrapper.classList.add('e-' + this.orientation.toLocaleLowerCase());
            }
        };
        StepperBase.prototype.renderProgressBar = function (wrapper) {
            this.progressStep = this.createElement('div', { className: 'e-stepper-progressbar' });
            this.progressbar = this.createElement('div', { className: 'e-progressbar-value' });
            this.progressStep.appendChild(this.progressbar);
            wrapper.prepend(this.progressStep);
            this.progressbar.style.setProperty(PROGRESSVALUE, (0) + '%');
            var beforeLabel = (wrapper.querySelector('li').querySelector('.e-step-label-container'));
            if (wrapper.classList.contains('e-vertical')) {
                if (wrapper.classList.contains('e-label-bottom') || wrapper.classList.contains('e-label-top')) {
                    var stepsContainer = (wrapper.querySelector('.e-stepper-steps'));
                    this.progressStep.style.setProperty('--progress-position', (stepsContainer.offsetWidth / 2) + 'px');
                }
                else {
                    this.progressStep.style.setProperty('--progress-position', ((this.progressBarPosition / 2) - 1) + 'px');
                }
            }
            if (beforeLabel && (beforeLabel.classList.contains('e-label-before'))) {
                this.progressStep.style.setProperty('--progress-position', (((this.progressBarPosition) - 1)) + 5 + 'px');
            }
            if (wrapper.classList.contains('e-horizontal')) {
                this.setProgressPosition(wrapper);
            }
        };
        StepperBase.prototype.setProgressPosition = function (wrapper, isResize) {
            var stepItemContainer = (wrapper.querySelector('.e-step-container'));
            var stepItemEle = stepItemContainer.firstElementChild;
            Eif (isResize !== true) {
                var topPos = 0;
                if (wrapper.classList.contains('e-label-before')) {
                    topPos = (stepItemContainer.offsetParent.offsetHeight - (stepItemEle.offsetHeight / 2) - 1);
                }
                else {
                    topPos = (stepItemEle.offsetHeight / 2);
                }
                this.progressStep.style.setProperty('--progress-top-position', topPos + 'px');
            }
            var lastEle = wrapper.querySelector('.e-stepper-steps').lastChild.firstChild;
            if (wrapper.classList.contains('e-rtl')) {
                var leftPost = ((stepItemEle.offsetLeft + stepItemEle.offsetWidth) - wrapper.querySelector('.e-stepper-steps').offsetWidth);
                this.progressStep.style.setProperty('--progress-left-position', Math.abs(leftPost) + 'px');
                this.progressStep.style.setProperty('--progress-bar-width', Math.abs(lastEle.offsetLeft - stepItemEle.offsetLeft) + 'px');
            }
            else {
                this.progressStep.style.setProperty('--progress-left-position', (stepItemEle.offsetLeft + 1) + 'px');
                this.progressStep.style.setProperty('--progress-bar-width', ((lastEle.offsetWidth + lastEle.offsetLeft - 2) - (stepItemEle.offsetLeft + 2)) + 'px');
            }
        };
        StepperBase.prototype.onPropertyChanged = function (newProp, oldProp) {
        };
        __decorate([
            ej2_base_1.Collection([], Step)
        ], StepperBase.prototype, "steps", void 0);
        __decorate([
            ej2_base_1.Property('')
        ], StepperBase.prototype, "cssClass", void 0);
        __decorate([
            ej2_base_1.Property(false)
        ], StepperBase.prototype, "readOnly", void 0);
        __decorate([
            ej2_base_1.Property(StepperOrientation.Horizontal)
        ], StepperBase.prototype, "orientation", void 0);
        __decorate([
            ej2_base_1.Event()
        ], StepperBase.prototype, "created", void 0);
        StepperBase = __decorate([
            ej2_base_1.NotifyPropertyChanges
        ], StepperBase);
        return StepperBase;
    }(ej2_base_1.Component));
    exports.StepperBase = StepperBase;
});