{"version":3,"file":"6161.de35527d3f1d7807d54e.js","mappings":"k4CACA,IAAMA,EAAiBC,OAAOD,gBAAkBE,EAAAA,GAE1CC,EAAAA,WAEF,WAAYC,EAAIC,GAIZ,G,4FAJe,SACfC,KAAKF,GAAKA,EACVE,KAAKD,EAAIA,EACTC,KAAKC,IAAMH,EAAGI,cAAc,OACb,MAAZF,KAAKC,IACJ,GAAID,KAAKC,IAAIE,UAAYH,KAAKC,IAAIG,aAAe,EAC7CJ,KAAKK,gBACF,CACH,IAAIC,EAAQN,KACZA,KAAKC,IAAIM,iBAAiB,QAAQ,WAC9BD,EAAMD,WACT,GACJ,CAER,C,gDAED,WAAY,WACRL,KAAKQ,gBAAkBR,KAAKC,IAAIG,aAChCJ,KAAKS,iBAAmBT,KAAKC,IAAIS,cAEjCV,KAAKW,GAAK,IAAIjB,GAAe,SAAAkB,GAAW,UAClBA,GADkB,IACpC,IAAK,EAAL,qBAA2B,KACjBC,EADiB,QACNC,YACjB,EAAKC,OAAOF,EAAGG,MAAMH,EAAGI,OAC3B,CAJmC,+BAKvC,IACDjB,KAAKW,GAAGO,QAAQlB,KAAKF,GACxB,G,oBAED,SAAOqB,EAAEC,GAAG,WACRzB,OAAO0B,uBAAsB,WACzB,EAAKpB,IAAIqB,UAAUC,OAAO,cAC1B5B,OAAO0B,uBAAsB,WACzB,IAAIG,EAAeC,KAAKC,KAAKP,GAAK,EAC9BQ,EAAgBF,KAAKC,KAAKN,GAAK,EAC/BQ,EAAYJ,EAAe,EAAKhB,gBAChCqB,EAAYF,EAAgB,EAAKlB,iBACjCqB,EAAYL,KAAKM,IAAIH,EAAUC,GAAWG,QAAQ,GAClDC,EAAaR,KAAKS,IAAIN,EAAUC,GAAWG,QAAQ,GACvD,EAAK/B,IAAIkC,MAAT,uBAAiCL,EAAjC,2BAA6DG,GAC7DtC,OAAO0B,uBAAsB,WACzB,EAAKpB,IAAIqB,UAAUc,IAAI,aAC1B,GACJ,GACJ,GACJ,M,gFA/CCvC,GAoDC,SAASwC,EAAWC,GACvBA,EAASC,SAAQ,SAACC,EAAMzC,GAEE,IAAlByC,EAAKC,UACL,IAAI5C,EAAS2C,EAAMzC,EAE1B,GACJ,C","sources":["webpack://nationalspacecentre.web/./wwwroot/app/src/js/collection-img-scale.js"],"sourcesContent":["import { ResizeObserver as Polyfill } from '@juggle/resize-observer';\r\nconst ResizeObserver = window.ResizeObserver || Polyfill;\r\n\r\nclass ImgScale {\r\n\r\n constructor(el, i) {\r\n this.el = el;\r\n this.i = i;\r\n this.img = el.querySelector('img');\r\n if(this.img != null) {\r\n if (this.img.complete && this.img.naturalWidth > 0) {\r\n this.imgLoaded();\r\n } else {\r\n let _this = this;\r\n this.img.addEventListener('load', () => {\r\n _this.imgLoaded();\r\n });\r\n }\r\n }\r\n }\r\n\r\n imgLoaded() {\r\n this.imgNaturalWidth = this.img.naturalWidth;\r\n this.imgNaturalHeight = this.img.naturalHeight;\r\n // add resize observer\r\n this.ro = new ResizeObserver(entries => {\r\n for (let entry of entries) {\r\n const cr = entry.contentRect;\r\n this.update(cr.width,cr.height);\r\n }\r\n });\r\n this.ro.observe(this.el);\r\n }\r\n\r\n update(w,h) {\r\n window.requestAnimationFrame(() => {\r\n this.img.classList.remove('transition');\r\n window.requestAnimationFrame(() => {\r\n let wrapperWidth = Math.ceil(w) + 1,\r\n wrapperHeight = Math.ceil(h) + 1;\r\n let xFitScale = wrapperWidth / this.imgNaturalWidth,\r\n yFitScale = wrapperHeight / this.imgNaturalHeight;\r\n let initScale = Math.max(xFitScale,yFitScale).toFixed(3),\r\n hoverScale = Math.min(xFitScale,yFitScale).toFixed(3);\r\n this.img.style = `--init-scale:${initScale}; --hover-scale:${hoverScale}`;\r\n window.requestAnimationFrame(() => {\r\n this.img.classList.add('transition');\r\n });\r\n });\r\n });\r\n }\r\n\r\n}\r\n\r\n// export the default function to create\r\nexport function createFrom(wrappers) {\r\n wrappers.forEach((node, i) => {\r\n // if node is an element\r\n if (node.nodeType === 1) {\r\n new ImgScale(node, i);\r\n }\r\n });\r\n}"],"names":["ResizeObserver","window","Polyfill","ImgScale","el","i","this","img","querySelector","complete","naturalWidth","imgLoaded","_this","addEventListener","imgNaturalWidth","imgNaturalHeight","naturalHeight","ro","entries","cr","contentRect","update","width","height","observe","w","h","requestAnimationFrame","classList","remove","wrapperWidth","Math","ceil","wrapperHeight","xFitScale","yFitScale","initScale","max","toFixed","hoverScale","min","style","add","createFrom","wrappers","forEach","node","nodeType"],"sourceRoot":""}