@fancyapps/ui/dist/carousel/carousel.toolbar.js

Robust JavaScript UI Component Library

/*! License details at fancyapps.com/license */
import{isPlainObject as t}from"../utils/isPlainObject.js";import{isString as e}from"../utils/isString.js";import{stringToHtml as o}from"../utils/strToHtml.js";import{PanzoomButtons as n}from"../shared/buttons.js";import{extend as i}from"../utils/extend.js";import{addClass as l}from"../utils/addClass.js";import{removeClass as a}from"../utils/removeClass.js";var s;!function(t){t.Left="left",t.middle="middle",t.right="right"}(s||(s={}));const r={counter:{tpl:'<div class="f-counter"><span data-carousel-page></span>/<span data-carousel-pages></span></div>'},download:{tpl:'<button data-carousel-download class="f-button" title="{{DOWNLOAD}}"><svg><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2M7 11l5 5 5-5M12 4v12"/></svg></button>'},autoplay:{tpl:'<button data-autoplay-action="toggle" class="f-button" title="{{TOGGLE_AUTOPLAY}}"><svg><g><path d="M5 3.5 19 12 5 20.5Z"/></g><g><path d="M8 4v15M17 4v15"/></g></svg></button>'},thumbs:{tpl:'<button data-thumbs-action="toggle" class="f-button" title="{{TOGGLE_THUMBS}}"><svg><rect width="18" height="14" x="3" y="3" rx="2"/><path d="M4 21h1M9 21h1M14 21h1M19 21h1"/></svg></button>'},...n},u={absolute:!1,display:{left:[],middle:["zoomIn","zoomOut","toggle1to1","rotateCCW","rotateCW","flipX","flipY","reset"],right:[]},enabled:"auto",items:{}},c=()=>{let s,c;function d(e){const o=s?.getOptions().Toolbar;let n=(t(o)?{...u,...o}:u)[e];return n&&"function"==typeof n&&s?n(s):n}function f(){if(!s||c)return;if(!1===s?.getOptions().Toolbar)return;const a=s.getContainer();if(!a)return;let u=d("enabled");if(!u)return;const f=d("absolute"),p=s.getSlides().length>1;let g=!1,m=!1;for(const t of s.getSlides())t.panzoomRef&&(g=!0),(t.downloadSrc||"image"===t.type&&t.src)&&(m=!0);const b=s.getPlugins().Thumbs?.isEnabled()||!1,h=p&&s.getPlugins().Autoplay||!1,v=s.getPlugins().Fullscreen&&(document.fullscreenEnabled||document.webkitFullscreenEnabled);if("auto"===u&&(u=g),!u)return;c=a.querySelector(".f-carousel__toolbar")||void 0,c||(c=document.createElement("div"),l(c,"f-carousel__toolbar"));const y=d("display"),E=i({},r,d("items"));for(const i of["left","middle","right"]){const a=y[i]||[],r=document.createElement("div");l(r,`f-carousel__toolbar__column is-${i}`);for(const i of a){let l;if(e(i)){if("counter"===i&&!p)continue;if("autoplay"===i&&!h)continue;if(Object.prototype.hasOwnProperty.call(n,i)&&!g)continue;if("fullscreen"===i&&!v)continue;if("thumbs"===i&&!b)continue;if("download"===i&&!m)continue;l=E[i]}if(t(i)&&(l=i),l&&l.tpl){let t=s.localize(l.tpl);t=t.split("<svg>").join('<svg tabindex="-1" width="24" height="24" viewBox="0 0 24 24">');const e=o(t);e&&("function"==typeof l.click&&s&&e.addEventListener("click",t=>{t.preventDefault(),t.stopPropagation(),"function"==typeof l.click&&s&&l.click(s,t)}),r.append(e))}}c.append(r)}if(c.childElementCount){if(f&&l(c,"is-absolute"),!c.parentElement){const t=d("parentEl");t?t.insertAdjacentElement("afterbegin",c):a.insertAdjacentElement("afterbegin",c)}a.contains(c)&&(l(a,"has-toolbar"),f&&l(a,"has-absolute-toolbar"))}}return{init:function(t){s=t,s?.on("initSlides",f)},destroy:function(){s?.off("initSlides",f),a(s?.getContainer(),"has-toolbar has-absolute-toolbar"),c?.remove(),c=void 0},add:function(t,e){r[t]=e},isEnabled:function(){return!!c}}};export{c as Toolbar,s as ToolbarColumn};