{"version":3,"sources":["../src/imageLoader.ts"],"names":[],"mappings":";AAMA,IAAM,YAAY;AAEX,IAAM,kBAAkB,MAAM;AACnC,QAAM,kBAAkB,CACtB,KACA,KACA,UAKG;AACH,QAAI,IAAI,QAAQ;AAAK;AACrB,QAAI,MAAM;AACV,QAAI,WAAW;AAEf,QAAI,SAAS,MAAM;AACjB,iBAAW;AACX,YAAM,SAAS,EAAE,iBAAiB,SAAS,CAAC;AAAA,IAC9C;AAEA,QAAI,UAAU,MAAM;AAClB,iBAAW;AACX,YAAM,SAAS,EAAE,iBAAiB,QAAQ,CAAC;AAAA,IAC7C;AAEA,eAAW,MAAM;AACf,UAAI,CAAC;AAAU,cAAM,SAAS,EAAE,iBAAiB,UAAU,CAAC;AAAA,IAC9D,GAAG,SAAS;AAAA,EACd;AAEA,SAAO;AAAA,IACL;AAAA,EACF;AACF;AAEO,IAAM,cAAc,gBAAgB","sourcesContent":["import { createStore } from \"@namnode/store\"\nimport { ZoomedImgStatus } from \"./types\"\n\n// There is a scenario where the image is already in the cache,\n// we don't want to trigger the loading state too quickly in that case\n// 50ms should be enough to wait before triggering the loading state\nconst THRESHOLD = 50\n\nexport const makeImageLoader = () => {\n  const createZoomImage = (\n    img: HTMLImageElement,\n    src: string,\n    store: ReturnType<\n      typeof createStore<{\n        zoomedImgStatus: ZoomedImgStatus\n      }>\n    >,\n  ) => {\n    if (img.src === src) return\n    img.src = src\n    let complete = false\n\n    img.onload = () => {\n      complete = true\n      store.setState({ zoomedImgStatus: \"loaded\" })\n    }\n\n    img.onerror = () => {\n      complete = true\n      store.setState({ zoomedImgStatus: \"error\" })\n    }\n\n    setTimeout(() => {\n      if (!complete) store.setState({ zoomedImgStatus: \"loading\" })\n    }, THRESHOLD)\n  }\n\n  return {\n    createZoomImage,\n  }\n}\n\nexport const imageLoader = makeImageLoader()\n"]}