GPQAPP

Форк
0
428 строк · 12.7 Кб
1
/*!
2
 * bsStepper v1.7.0 (https://github.com/Johann-S/bs-stepper)
3
 * Copyright 2018 - 2019 Johann-S <johann.servoire@gmail.com>
4
 * Licensed under MIT (https://github.com/Johann-S/bs-stepper/blob/master/LICENSE)
5
 */
6
(function (global, factory) {
7
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
8
  typeof define === 'function' && define.amd ? define(factory) :
9
  (global = global || self, global.Stepper = factory());
10
}(this, function () { 'use strict';
11

12
  function _extends() {
13
    _extends = Object.assign || function (target) {
14
      for (var i = 1; i < arguments.length; i++) {
15
        var source = arguments[i];
16

17
        for (var key in source) {
18
          if (Object.prototype.hasOwnProperty.call(source, key)) {
19
            target[key] = source[key];
20
          }
21
        }
22
      }
23

24
      return target;
25
    };
26

27
    return _extends.apply(this, arguments);
28
  }
29

30
  var matches = window.Element.prototype.matches;
31

32
  var closest = function closest(element, selector) {
33
    return element.closest(selector);
34
  };
35

36
  var WinEvent = function WinEvent(inType, params) {
37
    return new window.Event(inType, params);
38
  };
39

40
  var createCustomEvent = function createCustomEvent(eventName, params) {
41
    var cEvent = new window.CustomEvent(eventName, params);
42
    return cEvent;
43
  };
44
  /* istanbul ignore next */
45

46

47
  function polyfill() {
48
    if (!window.Element.prototype.matches) {
49
      matches = window.Element.prototype.msMatchesSelector || window.Element.prototype.webkitMatchesSelector;
50
    }
51

52
    if (!window.Element.prototype.closest) {
53
      closest = function closest(element, selector) {
54
        if (!document.documentElement.contains(element)) {
55
          return null;
56
        }
57

58
        do {
59
          if (matches.call(element, selector)) {
60
            return element;
61
          }
62

63
          element = element.parentElement || element.parentNode;
64
        } while (element !== null && element.nodeType === 1);
65

66
        return null;
67
      };
68
    }
69

70
    if (!window.Event || typeof window.Event !== 'function') {
71
      WinEvent = function WinEvent(inType, params) {
72
        params = params || {};
73
        var e = document.createEvent('Event');
74
        e.initEvent(inType, Boolean(params.bubbles), Boolean(params.cancelable));
75
        return e;
76
      };
77
    }
78

79
    if (typeof window.CustomEvent !== 'function') {
80
      var originPreventDefault = window.Event.prototype.preventDefault;
81

82
      createCustomEvent = function createCustomEvent(eventName, params) {
83
        var evt = document.createEvent('CustomEvent');
84
        params = params || {
85
          bubbles: false,
86
          cancelable: false,
87
          detail: null
88
        };
89
        evt.initCustomEvent(eventName, params.bubbles, params.cancelable, params.detail);
90

91
        evt.preventDefault = function () {
92
          if (!this.cancelable) {
93
            return;
94
          }
95

96
          originPreventDefault.call(this);
97
          Object.defineProperty(this, 'defaultPrevented', {
98
            get: function get() {
99
              return true;
100
            }
101
          });
102
        };
103

104
        return evt;
105
      };
106
    }
107
  }
108

109
  polyfill();
110

111
  var MILLISECONDS_MULTIPLIER = 1000;
112
  var ClassName = {
113
    ACTIVE: 'active',
114
    LINEAR: 'linear',
115
    BLOCK: 'dstepper-block',
116
    NONE: 'dstepper-none',
117
    FADE: 'fade',
118
    VERTICAL: 'vertical'
119
  };
120
  var transitionEndEvent = 'transitionend';
121
  var customProperty = 'bsStepper';
122

123
  var show = function show(stepperNode, indexStep, options, done) {
124
    var stepper = stepperNode[customProperty];
125

126
    if (stepper._steps[indexStep].classList.contains(ClassName.ACTIVE) || stepper._stepsContents[indexStep].classList.contains(ClassName.ACTIVE)) {
127
      return;
128
    }
129

130
    var showEvent = createCustomEvent('show.bs-stepper', {
131
      cancelable: true,
132
      detail: {
133
        from: stepper._currentIndex,
134
        to: indexStep,
135
        indexStep: indexStep
136
      }
137
    });
138
    stepperNode.dispatchEvent(showEvent);
139

140
    var activeStep = stepper._steps.filter(function (step) {
141
      return step.classList.contains(ClassName.ACTIVE);
142
    });
143

144
    var activeContent = stepper._stepsContents.filter(function (content) {
145
      return content.classList.contains(ClassName.ACTIVE);
146
    });
147

148
    if (showEvent.defaultPrevented) {
149
      return;
150
    }
151

152
    if (activeStep.length) {
153
      activeStep[0].classList.remove(ClassName.ACTIVE);
154
    }
155

156
    if (activeContent.length) {
157
      activeContent[0].classList.remove(ClassName.ACTIVE);
158

159
      if (!stepperNode.classList.contains(ClassName.VERTICAL) && !stepper.options.animation) {
160
        activeContent[0].classList.remove(ClassName.BLOCK);
161
      }
162
    }
163

164
    showStep(stepperNode, stepper._steps[indexStep], stepper._steps, options);
165
    showContent(stepperNode, stepper._stepsContents[indexStep], stepper._stepsContents, activeContent, done);
166
  };
167

168
  var showStep = function showStep(stepperNode, step, stepList, options) {
169
    stepList.forEach(function (step) {
170
      var trigger = step.querySelector(options.selectors.trigger);
171
      trigger.setAttribute('aria-selected', 'false'); // if stepper is in linear mode, set disabled attribute on the trigger
172

173
      if (stepperNode.classList.contains(ClassName.LINEAR)) {
174
        trigger.setAttribute('disabled', 'disabled');
175
      }
176
    });
177
    step.classList.add(ClassName.ACTIVE);
178
    var currentTrigger = step.querySelector(options.selectors.trigger);
179
    currentTrigger.setAttribute('aria-selected', 'true'); // if stepper is in linear mode, remove disabled attribute on current
180

181
    if (stepperNode.classList.contains(ClassName.LINEAR)) {
182
      currentTrigger.removeAttribute('disabled');
183
    }
184
  };
185

186
  var showContent = function showContent(stepperNode, content, contentList, activeContent, done) {
187
    var stepper = stepperNode[customProperty];
188
    var toIndex = contentList.indexOf(content);
189
    var shownEvent = createCustomEvent('shown.bs-stepper', {
190
      cancelable: true,
191
      detail: {
192
        from: stepper._currentIndex,
193
        to: toIndex,
194
        indexStep: toIndex
195
      }
196
    });
197

198
    function complete() {
199
      content.classList.add(ClassName.BLOCK);
200
      content.removeEventListener(transitionEndEvent, complete);
201
      stepperNode.dispatchEvent(shownEvent);
202
      done();
203
    }
204

205
    if (content.classList.contains(ClassName.FADE)) {
206
      content.classList.remove(ClassName.NONE);
207
      var duration = getTransitionDurationFromElement(content);
208
      content.addEventListener(transitionEndEvent, complete);
209

210
      if (activeContent.length) {
211
        activeContent[0].classList.add(ClassName.NONE);
212
      }
213

214
      content.classList.add(ClassName.ACTIVE);
215
      emulateTransitionEnd(content, duration);
216
    } else {
217
      content.classList.add(ClassName.ACTIVE);
218
      content.classList.add(ClassName.BLOCK);
219
      stepperNode.dispatchEvent(shownEvent);
220
      done();
221
    }
222
  };
223

224
  var getTransitionDurationFromElement = function getTransitionDurationFromElement(element) {
225
    if (!element) {
226
      return 0;
227
    } // Get transition-duration of the element
228

229

230
    var transitionDuration = window.getComputedStyle(element).transitionDuration;
231
    var floatTransitionDuration = parseFloat(transitionDuration); // Return 0 if element or transition duration is not found
232

233
    if (!floatTransitionDuration) {
234
      return 0;
235
    } // If multiple durations are defined, take the first
236

237

238
    transitionDuration = transitionDuration.split(',')[0];
239
    return parseFloat(transitionDuration) * MILLISECONDS_MULTIPLIER;
240
  };
241

242
  var emulateTransitionEnd = function emulateTransitionEnd(element, duration) {
243
    var called = false;
244
    var durationPadding = 5;
245
    var emulatedDuration = duration + durationPadding;
246

247
    function listener() {
248
      called = true;
249
      element.removeEventListener(transitionEndEvent, listener);
250
    }
251

252
    element.addEventListener(transitionEndEvent, listener);
253
    window.setTimeout(function () {
254
      if (!called) {
255
        element.dispatchEvent(WinEvent(transitionEndEvent));
256
      }
257

258
      element.removeEventListener(transitionEndEvent, listener);
259
    }, emulatedDuration);
260
  };
261

262
  var detectAnimation = function detectAnimation(contentList, options) {
263
    if (options.animation) {
264
      contentList.forEach(function (content) {
265
        content.classList.add(ClassName.FADE);
266
        content.classList.add(ClassName.NONE);
267
      });
268
    }
269
  };
270

271
  var buildClickStepLinearListener = function buildClickStepLinearListener() {
272
    return function clickStepLinearListener(event) {
273
      event.preventDefault();
274
    };
275
  };
276

277
  var buildClickStepNonLinearListener = function buildClickStepNonLinearListener(options) {
278
    return function clickStepNonLinearListener(event) {
279
      event.preventDefault();
280
      var step = closest(event.target, options.selectors.steps);
281
      var stepperNode = closest(step, options.selectors.stepper);
282
      var stepper = stepperNode[customProperty];
283

284
      var stepIndex = stepper._steps.indexOf(step);
285

286
      show(stepperNode, stepIndex, options, function () {
287
        stepper._currentIndex = stepIndex;
288
      });
289
    };
290
  };
291

292
  var DEFAULT_OPTIONS = {
293
    linear: true,
294
    animation: false,
295
    selectors: {
296
      steps: '.step',
297
      trigger: '.step-trigger',
298
      stepper: '.bs-stepper'
299
    }
300
  };
301

302
  var Stepper =
303
  /*#__PURE__*/
304
  function () {
305
    function Stepper(element, _options) {
306
      var _this = this;
307

308
      if (_options === void 0) {
309
        _options = {};
310
      }
311

312
      this._element = element;
313
      this._currentIndex = 0;
314
      this._stepsContents = [];
315
      this.options = _extends({}, DEFAULT_OPTIONS, {}, _options);
316
      this.options.selectors = _extends({}, DEFAULT_OPTIONS.selectors, {}, this.options.selectors);
317

318
      if (this.options.linear) {
319
        this._element.classList.add(ClassName.LINEAR);
320
      }
321

322
      this._steps = [].slice.call(this._element.querySelectorAll(this.options.selectors.steps));
323

324
      this._steps.filter(function (step) {
325
        return step.hasAttribute('data-target');
326
      }).forEach(function (step) {
327
        _this._stepsContents.push(_this._element.querySelector(step.getAttribute('data-target')));
328
      });
329

330
      detectAnimation(this._stepsContents, this.options);
331

332
      this._setLinkListeners();
333

334
      Object.defineProperty(this._element, customProperty, {
335
        value: this,
336
        writable: true
337
      });
338

339
      if (this._steps.length) {
340
        show(this._element, this._currentIndex, this.options, function () {});
341
      }
342
    } // Private
343

344

345
    var _proto = Stepper.prototype;
346

347
    _proto._setLinkListeners = function _setLinkListeners() {
348
      var _this2 = this;
349

350
      this._steps.forEach(function (step) {
351
        var trigger = step.querySelector(_this2.options.selectors.trigger);
352

353
        if (_this2.options.linear) {
354
          _this2._clickStepLinearListener = buildClickStepLinearListener(_this2.options);
355
          trigger.addEventListener('click', _this2._clickStepLinearListener);
356
        } else {
357
          _this2._clickStepNonLinearListener = buildClickStepNonLinearListener(_this2.options);
358
          trigger.addEventListener('click', _this2._clickStepNonLinearListener);
359
        }
360
      });
361
    } // Public
362
    ;
363

364
    _proto.next = function next() {
365
      var _this3 = this;
366

367
      var nextStep = this._currentIndex + 1 <= this._steps.length - 1 ? this._currentIndex + 1 : this._steps.length - 1;
368
      show(this._element, nextStep, this.options, function () {
369
        _this3._currentIndex = nextStep;
370
      });
371
    };
372

373
    _proto.previous = function previous() {
374
      var _this4 = this;
375

376
      var previousStep = this._currentIndex - 1 >= 0 ? this._currentIndex - 1 : 0;
377
      show(this._element, previousStep, this.options, function () {
378
        _this4._currentIndex = previousStep;
379
      });
380
    };
381

382
    _proto.to = function to(stepNumber) {
383
      var _this5 = this;
384

385
      var tempIndex = stepNumber - 1;
386
      var nextStep = tempIndex >= 0 && tempIndex < this._steps.length ? tempIndex : 0;
387
      show(this._element, nextStep, this.options, function () {
388
        _this5._currentIndex = nextStep;
389
      });
390
    };
391

392
    _proto.reset = function reset() {
393
      var _this6 = this;
394

395
      show(this._element, 0, this.options, function () {
396
        _this6._currentIndex = 0;
397
      });
398
    };
399

400
    _proto.destroy = function destroy() {
401
      var _this7 = this;
402

403
      this._steps.forEach(function (step) {
404
        var trigger = step.querySelector(_this7.options.selectors.trigger);
405

406
        if (_this7.options.linear) {
407
          trigger.removeEventListener('click', _this7._clickStepLinearListener);
408
        } else {
409
          trigger.removeEventListener('click', _this7._clickStepNonLinearListener);
410
        }
411
      });
412

413
      this._element[customProperty] = undefined;
414
      this._element = undefined;
415
      this._currentIndex = undefined;
416
      this._steps = undefined;
417
      this._stepsContents = undefined;
418
      this._clickStepLinearListener = undefined;
419
      this._clickStepNonLinearListener = undefined;
420
    };
421

422
    return Stepper;
423
  }();
424

425
  return Stepper;
426

427
}));
428
//# sourceMappingURL=bs-stepper.js.map
429

Использование cookies

Мы используем файлы cookie в соответствии с Политикой конфиденциальности и Политикой использования cookies.

Нажимая кнопку «Принимаю», Вы даете АО «СберТех» согласие на обработку Ваших персональных данных в целях совершенствования нашего веб-сайта и Сервиса GitVerse, а также повышения удобства их использования.

Запретить использование cookies Вы можете самостоятельно в настройках Вашего браузера.