UNPKG

@fancyapps/ui

Version:

Robust JavaScript UI Component Library

3 lines (2 loc) 3.52 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 d(){var t,a,d,c;if(!(null==l?void 0:l.getOptions().Toolbar))return;if(!l||r)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===(t=l.getPlugins().Thumbs)||void 0===t?void 0:t.isEnabled())||!1,h=p&&l.getPlugins().Autoplay||!1,y=l.getPlugins().Fullscreen&&(document.fullscreenEnabled||document.webkitFullscreenEnabled);if("auto"===f&&(f=b),!f)return;r=(null===(a=l.getContainer())||void 0===a?void 0:a.querySelector(".f-carousel__toolbar"))||void 0,r||(r=document.createElement("div"),r.classList.add("f-carousel__toolbar"));const E=u("display"),j=i({},s,u("items"));for(const t of["left","middle","right"]){const i=E[t]||[],s=document.createElement("div");s.classList.add("f-carousel__toolbar__column"),s.classList.add(`is-${t}`);for(const t of i){let i;if(e(t)){if("counter"===t&&!p)continue;if("autoplay"===t&&!h)continue;if(n[t]&&!b)continue;if("fullscreen"===t&&!y)continue;if("thumbs"===t&&!v)continue;if("download"===t&&!m)continue;i=j[t]}if("object"==typeof t&&(i=t),i&&i.tpl){let t=l.localize(i.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 i.click&&l&&e.addEventListener("click",(t=>{t.preventDefault(),t.stopPropagation(),"function"==typeof i.click&&l&&i.click(l,t)})),s.append(e))}}r.append(s)}if(r.childElementCount&&(!0===g&&r.classList.add("is-absolute"),null===(d=l.getContainer())||void 0===d||d.classList.add("has-toolbar"),!r.parentElement)){const t=u("parentEl");t?t.insertAdjacentElement("afterbegin",r):null===(c=l.getViewport())||void 0===c||c.insertAdjacentElement("beforebegin",r)}}return{init:function(t){l=t,l.on("initSlides",d)},destroy:function(){var t;null==l||l.off("initSlides",d),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};