splide.js
3155 lines
| 1 | function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } |
| 2 | |
| 3 | function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; } |
| 4 | |
| 5 | /*! |
| 6 | * Splide.js |
| 7 | * Version : 4.1.4 |
| 8 | * License : MIT |
| 9 | * Copyright: 2022 Naotoshi Fujita |
| 10 | */ |
| 11 | (function (global, factory) { |
| 12 | typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.Splide = factory()); |
| 13 | })(this, function () { |
| 14 | 'use strict'; |
| 15 | |
| 16 | var MEDIA_PREFERS_REDUCED_MOTION = "(prefers-reduced-motion: reduce)"; |
| 17 | var CREATED = 1; |
| 18 | var MOUNTED = 2; |
| 19 | var IDLE = 3; |
| 20 | var MOVING = 4; |
| 21 | var SCROLLING = 5; |
| 22 | var DRAGGING = 6; |
| 23 | var DESTROYED = 7; |
| 24 | var STATES = { |
| 25 | CREATED: CREATED, |
| 26 | MOUNTED: MOUNTED, |
| 27 | IDLE: IDLE, |
| 28 | MOVING: MOVING, |
| 29 | SCROLLING: SCROLLING, |
| 30 | DRAGGING: DRAGGING, |
| 31 | DESTROYED: DESTROYED |
| 32 | }; |
| 33 | |
| 34 | function empty(array) { |
| 35 | array.length = 0; |
| 36 | } |
| 37 | |
| 38 | function slice(arrayLike, start, end) { |
| 39 | return Array.prototype.slice.call(arrayLike, start, end); |
| 40 | } |
| 41 | |
| 42 | function apply(func) { |
| 43 | return func.bind.apply(func, [null].concat(slice(arguments, 1))); |
| 44 | } |
| 45 | |
| 46 | var nextTick = setTimeout; |
| 47 | |
| 48 | var noop = function noop() {}; |
| 49 | |
| 50 | function raf(func) { |
| 51 | return requestAnimationFrame(func); |
| 52 | } |
| 53 | |
| 54 | function typeOf(type, subject) { |
| 55 | return typeof subject === type; |
| 56 | } |
| 57 | |
| 58 | function isObject(subject) { |
| 59 | return !isNull(subject) && typeOf("object", subject); |
| 60 | } |
| 61 | |
| 62 | var isArray = Array.isArray; |
| 63 | var isFunction = apply(typeOf, "function"); |
| 64 | var isString = apply(typeOf, "string"); |
| 65 | var isUndefined = apply(typeOf, "undefined"); |
| 66 | |
| 67 | function isNull(subject) { |
| 68 | return subject === null; |
| 69 | } |
| 70 | |
| 71 | function isHTMLElement(subject) { |
| 72 | try { |
| 73 | return subject instanceof (subject.ownerDocument.defaultView || window).HTMLElement; |
| 74 | } catch (e) { |
| 75 | return false; |
| 76 | } |
| 77 | } |
| 78 | |
| 79 | function toArray(value) { |
| 80 | return isArray(value) ? value : [value]; |
| 81 | } |
| 82 | |
| 83 | function forEach(values, iteratee) { |
| 84 | toArray(values).forEach(iteratee); |
| 85 | } |
| 86 | |
| 87 | function includes(array, value) { |
| 88 | return array.indexOf(value) > -1; |
| 89 | } |
| 90 | |
| 91 | function push(array, items) { |
| 92 | array.push.apply(array, toArray(items)); |
| 93 | return array; |
| 94 | } |
| 95 | |
| 96 | function toggleClass(elm, classes, add) { |
| 97 | if (elm) { |
| 98 | forEach(classes, function (name) { |
| 99 | if (name) { |
| 100 | elm.classList[add ? "add" : "remove"](name); |
| 101 | } |
| 102 | }); |
| 103 | } |
| 104 | } |
| 105 | |
| 106 | function addClass(elm, classes) { |
| 107 | toggleClass(elm, isString(classes) ? classes.split(" ") : classes, true); |
| 108 | } |
| 109 | |
| 110 | function append(parent, children) { |
| 111 | forEach(children, parent.appendChild.bind(parent)); |
| 112 | } |
| 113 | |
| 114 | function before(nodes, ref) { |
| 115 | forEach(nodes, function (node) { |
| 116 | var parent = (ref || node).parentNode; |
| 117 | |
| 118 | if (parent) { |
| 119 | parent.insertBefore(node, ref); |
| 120 | } |
| 121 | }); |
| 122 | } |
| 123 | |
| 124 | function matches(elm, selector) { |
| 125 | return isHTMLElement(elm) && (elm["msMatchesSelector"] || elm.matches).call(elm, selector); |
| 126 | } |
| 127 | |
| 128 | function children(parent, selector) { |
| 129 | var children2 = parent ? slice(parent.children) : []; |
| 130 | return selector ? children2.filter(function (child) { |
| 131 | return matches(child, selector); |
| 132 | }) : children2; |
| 133 | } |
| 134 | |
| 135 | function child(parent, selector) { |
| 136 | return selector ? children(parent, selector)[0] : parent.firstElementChild; |
| 137 | } |
| 138 | |
| 139 | var ownKeys = Object.keys; |
| 140 | |
| 141 | function forOwn(object, iteratee, right) { |
| 142 | if (object) { |
| 143 | (right ? ownKeys(object).reverse() : ownKeys(object)).forEach(function (key) { |
| 144 | key !== "__proto__" && iteratee(object[key], key); |
| 145 | }); |
| 146 | } |
| 147 | |
| 148 | return object; |
| 149 | } |
| 150 | |
| 151 | function assign(object) { |
| 152 | slice(arguments, 1).forEach(function (source) { |
| 153 | forOwn(source, function (value, key) { |
| 154 | object[key] = source[key]; |
| 155 | }); |
| 156 | }); |
| 157 | return object; |
| 158 | } |
| 159 | |
| 160 | function merge(object) { |
| 161 | slice(arguments, 1).forEach(function (source) { |
| 162 | forOwn(source, function (value, key) { |
| 163 | if (isArray(value)) { |
| 164 | object[key] = value.slice(); |
| 165 | } else if (isObject(value)) { |
| 166 | object[key] = merge({}, isObject(object[key]) ? object[key] : {}, value); |
| 167 | } else { |
| 168 | object[key] = value; |
| 169 | } |
| 170 | }); |
| 171 | }); |
| 172 | return object; |
| 173 | } |
| 174 | |
| 175 | function omit(object, keys) { |
| 176 | forEach(keys || ownKeys(object), function (key) { |
| 177 | delete object[key]; |
| 178 | }); |
| 179 | } |
| 180 | |
| 181 | function removeAttribute(elms, attrs) { |
| 182 | forEach(elms, function (elm) { |
| 183 | forEach(attrs, function (attr) { |
| 184 | elm && elm.removeAttribute(attr); |
| 185 | }); |
| 186 | }); |
| 187 | } |
| 188 | |
| 189 | function setAttribute(elms, attrs, value) { |
| 190 | if (isObject(attrs)) { |
| 191 | forOwn(attrs, function (value2, name) { |
| 192 | setAttribute(elms, name, value2); |
| 193 | }); |
| 194 | } else { |
| 195 | forEach(elms, function (elm) { |
| 196 | isNull(value) || value === "" ? removeAttribute(elm, attrs) : elm.setAttribute(attrs, String(value)); |
| 197 | }); |
| 198 | } |
| 199 | } |
| 200 | |
| 201 | function create(tag, attrs, parent) { |
| 202 | var elm = document.createElement(tag); |
| 203 | |
| 204 | if (attrs) { |
| 205 | isString(attrs) ? addClass(elm, attrs) : setAttribute(elm, attrs); |
| 206 | } |
| 207 | |
| 208 | parent && append(parent, elm); |
| 209 | return elm; |
| 210 | } |
| 211 | |
| 212 | function style(elm, prop, value) { |
| 213 | if (isUndefined(value)) { |
| 214 | return getComputedStyle(elm)[prop]; |
| 215 | } |
| 216 | |
| 217 | if (!isNull(value)) { |
| 218 | elm.style[prop] = "" + value; |
| 219 | } |
| 220 | } |
| 221 | |
| 222 | function display(elm, display2) { |
| 223 | style(elm, "display", display2); |
| 224 | } |
| 225 | |
| 226 | function focus(elm) { |
| 227 | elm["setActive"] && elm["setActive"]() || elm.focus({ |
| 228 | preventScroll: true |
| 229 | }); |
| 230 | } |
| 231 | |
| 232 | function getAttribute(elm, attr) { |
| 233 | return elm.getAttribute(attr); |
| 234 | } |
| 235 | |
| 236 | function hasClass(elm, className) { |
| 237 | return elm && elm.classList.contains(className); |
| 238 | } |
| 239 | |
| 240 | function rect(target) { |
| 241 | return target.getBoundingClientRect(); |
| 242 | } |
| 243 | |
| 244 | function remove(nodes) { |
| 245 | forEach(nodes, function (node) { |
| 246 | if (node && node.parentNode) { |
| 247 | node.parentNode.removeChild(node); |
| 248 | } |
| 249 | }); |
| 250 | } |
| 251 | |
| 252 | function parseHtml(html) { |
| 253 | return child(new DOMParser().parseFromString(html, "text/html").body); |
| 254 | } |
| 255 | |
| 256 | function prevent(e, stopPropagation) { |
| 257 | e.preventDefault(); |
| 258 | |
| 259 | if (stopPropagation) { |
| 260 | e.stopPropagation(); |
| 261 | e.stopImmediatePropagation(); |
| 262 | } |
| 263 | } |
| 264 | |
| 265 | function query(parent, selector) { |
| 266 | return parent && parent.querySelector(selector); |
| 267 | } |
| 268 | |
| 269 | function queryAll(parent, selector) { |
| 270 | return selector ? slice(parent.querySelectorAll(selector)) : []; |
| 271 | } |
| 272 | |
| 273 | function removeClass(elm, classes) { |
| 274 | toggleClass(elm, classes, false); |
| 275 | } |
| 276 | |
| 277 | function timeOf(e) { |
| 278 | return e.timeStamp; |
| 279 | } |
| 280 | |
| 281 | function unit(value) { |
| 282 | return isString(value) ? value : value ? value + "px" : ""; |
| 283 | } |
| 284 | |
| 285 | var PROJECT_CODE = "splide"; |
| 286 | var DATA_ATTRIBUTE = "data-" + PROJECT_CODE; |
| 287 | |
| 288 | function assert(condition, message) { |
| 289 | if (!condition) { |
| 290 | throw new Error("[" + PROJECT_CODE + "] " + (message || "")); |
| 291 | } |
| 292 | } |
| 293 | |
| 294 | var min = Math.min, |
| 295 | max = Math.max, |
| 296 | floor = Math.floor, |
| 297 | ceil = Math.ceil, |
| 298 | abs = Math.abs; |
| 299 | |
| 300 | function approximatelyEqual(x, y, epsilon) { |
| 301 | return abs(x - y) < epsilon; |
| 302 | } |
| 303 | |
| 304 | function between(number, x, y, exclusive) { |
| 305 | var minimum = min(x, y); |
| 306 | var maximum = max(x, y); |
| 307 | return exclusive ? minimum < number && number < maximum : minimum <= number && number <= maximum; |
| 308 | } |
| 309 | |
| 310 | function clamp(number, x, y) { |
| 311 | var minimum = min(x, y); |
| 312 | var maximum = max(x, y); |
| 313 | return min(max(minimum, number), maximum); |
| 314 | } |
| 315 | |
| 316 | function sign(x) { |
| 317 | return +(x > 0) - +(x < 0); |
| 318 | } |
| 319 | |
| 320 | function format(string, replacements) { |
| 321 | forEach(replacements, function (replacement) { |
| 322 | string = string.replace("%s", "" + replacement); |
| 323 | }); |
| 324 | return string; |
| 325 | } |
| 326 | |
| 327 | function pad(number) { |
| 328 | return number < 10 ? "0" + number : "" + number; |
| 329 | } |
| 330 | |
| 331 | var ids = {}; |
| 332 | |
| 333 | function uniqueId(prefix) { |
| 334 | return "" + prefix + pad(ids[prefix] = (ids[prefix] || 0) + 1); |
| 335 | } |
| 336 | |
| 337 | function EventBinder() { |
| 338 | var listeners = []; |
| 339 | |
| 340 | function bind(targets, events, callback, options) { |
| 341 | forEachEvent(targets, events, function (target, event, namespace) { |
| 342 | var isEventTarget = ("addEventListener" in target); |
| 343 | var remover = isEventTarget ? target.removeEventListener.bind(target, event, callback, options) : target["removeListener"].bind(target, callback); |
| 344 | isEventTarget ? target.addEventListener(event, callback, options) : target["addListener"](callback); |
| 345 | listeners.push([target, event, namespace, callback, remover]); |
| 346 | }); |
| 347 | } |
| 348 | |
| 349 | function unbind(targets, events, callback) { |
| 350 | forEachEvent(targets, events, function (target, event, namespace) { |
| 351 | listeners = listeners.filter(function (listener) { |
| 352 | if (listener[0] === target && listener[1] === event && listener[2] === namespace && (!callback || listener[3] === callback)) { |
| 353 | listener[4](); |
| 354 | return false; |
| 355 | } |
| 356 | |
| 357 | return true; |
| 358 | }); |
| 359 | }); |
| 360 | } |
| 361 | |
| 362 | function dispatch(target, type, detail) { |
| 363 | var e; |
| 364 | var bubbles = true; |
| 365 | |
| 366 | if (typeof CustomEvent === "function") { |
| 367 | e = new CustomEvent(type, { |
| 368 | bubbles: bubbles, |
| 369 | detail: detail |
| 370 | }); |
| 371 | } else { |
| 372 | e = document.createEvent("CustomEvent"); |
| 373 | e.initCustomEvent(type, bubbles, false, detail); |
| 374 | } |
| 375 | |
| 376 | target.dispatchEvent(e); |
| 377 | return e; |
| 378 | } |
| 379 | |
| 380 | function forEachEvent(targets, events, iteratee) { |
| 381 | forEach(targets, function (target) { |
| 382 | target && forEach(events, function (events2) { |
| 383 | events2.split(" ").forEach(function (eventNS) { |
| 384 | var fragment = eventNS.split("."); |
| 385 | iteratee(target, fragment[0], fragment[1]); |
| 386 | }); |
| 387 | }); |
| 388 | }); |
| 389 | } |
| 390 | |
| 391 | function destroy() { |
| 392 | listeners.forEach(function (data) { |
| 393 | data[4](); |
| 394 | }); |
| 395 | empty(listeners); |
| 396 | } |
| 397 | |
| 398 | return { |
| 399 | bind: bind, |
| 400 | unbind: unbind, |
| 401 | dispatch: dispatch, |
| 402 | destroy: destroy |
| 403 | }; |
| 404 | } |
| 405 | |
| 406 | var EVENT_MOUNTED = "mounted"; |
| 407 | var EVENT_READY = "ready"; |
| 408 | var EVENT_MOVE = "move"; |
| 409 | var EVENT_MOVED = "moved"; |
| 410 | var EVENT_CLICK = "click"; |
| 411 | var EVENT_ACTIVE = "active"; |
| 412 | var EVENT_INACTIVE = "inactive"; |
| 413 | var EVENT_VISIBLE = "visible"; |
| 414 | var EVENT_HIDDEN = "hidden"; |
| 415 | var EVENT_REFRESH = "refresh"; |
| 416 | var EVENT_UPDATED = "updated"; |
| 417 | var EVENT_RESIZE = "resize"; |
| 418 | var EVENT_RESIZED = "resized"; |
| 419 | var EVENT_DRAG = "drag"; |
| 420 | var EVENT_DRAGGING = "dragging"; |
| 421 | var EVENT_DRAGGED = "dragged"; |
| 422 | var EVENT_SCROLL = "scroll"; |
| 423 | var EVENT_SCROLLED = "scrolled"; |
| 424 | var EVENT_OVERFLOW = "overflow"; |
| 425 | var EVENT_DESTROY = "destroy"; |
| 426 | var EVENT_ARROWS_MOUNTED = "arrows:mounted"; |
| 427 | var EVENT_ARROWS_UPDATED = "arrows:updated"; |
| 428 | var EVENT_PAGINATION_MOUNTED = "pagination:mounted"; |
| 429 | var EVENT_PAGINATION_UPDATED = "pagination:updated"; |
| 430 | var EVENT_NAVIGATION_MOUNTED = "navigation:mounted"; |
| 431 | var EVENT_AUTOPLAY_PLAY = "autoplay:play"; |
| 432 | var EVENT_AUTOPLAY_PLAYING = "autoplay:playing"; |
| 433 | var EVENT_AUTOPLAY_PAUSE = "autoplay:pause"; |
| 434 | var EVENT_LAZYLOAD_LOADED = "lazyload:loaded"; |
| 435 | var EVENT_SLIDE_KEYDOWN = "sk"; |
| 436 | var EVENT_SHIFTED = "sh"; |
| 437 | var EVENT_END_INDEX_CHANGED = "ei"; |
| 438 | |
| 439 | function EventInterface(Splide2) { |
| 440 | var bus = Splide2 ? Splide2.event.bus : document.createDocumentFragment(); |
| 441 | var binder = EventBinder(); |
| 442 | |
| 443 | function on(events, callback) { |
| 444 | binder.bind(bus, toArray(events).join(" "), function (e) { |
| 445 | callback.apply(callback, isArray(e.detail) ? e.detail : []); |
| 446 | }); |
| 447 | } |
| 448 | |
| 449 | function emit(event) { |
| 450 | binder.dispatch(bus, event, slice(arguments, 1)); |
| 451 | } |
| 452 | |
| 453 | if (Splide2) { |
| 454 | Splide2.event.on(EVENT_DESTROY, binder.destroy); |
| 455 | } |
| 456 | |
| 457 | return assign(binder, { |
| 458 | bus: bus, |
| 459 | on: on, |
| 460 | off: apply(binder.unbind, bus), |
| 461 | emit: emit |
| 462 | }); |
| 463 | } |
| 464 | |
| 465 | function RequestInterval(interval, onInterval, onUpdate, limit) { |
| 466 | var now = Date.now; |
| 467 | var startTime; |
| 468 | var rate = 0; |
| 469 | var id; |
| 470 | var paused = true; |
| 471 | var count = 0; |
| 472 | |
| 473 | function update() { |
| 474 | if (!paused) { |
| 475 | rate = interval ? min((now() - startTime) / interval, 1) : 1; |
| 476 | onUpdate && onUpdate(rate); |
| 477 | |
| 478 | if (rate >= 1) { |
| 479 | onInterval(); |
| 480 | startTime = now(); |
| 481 | |
| 482 | if (limit && ++count >= limit) { |
| 483 | return pause(); |
| 484 | } |
| 485 | } |
| 486 | |
| 487 | id = raf(update); |
| 488 | } |
| 489 | } |
| 490 | |
| 491 | function start(resume) { |
| 492 | resume || cancel(); |
| 493 | startTime = now() - (resume ? rate * interval : 0); |
| 494 | paused = false; |
| 495 | id = raf(update); |
| 496 | } |
| 497 | |
| 498 | function pause() { |
| 499 | paused = true; |
| 500 | } |
| 501 | |
| 502 | function rewind() { |
| 503 | startTime = now(); |
| 504 | rate = 0; |
| 505 | |
| 506 | if (onUpdate) { |
| 507 | onUpdate(rate); |
| 508 | } |
| 509 | } |
| 510 | |
| 511 | function cancel() { |
| 512 | id && cancelAnimationFrame(id); |
| 513 | rate = 0; |
| 514 | id = 0; |
| 515 | paused = true; |
| 516 | } |
| 517 | |
| 518 | function set(time) { |
| 519 | interval = time; |
| 520 | } |
| 521 | |
| 522 | function isPaused() { |
| 523 | return paused; |
| 524 | } |
| 525 | |
| 526 | return { |
| 527 | start: start, |
| 528 | rewind: rewind, |
| 529 | pause: pause, |
| 530 | cancel: cancel, |
| 531 | set: set, |
| 532 | isPaused: isPaused |
| 533 | }; |
| 534 | } |
| 535 | |
| 536 | function State(initialState) { |
| 537 | var state = initialState; |
| 538 | |
| 539 | function set(value) { |
| 540 | state = value; |
| 541 | } |
| 542 | |
| 543 | function is(states) { |
| 544 | return includes(toArray(states), state); |
| 545 | } |
| 546 | |
| 547 | return { |
| 548 | set: set, |
| 549 | is: is |
| 550 | }; |
| 551 | } |
| 552 | |
| 553 | function Throttle(func, duration) { |
| 554 | var interval = RequestInterval(duration || 0, func, null, 1); |
| 555 | return function () { |
| 556 | interval.isPaused() && interval.start(); |
| 557 | }; |
| 558 | } |
| 559 | |
| 560 | function Media(Splide2, Components2, options) { |
| 561 | var state = Splide2.state; |
| 562 | var breakpoints = options.breakpoints || {}; |
| 563 | var reducedMotion = options.reducedMotion || {}; |
| 564 | var binder = EventBinder(); |
| 565 | var queries = []; |
| 566 | |
| 567 | function setup() { |
| 568 | var isMin = options.mediaQuery === "min"; |
| 569 | ownKeys(breakpoints).sort(function (n, m) { |
| 570 | return isMin ? +n - +m : +m - +n; |
| 571 | }).forEach(function (key) { |
| 572 | register(breakpoints[key], "(" + (isMin ? "min" : "max") + "-width:" + key + "px)"); |
| 573 | }); |
| 574 | register(reducedMotion, MEDIA_PREFERS_REDUCED_MOTION); |
| 575 | update(); |
| 576 | } |
| 577 | |
| 578 | function destroy(completely) { |
| 579 | if (completely) { |
| 580 | binder.destroy(); |
| 581 | } |
| 582 | } |
| 583 | |
| 584 | function register(options2, query) { |
| 585 | var queryList = matchMedia(query); |
| 586 | binder.bind(queryList, "change", update); |
| 587 | queries.push([options2, queryList]); |
| 588 | } |
| 589 | |
| 590 | function update() { |
| 591 | var destroyed = state.is(DESTROYED); |
| 592 | var direction = options.direction; |
| 593 | var merged = queries.reduce(function (merged2, entry) { |
| 594 | return merge(merged2, entry[1].matches ? entry[0] : {}); |
| 595 | }, {}); |
| 596 | omit(options); |
| 597 | set(merged); |
| 598 | |
| 599 | if (options.destroy) { |
| 600 | Splide2.destroy(options.destroy === "completely"); |
| 601 | } else if (destroyed) { |
| 602 | destroy(true); |
| 603 | Splide2.mount(); |
| 604 | } else { |
| 605 | direction !== options.direction && Splide2.refresh(); |
| 606 | } |
| 607 | } |
| 608 | |
| 609 | function reduce(enable) { |
| 610 | if (matchMedia(MEDIA_PREFERS_REDUCED_MOTION).matches) { |
| 611 | enable ? merge(options, reducedMotion) : omit(options, ownKeys(reducedMotion)); |
| 612 | } |
| 613 | } |
| 614 | |
| 615 | function set(opts, base, notify) { |
| 616 | merge(options, opts); |
| 617 | base && merge(Object.getPrototypeOf(options), opts); |
| 618 | |
| 619 | if (notify || !state.is(CREATED)) { |
| 620 | Splide2.emit(EVENT_UPDATED, options); |
| 621 | } |
| 622 | } |
| 623 | |
| 624 | return { |
| 625 | setup: setup, |
| 626 | destroy: destroy, |
| 627 | reduce: reduce, |
| 628 | set: set |
| 629 | }; |
| 630 | } |
| 631 | |
| 632 | var ARROW = "Arrow"; |
| 633 | var ARROW_LEFT = ARROW + "Left"; |
| 634 | var ARROW_RIGHT = ARROW + "Right"; |
| 635 | var ARROW_UP = ARROW + "Up"; |
| 636 | var ARROW_DOWN = ARROW + "Down"; |
| 637 | var RTL = "rtl"; |
| 638 | var TTB = "ttb"; |
| 639 | var ORIENTATION_MAP = { |
| 640 | width: ["height"], |
| 641 | left: ["top", "right"], |
| 642 | right: ["bottom", "left"], |
| 643 | x: ["y"], |
| 644 | X: ["Y"], |
| 645 | Y: ["X"], |
| 646 | ArrowLeft: [ARROW_UP, ARROW_RIGHT], |
| 647 | ArrowRight: [ARROW_DOWN, ARROW_LEFT] |
| 648 | }; |
| 649 | |
| 650 | function Direction(Splide2, Components2, options) { |
| 651 | function resolve(prop, axisOnly, direction) { |
| 652 | direction = direction || options.direction; |
| 653 | var index = direction === RTL && !axisOnly ? 1 : direction === TTB ? 0 : -1; |
| 654 | return ORIENTATION_MAP[prop] && ORIENTATION_MAP[prop][index] || prop.replace(/width|left|right/i, function (match, offset) { |
| 655 | var replacement = ORIENTATION_MAP[match.toLowerCase()][index] || match; |
| 656 | return offset > 0 ? replacement.charAt(0).toUpperCase() + replacement.slice(1) : replacement; |
| 657 | }); |
| 658 | } |
| 659 | |
| 660 | function orient(value) { |
| 661 | return value * (options.direction === RTL ? 1 : -1); |
| 662 | } |
| 663 | |
| 664 | return { |
| 665 | resolve: resolve, |
| 666 | orient: orient |
| 667 | }; |
| 668 | } |
| 669 | |
| 670 | var ROLE = "role"; |
| 671 | var TAB_INDEX = "tabindex"; |
| 672 | var DISABLED = "disabled"; |
| 673 | var ARIA_PREFIX = "aria-"; |
| 674 | var ARIA_CONTROLS = ARIA_PREFIX + "controls"; |
| 675 | var ARIA_CURRENT = ARIA_PREFIX + "current"; |
| 676 | var ARIA_SELECTED = ARIA_PREFIX + "selected"; |
| 677 | var ARIA_LABEL = ARIA_PREFIX + "label"; |
| 678 | var ARIA_LABELLEDBY = ARIA_PREFIX + "labelledby"; |
| 679 | var ARIA_HIDDEN = ARIA_PREFIX + "hidden"; |
| 680 | var ARIA_ORIENTATION = ARIA_PREFIX + "orientation"; |
| 681 | var ARIA_ROLEDESCRIPTION = ARIA_PREFIX + "roledescription"; |
| 682 | var ARIA_LIVE = ARIA_PREFIX + "live"; |
| 683 | var ARIA_BUSY = ARIA_PREFIX + "busy"; |
| 684 | var ARIA_ATOMIC = ARIA_PREFIX + "atomic"; |
| 685 | var ALL_ATTRIBUTES = [ROLE, TAB_INDEX, DISABLED, ARIA_CONTROLS, ARIA_CURRENT, ARIA_LABEL, ARIA_LABELLEDBY, ARIA_HIDDEN, ARIA_ORIENTATION, ARIA_ROLEDESCRIPTION]; |
| 686 | var CLASS_PREFIX = PROJECT_CODE + "__"; |
| 687 | var STATUS_CLASS_PREFIX = "is-"; |
| 688 | var CLASS_ROOT = PROJECT_CODE; |
| 689 | var CLASS_TRACK = CLASS_PREFIX + "track"; |
| 690 | var CLASS_LIST = CLASS_PREFIX + "list"; |
| 691 | var CLASS_SLIDE = CLASS_PREFIX + "slide"; |
| 692 | var CLASS_CLONE = CLASS_SLIDE + "--clone"; |
| 693 | var CLASS_CONTAINER = CLASS_SLIDE + "__container"; |
| 694 | var CLASS_ARROWS = CLASS_PREFIX + "arrows"; |
| 695 | var CLASS_ARROW = CLASS_PREFIX + "arrow"; |
| 696 | var CLASS_ARROW_PREV = CLASS_ARROW + "--prev"; |
| 697 | var CLASS_ARROW_NEXT = CLASS_ARROW + "--next"; |
| 698 | var CLASS_PAGINATION = CLASS_PREFIX + "pagination"; |
| 699 | var CLASS_PAGINATION_PAGE = CLASS_PAGINATION + "__page"; |
| 700 | var CLASS_PROGRESS = CLASS_PREFIX + "progress"; |
| 701 | var CLASS_PROGRESS_BAR = CLASS_PROGRESS + "__bar"; |
| 702 | var CLASS_TOGGLE = CLASS_PREFIX + "toggle"; |
| 703 | var CLASS_SPINNER = CLASS_PREFIX + "spinner"; |
| 704 | var CLASS_SR = CLASS_PREFIX + "sr"; |
| 705 | var CLASS_INITIALIZED = STATUS_CLASS_PREFIX + "initialized"; |
| 706 | var CLASS_ACTIVE = STATUS_CLASS_PREFIX + "active"; |
| 707 | var CLASS_PREV = STATUS_CLASS_PREFIX + "prev"; |
| 708 | var CLASS_NEXT = STATUS_CLASS_PREFIX + "next"; |
| 709 | var CLASS_VISIBLE = STATUS_CLASS_PREFIX + "visible"; |
| 710 | var CLASS_LOADING = STATUS_CLASS_PREFIX + "loading"; |
| 711 | var CLASS_FOCUS_IN = STATUS_CLASS_PREFIX + "focus-in"; |
| 712 | var CLASS_OVERFLOW = STATUS_CLASS_PREFIX + "overflow"; |
| 713 | var STATUS_CLASSES = [CLASS_ACTIVE, CLASS_VISIBLE, CLASS_PREV, CLASS_NEXT, CLASS_LOADING, CLASS_FOCUS_IN, CLASS_OVERFLOW]; |
| 714 | var CLASSES = { |
| 715 | slide: CLASS_SLIDE, |
| 716 | clone: CLASS_CLONE, |
| 717 | arrows: CLASS_ARROWS, |
| 718 | arrow: CLASS_ARROW, |
| 719 | prev: CLASS_ARROW_PREV, |
| 720 | next: CLASS_ARROW_NEXT, |
| 721 | pagination: CLASS_PAGINATION, |
| 722 | page: CLASS_PAGINATION_PAGE, |
| 723 | spinner: CLASS_SPINNER |
| 724 | }; |
| 725 | |
| 726 | function closest(from, selector) { |
| 727 | if (isFunction(from.closest)) { |
| 728 | return from.closest(selector); |
| 729 | } |
| 730 | |
| 731 | var elm = from; |
| 732 | |
| 733 | while (elm && elm.nodeType === 1) { |
| 734 | if (matches(elm, selector)) { |
| 735 | break; |
| 736 | } |
| 737 | |
| 738 | elm = elm.parentElement; |
| 739 | } |
| 740 | |
| 741 | return elm; |
| 742 | } |
| 743 | |
| 744 | var FRICTION = 5; |
| 745 | var LOG_INTERVAL = 200; |
| 746 | var POINTER_DOWN_EVENTS = "touchstart mousedown"; |
| 747 | var POINTER_MOVE_EVENTS = "touchmove mousemove"; |
| 748 | var POINTER_UP_EVENTS = "touchend touchcancel mouseup click"; |
| 749 | |
| 750 | function Elements(Splide2, Components2, options) { |
| 751 | var _EventInterface = EventInterface(Splide2), |
| 752 | on = _EventInterface.on, |
| 753 | bind = _EventInterface.bind; |
| 754 | |
| 755 | var root = Splide2.root; |
| 756 | var i18n = options.i18n; |
| 757 | var elements = {}; |
| 758 | var slides = []; |
| 759 | var rootClasses = []; |
| 760 | var trackClasses = []; |
| 761 | var track; |
| 762 | var list; |
| 763 | var isUsingKey; |
| 764 | |
| 765 | function setup() { |
| 766 | collect(); |
| 767 | init(); |
| 768 | update(); |
| 769 | } |
| 770 | |
| 771 | function mount() { |
| 772 | on(EVENT_REFRESH, destroy); |
| 773 | on(EVENT_REFRESH, setup); |
| 774 | on(EVENT_UPDATED, update); |
| 775 | bind(document, POINTER_DOWN_EVENTS + " keydown", function (e) { |
| 776 | isUsingKey = e.type === "keydown"; |
| 777 | }, { |
| 778 | capture: true |
| 779 | }); |
| 780 | bind(root, "focusin", function () { |
| 781 | toggleClass(root, CLASS_FOCUS_IN, !!isUsingKey); |
| 782 | }); |
| 783 | } |
| 784 | |
| 785 | function destroy(completely) { |
| 786 | var attrs = ALL_ATTRIBUTES.concat("style"); |
| 787 | empty(slides); |
| 788 | removeClass(root, rootClasses); |
| 789 | removeClass(track, trackClasses); |
| 790 | removeAttribute([track, list], attrs); |
| 791 | removeAttribute(root, completely ? attrs : ["style", ARIA_ROLEDESCRIPTION]); |
| 792 | } |
| 793 | |
| 794 | function update() { |
| 795 | removeClass(root, rootClasses); |
| 796 | removeClass(track, trackClasses); |
| 797 | rootClasses = getClasses(CLASS_ROOT); |
| 798 | trackClasses = getClasses(CLASS_TRACK); |
| 799 | addClass(root, rootClasses); |
| 800 | addClass(track, trackClasses); |
| 801 | setAttribute(root, ARIA_LABEL, options.label); |
| 802 | setAttribute(root, ARIA_LABELLEDBY, options.labelledby); |
| 803 | } |
| 804 | |
| 805 | function collect() { |
| 806 | track = find("." + CLASS_TRACK); |
| 807 | list = child(track, "." + CLASS_LIST); |
| 808 | assert(track && list, "A track/list element is missing."); |
| 809 | push(slides, children(list, "." + CLASS_SLIDE + ":not(." + CLASS_CLONE + ")")); |
| 810 | forOwn({ |
| 811 | arrows: CLASS_ARROWS, |
| 812 | pagination: CLASS_PAGINATION, |
| 813 | prev: CLASS_ARROW_PREV, |
| 814 | next: CLASS_ARROW_NEXT, |
| 815 | bar: CLASS_PROGRESS_BAR, |
| 816 | toggle: CLASS_TOGGLE |
| 817 | }, function (className, key) { |
| 818 | elements[key] = find("." + className); |
| 819 | }); |
| 820 | assign(elements, { |
| 821 | root: root, |
| 822 | track: track, |
| 823 | list: list, |
| 824 | slides: slides |
| 825 | }); |
| 826 | } |
| 827 | |
| 828 | function init() { |
| 829 | var id = root.id || uniqueId(PROJECT_CODE); |
| 830 | var role = options.role; |
| 831 | root.id = id; |
| 832 | track.id = track.id || id + "-track"; |
| 833 | list.id = list.id || id + "-list"; |
| 834 | |
| 835 | if (!getAttribute(root, ROLE) && root.tagName !== "SECTION" && role) { |
| 836 | setAttribute(root, ROLE, role); |
| 837 | } |
| 838 | |
| 839 | setAttribute(root, ARIA_ROLEDESCRIPTION, i18n.carousel); |
| 840 | setAttribute(list, ROLE, "presentation"); |
| 841 | } |
| 842 | |
| 843 | function find(selector) { |
| 844 | var elm = query(root, selector); |
| 845 | return elm && closest(elm, "." + CLASS_ROOT) === root ? elm : void 0; |
| 846 | } |
| 847 | |
| 848 | function getClasses(base) { |
| 849 | return [base + "--" + options.type, base + "--" + options.direction, options.drag && base + "--draggable", options.isNavigation && base + "--nav", base === CLASS_ROOT && CLASS_ACTIVE]; |
| 850 | } |
| 851 | |
| 852 | return assign(elements, { |
| 853 | setup: setup, |
| 854 | mount: mount, |
| 855 | destroy: destroy |
| 856 | }); |
| 857 | } |
| 858 | |
| 859 | var SLIDE = "slide"; |
| 860 | var LOOP = "loop"; |
| 861 | var FADE = "fade"; |
| 862 | |
| 863 | function Slide$1(Splide2, index, slideIndex, slide) { |
| 864 | var event = EventInterface(Splide2); |
| 865 | var on = event.on, |
| 866 | emit = event.emit, |
| 867 | bind = event.bind; |
| 868 | var Components = Splide2.Components, |
| 869 | root = Splide2.root, |
| 870 | options = Splide2.options; |
| 871 | var isNavigation = options.isNavigation, |
| 872 | updateOnMove = options.updateOnMove, |
| 873 | i18n = options.i18n, |
| 874 | pagination = options.pagination, |
| 875 | slideFocus = options.slideFocus; |
| 876 | var resolve = Components.Direction.resolve; |
| 877 | var styles = getAttribute(slide, "style"); |
| 878 | var label = getAttribute(slide, ARIA_LABEL); |
| 879 | var isClone = slideIndex > -1; |
| 880 | var container = child(slide, "." + CLASS_CONTAINER); |
| 881 | var destroyed; |
| 882 | |
| 883 | function mount() { |
| 884 | if (!isClone) { |
| 885 | slide.id = root.id + "-slide" + pad(index + 1); |
| 886 | setAttribute(slide, ROLE, pagination ? "tabpanel" : "group"); |
| 887 | setAttribute(slide, ARIA_ROLEDESCRIPTION, i18n.slide); |
| 888 | setAttribute(slide, ARIA_LABEL, label || format(i18n.slideLabel, [index + 1, Splide2.length])); |
| 889 | } |
| 890 | |
| 891 | listen(); |
| 892 | } |
| 893 | |
| 894 | function listen() { |
| 895 | bind(slide, "click", apply(emit, EVENT_CLICK, self)); |
| 896 | bind(slide, "keydown", apply(emit, EVENT_SLIDE_KEYDOWN, self)); |
| 897 | on([EVENT_MOVED, EVENT_SHIFTED, EVENT_SCROLLED], update); |
| 898 | on(EVENT_NAVIGATION_MOUNTED, initNavigation); |
| 899 | |
| 900 | if (updateOnMove) { |
| 901 | on(EVENT_MOVE, onMove); |
| 902 | } |
| 903 | } |
| 904 | |
| 905 | function destroy() { |
| 906 | destroyed = true; |
| 907 | event.destroy(); |
| 908 | removeClass(slide, STATUS_CLASSES); |
| 909 | removeAttribute(slide, ALL_ATTRIBUTES); |
| 910 | setAttribute(slide, "style", styles); |
| 911 | setAttribute(slide, ARIA_LABEL, label || ""); |
| 912 | } |
| 913 | |
| 914 | function initNavigation() { |
| 915 | var controls = Splide2.splides.map(function (target) { |
| 916 | var Slide2 = target.splide.Components.Slides.getAt(index); |
| 917 | return Slide2 ? Slide2.slide.id : ""; |
| 918 | }).join(" "); |
| 919 | setAttribute(slide, ARIA_LABEL, format(i18n.slideX, (isClone ? slideIndex : index) + 1)); |
| 920 | setAttribute(slide, ARIA_CONTROLS, controls); |
| 921 | setAttribute(slide, ROLE, slideFocus ? "button" : ""); |
| 922 | slideFocus && removeAttribute(slide, ARIA_ROLEDESCRIPTION); |
| 923 | } |
| 924 | |
| 925 | function onMove() { |
| 926 | if (!destroyed) { |
| 927 | update(); |
| 928 | } |
| 929 | } |
| 930 | |
| 931 | function update() { |
| 932 | if (!destroyed) { |
| 933 | var curr = Splide2.index; |
| 934 | updateActivity(); |
| 935 | updateVisibility(); |
| 936 | toggleClass(slide, CLASS_PREV, index === curr - 1); |
| 937 | toggleClass(slide, CLASS_NEXT, index === curr + 1); |
| 938 | } |
| 939 | } |
| 940 | |
| 941 | function updateActivity() { |
| 942 | var active = isActive(); |
| 943 | |
| 944 | if (active !== hasClass(slide, CLASS_ACTIVE)) { |
| 945 | toggleClass(slide, CLASS_ACTIVE, active); |
| 946 | setAttribute(slide, ARIA_CURRENT, isNavigation && active || ""); |
| 947 | emit(active ? EVENT_ACTIVE : EVENT_INACTIVE, self); |
| 948 | } |
| 949 | } |
| 950 | |
| 951 | function updateVisibility() { |
| 952 | var visible = isVisible(); |
| 953 | var hidden = !visible && (!isActive() || isClone); |
| 954 | |
| 955 | if (!Splide2.state.is([MOVING, SCROLLING])) { |
| 956 | setAttribute(slide, ARIA_HIDDEN, hidden || ""); |
| 957 | } |
| 958 | |
| 959 | setAttribute(queryAll(slide, options.focusableNodes || ""), TAB_INDEX, hidden ? -1 : ""); |
| 960 | |
| 961 | if (slideFocus) { |
| 962 | setAttribute(slide, TAB_INDEX, hidden ? -1 : 0); |
| 963 | } |
| 964 | |
| 965 | if (visible !== hasClass(slide, CLASS_VISIBLE)) { |
| 966 | toggleClass(slide, CLASS_VISIBLE, visible); |
| 967 | emit(visible ? EVENT_VISIBLE : EVENT_HIDDEN, self); |
| 968 | } |
| 969 | |
| 970 | if (!visible && document.activeElement === slide) { |
| 971 | var Slide2 = Components.Slides.getAt(Splide2.index); |
| 972 | Slide2 && focus(Slide2.slide); |
| 973 | } |
| 974 | } |
| 975 | |
| 976 | function style$1(prop, value, useContainer) { |
| 977 | style(useContainer && container || slide, prop, value); |
| 978 | } |
| 979 | |
| 980 | function isActive() { |
| 981 | var curr = Splide2.index; |
| 982 | return curr === index || options.cloneStatus && curr === slideIndex; |
| 983 | } |
| 984 | |
| 985 | function isVisible() { |
| 986 | if (Splide2.is(FADE)) { |
| 987 | return isActive(); |
| 988 | } |
| 989 | |
| 990 | var trackRect = rect(Components.Elements.track); |
| 991 | var slideRect = rect(slide); |
| 992 | var left = resolve("left", true); |
| 993 | var right = resolve("right", true); |
| 994 | return floor(trackRect[left]) <= ceil(slideRect[left]) && floor(slideRect[right]) <= ceil(trackRect[right]); |
| 995 | } |
| 996 | |
| 997 | function isWithin(from, distance) { |
| 998 | var diff = abs(from - index); |
| 999 | |
| 1000 | if (!isClone && (options.rewind || Splide2.is(LOOP))) { |
| 1001 | diff = min(diff, Splide2.length - diff); |
| 1002 | } |
| 1003 | |
| 1004 | return diff <= distance; |
| 1005 | } |
| 1006 | |
| 1007 | var self = { |
| 1008 | index: index, |
| 1009 | slideIndex: slideIndex, |
| 1010 | slide: slide, |
| 1011 | container: container, |
| 1012 | isClone: isClone, |
| 1013 | mount: mount, |
| 1014 | destroy: destroy, |
| 1015 | update: update, |
| 1016 | style: style$1, |
| 1017 | isWithin: isWithin |
| 1018 | }; |
| 1019 | return self; |
| 1020 | } |
| 1021 | |
| 1022 | function Slides(Splide2, Components2, options) { |
| 1023 | var _EventInterface2 = EventInterface(Splide2), |
| 1024 | on = _EventInterface2.on, |
| 1025 | emit = _EventInterface2.emit, |
| 1026 | bind = _EventInterface2.bind; |
| 1027 | |
| 1028 | var _Components2$Elements = Components2.Elements, |
| 1029 | slides = _Components2$Elements.slides, |
| 1030 | list = _Components2$Elements.list; |
| 1031 | var Slides2 = []; |
| 1032 | |
| 1033 | function mount() { |
| 1034 | init(); |
| 1035 | on(EVENT_REFRESH, destroy); |
| 1036 | on(EVENT_REFRESH, init); |
| 1037 | } |
| 1038 | |
| 1039 | function init() { |
| 1040 | slides.forEach(function (slide, index) { |
| 1041 | register(slide, index, -1); |
| 1042 | }); |
| 1043 | } |
| 1044 | |
| 1045 | function destroy() { |
| 1046 | forEach$1(function (Slide2) { |
| 1047 | Slide2.destroy(); |
| 1048 | }); |
| 1049 | empty(Slides2); |
| 1050 | } |
| 1051 | |
| 1052 | function update() { |
| 1053 | forEach$1(function (Slide2) { |
| 1054 | Slide2.update(); |
| 1055 | }); |
| 1056 | } |
| 1057 | |
| 1058 | function register(slide, index, slideIndex) { |
| 1059 | var object = Slide$1(Splide2, index, slideIndex, slide); |
| 1060 | object.mount(); |
| 1061 | Slides2.push(object); |
| 1062 | Slides2.sort(function (Slide1, Slide2) { |
| 1063 | return Slide1.index - Slide2.index; |
| 1064 | }); |
| 1065 | } |
| 1066 | |
| 1067 | function get(excludeClones) { |
| 1068 | return excludeClones ? filter(function (Slide2) { |
| 1069 | return !Slide2.isClone; |
| 1070 | }) : Slides2; |
| 1071 | } |
| 1072 | |
| 1073 | function getIn(page) { |
| 1074 | var Controller = Components2.Controller; |
| 1075 | var index = Controller.toIndex(page); |
| 1076 | var max = Controller.hasFocus() ? 1 : options.perPage; |
| 1077 | return filter(function (Slide2) { |
| 1078 | return between(Slide2.index, index, index + max - 1); |
| 1079 | }); |
| 1080 | } |
| 1081 | |
| 1082 | function getAt(index) { |
| 1083 | return filter(index)[0]; |
| 1084 | } |
| 1085 | |
| 1086 | function add(items, index) { |
| 1087 | forEach(items, function (slide) { |
| 1088 | if (isString(slide)) { |
| 1089 | slide = parseHtml(slide); |
| 1090 | } |
| 1091 | |
| 1092 | if (isHTMLElement(slide)) { |
| 1093 | var ref = slides[index]; |
| 1094 | ref ? before(slide, ref) : append(list, slide); |
| 1095 | addClass(slide, options.classes.slide); |
| 1096 | observeImages(slide, apply(emit, EVENT_RESIZE)); |
| 1097 | } |
| 1098 | }); |
| 1099 | emit(EVENT_REFRESH); |
| 1100 | } |
| 1101 | |
| 1102 | function remove$1(matcher) { |
| 1103 | remove(filter(matcher).map(function (Slide2) { |
| 1104 | return Slide2.slide; |
| 1105 | })); |
| 1106 | emit(EVENT_REFRESH); |
| 1107 | } |
| 1108 | |
| 1109 | function forEach$1(iteratee, excludeClones) { |
| 1110 | get(excludeClones).forEach(iteratee); |
| 1111 | } |
| 1112 | |
| 1113 | function filter(matcher) { |
| 1114 | return Slides2.filter(isFunction(matcher) ? matcher : function (Slide2) { |
| 1115 | return isString(matcher) ? matches(Slide2.slide, matcher) : includes(toArray(matcher), Slide2.index); |
| 1116 | }); |
| 1117 | } |
| 1118 | |
| 1119 | function style(prop, value, useContainer) { |
| 1120 | forEach$1(function (Slide2) { |
| 1121 | Slide2.style(prop, value, useContainer); |
| 1122 | }); |
| 1123 | } |
| 1124 | |
| 1125 | function observeImages(elm, callback) { |
| 1126 | var images = queryAll(elm, "img"); |
| 1127 | var length = images.length; |
| 1128 | |
| 1129 | if (length) { |
| 1130 | images.forEach(function (img) { |
| 1131 | bind(img, "load error", function () { |
| 1132 | if (! --length) { |
| 1133 | callback(); |
| 1134 | } |
| 1135 | }); |
| 1136 | }); |
| 1137 | } else { |
| 1138 | callback(); |
| 1139 | } |
| 1140 | } |
| 1141 | |
| 1142 | function getLength(excludeClones) { |
| 1143 | return excludeClones ? slides.length : Slides2.length; |
| 1144 | } |
| 1145 | |
| 1146 | function isEnough() { |
| 1147 | return Slides2.length > options.perPage; |
| 1148 | } |
| 1149 | |
| 1150 | return { |
| 1151 | mount: mount, |
| 1152 | destroy: destroy, |
| 1153 | update: update, |
| 1154 | register: register, |
| 1155 | get: get, |
| 1156 | getIn: getIn, |
| 1157 | getAt: getAt, |
| 1158 | add: add, |
| 1159 | remove: remove$1, |
| 1160 | forEach: forEach$1, |
| 1161 | filter: filter, |
| 1162 | style: style, |
| 1163 | getLength: getLength, |
| 1164 | isEnough: isEnough |
| 1165 | }; |
| 1166 | } |
| 1167 | |
| 1168 | function Layout(Splide2, Components2, options) { |
| 1169 | var _EventInterface3 = EventInterface(Splide2), |
| 1170 | on = _EventInterface3.on, |
| 1171 | bind = _EventInterface3.bind, |
| 1172 | emit = _EventInterface3.emit; |
| 1173 | |
| 1174 | var Slides = Components2.Slides; |
| 1175 | var resolve = Components2.Direction.resolve; |
| 1176 | var _Components2$Elements2 = Components2.Elements, |
| 1177 | root = _Components2$Elements2.root, |
| 1178 | track = _Components2$Elements2.track, |
| 1179 | list = _Components2$Elements2.list; |
| 1180 | var getAt = Slides.getAt, |
| 1181 | styleSlides = Slides.style; |
| 1182 | var vertical; |
| 1183 | var rootRect; |
| 1184 | var overflow; |
| 1185 | |
| 1186 | function mount() { |
| 1187 | init(); |
| 1188 | bind(window, "resize load", Throttle(apply(emit, EVENT_RESIZE))); |
| 1189 | on([EVENT_UPDATED, EVENT_REFRESH], init); |
| 1190 | on(EVENT_RESIZE, resize); |
| 1191 | } |
| 1192 | |
| 1193 | function init() { |
| 1194 | vertical = options.direction === TTB; |
| 1195 | style(root, "maxWidth", unit(options.width)); |
| 1196 | style(track, resolve("paddingLeft"), cssPadding(false)); |
| 1197 | style(track, resolve("paddingRight"), cssPadding(true)); |
| 1198 | resize(true); |
| 1199 | } |
| 1200 | |
| 1201 | function resize(force) { |
| 1202 | var newRect = rect(root); |
| 1203 | |
| 1204 | if (force || rootRect.width !== newRect.width || rootRect.height !== newRect.height) { |
| 1205 | style(track, "height", cssTrackHeight()); |
| 1206 | styleSlides(resolve("marginRight"), unit(options.gap)); |
| 1207 | styleSlides("width", cssSlideWidth()); |
| 1208 | styleSlides("height", cssSlideHeight(), true); |
| 1209 | rootRect = newRect; |
| 1210 | emit(EVENT_RESIZED); |
| 1211 | |
| 1212 | if (overflow !== (overflow = isOverflow())) { |
| 1213 | toggleClass(root, CLASS_OVERFLOW, overflow); |
| 1214 | emit(EVENT_OVERFLOW, overflow); |
| 1215 | } |
| 1216 | } |
| 1217 | } |
| 1218 | |
| 1219 | function cssPadding(right) { |
| 1220 | var padding = options.padding; |
| 1221 | var prop = resolve(right ? "right" : "left"); |
| 1222 | return padding && unit(padding[prop] || (isObject(padding) ? 0 : padding)) || "0px"; |
| 1223 | } |
| 1224 | |
| 1225 | function cssTrackHeight() { |
| 1226 | var height = ""; |
| 1227 | |
| 1228 | if (vertical) { |
| 1229 | height = cssHeight(); |
| 1230 | assert(height, "height or heightRatio is missing."); |
| 1231 | height = "calc(" + height + " - " + cssPadding(false) + " - " + cssPadding(true) + ")"; |
| 1232 | } |
| 1233 | |
| 1234 | return height; |
| 1235 | } |
| 1236 | |
| 1237 | function cssHeight() { |
| 1238 | return unit(options.height || rect(list).width * options.heightRatio); |
| 1239 | } |
| 1240 | |
| 1241 | function cssSlideWidth() { |
| 1242 | return options.autoWidth ? null : unit(options.fixedWidth) || (vertical ? "" : cssSlideSize()); |
| 1243 | } |
| 1244 | |
| 1245 | function cssSlideHeight() { |
| 1246 | return unit(options.fixedHeight) || (vertical ? options.autoHeight ? null : cssSlideSize() : cssHeight()); |
| 1247 | } |
| 1248 | |
| 1249 | function cssSlideSize() { |
| 1250 | var gap = unit(options.gap); |
| 1251 | return "calc((100%" + (gap && " + " + gap) + ")/" + (options.perPage || 1) + (gap && " - " + gap) + ")"; |
| 1252 | } |
| 1253 | |
| 1254 | function listSize() { |
| 1255 | return rect(list)[resolve("width")]; |
| 1256 | } |
| 1257 | |
| 1258 | function slideSize(index, withoutGap) { |
| 1259 | var Slide = getAt(index || 0); |
| 1260 | return Slide ? rect(Slide.slide)[resolve("width")] + (withoutGap ? 0 : getGap()) : 0; |
| 1261 | } |
| 1262 | |
| 1263 | function totalSize(index, withoutGap) { |
| 1264 | var Slide = getAt(index); |
| 1265 | |
| 1266 | if (Slide) { |
| 1267 | var right = rect(Slide.slide)[resolve("right")]; |
| 1268 | var left = rect(list)[resolve("left")]; |
| 1269 | return abs(right - left) + (withoutGap ? 0 : getGap()); |
| 1270 | } |
| 1271 | |
| 1272 | return 0; |
| 1273 | } |
| 1274 | |
| 1275 | function sliderSize(withoutGap) { |
| 1276 | return totalSize(Splide2.length - 1) - totalSize(0) + slideSize(0, withoutGap); |
| 1277 | } |
| 1278 | |
| 1279 | function getGap() { |
| 1280 | var Slide = getAt(0); |
| 1281 | return Slide && parseFloat(style(Slide.slide, resolve("marginRight"))) || 0; |
| 1282 | } |
| 1283 | |
| 1284 | function getPadding(right) { |
| 1285 | return parseFloat(style(track, resolve("padding" + (right ? "Right" : "Left")))) || 0; |
| 1286 | } |
| 1287 | |
| 1288 | function isOverflow() { |
| 1289 | return Splide2.is(FADE) || sliderSize(true) > listSize(); |
| 1290 | } |
| 1291 | |
| 1292 | return { |
| 1293 | mount: mount, |
| 1294 | resize: resize, |
| 1295 | listSize: listSize, |
| 1296 | slideSize: slideSize, |
| 1297 | sliderSize: sliderSize, |
| 1298 | totalSize: totalSize, |
| 1299 | getPadding: getPadding, |
| 1300 | isOverflow: isOverflow |
| 1301 | }; |
| 1302 | } |
| 1303 | |
| 1304 | var MULTIPLIER = 2; |
| 1305 | |
| 1306 | function Clones(Splide2, Components2, options) { |
| 1307 | var event = EventInterface(Splide2); |
| 1308 | var on = event.on; |
| 1309 | var Elements = Components2.Elements, |
| 1310 | Slides = Components2.Slides; |
| 1311 | var resolve = Components2.Direction.resolve; |
| 1312 | var clones = []; |
| 1313 | var cloneCount; |
| 1314 | |
| 1315 | function mount() { |
| 1316 | on(EVENT_REFRESH, remount); |
| 1317 | on([EVENT_UPDATED, EVENT_RESIZE], observe); |
| 1318 | |
| 1319 | if (cloneCount = computeCloneCount()) { |
| 1320 | generate(cloneCount); |
| 1321 | Components2.Layout.resize(true); |
| 1322 | } |
| 1323 | } |
| 1324 | |
| 1325 | function remount() { |
| 1326 | destroy(); |
| 1327 | mount(); |
| 1328 | } |
| 1329 | |
| 1330 | function destroy() { |
| 1331 | remove(clones); |
| 1332 | empty(clones); |
| 1333 | event.destroy(); |
| 1334 | } |
| 1335 | |
| 1336 | function observe() { |
| 1337 | var count = computeCloneCount(); |
| 1338 | |
| 1339 | if (cloneCount !== count) { |
| 1340 | if (cloneCount < count || !count) { |
| 1341 | event.emit(EVENT_REFRESH); |
| 1342 | } |
| 1343 | } |
| 1344 | } |
| 1345 | |
| 1346 | function generate(count) { |
| 1347 | var slides = Slides.get().slice(); |
| 1348 | var length = slides.length; |
| 1349 | |
| 1350 | if (length) { |
| 1351 | while (slides.length < count) { |
| 1352 | push(slides, slides); |
| 1353 | } |
| 1354 | |
| 1355 | push(slides.slice(-count), slides.slice(0, count)).forEach(function (Slide, index) { |
| 1356 | var isHead = index < count; |
| 1357 | var clone = cloneDeep(Slide.slide, index); |
| 1358 | isHead ? before(clone, slides[0].slide) : append(Elements.list, clone); |
| 1359 | push(clones, clone); |
| 1360 | Slides.register(clone, index - count + (isHead ? 0 : length), Slide.index); |
| 1361 | }); |
| 1362 | } |
| 1363 | } |
| 1364 | |
| 1365 | function cloneDeep(elm, index) { |
| 1366 | var clone = elm.cloneNode(true); |
| 1367 | addClass(clone, options.classes.clone); |
| 1368 | clone.id = Splide2.root.id + "-clone" + pad(index + 1); |
| 1369 | return clone; |
| 1370 | } |
| 1371 | |
| 1372 | function computeCloneCount() { |
| 1373 | var clones2 = options.clones; |
| 1374 | |
| 1375 | if (!Splide2.is(LOOP)) { |
| 1376 | clones2 = 0; |
| 1377 | } else if (isUndefined(clones2)) { |
| 1378 | var fixedSize = options[resolve("fixedWidth")] && Components2.Layout.slideSize(0); |
| 1379 | var fixedCount = fixedSize && ceil(rect(Elements.track)[resolve("width")] / fixedSize); |
| 1380 | clones2 = fixedCount || options[resolve("autoWidth")] && Splide2.length || options.perPage * MULTIPLIER; |
| 1381 | } |
| 1382 | |
| 1383 | return clones2; |
| 1384 | } |
| 1385 | |
| 1386 | return { |
| 1387 | mount: mount, |
| 1388 | destroy: destroy |
| 1389 | }; |
| 1390 | } |
| 1391 | |
| 1392 | function Move(Splide2, Components2, options) { |
| 1393 | var _EventInterface4 = EventInterface(Splide2), |
| 1394 | on = _EventInterface4.on, |
| 1395 | emit = _EventInterface4.emit; |
| 1396 | |
| 1397 | var set = Splide2.state.set; |
| 1398 | var _Components2$Layout = Components2.Layout, |
| 1399 | slideSize = _Components2$Layout.slideSize, |
| 1400 | getPadding = _Components2$Layout.getPadding, |
| 1401 | totalSize = _Components2$Layout.totalSize, |
| 1402 | listSize = _Components2$Layout.listSize, |
| 1403 | sliderSize = _Components2$Layout.sliderSize; |
| 1404 | var _Components2$Directio = Components2.Direction, |
| 1405 | resolve = _Components2$Directio.resolve, |
| 1406 | orient = _Components2$Directio.orient; |
| 1407 | var _Components2$Elements3 = Components2.Elements, |
| 1408 | list = _Components2$Elements3.list, |
| 1409 | track = _Components2$Elements3.track; |
| 1410 | var Transition; |
| 1411 | |
| 1412 | function mount() { |
| 1413 | Transition = Components2.Transition; |
| 1414 | on([EVENT_MOUNTED, EVENT_RESIZED, EVENT_UPDATED, EVENT_REFRESH], reposition); |
| 1415 | } |
| 1416 | |
| 1417 | function reposition() { |
| 1418 | if (!Components2.Controller.isBusy()) { |
| 1419 | Components2.Scroll.cancel(); |
| 1420 | jump(Splide2.index); |
| 1421 | Components2.Slides.update(); |
| 1422 | } |
| 1423 | } |
| 1424 | |
| 1425 | function move(dest, index, prev, callback) { |
| 1426 | if (dest !== index && canShift(dest > prev)) { |
| 1427 | cancel(); |
| 1428 | translate(shift(getPosition(), dest > prev), true); |
| 1429 | } |
| 1430 | |
| 1431 | set(MOVING); |
| 1432 | emit(EVENT_MOVE, index, prev, dest); |
| 1433 | Transition.start(index, function () { |
| 1434 | set(IDLE); |
| 1435 | emit(EVENT_MOVED, index, prev, dest); |
| 1436 | callback && callback(); |
| 1437 | }); |
| 1438 | } |
| 1439 | |
| 1440 | function jump(index) { |
| 1441 | translate(toPosition(index, true)); |
| 1442 | } |
| 1443 | |
| 1444 | function translate(position, preventLoop) { |
| 1445 | if (!Splide2.is(FADE)) { |
| 1446 | var destination = preventLoop ? position : loop(position); |
| 1447 | style(list, "transform", "translate" + resolve("X") + "(" + destination + "px)"); |
| 1448 | position !== destination && emit(EVENT_SHIFTED); |
| 1449 | } |
| 1450 | } |
| 1451 | |
| 1452 | function loop(position) { |
| 1453 | if (Splide2.is(LOOP)) { |
| 1454 | var index = toIndex(position); |
| 1455 | var exceededMax = index > Components2.Controller.getEnd(); |
| 1456 | var exceededMin = index < 0; |
| 1457 | |
| 1458 | if (exceededMin || exceededMax) { |
| 1459 | position = shift(position, exceededMax); |
| 1460 | } |
| 1461 | } |
| 1462 | |
| 1463 | return position; |
| 1464 | } |
| 1465 | |
| 1466 | function shift(position, backwards) { |
| 1467 | var excess = position - getLimit(backwards); |
| 1468 | var size = sliderSize(); |
| 1469 | position -= orient(size * (ceil(abs(excess) / size) || 1)) * (backwards ? 1 : -1); |
| 1470 | return position; |
| 1471 | } |
| 1472 | |
| 1473 | function cancel() { |
| 1474 | translate(getPosition(), true); |
| 1475 | Transition.cancel(); |
| 1476 | } |
| 1477 | |
| 1478 | function toIndex(position) { |
| 1479 | var Slides = Components2.Slides.get(); |
| 1480 | var index = 0; |
| 1481 | var minDistance = Infinity; |
| 1482 | |
| 1483 | for (var i = 0; i < Slides.length; i++) { |
| 1484 | var slideIndex = Slides[i].index; |
| 1485 | var distance = abs(toPosition(slideIndex, true) - position); |
| 1486 | |
| 1487 | if (distance <= minDistance) { |
| 1488 | minDistance = distance; |
| 1489 | index = slideIndex; |
| 1490 | } else { |
| 1491 | break; |
| 1492 | } |
| 1493 | } |
| 1494 | |
| 1495 | return index; |
| 1496 | } |
| 1497 | |
| 1498 | function toPosition(index, trimming) { |
| 1499 | var position = orient(totalSize(index - 1) - offset(index)); |
| 1500 | return trimming ? trim(position) : position; |
| 1501 | } |
| 1502 | |
| 1503 | function getPosition() { |
| 1504 | var left = resolve("left"); |
| 1505 | return rect(list)[left] - rect(track)[left] + orient(getPadding(false)); |
| 1506 | } |
| 1507 | |
| 1508 | function trim(position) { |
| 1509 | if (options.trimSpace && Splide2.is(SLIDE)) { |
| 1510 | position = clamp(position, 0, orient(sliderSize(true) - listSize())); |
| 1511 | } |
| 1512 | |
| 1513 | return position; |
| 1514 | } |
| 1515 | |
| 1516 | function offset(index) { |
| 1517 | var focus = options.focus; |
| 1518 | return focus === "center" ? (listSize() - slideSize(index, true)) / 2 : +focus * slideSize(index) || 0; |
| 1519 | } |
| 1520 | |
| 1521 | function getLimit(max) { |
| 1522 | return toPosition(max ? Components2.Controller.getEnd() : 0, !!options.trimSpace); |
| 1523 | } |
| 1524 | |
| 1525 | function canShift(backwards) { |
| 1526 | var shifted = orient(shift(getPosition(), backwards)); |
| 1527 | return backwards ? shifted >= 0 : shifted <= list[resolve("scrollWidth")] - rect(track)[resolve("width")]; |
| 1528 | } |
| 1529 | |
| 1530 | function exceededLimit(max, position) { |
| 1531 | position = isUndefined(position) ? getPosition() : position; |
| 1532 | var exceededMin = max !== true && orient(position) < orient(getLimit(false)); |
| 1533 | var exceededMax = max !== false && orient(position) > orient(getLimit(true)); |
| 1534 | return exceededMin || exceededMax; |
| 1535 | } |
| 1536 | |
| 1537 | return { |
| 1538 | mount: mount, |
| 1539 | move: move, |
| 1540 | jump: jump, |
| 1541 | translate: translate, |
| 1542 | shift: shift, |
| 1543 | cancel: cancel, |
| 1544 | toIndex: toIndex, |
| 1545 | toPosition: toPosition, |
| 1546 | getPosition: getPosition, |
| 1547 | getLimit: getLimit, |
| 1548 | exceededLimit: exceededLimit, |
| 1549 | reposition: reposition |
| 1550 | }; |
| 1551 | } |
| 1552 | |
| 1553 | function Controller(Splide2, Components2, options) { |
| 1554 | var _EventInterface5 = EventInterface(Splide2), |
| 1555 | on = _EventInterface5.on, |
| 1556 | emit = _EventInterface5.emit; |
| 1557 | |
| 1558 | var Move = Components2.Move; |
| 1559 | var getPosition = Move.getPosition, |
| 1560 | getLimit = Move.getLimit, |
| 1561 | toPosition = Move.toPosition; |
| 1562 | var _Components2$Slides = Components2.Slides, |
| 1563 | isEnough = _Components2$Slides.isEnough, |
| 1564 | getLength = _Components2$Slides.getLength; |
| 1565 | var omitEnd = options.omitEnd; |
| 1566 | var isLoop = Splide2.is(LOOP); |
| 1567 | var isSlide = Splide2.is(SLIDE); |
| 1568 | var getNext = apply(getAdjacent, false); |
| 1569 | var getPrev = apply(getAdjacent, true); |
| 1570 | var currIndex = options.start || 0; |
| 1571 | var endIndex; |
| 1572 | var prevIndex = currIndex; |
| 1573 | var slideCount; |
| 1574 | var perMove; |
| 1575 | var perPage; |
| 1576 | |
| 1577 | function mount() { |
| 1578 | init(); |
| 1579 | on([EVENT_UPDATED, EVENT_REFRESH, EVENT_END_INDEX_CHANGED], init); |
| 1580 | on(EVENT_RESIZED, onResized); |
| 1581 | } |
| 1582 | |
| 1583 | function init() { |
| 1584 | slideCount = getLength(true); |
| 1585 | perMove = options.perMove; |
| 1586 | perPage = options.perPage; |
| 1587 | endIndex = getEnd(); |
| 1588 | var index = clamp(currIndex, 0, omitEnd ? endIndex : slideCount - 1); |
| 1589 | |
| 1590 | if (index !== currIndex) { |
| 1591 | currIndex = index; |
| 1592 | Move.reposition(); |
| 1593 | } |
| 1594 | } |
| 1595 | |
| 1596 | function onResized() { |
| 1597 | if (endIndex !== getEnd()) { |
| 1598 | emit(EVENT_END_INDEX_CHANGED); |
| 1599 | } |
| 1600 | } |
| 1601 | |
| 1602 | function go(control, allowSameIndex, callback) { |
| 1603 | if (!isBusy()) { |
| 1604 | var dest = parse(control); |
| 1605 | var index = loop(dest); |
| 1606 | |
| 1607 | if (index > -1 && (allowSameIndex || index !== currIndex)) { |
| 1608 | setIndex(index); |
| 1609 | Move.move(dest, index, prevIndex, callback); |
| 1610 | } |
| 1611 | } |
| 1612 | } |
| 1613 | |
| 1614 | function scroll(destination, duration, snap, callback) { |
| 1615 | Components2.Scroll.scroll(destination, duration, snap, function () { |
| 1616 | var index = loop(Move.toIndex(getPosition())); |
| 1617 | setIndex(omitEnd ? min(index, endIndex) : index); |
| 1618 | callback && callback(); |
| 1619 | }); |
| 1620 | } |
| 1621 | |
| 1622 | function parse(control) { |
| 1623 | var index = currIndex; |
| 1624 | |
| 1625 | if (isString(control)) { |
| 1626 | var _ref = control.match(/([+\-<>])(\d+)?/) || [], |
| 1627 | indicator = _ref[1], |
| 1628 | number = _ref[2]; |
| 1629 | |
| 1630 | if (indicator === "+" || indicator === "-") { |
| 1631 | index = computeDestIndex(currIndex + +("" + indicator + (+number || 1)), currIndex); |
| 1632 | } else if (indicator === ">") { |
| 1633 | index = number ? toIndex(+number) : getNext(true); |
| 1634 | } else if (indicator === "<") { |
| 1635 | index = getPrev(true); |
| 1636 | } |
| 1637 | } else { |
| 1638 | index = isLoop ? control : clamp(control, 0, endIndex); |
| 1639 | } |
| 1640 | |
| 1641 | return index; |
| 1642 | } |
| 1643 | |
| 1644 | function getAdjacent(prev, destination) { |
| 1645 | var number = perMove || (hasFocus() ? 1 : perPage); |
| 1646 | var dest = computeDestIndex(currIndex + number * (prev ? -1 : 1), currIndex, !(perMove || hasFocus())); |
| 1647 | |
| 1648 | if (dest === -1 && isSlide) { |
| 1649 | if (!approximatelyEqual(getPosition(), getLimit(!prev), 1)) { |
| 1650 | return prev ? 0 : endIndex; |
| 1651 | } |
| 1652 | } |
| 1653 | |
| 1654 | return destination ? dest : loop(dest); |
| 1655 | } |
| 1656 | |
| 1657 | function computeDestIndex(dest, from, snapPage) { |
| 1658 | if (isEnough() || hasFocus()) { |
| 1659 | var index = computeMovableDestIndex(dest); |
| 1660 | |
| 1661 | if (index !== dest) { |
| 1662 | from = dest; |
| 1663 | dest = index; |
| 1664 | snapPage = false; |
| 1665 | } |
| 1666 | |
| 1667 | if (dest < 0 || dest > endIndex) { |
| 1668 | if (!perMove && (between(0, dest, from, true) || between(endIndex, from, dest, true))) { |
| 1669 | dest = toIndex(toPage(dest)); |
| 1670 | } else { |
| 1671 | if (isLoop) { |
| 1672 | dest = snapPage ? dest < 0 ? -(slideCount % perPage || perPage) : slideCount : dest; |
| 1673 | } else if (options.rewind) { |
| 1674 | dest = dest < 0 ? endIndex : 0; |
| 1675 | } else { |
| 1676 | dest = -1; |
| 1677 | } |
| 1678 | } |
| 1679 | } else { |
| 1680 | if (snapPage && dest !== from) { |
| 1681 | dest = toIndex(toPage(from) + (dest < from ? -1 : 1)); |
| 1682 | } |
| 1683 | } |
| 1684 | } else { |
| 1685 | dest = -1; |
| 1686 | } |
| 1687 | |
| 1688 | return dest; |
| 1689 | } |
| 1690 | |
| 1691 | function computeMovableDestIndex(dest) { |
| 1692 | if (isSlide && options.trimSpace === "move" && dest !== currIndex) { |
| 1693 | var position = getPosition(); |
| 1694 | |
| 1695 | while (position === toPosition(dest, true) && between(dest, 0, Splide2.length - 1, !options.rewind)) { |
| 1696 | dest < currIndex ? --dest : ++dest; |
| 1697 | } |
| 1698 | } |
| 1699 | |
| 1700 | return dest; |
| 1701 | } |
| 1702 | |
| 1703 | function loop(index) { |
| 1704 | return isLoop ? (index + slideCount) % slideCount || 0 : index; |
| 1705 | } |
| 1706 | |
| 1707 | function getEnd() { |
| 1708 | var end = slideCount - (hasFocus() || isLoop && perMove ? 1 : perPage); |
| 1709 | |
| 1710 | while (omitEnd && end-- > 0) { |
| 1711 | if (toPosition(slideCount - 1, true) !== toPosition(end, true)) { |
| 1712 | end++; |
| 1713 | break; |
| 1714 | } |
| 1715 | } |
| 1716 | |
| 1717 | return clamp(end, 0, slideCount - 1); |
| 1718 | } |
| 1719 | |
| 1720 | function toIndex(page) { |
| 1721 | return clamp(hasFocus() ? page : perPage * page, 0, endIndex); |
| 1722 | } |
| 1723 | |
| 1724 | function toPage(index) { |
| 1725 | return hasFocus() ? min(index, endIndex) : floor((index >= endIndex ? slideCount - 1 : index) / perPage); |
| 1726 | } |
| 1727 | |
| 1728 | function toDest(destination) { |
| 1729 | var closest = Move.toIndex(destination); |
| 1730 | return isSlide ? clamp(closest, 0, endIndex) : closest; |
| 1731 | } |
| 1732 | |
| 1733 | function setIndex(index) { |
| 1734 | if (index !== currIndex) { |
| 1735 | prevIndex = currIndex; |
| 1736 | currIndex = index; |
| 1737 | } |
| 1738 | } |
| 1739 | |
| 1740 | function getIndex(prev) { |
| 1741 | return prev ? prevIndex : currIndex; |
| 1742 | } |
| 1743 | |
| 1744 | function hasFocus() { |
| 1745 | return !isUndefined(options.focus) || options.isNavigation; |
| 1746 | } |
| 1747 | |
| 1748 | function isBusy() { |
| 1749 | return Splide2.state.is([MOVING, SCROLLING]) && !!options.waitForTransition; |
| 1750 | } |
| 1751 | |
| 1752 | return { |
| 1753 | mount: mount, |
| 1754 | go: go, |
| 1755 | scroll: scroll, |
| 1756 | getNext: getNext, |
| 1757 | getPrev: getPrev, |
| 1758 | getAdjacent: getAdjacent, |
| 1759 | getEnd: getEnd, |
| 1760 | setIndex: setIndex, |
| 1761 | getIndex: getIndex, |
| 1762 | toIndex: toIndex, |
| 1763 | toPage: toPage, |
| 1764 | toDest: toDest, |
| 1765 | hasFocus: hasFocus, |
| 1766 | isBusy: isBusy |
| 1767 | }; |
| 1768 | } |
| 1769 | |
| 1770 | var XML_NAME_SPACE = "http://www.w3.org/2000/svg"; |
| 1771 | var PATH = "m15.5 0.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4-14.6-14.6z"; |
| 1772 | var SIZE = 40; |
| 1773 | |
| 1774 | function Arrows(Splide2, Components2, options) { |
| 1775 | var event = EventInterface(Splide2); |
| 1776 | var on = event.on, |
| 1777 | bind = event.bind, |
| 1778 | emit = event.emit; |
| 1779 | var classes = options.classes, |
| 1780 | i18n = options.i18n; |
| 1781 | var Elements = Components2.Elements, |
| 1782 | Controller = Components2.Controller; |
| 1783 | var placeholder = Elements.arrows, |
| 1784 | track = Elements.track; |
| 1785 | var wrapper = placeholder; |
| 1786 | var prev = Elements.prev; |
| 1787 | var next = Elements.next; |
| 1788 | var created; |
| 1789 | var wrapperClasses; |
| 1790 | var arrows = {}; |
| 1791 | |
| 1792 | function mount() { |
| 1793 | init(); |
| 1794 | on(EVENT_UPDATED, remount); |
| 1795 | } |
| 1796 | |
| 1797 | function remount() { |
| 1798 | destroy(); |
| 1799 | mount(); |
| 1800 | } |
| 1801 | |
| 1802 | function init() { |
| 1803 | var enabled = options.arrows; |
| 1804 | |
| 1805 | if (enabled && !(prev && next)) { |
| 1806 | createArrows(); |
| 1807 | } |
| 1808 | |
| 1809 | if (prev && next) { |
| 1810 | assign(arrows, { |
| 1811 | prev: prev, |
| 1812 | next: next |
| 1813 | }); |
| 1814 | display(wrapper, enabled ? "" : "none"); |
| 1815 | addClass(wrapper, wrapperClasses = CLASS_ARROWS + "--" + options.direction); |
| 1816 | |
| 1817 | if (enabled) { |
| 1818 | listen(); |
| 1819 | update(); |
| 1820 | setAttribute([prev, next], ARIA_CONTROLS, track.id); |
| 1821 | emit(EVENT_ARROWS_MOUNTED, prev, next); |
| 1822 | } |
| 1823 | } |
| 1824 | } |
| 1825 | |
| 1826 | function destroy() { |
| 1827 | event.destroy(); |
| 1828 | removeClass(wrapper, wrapperClasses); |
| 1829 | |
| 1830 | if (created) { |
| 1831 | remove(placeholder ? [prev, next] : wrapper); |
| 1832 | prev = next = null; |
| 1833 | } else { |
| 1834 | removeAttribute([prev, next], ALL_ATTRIBUTES); |
| 1835 | } |
| 1836 | } |
| 1837 | |
| 1838 | function listen() { |
| 1839 | on([EVENT_MOUNTED, EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update); |
| 1840 | bind(next, "click", apply(go, ">")); |
| 1841 | bind(prev, "click", apply(go, "<")); |
| 1842 | } |
| 1843 | |
| 1844 | function go(control) { |
| 1845 | Controller.go(control, true); |
| 1846 | } |
| 1847 | |
| 1848 | function createArrows() { |
| 1849 | wrapper = placeholder || create("div", classes.arrows); |
| 1850 | prev = createArrow(true); |
| 1851 | next = createArrow(false); |
| 1852 | created = true; |
| 1853 | append(wrapper, [prev, next]); |
| 1854 | !placeholder && before(wrapper, track); |
| 1855 | } |
| 1856 | |
| 1857 | function createArrow(prev2) { |
| 1858 | var arrow = "<button class=\"" + classes.arrow + " " + (prev2 ? classes.prev : classes.next) + "\" type=\"button\"><svg xmlns=\"" + XML_NAME_SPACE + "\" viewBox=\"0 0 " + SIZE + " " + SIZE + "\" width=\"" + SIZE + "\" height=\"" + SIZE + "\" focusable=\"false\"><path d=\"" + (options.arrowPath || PATH) + "\" />"; |
| 1859 | return parseHtml(arrow); |
| 1860 | } |
| 1861 | |
| 1862 | function update() { |
| 1863 | if (prev && next) { |
| 1864 | var index = Splide2.index; |
| 1865 | var prevIndex = Controller.getPrev(); |
| 1866 | var nextIndex = Controller.getNext(); |
| 1867 | var prevLabel = prevIndex > -1 && index < prevIndex ? i18n.last : i18n.prev; |
| 1868 | var nextLabel = nextIndex > -1 && index > nextIndex ? i18n.first : i18n.next; |
| 1869 | prev.disabled = prevIndex < 0; |
| 1870 | next.disabled = nextIndex < 0; |
| 1871 | setAttribute(prev, ARIA_LABEL, prevLabel); |
| 1872 | setAttribute(next, ARIA_LABEL, nextLabel); |
| 1873 | emit(EVENT_ARROWS_UPDATED, prev, next, prevIndex, nextIndex); |
| 1874 | } |
| 1875 | } |
| 1876 | |
| 1877 | return { |
| 1878 | arrows: arrows, |
| 1879 | mount: mount, |
| 1880 | destroy: destroy, |
| 1881 | update: update |
| 1882 | }; |
| 1883 | } |
| 1884 | |
| 1885 | var INTERVAL_DATA_ATTRIBUTE = DATA_ATTRIBUTE + "-interval"; |
| 1886 | |
| 1887 | function Autoplay(Splide2, Components2, options) { |
| 1888 | var _EventInterface6 = EventInterface(Splide2), |
| 1889 | on = _EventInterface6.on, |
| 1890 | bind = _EventInterface6.bind, |
| 1891 | emit = _EventInterface6.emit; |
| 1892 | |
| 1893 | var interval = RequestInterval(options.interval, Splide2.go.bind(Splide2, ">"), onAnimationFrame); |
| 1894 | var isPaused = interval.isPaused; |
| 1895 | var Elements = Components2.Elements, |
| 1896 | _Components2$Elements4 = Components2.Elements, |
| 1897 | root = _Components2$Elements4.root, |
| 1898 | toggle = _Components2$Elements4.toggle; |
| 1899 | var autoplay = options.autoplay; |
| 1900 | var hovered; |
| 1901 | var focused; |
| 1902 | var stopped = autoplay === "pause"; |
| 1903 | |
| 1904 | function mount() { |
| 1905 | if (autoplay) { |
| 1906 | listen(); |
| 1907 | toggle && setAttribute(toggle, ARIA_CONTROLS, Elements.track.id); |
| 1908 | stopped || play(); |
| 1909 | update(); |
| 1910 | } |
| 1911 | } |
| 1912 | |
| 1913 | function listen() { |
| 1914 | if (options.pauseOnHover) { |
| 1915 | bind(root, "mouseenter mouseleave", function (e) { |
| 1916 | hovered = e.type === "mouseenter"; |
| 1917 | autoToggle(); |
| 1918 | }); |
| 1919 | } |
| 1920 | |
| 1921 | if (options.pauseOnFocus) { |
| 1922 | bind(root, "focusin focusout", function (e) { |
| 1923 | focused = e.type === "focusin"; |
| 1924 | autoToggle(); |
| 1925 | }); |
| 1926 | } |
| 1927 | |
| 1928 | if (toggle) { |
| 1929 | bind(toggle, "click", function () { |
| 1930 | stopped ? play() : pause(true); |
| 1931 | }); |
| 1932 | } |
| 1933 | |
| 1934 | on([EVENT_MOVE, EVENT_SCROLL, EVENT_REFRESH], interval.rewind); |
| 1935 | on(EVENT_MOVE, onMove); |
| 1936 | } |
| 1937 | |
| 1938 | function play() { |
| 1939 | if (isPaused() && Components2.Slides.isEnough()) { |
| 1940 | interval.start(!options.resetProgress); |
| 1941 | focused = hovered = stopped = false; |
| 1942 | update(); |
| 1943 | emit(EVENT_AUTOPLAY_PLAY); |
| 1944 | } |
| 1945 | } |
| 1946 | |
| 1947 | function pause(stop) { |
| 1948 | if (stop === void 0) { |
| 1949 | stop = true; |
| 1950 | } |
| 1951 | |
| 1952 | stopped = !!stop; |
| 1953 | update(); |
| 1954 | |
| 1955 | if (!isPaused()) { |
| 1956 | interval.pause(); |
| 1957 | emit(EVENT_AUTOPLAY_PAUSE); |
| 1958 | } |
| 1959 | } |
| 1960 | |
| 1961 | function autoToggle() { |
| 1962 | if (!stopped) { |
| 1963 | hovered || focused ? pause(false) : play(); |
| 1964 | } |
| 1965 | } |
| 1966 | |
| 1967 | function update() { |
| 1968 | if (toggle) { |
| 1969 | toggleClass(toggle, CLASS_ACTIVE, !stopped); |
| 1970 | setAttribute(toggle, ARIA_LABEL, options.i18n[stopped ? "play" : "pause"]); |
| 1971 | } |
| 1972 | } |
| 1973 | |
| 1974 | function onAnimationFrame(rate) { |
| 1975 | var bar = Elements.bar; |
| 1976 | bar && style(bar, "width", rate * 100 + "%"); |
| 1977 | emit(EVENT_AUTOPLAY_PLAYING, rate); |
| 1978 | } |
| 1979 | |
| 1980 | function onMove(index) { |
| 1981 | var Slide = Components2.Slides.getAt(index); |
| 1982 | interval.set(Slide && +getAttribute(Slide.slide, INTERVAL_DATA_ATTRIBUTE) || options.interval); |
| 1983 | } |
| 1984 | |
| 1985 | return { |
| 1986 | mount: mount, |
| 1987 | destroy: interval.cancel, |
| 1988 | play: play, |
| 1989 | pause: pause, |
| 1990 | isPaused: isPaused |
| 1991 | }; |
| 1992 | } |
| 1993 | |
| 1994 | function Cover(Splide2, Components2, options) { |
| 1995 | var _EventInterface7 = EventInterface(Splide2), |
| 1996 | on = _EventInterface7.on; |
| 1997 | |
| 1998 | function mount() { |
| 1999 | if (options.cover) { |
| 2000 | on(EVENT_LAZYLOAD_LOADED, apply(toggle, true)); |
| 2001 | on([EVENT_MOUNTED, EVENT_UPDATED, EVENT_REFRESH], apply(cover, true)); |
| 2002 | } |
| 2003 | } |
| 2004 | |
| 2005 | function cover(cover2) { |
| 2006 | Components2.Slides.forEach(function (Slide) { |
| 2007 | var img = child(Slide.container || Slide.slide, "img"); |
| 2008 | |
| 2009 | if (img && img.src) { |
| 2010 | toggle(cover2, img, Slide); |
| 2011 | } |
| 2012 | }); |
| 2013 | } |
| 2014 | |
| 2015 | function toggle(cover2, img, Slide) { |
| 2016 | Slide.style("background", cover2 ? "center/cover no-repeat url(\"" + img.src + "\")" : "", true); |
| 2017 | display(img, cover2 ? "none" : ""); |
| 2018 | } |
| 2019 | |
| 2020 | return { |
| 2021 | mount: mount, |
| 2022 | destroy: apply(cover, false) |
| 2023 | }; |
| 2024 | } |
| 2025 | |
| 2026 | var BOUNCE_DIFF_THRESHOLD = 10; |
| 2027 | var BOUNCE_DURATION = 600; |
| 2028 | var FRICTION_FACTOR = 0.6; |
| 2029 | var BASE_VELOCITY = 1.5; |
| 2030 | var MIN_DURATION = 800; |
| 2031 | |
| 2032 | function Scroll(Splide2, Components2, options) { |
| 2033 | var _EventInterface8 = EventInterface(Splide2), |
| 2034 | on = _EventInterface8.on, |
| 2035 | emit = _EventInterface8.emit; |
| 2036 | |
| 2037 | var set = Splide2.state.set; |
| 2038 | var Move = Components2.Move; |
| 2039 | var getPosition = Move.getPosition, |
| 2040 | getLimit = Move.getLimit, |
| 2041 | exceededLimit = Move.exceededLimit, |
| 2042 | translate = Move.translate; |
| 2043 | var isSlide = Splide2.is(SLIDE); |
| 2044 | var interval; |
| 2045 | var callback; |
| 2046 | var friction = 1; |
| 2047 | |
| 2048 | function mount() { |
| 2049 | on(EVENT_MOVE, clear); |
| 2050 | on([EVENT_UPDATED, EVENT_REFRESH], cancel); |
| 2051 | } |
| 2052 | |
| 2053 | function scroll(destination, duration, snap, onScrolled, noConstrain) { |
| 2054 | var from = getPosition(); |
| 2055 | clear(); |
| 2056 | |
| 2057 | if (snap && (!isSlide || !exceededLimit())) { |
| 2058 | var size = Components2.Layout.sliderSize(); |
| 2059 | var offset = sign(destination) * size * floor(abs(destination) / size) || 0; |
| 2060 | destination = Move.toPosition(Components2.Controller.toDest(destination % size)) + offset; |
| 2061 | } |
| 2062 | |
| 2063 | var noDistance = approximatelyEqual(from, destination, 1); |
| 2064 | friction = 1; |
| 2065 | duration = noDistance ? 0 : duration || max(abs(destination - from) / BASE_VELOCITY, MIN_DURATION); |
| 2066 | callback = onScrolled; |
| 2067 | interval = RequestInterval(duration, onEnd, apply(update, from, destination, noConstrain), 1); |
| 2068 | set(SCROLLING); |
| 2069 | emit(EVENT_SCROLL); |
| 2070 | interval.start(); |
| 2071 | } |
| 2072 | |
| 2073 | function onEnd() { |
| 2074 | set(IDLE); |
| 2075 | callback && callback(); |
| 2076 | emit(EVENT_SCROLLED); |
| 2077 | } |
| 2078 | |
| 2079 | function update(from, to, noConstrain, rate) { |
| 2080 | var position = getPosition(); |
| 2081 | var target = from + (to - from) * easing(rate); |
| 2082 | var diff = (target - position) * friction; |
| 2083 | translate(position + diff); |
| 2084 | |
| 2085 | if (isSlide && !noConstrain && exceededLimit()) { |
| 2086 | friction *= FRICTION_FACTOR; |
| 2087 | |
| 2088 | if (abs(diff) < BOUNCE_DIFF_THRESHOLD) { |
| 2089 | scroll(getLimit(exceededLimit(true)), BOUNCE_DURATION, false, callback, true); |
| 2090 | } |
| 2091 | } |
| 2092 | } |
| 2093 | |
| 2094 | function clear() { |
| 2095 | if (interval) { |
| 2096 | interval.cancel(); |
| 2097 | } |
| 2098 | } |
| 2099 | |
| 2100 | function cancel() { |
| 2101 | if (interval && !interval.isPaused()) { |
| 2102 | clear(); |
| 2103 | onEnd(); |
| 2104 | } |
| 2105 | } |
| 2106 | |
| 2107 | function easing(t) { |
| 2108 | var easingFunc = options.easingFunc; |
| 2109 | return easingFunc ? easingFunc(t) : 1 - Math.pow(1 - t, 4); |
| 2110 | } |
| 2111 | |
| 2112 | return { |
| 2113 | mount: mount, |
| 2114 | destroy: clear, |
| 2115 | scroll: scroll, |
| 2116 | cancel: cancel |
| 2117 | }; |
| 2118 | } |
| 2119 | |
| 2120 | var SCROLL_LISTENER_OPTIONS = { |
| 2121 | passive: false, |
| 2122 | capture: true |
| 2123 | }; |
| 2124 | |
| 2125 | function Drag(Splide2, Components2, options) { |
| 2126 | var _EventInterface9 = EventInterface(Splide2), |
| 2127 | on = _EventInterface9.on, |
| 2128 | emit = _EventInterface9.emit, |
| 2129 | bind = _EventInterface9.bind, |
| 2130 | unbind = _EventInterface9.unbind; |
| 2131 | |
| 2132 | var state = Splide2.state; |
| 2133 | var Move = Components2.Move, |
| 2134 | Scroll = Components2.Scroll, |
| 2135 | Controller = Components2.Controller, |
| 2136 | track = Components2.Elements.track, |
| 2137 | reduce = Components2.Media.reduce; |
| 2138 | var _Components2$Directio2 = Components2.Direction, |
| 2139 | resolve = _Components2$Directio2.resolve, |
| 2140 | orient = _Components2$Directio2.orient; |
| 2141 | var getPosition = Move.getPosition, |
| 2142 | exceededLimit = Move.exceededLimit; |
| 2143 | var basePosition; |
| 2144 | var baseEvent; |
| 2145 | var prevBaseEvent; |
| 2146 | var isFree; |
| 2147 | var dragging; |
| 2148 | var exceeded = false; |
| 2149 | var clickPrevented; |
| 2150 | var disabled; |
| 2151 | var target; |
| 2152 | |
| 2153 | function mount() { |
| 2154 | bind(track, POINTER_MOVE_EVENTS, noop, SCROLL_LISTENER_OPTIONS); |
| 2155 | bind(track, POINTER_UP_EVENTS, noop, SCROLL_LISTENER_OPTIONS); |
| 2156 | bind(track, POINTER_DOWN_EVENTS, onPointerDown, SCROLL_LISTENER_OPTIONS); |
| 2157 | bind(track, "click", onClick, { |
| 2158 | capture: true |
| 2159 | }); |
| 2160 | bind(track, "dragstart", prevent); |
| 2161 | on([EVENT_MOUNTED, EVENT_UPDATED], init); |
| 2162 | } |
| 2163 | |
| 2164 | function init() { |
| 2165 | var drag = options.drag; |
| 2166 | disable(!drag); |
| 2167 | isFree = drag === "free"; |
| 2168 | } |
| 2169 | |
| 2170 | function onPointerDown(e) { |
| 2171 | clickPrevented = false; |
| 2172 | |
| 2173 | if (!disabled) { |
| 2174 | var isTouch = isTouchEvent(e); |
| 2175 | |
| 2176 | if (isDraggable(e.target) && (isTouch || !e.button)) { |
| 2177 | if (!Controller.isBusy()) { |
| 2178 | target = isTouch ? track : window; |
| 2179 | dragging = state.is([MOVING, SCROLLING]); |
| 2180 | prevBaseEvent = null; |
| 2181 | bind(target, POINTER_MOVE_EVENTS, onPointerMove, SCROLL_LISTENER_OPTIONS); |
| 2182 | bind(target, POINTER_UP_EVENTS, onPointerUp, SCROLL_LISTENER_OPTIONS); |
| 2183 | Move.cancel(); |
| 2184 | Scroll.cancel(); |
| 2185 | save(e); |
| 2186 | } else { |
| 2187 | prevent(e, true); |
| 2188 | } |
| 2189 | } |
| 2190 | } |
| 2191 | } |
| 2192 | |
| 2193 | function onPointerMove(e) { |
| 2194 | if (!state.is(DRAGGING)) { |
| 2195 | state.set(DRAGGING); |
| 2196 | emit(EVENT_DRAG); |
| 2197 | } |
| 2198 | |
| 2199 | if (e.cancelable) { |
| 2200 | if (dragging) { |
| 2201 | Move.translate(basePosition + constrain(diffCoord(e))); |
| 2202 | var expired = diffTime(e) > LOG_INTERVAL; |
| 2203 | var hasExceeded = exceeded !== (exceeded = exceededLimit()); |
| 2204 | |
| 2205 | if (expired || hasExceeded) { |
| 2206 | save(e); |
| 2207 | } |
| 2208 | |
| 2209 | clickPrevented = true; |
| 2210 | emit(EVENT_DRAGGING); |
| 2211 | prevent(e); |
| 2212 | } else if (isSliderDirection(e)) { |
| 2213 | dragging = shouldStart(e); |
| 2214 | prevent(e); |
| 2215 | } |
| 2216 | } |
| 2217 | } |
| 2218 | |
| 2219 | function onPointerUp(e) { |
| 2220 | if (state.is(DRAGGING)) { |
| 2221 | state.set(IDLE); |
| 2222 | emit(EVENT_DRAGGED); |
| 2223 | } |
| 2224 | |
| 2225 | if (dragging) { |
| 2226 | move(e); |
| 2227 | prevent(e); |
| 2228 | } |
| 2229 | |
| 2230 | unbind(target, POINTER_MOVE_EVENTS, onPointerMove); |
| 2231 | unbind(target, POINTER_UP_EVENTS, onPointerUp); |
| 2232 | dragging = false; |
| 2233 | } |
| 2234 | |
| 2235 | function onClick(e) { |
| 2236 | if (!disabled && clickPrevented) { |
| 2237 | prevent(e, true); |
| 2238 | } |
| 2239 | } |
| 2240 | |
| 2241 | function save(e) { |
| 2242 | prevBaseEvent = baseEvent; |
| 2243 | baseEvent = e; |
| 2244 | basePosition = getPosition(); |
| 2245 | } |
| 2246 | |
| 2247 | function move(e) { |
| 2248 | var velocity = computeVelocity(e); |
| 2249 | var destination = computeDestination(velocity); |
| 2250 | var rewind = options.rewind && options.rewindByDrag; |
| 2251 | reduce(false); |
| 2252 | |
| 2253 | if (isFree) { |
| 2254 | Controller.scroll(destination, 0, options.snap); |
| 2255 | } else if (Splide2.is(FADE)) { |
| 2256 | Controller.go(orient(sign(velocity)) < 0 ? rewind ? "<" : "-" : rewind ? ">" : "+"); |
| 2257 | } else if (Splide2.is(SLIDE) && exceeded && rewind) { |
| 2258 | Controller.go(exceededLimit(true) ? ">" : "<"); |
| 2259 | } else { |
| 2260 | Controller.go(Controller.toDest(destination), true); |
| 2261 | } |
| 2262 | |
| 2263 | reduce(true); |
| 2264 | } |
| 2265 | |
| 2266 | function shouldStart(e) { |
| 2267 | var thresholds = options.dragMinThreshold; |
| 2268 | var isObj = isObject(thresholds); |
| 2269 | var mouse = isObj && thresholds.mouse || 0; |
| 2270 | var touch = (isObj ? thresholds.touch : +thresholds) || 10; |
| 2271 | return abs(diffCoord(e)) > (isTouchEvent(e) ? touch : mouse); |
| 2272 | } |
| 2273 | |
| 2274 | function isSliderDirection(e) { |
| 2275 | return abs(diffCoord(e)) > abs(diffCoord(e, true)); |
| 2276 | } |
| 2277 | |
| 2278 | function computeVelocity(e) { |
| 2279 | if (Splide2.is(LOOP) || !exceeded) { |
| 2280 | var time = diffTime(e); |
| 2281 | |
| 2282 | if (time && time < LOG_INTERVAL) { |
| 2283 | return diffCoord(e) / time; |
| 2284 | } |
| 2285 | } |
| 2286 | |
| 2287 | return 0; |
| 2288 | } |
| 2289 | |
| 2290 | function computeDestination(velocity) { |
| 2291 | return getPosition() + sign(velocity) * min(abs(velocity) * (options.flickPower || 600), isFree ? Infinity : Components2.Layout.listSize() * (options.flickMaxPages || 1)); |
| 2292 | } |
| 2293 | |
| 2294 | function diffCoord(e, orthogonal) { |
| 2295 | return coordOf(e, orthogonal) - coordOf(getBaseEvent(e), orthogonal); |
| 2296 | } |
| 2297 | |
| 2298 | function diffTime(e) { |
| 2299 | return timeOf(e) - timeOf(getBaseEvent(e)); |
| 2300 | } |
| 2301 | |
| 2302 | function getBaseEvent(e) { |
| 2303 | return baseEvent === e && prevBaseEvent || baseEvent; |
| 2304 | } |
| 2305 | |
| 2306 | function coordOf(e, orthogonal) { |
| 2307 | return (isTouchEvent(e) ? e.changedTouches[0] : e)["page" + resolve(orthogonal ? "Y" : "X")]; |
| 2308 | } |
| 2309 | |
| 2310 | function constrain(diff) { |
| 2311 | return diff / (exceeded && Splide2.is(SLIDE) ? FRICTION : 1); |
| 2312 | } |
| 2313 | |
| 2314 | function isDraggable(target2) { |
| 2315 | var noDrag = options.noDrag; |
| 2316 | return !matches(target2, "." + CLASS_PAGINATION_PAGE + ", ." + CLASS_ARROW) && (!noDrag || !matches(target2, noDrag)); |
| 2317 | } |
| 2318 | |
| 2319 | function isTouchEvent(e) { |
| 2320 | return typeof TouchEvent !== "undefined" && e instanceof TouchEvent; |
| 2321 | } |
| 2322 | |
| 2323 | function isDragging() { |
| 2324 | return dragging; |
| 2325 | } |
| 2326 | |
| 2327 | function disable(value) { |
| 2328 | disabled = value; |
| 2329 | } |
| 2330 | |
| 2331 | return { |
| 2332 | mount: mount, |
| 2333 | disable: disable, |
| 2334 | isDragging: isDragging |
| 2335 | }; |
| 2336 | } |
| 2337 | |
| 2338 | var NORMALIZATION_MAP = { |
| 2339 | Spacebar: " ", |
| 2340 | Right: ARROW_RIGHT, |
| 2341 | Left: ARROW_LEFT, |
| 2342 | Up: ARROW_UP, |
| 2343 | Down: ARROW_DOWN |
| 2344 | }; |
| 2345 | |
| 2346 | function normalizeKey(key) { |
| 2347 | key = isString(key) ? key : key.key; |
| 2348 | return NORMALIZATION_MAP[key] || key; |
| 2349 | } |
| 2350 | |
| 2351 | var KEYBOARD_EVENT = "keydown"; |
| 2352 | |
| 2353 | function Keyboard(Splide2, Components2, options) { |
| 2354 | var _EventInterface10 = EventInterface(Splide2), |
| 2355 | on = _EventInterface10.on, |
| 2356 | bind = _EventInterface10.bind, |
| 2357 | unbind = _EventInterface10.unbind; |
| 2358 | |
| 2359 | var root = Splide2.root; |
| 2360 | var resolve = Components2.Direction.resolve; |
| 2361 | var target; |
| 2362 | var disabled; |
| 2363 | |
| 2364 | function mount() { |
| 2365 | init(); |
| 2366 | on(EVENT_UPDATED, destroy); |
| 2367 | on(EVENT_UPDATED, init); |
| 2368 | on(EVENT_MOVE, onMove); |
| 2369 | } |
| 2370 | |
| 2371 | function init() { |
| 2372 | var keyboard = options.keyboard; |
| 2373 | |
| 2374 | if (keyboard) { |
| 2375 | target = keyboard === "global" ? window : root; |
| 2376 | bind(target, KEYBOARD_EVENT, onKeydown); |
| 2377 | } |
| 2378 | } |
| 2379 | |
| 2380 | function destroy() { |
| 2381 | unbind(target, KEYBOARD_EVENT); |
| 2382 | } |
| 2383 | |
| 2384 | function disable(value) { |
| 2385 | disabled = value; |
| 2386 | } |
| 2387 | |
| 2388 | function onMove() { |
| 2389 | var _disabled = disabled; |
| 2390 | disabled = true; |
| 2391 | nextTick(function () { |
| 2392 | disabled = _disabled; |
| 2393 | }); |
| 2394 | } |
| 2395 | |
| 2396 | function onKeydown(e) { |
| 2397 | if (!disabled) { |
| 2398 | var key = normalizeKey(e); |
| 2399 | |
| 2400 | if (key === resolve(ARROW_LEFT)) { |
| 2401 | Splide2.go("<"); |
| 2402 | } else if (key === resolve(ARROW_RIGHT)) { |
| 2403 | Splide2.go(">"); |
| 2404 | } |
| 2405 | } |
| 2406 | } |
| 2407 | |
| 2408 | return { |
| 2409 | mount: mount, |
| 2410 | destroy: destroy, |
| 2411 | disable: disable |
| 2412 | }; |
| 2413 | } |
| 2414 | |
| 2415 | var SRC_DATA_ATTRIBUTE = DATA_ATTRIBUTE + "-lazy"; |
| 2416 | var SRCSET_DATA_ATTRIBUTE = SRC_DATA_ATTRIBUTE + "-srcset"; |
| 2417 | var IMAGE_SELECTOR = "[" + SRC_DATA_ATTRIBUTE + "], [" + SRCSET_DATA_ATTRIBUTE + "]"; |
| 2418 | |
| 2419 | function LazyLoad(Splide2, Components2, options) { |
| 2420 | var _EventInterface11 = EventInterface(Splide2), |
| 2421 | on = _EventInterface11.on, |
| 2422 | off = _EventInterface11.off, |
| 2423 | bind = _EventInterface11.bind, |
| 2424 | emit = _EventInterface11.emit; |
| 2425 | |
| 2426 | var isSequential = options.lazyLoad === "sequential"; |
| 2427 | var events = [EVENT_MOVED, EVENT_SCROLLED]; |
| 2428 | var entries = []; |
| 2429 | |
| 2430 | function mount() { |
| 2431 | if (options.lazyLoad) { |
| 2432 | init(); |
| 2433 | on(EVENT_REFRESH, init); |
| 2434 | } |
| 2435 | } |
| 2436 | |
| 2437 | function init() { |
| 2438 | empty(entries); |
| 2439 | register(); |
| 2440 | |
| 2441 | if (isSequential) { |
| 2442 | loadNext(); |
| 2443 | } else { |
| 2444 | off(events); |
| 2445 | on(events, check); |
| 2446 | check(); |
| 2447 | } |
| 2448 | } |
| 2449 | |
| 2450 | function register() { |
| 2451 | Components2.Slides.forEach(function (Slide) { |
| 2452 | queryAll(Slide.slide, IMAGE_SELECTOR).forEach(function (img) { |
| 2453 | var src = getAttribute(img, SRC_DATA_ATTRIBUTE); |
| 2454 | var srcset = getAttribute(img, SRCSET_DATA_ATTRIBUTE); |
| 2455 | |
| 2456 | if (src !== img.src || srcset !== img.srcset) { |
| 2457 | var className = options.classes.spinner; |
| 2458 | var parent = img.parentElement; |
| 2459 | var spinner = child(parent, "." + className) || create("span", className, parent); |
| 2460 | entries.push([img, Slide, spinner]); |
| 2461 | img.src || display(img, "none"); |
| 2462 | } |
| 2463 | }); |
| 2464 | }); |
| 2465 | } |
| 2466 | |
| 2467 | function check() { |
| 2468 | entries = entries.filter(function (data) { |
| 2469 | var distance = options.perPage * ((options.preloadPages || 1) + 1) - 1; |
| 2470 | return data[1].isWithin(Splide2.index, distance) ? load(data) : true; |
| 2471 | }); |
| 2472 | entries.length || off(events); |
| 2473 | } |
| 2474 | |
| 2475 | function load(data) { |
| 2476 | var img = data[0]; |
| 2477 | addClass(data[1].slide, CLASS_LOADING); |
| 2478 | bind(img, "load error", apply(onLoad, data)); |
| 2479 | setAttribute(img, "src", getAttribute(img, SRC_DATA_ATTRIBUTE)); |
| 2480 | setAttribute(img, "srcset", getAttribute(img, SRCSET_DATA_ATTRIBUTE)); |
| 2481 | removeAttribute(img, SRC_DATA_ATTRIBUTE); |
| 2482 | removeAttribute(img, SRCSET_DATA_ATTRIBUTE); |
| 2483 | } |
| 2484 | |
| 2485 | function onLoad(data, e) { |
| 2486 | var img = data[0], |
| 2487 | Slide = data[1]; |
| 2488 | removeClass(Slide.slide, CLASS_LOADING); |
| 2489 | |
| 2490 | if (e.type !== "error") { |
| 2491 | remove(data[2]); |
| 2492 | display(img, ""); |
| 2493 | emit(EVENT_LAZYLOAD_LOADED, img, Slide); |
| 2494 | emit(EVENT_RESIZE); |
| 2495 | } |
| 2496 | |
| 2497 | isSequential && loadNext(); |
| 2498 | } |
| 2499 | |
| 2500 | function loadNext() { |
| 2501 | entries.length && load(entries.shift()); |
| 2502 | } |
| 2503 | |
| 2504 | return { |
| 2505 | mount: mount, |
| 2506 | destroy: apply(empty, entries), |
| 2507 | check: check |
| 2508 | }; |
| 2509 | } |
| 2510 | |
| 2511 | function Pagination(Splide2, Components2, options) { |
| 2512 | var event = EventInterface(Splide2); |
| 2513 | var on = event.on, |
| 2514 | emit = event.emit, |
| 2515 | bind = event.bind; |
| 2516 | var Slides = Components2.Slides, |
| 2517 | Elements = Components2.Elements, |
| 2518 | Controller = Components2.Controller; |
| 2519 | var hasFocus = Controller.hasFocus, |
| 2520 | getIndex = Controller.getIndex, |
| 2521 | go = Controller.go; |
| 2522 | var resolve = Components2.Direction.resolve; |
| 2523 | var placeholder = Elements.pagination; |
| 2524 | var items = []; |
| 2525 | var list; |
| 2526 | var paginationClasses; |
| 2527 | |
| 2528 | function mount() { |
| 2529 | destroy(); |
| 2530 | on([EVENT_UPDATED, EVENT_REFRESH, EVENT_END_INDEX_CHANGED], mount); |
| 2531 | var enabled = options.pagination; |
| 2532 | placeholder && display(placeholder, enabled ? "" : "none"); |
| 2533 | |
| 2534 | if (enabled) { |
| 2535 | on([EVENT_MOVE, EVENT_SCROLL, EVENT_SCROLLED], update); |
| 2536 | createPagination(); |
| 2537 | update(); |
| 2538 | emit(EVENT_PAGINATION_MOUNTED, { |
| 2539 | list: list, |
| 2540 | items: items |
| 2541 | }, getAt(Splide2.index)); |
| 2542 | } |
| 2543 | } |
| 2544 | |
| 2545 | function destroy() { |
| 2546 | if (list) { |
| 2547 | remove(placeholder ? slice(list.children) : list); |
| 2548 | removeClass(list, paginationClasses); |
| 2549 | empty(items); |
| 2550 | list = null; |
| 2551 | } |
| 2552 | |
| 2553 | event.destroy(); |
| 2554 | } |
| 2555 | |
| 2556 | function createPagination() { |
| 2557 | var length = Splide2.length; |
| 2558 | var classes = options.classes, |
| 2559 | i18n = options.i18n, |
| 2560 | perPage = options.perPage; |
| 2561 | var max = hasFocus() ? Controller.getEnd() + 1 : ceil(length / perPage); |
| 2562 | list = placeholder || create("ul", classes.pagination, Elements.track.parentElement); |
| 2563 | addClass(list, paginationClasses = CLASS_PAGINATION + "--" + getDirection()); |
| 2564 | setAttribute(list, ROLE, "tablist"); |
| 2565 | setAttribute(list, ARIA_LABEL, i18n.select); |
| 2566 | setAttribute(list, ARIA_ORIENTATION, getDirection() === TTB ? "vertical" : ""); |
| 2567 | |
| 2568 | for (var i = 0; i < max; i++) { |
| 2569 | var li = create("li", null, list); |
| 2570 | var button = create("button", { |
| 2571 | class: classes.page, |
| 2572 | type: "button" |
| 2573 | }, li); |
| 2574 | var controls = Slides.getIn(i).map(function (Slide) { |
| 2575 | return Slide.slide.id; |
| 2576 | }); |
| 2577 | var text = !hasFocus() && perPage > 1 ? i18n.pageX : i18n.slideX; |
| 2578 | bind(button, "click", apply(onClick, i)); |
| 2579 | |
| 2580 | if (options.paginationKeyboard) { |
| 2581 | bind(button, "keydown", apply(onKeydown, i)); |
| 2582 | } |
| 2583 | |
| 2584 | setAttribute(li, ROLE, "presentation"); |
| 2585 | setAttribute(button, ROLE, "tab"); |
| 2586 | setAttribute(button, ARIA_CONTROLS, controls.join(" ")); |
| 2587 | setAttribute(button, ARIA_LABEL, format(text, i + 1)); |
| 2588 | setAttribute(button, TAB_INDEX, -1); |
| 2589 | items.push({ |
| 2590 | li: li, |
| 2591 | button: button, |
| 2592 | page: i |
| 2593 | }); |
| 2594 | } |
| 2595 | } |
| 2596 | |
| 2597 | function onClick(page) { |
| 2598 | go(">" + page, true); |
| 2599 | } |
| 2600 | |
| 2601 | function onKeydown(page, e) { |
| 2602 | var length = items.length; |
| 2603 | var key = normalizeKey(e); |
| 2604 | var dir = getDirection(); |
| 2605 | var nextPage = -1; |
| 2606 | |
| 2607 | if (key === resolve(ARROW_RIGHT, false, dir)) { |
| 2608 | nextPage = ++page % length; |
| 2609 | } else if (key === resolve(ARROW_LEFT, false, dir)) { |
| 2610 | nextPage = (--page + length) % length; |
| 2611 | } else if (key === "Home") { |
| 2612 | nextPage = 0; |
| 2613 | } else if (key === "End") { |
| 2614 | nextPage = length - 1; |
| 2615 | } |
| 2616 | |
| 2617 | var item = items[nextPage]; |
| 2618 | |
| 2619 | if (item) { |
| 2620 | focus(item.button); |
| 2621 | go(">" + nextPage); |
| 2622 | prevent(e, true); |
| 2623 | } |
| 2624 | } |
| 2625 | |
| 2626 | function getDirection() { |
| 2627 | return options.paginationDirection || options.direction; |
| 2628 | } |
| 2629 | |
| 2630 | function getAt(index) { |
| 2631 | return items[Controller.toPage(index)]; |
| 2632 | } |
| 2633 | |
| 2634 | function update() { |
| 2635 | var prev = getAt(getIndex(true)); |
| 2636 | var curr = getAt(getIndex()); |
| 2637 | |
| 2638 | if (prev) { |
| 2639 | var button = prev.button; |
| 2640 | removeClass(button, CLASS_ACTIVE); |
| 2641 | removeAttribute(button, ARIA_SELECTED); |
| 2642 | setAttribute(button, TAB_INDEX, -1); |
| 2643 | } |
| 2644 | |
| 2645 | if (curr) { |
| 2646 | var _button = curr.button; |
| 2647 | addClass(_button, CLASS_ACTIVE); |
| 2648 | setAttribute(_button, ARIA_SELECTED, true); |
| 2649 | setAttribute(_button, TAB_INDEX, ""); |
| 2650 | } |
| 2651 | |
| 2652 | emit(EVENT_PAGINATION_UPDATED, { |
| 2653 | list: list, |
| 2654 | items: items |
| 2655 | }, prev, curr); |
| 2656 | } |
| 2657 | |
| 2658 | return { |
| 2659 | items: items, |
| 2660 | mount: mount, |
| 2661 | destroy: destroy, |
| 2662 | getAt: getAt, |
| 2663 | update: update |
| 2664 | }; |
| 2665 | } |
| 2666 | |
| 2667 | var TRIGGER_KEYS = [" ", "Enter"]; |
| 2668 | |
| 2669 | function Sync(Splide2, Components2, options) { |
| 2670 | var isNavigation = options.isNavigation, |
| 2671 | slideFocus = options.slideFocus; |
| 2672 | var events = []; |
| 2673 | |
| 2674 | function mount() { |
| 2675 | Splide2.splides.forEach(function (target) { |
| 2676 | if (!target.isParent) { |
| 2677 | sync(Splide2, target.splide); |
| 2678 | sync(target.splide, Splide2); |
| 2679 | } |
| 2680 | }); |
| 2681 | |
| 2682 | if (isNavigation) { |
| 2683 | navigate(); |
| 2684 | } |
| 2685 | } |
| 2686 | |
| 2687 | function destroy() { |
| 2688 | events.forEach(function (event) { |
| 2689 | event.destroy(); |
| 2690 | }); |
| 2691 | empty(events); |
| 2692 | } |
| 2693 | |
| 2694 | function remount() { |
| 2695 | destroy(); |
| 2696 | mount(); |
| 2697 | } |
| 2698 | |
| 2699 | function sync(splide, target) { |
| 2700 | var event = EventInterface(splide); |
| 2701 | event.on(EVENT_MOVE, function (index, prev, dest) { |
| 2702 | target.go(target.is(LOOP) ? dest : index); |
| 2703 | }); |
| 2704 | events.push(event); |
| 2705 | } |
| 2706 | |
| 2707 | function navigate() { |
| 2708 | var event = EventInterface(Splide2); |
| 2709 | var on = event.on; |
| 2710 | on(EVENT_CLICK, onClick); |
| 2711 | on(EVENT_SLIDE_KEYDOWN, onKeydown); |
| 2712 | on([EVENT_MOUNTED, EVENT_UPDATED], update); |
| 2713 | events.push(event); |
| 2714 | event.emit(EVENT_NAVIGATION_MOUNTED, Splide2.splides); |
| 2715 | } |
| 2716 | |
| 2717 | function update() { |
| 2718 | setAttribute(Components2.Elements.list, ARIA_ORIENTATION, options.direction === TTB ? "vertical" : ""); |
| 2719 | } |
| 2720 | |
| 2721 | function onClick(Slide) { |
| 2722 | Splide2.go(Slide.index); |
| 2723 | } |
| 2724 | |
| 2725 | function onKeydown(Slide, e) { |
| 2726 | if (includes(TRIGGER_KEYS, normalizeKey(e))) { |
| 2727 | onClick(Slide); |
| 2728 | prevent(e); |
| 2729 | } |
| 2730 | } |
| 2731 | |
| 2732 | return { |
| 2733 | setup: apply(Components2.Media.set, { |
| 2734 | slideFocus: isUndefined(slideFocus) ? isNavigation : slideFocus |
| 2735 | }, true), |
| 2736 | mount: mount, |
| 2737 | destroy: destroy, |
| 2738 | remount: remount |
| 2739 | }; |
| 2740 | } |
| 2741 | |
| 2742 | function Wheel(Splide2, Components2, options) { |
| 2743 | var _EventInterface12 = EventInterface(Splide2), |
| 2744 | bind = _EventInterface12.bind; |
| 2745 | |
| 2746 | var lastTime = 0; |
| 2747 | |
| 2748 | function mount() { |
| 2749 | if (options.wheel) { |
| 2750 | bind(Components2.Elements.track, "wheel", onWheel, SCROLL_LISTENER_OPTIONS); |
| 2751 | } |
| 2752 | } |
| 2753 | |
| 2754 | function onWheel(e) { |
| 2755 | if (e.cancelable) { |
| 2756 | var deltaY = e.deltaY; |
| 2757 | var backwards = deltaY < 0; |
| 2758 | var timeStamp = timeOf(e); |
| 2759 | |
| 2760 | var _min = options.wheelMinThreshold || 0; |
| 2761 | |
| 2762 | var sleep = options.wheelSleep || 0; |
| 2763 | |
| 2764 | if (abs(deltaY) > _min && timeStamp - lastTime > sleep) { |
| 2765 | Splide2.go(backwards ? "<" : ">"); |
| 2766 | lastTime = timeStamp; |
| 2767 | } |
| 2768 | |
| 2769 | shouldPrevent(backwards) && prevent(e); |
| 2770 | } |
| 2771 | } |
| 2772 | |
| 2773 | function shouldPrevent(backwards) { |
| 2774 | return !options.releaseWheel || Splide2.state.is(MOVING) || Components2.Controller.getAdjacent(backwards) !== -1; |
| 2775 | } |
| 2776 | |
| 2777 | return { |
| 2778 | mount: mount |
| 2779 | }; |
| 2780 | } |
| 2781 | |
| 2782 | var SR_REMOVAL_DELAY = 90; |
| 2783 | |
| 2784 | function Live(Splide2, Components2, options) { |
| 2785 | var _EventInterface13 = EventInterface(Splide2), |
| 2786 | on = _EventInterface13.on; |
| 2787 | |
| 2788 | var track = Components2.Elements.track; |
| 2789 | var enabled = options.live && !options.isNavigation; |
| 2790 | var sr = create("span", CLASS_SR); |
| 2791 | var interval = RequestInterval(SR_REMOVAL_DELAY, apply(toggle, false)); |
| 2792 | |
| 2793 | function mount() { |
| 2794 | if (enabled) { |
| 2795 | disable(!Components2.Autoplay.isPaused()); |
| 2796 | setAttribute(track, ARIA_ATOMIC, true); |
| 2797 | sr.textContent = "\u2026"; |
| 2798 | on(EVENT_AUTOPLAY_PLAY, apply(disable, true)); |
| 2799 | on(EVENT_AUTOPLAY_PAUSE, apply(disable, false)); |
| 2800 | on([EVENT_MOVED, EVENT_SCROLLED], apply(toggle, true)); |
| 2801 | } |
| 2802 | } |
| 2803 | |
| 2804 | function toggle(active) { |
| 2805 | setAttribute(track, ARIA_BUSY, active); |
| 2806 | |
| 2807 | if (active) { |
| 2808 | append(track, sr); |
| 2809 | interval.start(); |
| 2810 | } else { |
| 2811 | remove(sr); |
| 2812 | interval.cancel(); |
| 2813 | } |
| 2814 | } |
| 2815 | |
| 2816 | function destroy() { |
| 2817 | removeAttribute(track, [ARIA_LIVE, ARIA_ATOMIC, ARIA_BUSY]); |
| 2818 | remove(sr); |
| 2819 | } |
| 2820 | |
| 2821 | function disable(disabled) { |
| 2822 | if (enabled) { |
| 2823 | setAttribute(track, ARIA_LIVE, disabled ? "off" : "polite"); |
| 2824 | } |
| 2825 | } |
| 2826 | |
| 2827 | return { |
| 2828 | mount: mount, |
| 2829 | disable: disable, |
| 2830 | destroy: destroy |
| 2831 | }; |
| 2832 | } |
| 2833 | |
| 2834 | var ComponentConstructors = /*#__PURE__*/Object.freeze({ |
| 2835 | __proto__: null, |
| 2836 | Media: Media, |
| 2837 | Direction: Direction, |
| 2838 | Elements: Elements, |
| 2839 | Slides: Slides, |
| 2840 | Layout: Layout, |
| 2841 | Clones: Clones, |
| 2842 | Move: Move, |
| 2843 | Controller: Controller, |
| 2844 | Arrows: Arrows, |
| 2845 | Autoplay: Autoplay, |
| 2846 | Cover: Cover, |
| 2847 | Scroll: Scroll, |
| 2848 | Drag: Drag, |
| 2849 | Keyboard: Keyboard, |
| 2850 | LazyLoad: LazyLoad, |
| 2851 | Pagination: Pagination, |
| 2852 | Sync: Sync, |
| 2853 | Wheel: Wheel, |
| 2854 | Live: Live |
| 2855 | }); |
| 2856 | var I18N = { |
| 2857 | prev: "Previous slide", |
| 2858 | next: "Next slide", |
| 2859 | first: "Go to first slide", |
| 2860 | last: "Go to last slide", |
| 2861 | slideX: "Go to slide %s", |
| 2862 | pageX: "Go to page %s", |
| 2863 | play: "Start autoplay", |
| 2864 | pause: "Pause autoplay", |
| 2865 | carousel: "carousel", |
| 2866 | slide: "slide", |
| 2867 | select: "Select a slide to show", |
| 2868 | slideLabel: "%s of %s" |
| 2869 | }; |
| 2870 | var DEFAULTS = { |
| 2871 | type: "slide", |
| 2872 | role: "region", |
| 2873 | speed: 400, |
| 2874 | perPage: 1, |
| 2875 | cloneStatus: true, |
| 2876 | arrows: true, |
| 2877 | pagination: true, |
| 2878 | paginationKeyboard: true, |
| 2879 | interval: 5e3, |
| 2880 | pauseOnHover: true, |
| 2881 | pauseOnFocus: true, |
| 2882 | resetProgress: true, |
| 2883 | easing: "cubic-bezier(0.25, 1, 0.5, 1)", |
| 2884 | drag: true, |
| 2885 | direction: "ltr", |
| 2886 | trimSpace: true, |
| 2887 | focusableNodes: "a, button, textarea, input, select, iframe", |
| 2888 | live: true, |
| 2889 | classes: CLASSES, |
| 2890 | i18n: I18N, |
| 2891 | reducedMotion: { |
| 2892 | speed: 0, |
| 2893 | rewindSpeed: 0, |
| 2894 | autoplay: "pause" |
| 2895 | } |
| 2896 | }; |
| 2897 | |
| 2898 | function Fade(Splide2, Components2, options) { |
| 2899 | var Slides = Components2.Slides; |
| 2900 | |
| 2901 | function mount() { |
| 2902 | EventInterface(Splide2).on([EVENT_MOUNTED, EVENT_REFRESH], init); |
| 2903 | } |
| 2904 | |
| 2905 | function init() { |
| 2906 | Slides.forEach(function (Slide) { |
| 2907 | Slide.style("transform", "translateX(-" + 100 * Slide.index + "%)"); |
| 2908 | }); |
| 2909 | } |
| 2910 | |
| 2911 | function start(index, done) { |
| 2912 | Slides.style("transition", "opacity " + options.speed + "ms " + options.easing); |
| 2913 | nextTick(done); |
| 2914 | } |
| 2915 | |
| 2916 | return { |
| 2917 | mount: mount, |
| 2918 | start: start, |
| 2919 | cancel: noop |
| 2920 | }; |
| 2921 | } |
| 2922 | |
| 2923 | function Slide(Splide2, Components2, options) { |
| 2924 | var Move = Components2.Move, |
| 2925 | Controller = Components2.Controller, |
| 2926 | Scroll = Components2.Scroll; |
| 2927 | var list = Components2.Elements.list; |
| 2928 | var transition = apply(style, list, "transition"); |
| 2929 | var endCallback; |
| 2930 | |
| 2931 | function mount() { |
| 2932 | EventInterface(Splide2).bind(list, "transitionend", function (e) { |
| 2933 | if (e.target === list && endCallback) { |
| 2934 | cancel(); |
| 2935 | endCallback(); |
| 2936 | } |
| 2937 | }); |
| 2938 | } |
| 2939 | |
| 2940 | function start(index, done) { |
| 2941 | var destination = Move.toPosition(index, true); |
| 2942 | var position = Move.getPosition(); |
| 2943 | var speed = getSpeed(index); |
| 2944 | |
| 2945 | if (abs(destination - position) >= 1 && speed >= 1) { |
| 2946 | if (options.useScroll) { |
| 2947 | Scroll.scroll(destination, speed, false, done); |
| 2948 | } else { |
| 2949 | transition("transform " + speed + "ms " + options.easing); |
| 2950 | Move.translate(destination, true); |
| 2951 | endCallback = done; |
| 2952 | } |
| 2953 | } else { |
| 2954 | Move.jump(index); |
| 2955 | done(); |
| 2956 | } |
| 2957 | } |
| 2958 | |
| 2959 | function cancel() { |
| 2960 | transition(""); |
| 2961 | Scroll.cancel(); |
| 2962 | } |
| 2963 | |
| 2964 | function getSpeed(index) { |
| 2965 | var rewindSpeed = options.rewindSpeed; |
| 2966 | |
| 2967 | if (Splide2.is(SLIDE) && rewindSpeed) { |
| 2968 | var prev = Controller.getIndex(true); |
| 2969 | var end = Controller.getEnd(); |
| 2970 | |
| 2971 | if (prev === 0 && index >= end || prev >= end && index === 0) { |
| 2972 | return rewindSpeed; |
| 2973 | } |
| 2974 | } |
| 2975 | |
| 2976 | return options.speed; |
| 2977 | } |
| 2978 | |
| 2979 | return { |
| 2980 | mount: mount, |
| 2981 | start: start, |
| 2982 | cancel: cancel |
| 2983 | }; |
| 2984 | } |
| 2985 | |
| 2986 | var _Splide = /*#__PURE__*/function () { |
| 2987 | function _Splide(target, options) { |
| 2988 | this.event = EventInterface(); |
| 2989 | this.Components = {}; |
| 2990 | this.state = State(CREATED); |
| 2991 | this.splides = []; |
| 2992 | this._o = {}; |
| 2993 | this._E = {}; |
| 2994 | var root = isString(target) ? query(document, target) : target; |
| 2995 | assert(root, root + " is invalid."); |
| 2996 | this.root = root; |
| 2997 | options = merge({ |
| 2998 | label: getAttribute(root, ARIA_LABEL) || "", |
| 2999 | labelledby: getAttribute(root, ARIA_LABELLEDBY) || "" |
| 3000 | }, DEFAULTS, _Splide.defaults, options || {}); |
| 3001 | |
| 3002 | try { |
| 3003 | merge(options, JSON.parse(getAttribute(root, DATA_ATTRIBUTE))); |
| 3004 | } catch (e) { |
| 3005 | assert(false, "Invalid JSON"); |
| 3006 | } |
| 3007 | |
| 3008 | this._o = Object.create(merge({}, options)); |
| 3009 | } |
| 3010 | |
| 3011 | var _proto = _Splide.prototype; |
| 3012 | |
| 3013 | _proto.mount = function mount(Extensions, Transition) { |
| 3014 | var _this = this; |
| 3015 | |
| 3016 | var state = this.state, |
| 3017 | Components2 = this.Components; |
| 3018 | assert(state.is([CREATED, DESTROYED]), "Already mounted!"); |
| 3019 | state.set(CREATED); |
| 3020 | this._C = Components2; |
| 3021 | this._T = Transition || this._T || (this.is(FADE) ? Fade : Slide); |
| 3022 | this._E = Extensions || this._E; |
| 3023 | var Constructors = assign({}, ComponentConstructors, this._E, { |
| 3024 | Transition: this._T |
| 3025 | }); |
| 3026 | forOwn(Constructors, function (Component, key) { |
| 3027 | var component = Component(_this, Components2, _this._o); |
| 3028 | Components2[key] = component; |
| 3029 | component.setup && component.setup(); |
| 3030 | }); |
| 3031 | forOwn(Components2, function (component) { |
| 3032 | component.mount && component.mount(); |
| 3033 | }); |
| 3034 | this.emit(EVENT_MOUNTED); |
| 3035 | addClass(this.root, CLASS_INITIALIZED); |
| 3036 | state.set(IDLE); |
| 3037 | this.emit(EVENT_READY); |
| 3038 | return this; |
| 3039 | }; |
| 3040 | |
| 3041 | _proto.sync = function sync(splide) { |
| 3042 | this.splides.push({ |
| 3043 | splide: splide |
| 3044 | }); |
| 3045 | splide.splides.push({ |
| 3046 | splide: this, |
| 3047 | isParent: true |
| 3048 | }); |
| 3049 | |
| 3050 | if (this.state.is(IDLE)) { |
| 3051 | this._C.Sync.remount(); |
| 3052 | |
| 3053 | splide.Components.Sync.remount(); |
| 3054 | } |
| 3055 | |
| 3056 | return this; |
| 3057 | }; |
| 3058 | |
| 3059 | _proto.go = function go(control) { |
| 3060 | this._C.Controller.go(control); |
| 3061 | |
| 3062 | return this; |
| 3063 | }; |
| 3064 | |
| 3065 | _proto.on = function on(events, callback) { |
| 3066 | this.event.on(events, callback); |
| 3067 | return this; |
| 3068 | }; |
| 3069 | |
| 3070 | _proto.off = function off(events) { |
| 3071 | this.event.off(events); |
| 3072 | return this; |
| 3073 | }; |
| 3074 | |
| 3075 | _proto.emit = function emit(event) { |
| 3076 | var _this$event; |
| 3077 | |
| 3078 | (_this$event = this.event).emit.apply(_this$event, [event].concat(slice(arguments, 1))); |
| 3079 | |
| 3080 | return this; |
| 3081 | }; |
| 3082 | |
| 3083 | _proto.add = function add(slides, index) { |
| 3084 | this._C.Slides.add(slides, index); |
| 3085 | |
| 3086 | return this; |
| 3087 | }; |
| 3088 | |
| 3089 | _proto.remove = function remove(matcher) { |
| 3090 | this._C.Slides.remove(matcher); |
| 3091 | |
| 3092 | return this; |
| 3093 | }; |
| 3094 | |
| 3095 | _proto.is = function is(type) { |
| 3096 | return this._o.type === type; |
| 3097 | }; |
| 3098 | |
| 3099 | _proto.refresh = function refresh() { |
| 3100 | this.emit(EVENT_REFRESH); |
| 3101 | return this; |
| 3102 | }; |
| 3103 | |
| 3104 | _proto.destroy = function destroy(completely) { |
| 3105 | if (completely === void 0) { |
| 3106 | completely = true; |
| 3107 | } |
| 3108 | |
| 3109 | var event = this.event, |
| 3110 | state = this.state; |
| 3111 | |
| 3112 | if (state.is(CREATED)) { |
| 3113 | EventInterface(this).on(EVENT_READY, this.destroy.bind(this, completely)); |
| 3114 | } else { |
| 3115 | forOwn(this._C, function (component) { |
| 3116 | component.destroy && component.destroy(completely); |
| 3117 | }, true); |
| 3118 | event.emit(EVENT_DESTROY); |
| 3119 | event.destroy(); |
| 3120 | completely && empty(this.splides); |
| 3121 | state.set(DESTROYED); |
| 3122 | } |
| 3123 | |
| 3124 | return this; |
| 3125 | }; |
| 3126 | |
| 3127 | _createClass(_Splide, [{ |
| 3128 | key: "options", |
| 3129 | get: function get() { |
| 3130 | return this._o; |
| 3131 | }, |
| 3132 | set: function set(options) { |
| 3133 | this._C.Media.set(options, true, true); |
| 3134 | } |
| 3135 | }, { |
| 3136 | key: "length", |
| 3137 | get: function get() { |
| 3138 | return this._C.Slides.getLength(true); |
| 3139 | } |
| 3140 | }, { |
| 3141 | key: "index", |
| 3142 | get: function get() { |
| 3143 | return this._C.Controller.getIndex(); |
| 3144 | } |
| 3145 | }]); |
| 3146 | |
| 3147 | return _Splide; |
| 3148 | }(); |
| 3149 | |
| 3150 | var Splide = _Splide; |
| 3151 | Splide.defaults = {}; |
| 3152 | Splide.STATES = STATES; |
| 3153 | return Splide; |
| 3154 | }); |
| 3155 |