lightgallery/plugins/rotate/lg-rotate.min.js

lightGallery is a feature-rich, modular JavaScript gallery plugin for building beautiful image and video galleries for the web and the mobile

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).lgRotate=e()}(this,function(){"use strict";const t={rotateLeft:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="currentColor"><path transform="translate(0, 960) scale(1, -1)" d="M554 764.667q126-16 213-112t87-226-87-226-213-112v86q92 16 153 87t61 165-61 165-153 87v-166l-194 190 194 194v-132zM302 156.667l62 62q46-34 106-44v-86q-96 12-168 68zM260 384.667q10-58 42-106l-60-60q-56 74-68 166h86zM304 574.667q-36-52-44-106h-86q12 90 70 166z"/></svg>',rotateRight:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="currentColor"><path transform="translate(0, 960) scale(1, -1)" d="M720 278.667q34 46 44 106h86q-12-92-68-166zM554 174.667q60 10 106 44l62-62q-72-56-168-68v86zM850 468.667h-86q-10 60-44 106l62 60q58-72 68-166zM664 702.667l-194-190v166q-92-16-153-87t-61-165 61-165 153-87v-86q-126 16-213 112t-87 226 87 226 213 112v132z"/></svg>',flipHorizontal:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="currentColor"><path transform="translate(0, 960) scale(1, -1)" d="M896 554.667l-170-170v128h-300v84h300v128zM298 468.667v-128h300v-84h-300v-128l-170 170z"/></svg>',flipVertical:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" fill="currentColor"><path transform="translate(0, 960) scale(1, -1)" d="M384 810.667l170-170h-128v-300h-84v300h-128zM682 212.667h128l-170-170-170 170h128v300h84v-300z"/></svg>'},e="lgSlideItemLoad",i="lgBeforeSlide",r="lgRotateLeft",s="lgRotateRight",o="lgFlipHorizontal",l="lgFlipVertical",a={rotate:!0,rotateSpeed:400,rotateLeft:!0,rotateRight:!0,flipHorizontal:!0,flipVertical:!0};var n=Object.defineProperty,g=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,f=(t,e,i)=>e in t?n(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i,d=(t,e)=>{for(var i in e||(e={}))h.call(e,i)&&f(t,i,e[i]);if(g)for(var i of g(e))c.call(e,i)&&f(t,i,e[i]);return t};return class{constructor(t,e){return this.core=t,this.$LG=e,this.settings=d(d({},a),this.core.settings),this}buildTemplates(){var t,e,i,r,s,o,l,a;let n="";this.settings.flipVertical&&(n+=`<button type="button" id="lg-flip-ver" aria-label="${null!=(e=null==(t=this.settings.rotatePluginStrings)?void 0:t.flipVertical)?e:this.core.settings.strings.flipVertical}" class="lg-flip-ver lg-icon"></button>`),this.settings.flipHorizontal&&(n+=`<button type="button" id="lg-flip-hor" aria-label="${null!=(r=null==(i=this.settings.rotatePluginStrings)?void 0:i.flipHorizontal)?r:this.core.settings.strings.flipHorizontal}" class="lg-flip-hor lg-icon"></button>`),this.settings.rotateLeft&&(n+=`<button type="button" id="lg-rotate-left" aria-label="${null!=(o=null==(s=this.settings.rotatePluginStrings)?void 0:s.rotateLeft)?o:this.core.settings.strings.rotateLeft}" class="lg-rotate-left lg-icon"></button>`),this.settings.rotateRight&&(n+=`<button type="button" id="lg-rotate-right" aria-label="${null!=(a=null==(l=this.settings.rotatePluginStrings)?void 0:l.rotateRight)?a:this.core.settings.strings.rotateRight}" class="lg-rotate-right lg-icon"></button>`),this.core.$toolbar.append(n)}init(){this.core.registerDefaultIcons(t),this.settings.rotate&&(this.buildTemplates(),this.rotateValuesList={},this.core.LGel.on(`${e}.rotate`,t=>{const{index:e}=t.detail;if(!this.core.getSlideItem(e).find(".lg-img-rotate").get()){this.core.getSlideItem(e).find(".lg-object").first().wrap("lg-img-rotate"),this.core.getSlideItem(this.core.index).find(".lg-img-rotate").css("transition-duration",this.settings.rotateSpeed+"ms")}}),this.core.outer.find("#lg-rotate-left").first().on("click.lg",this.rotateLeft.bind(this)),this.core.outer.find("#lg-rotate-right").first().on("click.lg",this.rotateRight.bind(this)),this.core.outer.find("#lg-flip-hor").first().on("click.lg",this.flipHorizontal.bind(this)),this.core.outer.find("#lg-flip-ver").first().on("click.lg",this.flipVertical.bind(this)),this.core.LGel.on(`${i}.rotate`,t=>{this.rotateValuesList[t.detail.index]||(this.rotateValuesList[t.detail.index]={rotate:0,flipHorizontal:1,flipVertical:1})}),this.$LG(window).on(`resize.lg.rotate.global${this.core.lgId}`,()=>{this.core.lgOpened&&this.rotateValuesList[this.core.index]&&this.isImageOrientationChanged()&&this.applyStyles()}))}getFitScale(){const t=(this.rotateValuesList[this.core.index].rotate%360+360)%360;if(90!==t&&270!==t)return 1;const e=this.core.getSlideItem(this.core.index).find(".lg-img-rotate").first().get(),i=e&&e.querySelector(".lg-object");if(!e||!i)return 1;const r=i.offsetWidth,s=i.offsetHeight,o=e.clientWidth,l=e.clientHeight;return r&&s&&o&&l?Math.min(o/s,l/r,1):1}applyStyles(){const t=this.core.getSlideItem(this.core.index).find(".lg-img-rotate").first(),e=this.rotateValuesList[this.core.index],i=this.getFitScale();t.css("transform","rotate("+e.rotate+"deg) scale3d("+e.flipHorizontal*i+", "+e.flipVertical*i+", 1)")}rotateLeft(){this.rotateValuesList[this.core.index].rotate-=90,this.applyStyles(),this.triggerEvents(r,{rotate:this.rotateValuesList[this.core.index].rotate})}rotateRight(){this.rotateValuesList[this.core.index].rotate+=90,this.applyStyles(),this.triggerEvents(s,{rotate:this.rotateValuesList[this.core.index].rotate})}getCurrentRotation(t){if(!t)return 0;const e=this.$LG(t).style(),i=e.getPropertyValue("-webkit-transform")||e.getPropertyValue("-moz-transform")||e.getPropertyValue("-ms-transform")||e.getPropertyValue("-o-transform")||e.getPropertyValue("transform")||"none";if("none"!==i){const t=i.split("(")[1].split(")")[0].split(",");if(t){const e=Math.round(Math.atan2(t[1],t[0])*(180/Math.PI));return e<0?e+360:e}}return 0}flipHorizontal(){const t=this.core.getSlideItem(this.core.index).find(".lg-img-rotate").first().get(),e=this.getCurrentRotation(t);let i="flipHorizontal";90!==e&&270!==e||(i="flipVertical"),this.rotateValuesList[this.core.index][i]*=-1,this.applyStyles(),this.triggerEvents(o,{flipHorizontal:this.rotateValuesList[this.core.index][i]})}flipVertical(){const t=this.core.getSlideItem(this.core.index).find(".lg-img-rotate").first().get(),e=this.getCurrentRotation(t);let i="flipVertical";90!==e&&270!==e||(i="flipHorizontal"),this.rotateValuesList[this.core.index][i]*=-1,this.applyStyles(),this.triggerEvents(l,{flipVertical:this.rotateValuesList[this.core.index][i]})}triggerEvents(t,e){setTimeout(()=>{this.core.LGel.trigger(t,e)},this.settings.rotateSpeed+10)}isImageOrientationChanged(){const t=this.rotateValuesList[this.core.index],e=Math.abs(t.rotate)%360!=0,i=t.flipHorizontal<0,r=t.flipVertical<0;return e||i||r}closeGallery(){this.settings.rotate&&(this.isImageOrientationChanged()&&this.core.getSlideItem(this.core.index).css("opacity",0),this.rotateValuesList={})}destroy(){this.core.LGel.off(".lg.rotate"),this.core.LGel.off(".rotate"),this.$LG(window).off(`.lg.rotate.global${this.core.lgId}`)}}});