UNPKG

@fancyapps/ui

Version:

Robust JavaScript UI Component Library

3 lines (2 loc) 3.47 kB
/*! 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";var l;!function(t){t.Left="left",t.middle="middle",t.right="right"}(l||(l={}));const s=Object.assign({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),a={absolute:!1,display:{left:[],middle:["zoomIn","zoomOut","toggle1to1","rotateCCW","rotateCW","flipX","flipY","reset"],right:[]},enabled:"auto",items:{}},r=()=>{let l,r;function u(e){const o=null==l?void 0:l.getOptions().Toolbar;let n=(t(o)?Object.assign(Object.assign({},a),o):a)[e];return n&&"function"==typeof n&&l?n(l):n}function c(){var a,c;if(!(null==l?void 0:l.getOptions().Toolbar))return;if(!l||r)return;const d=l.getContainer();if(!d)return;let f=u("enabled");if(!f)return;const g=u("absolute"),p=l.getSlides().length>1;let b=!1,m=!1;for(const t of l.getSlides())t.panzoomRef&&(b=!0),(t.downloadSrc||"image"===t.type&&t.src)&&(m=!0);const v=(null===(a=l.getPlugins().Thumbs)||void 0===a?void 0:a.isEnabled())||!1,h=p&&l.getPlugins().Autoplay||!1,E=l.getPlugins().Fullscreen&&(document.fullscreenEnabled||document.webkitFullscreenEnabled);if("auto"===f&&(f=b),!f)return;r=d.querySelector(".f-carousel__toolbar")||void 0,r||(r=document.createElement("div"),r.classList.add("f-carousel__toolbar"));const y=u("display"),j=i({},s,u("items"));for(const i of["left","middle","right"]){const s=y[i]||[],a=document.createElement("div");a.classList.add("f-carousel__toolbar__column"),a.classList.add(`is-${i}`);for(const i of s){let s;if(e(i)){if("counter"===i&&!p)continue;if("autoplay"===i&&!h)continue;if(n[i]&&!b)continue;if("fullscreen"===i&&!E)continue;if("thumbs"===i&&!v)continue;if("download"===i&&!m)continue;s=j[i]}if(t(i)&&(s=i),s&&s.tpl){let t=l.localize(s.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 s.click&&l&&e.addEventListener("click",(t=>{t.preventDefault(),t.stopPropagation(),"function"==typeof s.click&&l&&s.click(l,t)})),a.append(e))}}r.append(a)}if(r.childElementCount){if(g&&r.classList.add("is-absolute"),!r.parentElement){const t=u("parentEl");t?t.insertAdjacentElement("afterbegin",r):null===(c=l.getViewport())||void 0===c||c.insertAdjacentElement("beforebegin",r)}d.contains(r)&&d.classList.add("has-toolbar")}}return{init:function(t){l=t,null==l||l.on("initSlides",c)},destroy:function(){var t;null==l||l.off("initSlides",c),null===(t=null==l?void 0:l.getContainer())||void 0===t||t.classList.remove("has-toolbar"),null==r||r.remove(),r=void 0},add:function(t,e){s[t]=e},isEnabled:function(){return!!r}}};export{r as Toolbar,l as ToolbarColumn};