{"version":3,"file":"counter.js?v=9.1.7","mappings":";qJAGA,SAASA,EAAeC,EAAsBC,GAE5CD,EAAQE,SAAU,EAGlB,MAAMC,EAAoBH,EAAQI,KAG5BC,EAAgB,IAAO,GAGvBC,EAAcC,KAAKC,MAAML,EAAoBE,GAK5B,MACrB,IAAII,EAAQ,EAEZ,MAAMC,EAAWC,aAAY,KAC3BF,IACA,MAAMG,GAPWR,EAOYK,EAAQH,IAPK,EAAIF,GAA9B,IAACA,EAQjB,GAAGJ,EAAQa,UAAYb,EAAQc,QAAS,CACtC,MAAMC,EAAeR,KAAKC,OAAOR,EAAQa,UAAYb,EAAQc,SAAWF,GACxE,IAAII,EAAoC,IAApBhB,EAAQc,QAAgB,EAAI,EAC5Cd,EAAQa,YAAcE,IACxBd,EAAKgB,WAAY,QAAmBjB,EAAQa,UAAYE,EAAgBC,QAErE,CACL,MAAMD,EAAeR,KAAKC,OAAOR,EAAQc,QAAUd,EAAQa,WAAaD,GACxE,IAAII,EAAsC,IAAtBhB,EAAQa,UAAkB,EAAI,EAC9Cb,EAAQc,UAAYC,IACtBd,EAAKgB,WAAY,QAAkBjB,EAAQa,UAAYE,EAAeC,IAItEP,IAAUH,GACZY,cAAcR,KAEfL,EAAc,EAGnBc,EACF,CAEe,SAASC,EAASpB,GAC/B,MAAMqB,EAAaC,SAASC,KAAKC,wBAC3BC,EAAcH,SAASI,eAAe1B,EAAQ2B,IAEpD,IAAKF,EACH,OAGF,MAAMG,EAAaH,EAAYD,wBACzBK,EAASD,EAAWE,IAAMT,EAAWS,IAE3CC,OAAOC,iBAAiB,QAAQ,MAC1BhC,EAAQE,SAAW0B,EAAWE,KAAO,GAAKC,OAAOE,QAAUF,OAAOG,aAAeL,GACnF9B,EAAcC,EAASyB,MAK3BM,OAAOC,iBAAiB,UAAU,MAC3BhC,EAAQE,SAAW6B,OAAOE,QAAUF,OAAOG,aAAeL,GAC7D9B,EAAcC,EAASyB,KAG7B,wECRA,MACaU,EAAgB,CAC3BC,IAFW,KAGXC,IAAKC,QACLC,IAAKD,WACLE,IAAKF,cACLG,IAAKH,gBACLI,IAAKJ,oBAcMK,EAAiB,CAC5BC,IAAK,OACLC,IAAK,OACLC,IAAK,OACLC,IAAK,QAGA,SAASC,EAAkBC,GAChC,OAAOA,EAAIC,WAAWC,QAAQ,wBAAyB,IACzD,CAGA,IAAYC,EAMAC,GANZ,SAAYD,GACV,mBACA,kBACD,CAHD,CAAYA,IAAAA,EAAS,KAMrB,SAAYC,GACV,YACA,uBACD,CAHD,CAAYA,IAAAA,EAAQ","sources":["webpack://empori-base/./src/controls/Counter.tsx","webpack://empori-base/./src/util/util.ts"],"sourcesContent":["import { CounterJson } from '../empracoTypes';\r\nimport { thousandSeparator } from '../util/util';\r\n\r\nfunction StartCounting (counter: CounterJson, node: HTMLElement) {\r\n\r\n  counter.started = true;\r\n\r\n  // How long you want the animation to take in milliseconds\r\n  const animationDuration = counter.time;\r\n\r\n  // Calculate how long each \"frame\" should last if we want to update the animation 60 times per second\r\n  const frameDuration = 1000 / 60;\r\n\r\n  // Use that to calculate how many frames we need to complete the animation\r\n  const totalFrames = Math.round(animationDuration / frameDuration);\r\n\r\n  // An ease-out function that slows the count as it progresses\r\n  const easeOutQuad = (time: number) => time * (2 - time);\r\n\r\n  const animateCountUp = () => {\r\n    let frame = 0;\r\n\r\n    const interval = setInterval(() => {\r\n      frame++;\r\n      const progress = easeOutQuad(frame / totalFrames);\r\n      if(counter.countFrom > counter.countTo) {\r\n        const currentCount = Math.round((counter.countFrom - counter.countTo) * progress);\r\n        let value: number = counter.countTo === 0 ? 1 : 0;\r\n        if (counter.countFrom !== currentCount) {\r\n          node.innerHTML = thousandSeparator((counter.countFrom - currentCount) - value);\r\n        }\r\n      } else {\r\n        const currentCount = Math.round((counter.countTo - counter.countFrom) * progress);\r\n        let value: number = counter.countFrom === 0 ? 1 : 0;\r\n        if (counter.countTo !== currentCount) {\r\n          node.innerHTML = thousandSeparator(counter.countFrom + currentCount + value);\r\n        }\r\n      }\r\n\r\n      if (frame === totalFrames) {\r\n        clearInterval(interval);\r\n      }\r\n    }, frameDuration);\r\n  };\r\n\r\n  animateCountUp();\r\n}\r\n\r\nexport default function Counter (counter: CounterJson) {\r\n  const bodyHeight = document.body.getBoundingClientRect();\r\n  const counterNode = document.getElementById(counter.id);\r\n\r\n  if (!counterNode) {\r\n    return;\r\n  }\r\n\r\n  const counterPos = counterNode.getBoundingClientRect();\r\n  const offset = counterPos.top - bodyHeight.top;\r\n\r\n  window.addEventListener('load', () => {\r\n    if(!counter.started && counterPos.top >= 0 && window.scrollY + window.innerHeight >= offset) {\r\n      StartCounting(counter, counterNode);\r\n    }\r\n  });\r\n\r\n  // Initialize counter upon reached/scrolled to\r\n  window.addEventListener('scroll', () => {\r\n    if (!counter.started && window.scrollY + window.innerHeight >= offset) {\r\n      StartCounting(counter, counterNode);\r\n    }\r\n  });\r\n}","export type MappedArrayObject<T> = {\r\n  [key: string]: T;\r\n};\r\n\r\nexport type GroupedArrayObject<T> = {\r\n  [key: string]: T[];\r\n};\r\n\r\nexport function arrayToObject<T>(array: T[], key: (item: T) => string): MappedArrayObject<T> {\r\n  const obj: MappedArrayObject<T> = {};\r\n\r\n  for (let item of array) {\r\n    obj[key(item)] = item;\r\n  }\r\n\r\n  return obj;\r\n}\r\n\r\nexport function groupArray<T>(array: T[], key: (item: T) => string): GroupedArrayObject<T> {\r\n  const obj: GroupedArrayObject<T> = {};\r\n\r\n  for (let item of array) {\r\n    const itemKey = key(item);\r\n    (obj[itemKey] || (obj[itemKey] = [])).push(item);\r\n  }\r\n\r\n  return obj;\r\n}\r\n\r\nexport function camelCase(value?: string) {\r\n  if (!value || value.length <= 1) {\r\n    return value ?? '';\r\n  }\r\n\r\n  return value.charAt(0).toLocaleLowerCase() + value.substring(1);\r\n}\r\n\r\nconst formatMustasch = /{([^{}]*)}/g;\r\n\r\n/**\r\n * Format a string template in a provided mustasch format using an object as a lookup source.\r\n *\r\n * @example\r\n * formatObject('test {key1} format', { key1: 'string' }) // \"test string format\"\r\n *\r\n * @param format Format string template.\r\n * @param object Object to use as lookup.\r\n * @param replacementFunc Optional callback function for each parsed tag.\r\n * Returned `string` will be used instead of given mapped item.\r\n * @returns Formatted string template.\r\n */\r\nexport function formatObject(format: string, object?: any, replacementFunc?: (key: string, item: any) => string) {\r\n  if (object == null) {\r\n    return '';\r\n  }\r\n\r\n  return format.replace(formatMustasch, (a: string, b: string) => {\r\n    let val = object[b] ?? object[camelCase(b)];\r\n    let formatVal = replacementFunc?.(b, val);\r\n    return formatVal ?? val;\r\n  });\r\n}\r\n\r\nconst byte = 1024;\r\nexport const FileSizeUnits = {\r\n  KiB: byte,\r\n  MiB: byte * byte,\r\n  GiB: byte * byte * byte,\r\n  TiB: byte * byte * byte * byte,\r\n  PiB: byte * byte * byte * byte * byte,\r\n  EiB: byte * byte * byte * byte * byte * byte\r\n};\r\n\r\n/**\r\n * Returns a new array with one item replaced at given index.\r\n * Does not mutate the original array.\r\n * @param items The original array\r\n * @param index What item to replace\r\n * @param newItem The new replacementitem\r\n */\r\nexport function replaceItem<T>(items: T[], index: number, newItem: T) {\r\n  return items.map((item, idx) => idx === index ? newItem : item);\r\n}\r\n\r\nexport const FileExtensions = {\r\n  PDF: '.pdf',\r\n  MP4: '.mp4',\r\n  OGG: '.ogg',\r\n  SVG: '.svg'\r\n};\r\n\r\nexport function thousandSeparator(num: number) {\r\n  return num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ' ');\r\n};\r\n\r\n// eslint-disable-next-line no-shadow\r\nexport enum Direction {\r\n  prev,\r\n  next\r\n}\r\n\r\n// eslint-disable-next-line no-shadow\r\nexport enum ThemeIds {\r\n  raw = 'Raw',\r\n  exclusive = 'Exclusive'\r\n}\r\n"],"names":["StartCounting","counter","node","started","animationDuration","time","frameDuration","totalFrames","Math","round","frame","interval","setInterval","progress","countFrom","countTo","currentCount","value","innerHTML","clearInterval","animateCountUp","Counter","bodyHeight","document","body","getBoundingClientRect","counterNode","getElementById","id","counterPos","offset","top","window","addEventListener","scrollY","innerHeight","FileSizeUnits","KiB","MiB","byte","GiB","TiB","PiB","EiB","FileExtensions","PDF","MP4","OGG","SVG","thousandSeparator","num","toString","replace","Direction","ThemeIds"],"sourceRoot":""}