Jānis Skarnelis
3 years ago
22 changed files with 212 additions and 65 deletions
@ -0,0 +1,2 @@ |
|||
// @fancyapps/ui/Carousel.Autoplay v4.0.0-beta.1
|
|||
class t{constructor(t){this.carousel=t,this.state="ready";for(const t of["onReady","onSettle","onMouseEnter","onMouseLeave"])this[t]=this[t].bind(this);this.events={ready:this.onReady,settle:this.onSettle}}onReady(){this.start()}onSettle(){"play"===this.state&&this.set()}onMouseEnter(){"play"===this.state&&(this.state="pause",this.clear())}onMouseLeave(){"pause"===this.state&&(this.state="play",this.set())}set(){this.clear(),this.timer=setTimeout((()=>{"play"===this.state&&this.carousel.slideTo(this.carousel.pageIndex+1)}),this.carousel.option("Autoplay.timeout"))}clear(){this.timer&&(clearTimeout(this.timer),this.timer=null)}start(){this.set(),this.state="play",this.carousel.option("Autoplay.hoverPause")&&(this.carousel.$container.addEventListener("mouseenter",this.onMouseEnter,!1),this.carousel.$container.addEventListener("mouseleave",this.onMouseLeave,!1))}stop(){this.clear(),this.state="ready",this.carousel.$container.removeEventListener("mouseenter",this.onMouseEnter,!1),this.carousel.$container.removeEventListener("mouseleave",this.onMouseLeave,!1)}attach(){this.carousel.on(this.events)}detach(){this.stop(),this.carousel.off(this.events),this.carousel=null}}var e;t.defaults={timeout:3e3,hoverPause:!0},"undefined"!=typeof Carousel&&("object"==typeof(e=Carousel.Plugins)&&null!==e&&e.constructor===Object&&"[object Object]"===Object.prototype.toString.call(e))&&(Carousel.Plugins.Autoplay=t);export{t as Autoplay}; |
|||
@ -0,0 +1,2 @@ |
|||
// @fancyapps/ui/Carousel.Autoplay v4.0.0-beta.1
|
|||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).window=e.window||{})}(this,(function(e){"use strict";function t(e){return(t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function o(e,t){for(var o=0;o<t.length;o++){var n=t[o];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}var n,s=function(){function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),this.carousel=t,this.state="ready";for(var o=0,n=["onReady","onSettle","onMouseEnter","onMouseLeave"];o<n.length;o++){var s=n[o];this[s]=this[s].bind(this)}this.events={ready:this.onReady,settle:this.onSettle}}var t,n,s;return t=e,(n=[{key:"onReady",value:function(){this.start()}},{key:"onSettle",value:function(){"play"===this.state&&this.set()}},{key:"onMouseEnter",value:function(){"play"===this.state&&(this.state="pause",this.clear())}},{key:"onMouseLeave",value:function(){"pause"===this.state&&(this.state="play",this.set())}},{key:"set",value:function(){var e=this;this.clear(),this.timer=setTimeout((function(){"play"===e.state&&e.carousel.slideTo(e.carousel.pageIndex+1)}),this.carousel.option("Autoplay.timeout"))}},{key:"clear",value:function(){this.timer&&(clearTimeout(this.timer),this.timer=null)}},{key:"start",value:function(){this.set(),this.state="play",this.carousel.option("Autoplay.hoverPause")&&(this.carousel.$container.addEventListener("mouseenter",this.onMouseEnter,!1),this.carousel.$container.addEventListener("mouseleave",this.onMouseLeave,!1))}},{key:"stop",value:function(){this.clear(),this.state="ready",this.carousel.$container.removeEventListener("mouseenter",this.onMouseEnter,!1),this.carousel.$container.removeEventListener("mouseleave",this.onMouseLeave,!1)}},{key:"attach",value:function(){this.carousel.on(this.events)}},{key:"detach",value:function(){this.stop(),this.carousel.off(this.events),this.carousel=null}}])&&o(t.prototype,n),s&&o(t,s),e}();s.defaults={timeout:3e3,hoverPause:!0},"undefined"!=typeof Carousel&&("object"===t(n=Carousel.Plugins)&&null!==n&&n.constructor===Object&&"[object Object]"===Object.prototype.toString.call(n))&&(Carousel.Plugins.Autoplay=s),e.Autoplay=s})); |
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1,2 +1,2 @@ |
|||
// @fancyapps/ui/Panzoom.Controls v4.0.0-beta.1
|
|||
class t{constructor(t){this.panzoom=t,this.$container=null}addButton(t,o=!1){const n=document.createElement("button");return n.setAttribute("title",this.panzoom.localize(`{{CONTROLS.${t.toUpperCase()}}}`)),n.classList.add("panzoom__button"),n.classList.add(`panzoom__button--${t}`),n.innerHTML=this.panzoom.localize(this.panzoom.option(`Controls.tpl.${t}`,"")),o&&n.addEventListener("click",(o=>{o.stopPropagation(),this.panzoom[t]()})),this.$container.appendChild(n),n}createContainer(){if(this.$container||!this.panzoom.option("zoom"))return;const t=document.createElement("div");t.classList.add("panzoom__controls"),this.$container=this.panzoom.$container.appendChild(t);for(const t of this.panzoom.option("Controls.buttons",[]))this.addButton(t,!0)}removeContainer(){this.$container&&(this.$container.remove(),this.$container=null)}attach(){this.createContainer()}detach(){this.removeContainer()}}t.defaults={l10n:{ZOOMIN:"Zoom in",ZOOMOUT:"Zoom out"},buttons:["zoomIn","zoomOut"],tpl:{zoomIn:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 4V20M20 12L4 12" /></svg>',zoomOut:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20 12H4" /></svg>'}};export{t as Controls}; |
|||
class t{constructor(t){this.panzoom=t,this.$container=null}addButton(t,o=!1){const n=document.createElement("button");return n.setAttribute("title",this.panzoom.localize(`{{CONTROLS.${t.toUpperCase()}}}`)),n.classList.add("panzoom__button"),n.classList.add(`panzoom__button--${t}`),n.innerHTML=this.panzoom.localize(this.panzoom.option(`Controls.tpl.${t}`,"")),o&&n.addEventListener("click",(o=>{o.stopPropagation(),this.panzoom[t]()})),this.$container.appendChild(n),n}createContainer(){if(this.$container||!this.panzoom.option("zoom"))return;const t=document.createElement("div");t.classList.add("panzoom__controls"),this.$container=this.panzoom.$container.appendChild(t);for(const t of this.panzoom.option("Controls.buttons",[]))this.addButton(t,!0)}removeContainer(){this.$container&&(this.$container.remove(),this.$container=null)}attach(){this.createContainer()}detach(){this.removeContainer()}}var o;t.defaults={l10n:{ZOOMIN:"Zoom in",ZOOMOUT:"Zoom out"},buttons:["zoomIn","zoomOut"],tpl:{zoomIn:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 4V20M20 12L4 12" /></svg>',zoomOut:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20 12H4" /></svg>'}},"undefined"!=typeof Panzoom&&("object"==typeof(o=Panzoom.Plugins)&&null!==o&&o.constructor===Object&&"[object Object]"===Object.prototype.toString.call(o))&&(Panzoom.Plugins.Controls=t);export{t as Controls}; |
|||
|
|||
@ -1,2 +1,2 @@ |
|||
// @fancyapps/ui/Panzoom.Controls v4.0.0-beta.1
|
|||
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((t="undefined"!=typeof globalThis?globalThis:t||self).window=t.window||{})}(this,(function(t){"use strict";function n(t,n){for(var o=0;o<n.length;o++){var e=n[o];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}function o(t,n){(null==n||n>t.length)&&(n=t.length);for(var o=0,e=new Array(n);o<n;o++)e[o]=t[o];return e}function e(t,n){var e="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!e){if(Array.isArray(t)||(e=function(t,n){if(t){if("string"==typeof t)return o(t,n);var e=Object.prototype.toString.call(t).slice(8,-1);return"Object"===e&&t.constructor&&(e=t.constructor.name),"Map"===e||"Set"===e?Array.from(t):"Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)?o(t,n):void 0}}(t))||n&&t&&"number"==typeof t.length){e&&(t=e);var r=0,i=function(){};return{s:i,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:i}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,c=!0,l=!1;return{s:function(){e=e.call(t)},n:function(){var t=e.next();return c=t.done,t},e:function(t){l=!0,a=t},f:function(){try{c||null==e.return||e.return()}finally{if(l)throw a}}}}var r=function(){function t(n){!function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}(this,t),this.panzoom=n,this.$container=null}var o,r,i;return o=t,(r=[{key:"addButton",value:function(t){var n=this,o=arguments.length>1&&void 0!==arguments[1]&&arguments[1],e=document.createElement("button");return e.setAttribute("title",this.panzoom.localize("{{CONTROLS.".concat(t.toUpperCase(),"}}"))),e.classList.add("panzoom__button"),e.classList.add("panzoom__button--".concat(t)),e.innerHTML=this.panzoom.localize(this.panzoom.option("Controls.tpl.".concat(t),"")),o&&e.addEventListener("click",(function(o){o.stopPropagation(),n.panzoom[t]()})),this.$container.appendChild(e),e}},{key:"createContainer",value:function(){if(!this.$container&&this.panzoom.option("zoom")){var t=document.createElement("div");t.classList.add("panzoom__controls"),this.$container=this.panzoom.$container.appendChild(t);var n,o=e(this.panzoom.option("Controls.buttons",[]));try{for(o.s();!(n=o.n()).done;){var r=n.value;this.addButton(r,!0)}}catch(t){o.e(t)}finally{o.f()}}}},{key:"removeContainer",value:function(){this.$container&&(this.$container.remove(),this.$container=null)}},{key:"attach",value:function(){this.createContainer()}},{key:"detach",value:function(){this.removeContainer()}}])&&n(o.prototype,r),i&&n(o,i),t}();r.defaults={l10n:{ZOOMIN:"Zoom in",ZOOMOUT:"Zoom out"},buttons:["zoomIn","zoomOut"],tpl:{zoomIn:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 4V20M20 12L4 12" /></svg>',zoomOut:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20 12H4" /></svg>'}},t.Controls=r})); |
|||
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((t="undefined"!=typeof globalThis?globalThis:t||self).window=t.window||{})}(this,(function(t){"use strict";function n(t){return(n="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function o(t,n){for(var o=0;o<n.length;o++){var e=n[o];e.enumerable=e.enumerable||!1,e.configurable=!0,"value"in e&&(e.writable=!0),Object.defineProperty(t,e.key,e)}}function e(t,n){(null==n||n>t.length)&&(n=t.length);for(var o=0,e=new Array(n);o<n;o++)e[o]=t[o];return e}function r(t,n){var o="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!o){if(Array.isArray(t)||(o=function(t,n){if(t){if("string"==typeof t)return e(t,n);var o=Object.prototype.toString.call(t).slice(8,-1);return"Object"===o&&t.constructor&&(o=t.constructor.name),"Map"===o||"Set"===o?Array.from(t):"Arguments"===o||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(o)?e(t,n):void 0}}(t))||n&&t&&"number"==typeof t.length){o&&(t=o);var r=0,i=function(){};return{s:i,n:function(){return r>=t.length?{done:!0}:{done:!1,value:t[r++]}},e:function(t){throw t},f:i}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,c=!0,l=!1;return{s:function(){o=o.call(t)},n:function(){var t=o.next();return c=t.done,t},e:function(t){l=!0,a=t},f:function(){try{c||null==o.return||o.return()}finally{if(l)throw a}}}}var i,a=function(){function t(n){!function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}(this,t),this.panzoom=n,this.$container=null}var n,e,i;return n=t,(e=[{key:"addButton",value:function(t){var n=this,o=arguments.length>1&&void 0!==arguments[1]&&arguments[1],e=document.createElement("button");return e.setAttribute("title",this.panzoom.localize("{{CONTROLS.".concat(t.toUpperCase(),"}}"))),e.classList.add("panzoom__button"),e.classList.add("panzoom__button--".concat(t)),e.innerHTML=this.panzoom.localize(this.panzoom.option("Controls.tpl.".concat(t),"")),o&&e.addEventListener("click",(function(o){o.stopPropagation(),n.panzoom[t]()})),this.$container.appendChild(e),e}},{key:"createContainer",value:function(){if(!this.$container&&this.panzoom.option("zoom")){var t=document.createElement("div");t.classList.add("panzoom__controls"),this.$container=this.panzoom.$container.appendChild(t);var n,o=r(this.panzoom.option("Controls.buttons",[]));try{for(o.s();!(n=o.n()).done;){var e=n.value;this.addButton(e,!0)}}catch(t){o.e(t)}finally{o.f()}}}},{key:"removeContainer",value:function(){this.$container&&(this.$container.remove(),this.$container=null)}},{key:"attach",value:function(){this.createContainer()}},{key:"detach",value:function(){this.removeContainer()}}])&&o(n.prototype,e),i&&o(n,i),t}();a.defaults={l10n:{ZOOMIN:"Zoom in",ZOOMOUT:"Zoom out"},buttons:["zoomIn","zoomOut"],tpl:{zoomIn:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12 4V20M20 12L4 12" /></svg>',zoomOut:'<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20 12H4" /></svg>'}},"undefined"!=typeof Panzoom&&("object"===n(i=Panzoom.Plugins)&&null!==i&&i.constructor===Object&&"[object Object]"===Object.prototype.toString.call(i))&&(Panzoom.Plugins.Controls=a),t.Controls=a})); |
|||
|
|||
@ -1 +1 @@ |
|||
.panzoom{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.panzoom__viewport{position:relative;width:100%;height:100%;min-height:1px;margin:auto}.panzoom__content{max-width:100%;max-height:100%;object-fit:contain;transform:translate3d(0, 0, 0) scale(1);transform-origin:0 0;transition:unset;touch-action:none;user-select:none}.is-draggable{cursor:move;cursor:grab}.is-dragging{cursor:grabbing} |
|||
.panzoom{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.panzoom__viewport{position:relative;width:100%;height:100%;min-height:1px;margin:auto}.panzoom__content{max-width:100%;max-height:100%;object-fit:contain;transform:translate3d(0, 0, 0) scale(1);transform-origin:0 0;transition:none;touch-action:none;user-select:none}.is-draggable{cursor:move;cursor:grab}.is-dragging{cursor:grabbing} |
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,99 @@ |
|||
import { isPlainObject } from "../../../shared/utils/isPlainObject.js"; |
|||
|
|||
const defaults = { |
|||
timeout: 3000, |
|||
hoverPause: true, |
|||
}; |
|||
|
|||
export class Autoplay { |
|||
constructor(carousel) { |
|||
this.carousel = carousel; |
|||
this.state = "ready"; |
|||
|
|||
for (const methodName of ["onReady", "onSettle", "onMouseEnter", "onMouseLeave"]) { |
|||
this[methodName] = this[methodName].bind(this); |
|||
} |
|||
|
|||
this.events = { |
|||
ready: this.onReady, |
|||
settle: this.onSettle, |
|||
}; |
|||
} |
|||
|
|||
onReady() { |
|||
this.start(); |
|||
} |
|||
|
|||
onSettle() { |
|||
if (this.state === "play") { |
|||
this.set(); |
|||
} |
|||
} |
|||
|
|||
onMouseEnter() { |
|||
if (this.state === "play") { |
|||
this.state = "pause"; |
|||
this.clear(); |
|||
} |
|||
} |
|||
|
|||
onMouseLeave() { |
|||
if (this.state === "pause") { |
|||
this.state = "play"; |
|||
this.set(); |
|||
} |
|||
} |
|||
|
|||
set() { |
|||
this.clear(); |
|||
|
|||
this.timer = setTimeout(() => { |
|||
if (this.state === "play") { |
|||
this.carousel.slideTo(this.carousel.pageIndex + 1); |
|||
} |
|||
}, this.carousel.option("Autoplay.timeout")); |
|||
} |
|||
|
|||
clear() { |
|||
if (this.timer) { |
|||
clearTimeout(this.timer); |
|||
this.timer = null; |
|||
} |
|||
} |
|||
|
|||
start() { |
|||
this.set(); |
|||
this.state = "play"; |
|||
|
|||
if (this.carousel.option("Autoplay.hoverPause")) { |
|||
this.carousel.$container.addEventListener("mouseenter", this.onMouseEnter, false); |
|||
this.carousel.$container.addEventListener("mouseleave", this.onMouseLeave, false); |
|||
} |
|||
} |
|||
|
|||
stop() { |
|||
this.clear(); |
|||
this.state = "ready"; |
|||
|
|||
this.carousel.$container.removeEventListener("mouseenter", this.onMouseEnter, false); |
|||
this.carousel.$container.removeEventListener("mouseleave", this.onMouseLeave, false); |
|||
} |
|||
|
|||
attach() { |
|||
this.carousel.on(this.events); |
|||
} |
|||
|
|||
detach() { |
|||
this.stop(); |
|||
|
|||
this.carousel.off(this.events); |
|||
this.carousel = null; |
|||
} |
|||
} |
|||
|
|||
// Expose defaults
|
|||
Autoplay.defaults = defaults; |
|||
|
|||
if (typeof Carousel !== "undefined" && isPlainObject(Carousel.Plugins)) { |
|||
Carousel.Plugins.Autoplay = Autoplay; |
|||
} |
|||
Loading…
Reference in new issue