@tushar-br/desktop 1.0.173 → 1.0.174

package/staging_area/desktop/car gaem/node_modules/@monogrid/gainmap-js/README.md

@@ -0,0 +1,371 @@
+# gainmap-js
+[![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2FMONOGRID%2Fgainmap-js.svg?type=shield)](https://app.fossa.com/projects/git%2Bgithub.com%2FMONOGRID%2Fgainmap-js?ref=badge_shield)
+
+A Javascript (TypeScript) Encoder/Decoder Implementation of Adobe's Gain Map Technology for storing HDR Images using an SDR Image + a "Gain map"
+
+> :warning: This library is intended for encoding and decoding gain map images for the [three.js](https://github.com/mrdoob/three.js/) 3D Library
+>
+> It can be used for general encode/decode of gain maps but it depends on the three.js library which, in itself, is quite heavy if you only use it to encode/decode gain maps.
+
+## Share Your Project!
+Have you built something awesome using this library? We’d love to see what you’ve created!
+Whether it’s a small demo or a full-scale application, your project can inspire others and help improve the library. Please share your work in one of these ways:
+* GitHub Issues: [Open a new issue](https://github.com/MONOGRID/gainmap-js/issues/new) in this repository with a brief description, screenshots, and links to your project.
+* Email: Send us an email at gainmap@monogrid.com with your project details.
+Your contributions and creative ideas make our community stronger. We can’t wait to see what you build!
+
+## Live Demo
+
+* [WebGPU Version](https://monogrid.github.io/gainmap-js/webgpu.html)
+* [Legacy WebGL Version](https://monogrid.github.io/gainmap-js/)
+
+Both compares loading:
+ 1. a `JPEG` file with embedded gain map data
+ 2. a `webp` sdr file + a `webp` gain map + metadata JSON
+ 3. a comparable size `.hdr` file for comparison
+
+## [Free online encoder](https://gainmap-creator.monogrid.com)
+
+Use it to convert `.hdr` and `.exr` files into gain maps. It's free and the whole process happens in your browser.
+
+## Installing
+```bash
+$ npm install @monogrid/gainmap-js three
+```
+
+## What is a Gain map?
+
+[See here](https://gregbenzphotography.com/hdr-images/jpg-hdr-gain-maps-in-adobe-camera-raw/) for a detailed explanation, here are some relevant parts:
+
+> A gain map is a single file with a second pseudo-image embedded in it to create an optimized result for a specific monitor. It can be used to generate the HDR version (which looks dramatically better where supported), the SDR version (without tone mapping to ensures great quality), or anything in between (to better support less capable HDR displays).
+
+> Gain maps are not a new type of file, but rather a technology which can be embedded into a variety of image formats. There are reference specs already for the JPG, AVIF, JXL, and HEIF file formats. JPG is especially notable as it could not properly support HDR without gain maps and it offers a very useful bridge to the future (i.e. highly compatible with today’s software).
+
+> A gain map includes:
+>
+> * A **base (default) image**. This can be an SDR or an HDR image (JPG gain maps are always encoded with SDR as the base). If the browser or viewing software does not understand gain maps, it will just the treat file as if it were just the base image.
+> * The **gain map**. This is a secondary “image” embedded in the file. It is not a real image, but rather contains data to convert each pixel from the base image into the other (SDR or HDR) version of the image.
+>* Gain map **metadata**. This tells the browser how the gain map is encoded as well as critical information to optimize rendering on any display.
+
+Please note that Google [is adopting the gain map technology in Android 14](https://support.google.com/photos/answer/14159275) but its naming of the technology refers to it as **Ultra HDR Image Format** and a JPEG file with embedded gain map is [apparently called JPEGR](https://github.com/google/libultrahdr/blob/3a3a752a5da0b2304b1b6de0ef383bbe41256a67/lib/jpegr.h#L28C16-L28C21) in their terminology, we call it `HDRJPEG` for the moment.
+
+## API
+
+Refer to the [WIKI](https://github.com/MONOGRID/gainmap-js/wiki) for detailed documentation about the API.
+
+## Examples
+
+### Decoding
+
+The main use case of this library is to decode a JPEG file that contains gain map data
+and use it instead of a traditional `.exr` or `.hdr` image.
+
+> NOTE: Starting from v3.1.0 Decoding also works in a WebWorker, thanks to [Alejandro Romano](https://github.com/Arecsu) for the [contribution](https://github.com/MONOGRID/gainmap-js/pull/59)
+
+### Using a single JPEG with embedded Gain map Metadata
+
+This approach lets you load a single file with an embedded Gain Map.
+
+The advantage is to have a single file to load.
+
+The disadvantages are:
+ * No WEBP compression
+ * The JPEG cannot be manipulated in Photoshop, GIMP, or any other software that does not support the gain map technology (no photo editing software supports it at the time of writing 06-11-2023).
+ * Photo sharing websites and/or services (i.e. sharing with Slack) will likely strip the Gain map metadata and the HDR information will be lost, leaving you with only the SDR Representation.
+
+```ts
+import { HDRJPGLoader } from '@monogrid/gainmap-js'
+import {
+  EquirectangularReflectionMapping,
+  Mesh,
+  MeshBasicMaterial,
+  PerspectiveCamera,
+  PlaneGeometry,
+  Scene,
+  WebGLRenderer
+} from 'three'
+
+const renderer = new WebGLRenderer()
+
+const loader = new HDRJPGLoader(renderer)
+  .setRenderTargetOptions({ mapping: EquirectangularReflectionMapping })
+
+const result = await loader.loadAsync('gainmap.jpeg')
+// `result` can be used to populate a Texture
+
+const scene = new Scene()
+const mesh = new Mesh(
+  new PlaneGeometry(),
+  new MeshBasicMaterial({ map: result.renderTarget.texture })
+)
+scene.add(mesh)
+renderer.render(scene, new PerspectiveCamera())
+
+// Starting from three.js r159
+// `result.renderTarget.texture` can
+// also be used as Equirectangular scene background
+//
+// it was previously needed to convert it
+// to a DataTexture with `result.toDataTexture()`
+scene.background = result.renderTarget.texture
+
+// result must be manually disposed
+// when you are done using it
+result.dispose()
+```
+
+### Using separate files
+
+Using separate files will get rid of the limitations of using a single JPEG file but it will force to use three separate files
+
+1. An SDR Representation file
+2. A Gainmap file
+3. A JSON containing the gainmap metadata used for decoding
+
+
+```ts
+import { GainMapLoader } from '@monogrid/gainmap-js'
+import {
+  EquirectangularReflectionMapping,
+  Mesh,
+  MeshBasicMaterial,
+  PerspectiveCamera,
+  PlaneGeometry,
+  Scene,
+  WebGLRenderer
+} from 'three'
+
+const renderer = new WebGLRenderer()
+
+const loader = new GainMapLoader(renderer)
+  .setRenderTargetOptions({ mapping: EquirectangularReflectionMapping })
+
+const result = await loader.loadAsync(['sdr.jpeg', 'gainmap.jpeg', 'metadata.json'])
+// `result` can be used to populate a Texture
+
+const scene = new Scene()
+const mesh = new Mesh(
+  new PlaneGeometry(),
+  new MeshBasicMaterial({ map: result.renderTarget.texture })
+)
+scene.add(mesh)
+renderer.render(scene, new PerspectiveCamera())
+
+// Starting from three.js r159
+// `result.renderTarget.texture` can
+// also be used as Equirectangular scene background
+//
+// it was previously needed to convert it
+// to a DataTexture with `result.toDataTexture()`
+scene.background = result.renderTarget.texture
+
+// result must be manually disposed
+// when you are done using it
+result.dispose()
+```
+
+### Decoding with WebGPU
+
+> NOTE: WebGPU decoding requires three.js r163 or higher and a browser that supports WebGPU
+
+The library provides WebGPU-accelerated decoding through the `@monogrid/gainmap-js/webgpu` entry point. WebGPU decoding uses Three.js Shading Language (TSL) and offers improved performance and modern GPU architecture support.
+
+#### Using a single JPEG with embedded Gain map Metadata (WebGPU)
+
+```ts
+import { HDRJPGLoader } from '@monogrid/gainmap-js/webgpu'
+import {
+  EquirectangularReflectionMapping,
+  Mesh,
+  MeshBasicMaterial,
+  PerspectiveCamera,
+  PlaneGeometry,
+  Scene,
+  WebGPURenderer
+} from 'three/webgpu'
+
+const renderer = new WebGPURenderer()
+await renderer.init()
+
+const loader = new HDRJPGLoader(renderer)
+  .setRenderTargetOptions({ mapping: EquirectangularReflectionMapping })
+
+const result = await loader.loadAsync('gainmap.jpeg')
+// `result` can be used to populate a Texture
+
+const scene = new Scene()
+const mesh = new Mesh(
+  new PlaneGeometry(),
+  new MeshBasicMaterial({ map: result.renderTarget.texture })
+)
+scene.add(mesh)
+renderer.render(scene, new PerspectiveCamera())
+
+// Starting from three.js r159
+// `result.renderTarget.texture` can
+// also be used as Equirectangular scene background
+scene.background = result.renderTarget.texture
+
+// result must be manually disposed
+// when you are done using it
+result.dispose()
+```
+
+#### Using separate files (WebGPU)
+
+```ts
+import { GainMapLoader } from '@monogrid/gainmap-js/webgpu'
+import {
+  EquirectangularReflectionMapping,
+  Mesh,
+  MeshBasicMaterial,
+  PerspectiveCamera,
+  PlaneGeometry,
+  Scene,
+  WebGPURenderer
+} from 'three/webgpu'
+
+const renderer = new WebGPURenderer()
+await renderer.init()
+
+const loader = new GainMapLoader(renderer)
+  .setRenderTargetOptions({ mapping: EquirectangularReflectionMapping })
+
+const result = await loader.loadAsync(['sdr.jpeg', 'gainmap.jpeg', 'metadata.json'])
+// `result` can be used to populate a Texture
+
+const scene = new Scene()
+const mesh = new Mesh(
+  new PlaneGeometry(),
+  new MeshBasicMaterial({ map: result.renderTarget.texture })
+)
+scene.add(mesh)
+renderer.render(scene, new PerspectiveCamera())
+
+// Starting from three.js r159
+// `result.renderTarget.texture` can
+// also be used as Equirectangular scene background
+scene.background = result.renderTarget.texture
+
+// result must be manually disposed
+// when you are done using it
+result.dispose()
+```
+
+#### Key differences between WebGL and WebGPU
+
+1. **Import path**: Use `@monogrid/gainmap-js/webgpu` instead of `@monogrid/gainmap-js`
+2. **Three.js imports**: Use `three/webgpu` instead of `three`
+3. **Renderer**: Use `WebGPURenderer` instead of `WebGLRenderer`
+4. **Renderer initialization**: Call `await renderer.init()` before using WebGPU renderer
+5. **Async decoding**: The `decode()` function is async in WebGPU
+
+### Encoding
+
+Encoding a Gain map starting from an EXR file.
+
+This is generally not useful in a `three.js` site but this library exposes methods
+that allow to encode an `.exr` or `hdr` file into a `jpeg` with an embedded gain map.
+
+```ts
+import { compress, encode, findTextureMinMax } from '@monogrid/gainmap-js/encode'
+import { encodeJPEGMetadata } from '@monogrid/gainmap-js/libultrahdr'
+import { EXRLoader } from 'three/examples/jsm/loaders/EXRLoader.js'
+
+// load an HDR file
+const loader = new EXRLoader()
+const image = await loader.loadAsync('image.exr')
+
+// find RAW RGB Max value of a texture
+const textureMax = findTextureMinMax(image)
+
+// Encode the gainmap
+const encodingResult = encode({
+  image,
+  // this will encode the full HDR range
+  maxContentBoost: Math.max.apply(this, textureMax)
+})
+
+// obtain the RAW RGBA SDR buffer and create an ImageData
+const sdrImageData = new ImageData(encodingResult.sdr.toArray(), encodingResult.sdr.width, encodingResult.sdr.height)
+// obtain the RAW RGBA Gain map buffer and create an ImageData
+const gainMapImageData = new ImageData(encodingResult.gainMap.toArray(), encodingResult.gainMap.width, encodingResult.gainMap.height)
+
+// parallel compress the RAW buffers into the specified mimeType
+const mimeType = 'image/jpeg'
+const quality = 0.9
+
+const [sdr, gainMap] = await Promise.all([
+  compress({
+    source: sdrImageData,
+    mimeType,
+    quality,
+    flipY: true // output needs to be flipped
+  }),
+  compress({
+    source: gainMapImageData,
+    mimeType,
+    quality,
+    flipY: true // output needs to be flipped
+  })
+])
+
+// obtain the metadata which will be embedded into
+// and XMP tag inside the final JPEG file
+const metadata = encodingResult.getMetadata()
+
+// embed the compressed images + metadata into a single
+// JPEG file
+const jpeg = encodeJPEGMetadata({
+  ...encodingResult,
+  ...metadata,
+  sdr,
+  gainMap
+})
+
+// `jpeg` will be an `Uint8Array` which can be saved somewhere
+
+// encoder must be manually disposed
+// when no longer needed
+encodingResult.gainMap.dispose()
+encodingResult.sdr.dispose()
+
+```
+
+## Libultrahdr in Vite
+
+If you import `@monogrid/gainmap-js/libultrahdr`
+You will need to exclude it from Vite optimizations.
+
+```js
+// vite.config.js
+
+module.exports = defineConfig({
+  ...
+  optimizeDeps: {
+    exclude: ['@monogrid/gainmap-js/libultrahdr']
+  },
+  ...
+})
+```
+
+
+## Building
+
+Clone the repository:
+```bash
+$ git clone git@github.com:MONOGRID/gainmap-js.git
+$ cd gainmap-js
+$ npm i
+$ npm run build
+```
+
+
+## References
+
+* [Adobe Gainmap Specification](https://helpx.adobe.com/camera-raw/using/gain-map.html)
+* [Ultra HDR Image Format v1.0](https://developer.android.com/guide/topics/media/platform/hdr-image-format)
+
+
+## License
+[![FOSSA Status](https://app.fossa.com/api/projects/git%2Bgithub.com%2FMONOGRID%2Fgainmap-js.svg?type=large)](https://app.fossa.com/projects/git%2Bgithub.com%2FMONOGRID%2Fgainmap-js?ref=badge_large)

package/staging_area/desktop/car gaem/node_modules/@monogrid/gainmap-js/dist/Loader-CKVwvejH.js

@@ -0,0 +1,5 @@
+/**
+ * @monogrid/gainmap-js v3.4.0
+ * With ❤️, by MONOGRID <gainmap@monogrid.com>
+ */
+import{SRGBColorSpace as e,LinearSRGBColorSpace as t,HalfFloatType as a,Loader as r,LoadingManager as n,Texture as i,UVMapping as o,ClampToEdgeWrapping as s,LinearFilter as d,LinearMipMapLinearFilter as p,RGBAFormat as c,UnsignedByteType as l}from"three";function g(r){return n=>{const{sdr:i,gainMap:o,renderer:s}=n;i.colorSpace!==e&&(console.warn("SDR Colorspace needs to be *SRGBColorSpace*, setting it automatically"),i.colorSpace=e),i.needsUpdate=!0,o.colorSpace!==t&&(console.warn("Gainmap Colorspace needs to be *LinearSRGBColorSpace*, setting it automatically"),o.colorSpace=t),o.needsUpdate=!0;const d=r.createMaterial({...n,sdr:i,gainMap:o});return r.createQuadRenderer({width:i.image.width,height:i.image.height,type:a,colorSpace:t,material:d,renderer:s,renderTargetOptions:n.renderTargetOptions})}}class m extends Error{}class f extends Error{}const h=(e,t,a)=>{const r=new RegExp(`${t}="([^"]*)"`,"i").exec(e);if(r)return r[1];const n=new RegExp(`<${t}[^>]*>([\\s\\S]*?)</${t}>`,"i").exec(e);if(n){const e=n[1].match(/<rdf:li>([^<]*)<\/rdf:li>/g);return e&&3===e.length?e.map(e=>e.replace(/<\/?rdf:li>/g,"")):n[1].trim()}if(void 0!==a)return a;throw new Error(`Can't find ${t} in gainmap metadata`)},u=e=>{let t;t="undefined"!=typeof TextDecoder?(new TextDecoder).decode(e):e.toString();let a=t.indexOf("<x:xmpmeta");for(;-1!==a;){const e=t.indexOf("x:xmpmeta>",a),r=t.slice(a,e+10);try{const e=h(r,"hdrgm:GainMapMin","0"),t=h(r,"hdrgm:GainMapMax"),a=h(r,"hdrgm:Gamma","1"),n=h(r,"hdrgm:OffsetSDR","0.015625"),i=h(r,"hdrgm:OffsetHDR","0.015625"),o=/hdrgm:HDRCapacityMin="([^"]*)"/.exec(r),s=o?o[1]:"0",d=/hdrgm:HDRCapacityMax="([^"]*)"/.exec(r);if(!d)throw new Error("Incomplete gainmap metadata");const p=d[1];return{gainMapMin:Array.isArray(e)?e.map(e=>parseFloat(e)):[parseFloat(e),parseFloat(e),parseFloat(e)],gainMapMax:Array.isArray(t)?t.map(e=>parseFloat(e)):[parseFloat(t),parseFloat(t),parseFloat(t)],gamma:Array.isArray(a)?a.map(e=>parseFloat(e)):[parseFloat(a),parseFloat(a),parseFloat(a)],offsetSdr:Array.isArray(n)?n.map(e=>parseFloat(e)):[parseFloat(n),parseFloat(n),parseFloat(n)],offsetHdr:Array.isArray(i)?i.map(e=>parseFloat(e)):[parseFloat(i),parseFloat(i),parseFloat(i)],hdrCapacityMin:parseFloat(s),hdrCapacityMax:parseFloat(p)}}catch(e){}a=t.indexOf("<x:xmpmeta",e)}};class x{options;constructor(e){this.options={debug:!(!e||void 0===e.debug)&&e.debug,extractFII:!e||void 0===e.extractFII||e.extractFII,extractNonFII:!e||void 0===e.extractNonFII||e.extractNonFII}}extract(e){return new Promise((t,a)=>{const r=this.options.debug,n=new DataView(e.buffer);if(65496!==n.getUint16(0))return void a(new Error("Not a valid jpeg"));const i=n.byteLength;let o,s=2,d=0;for(;s<i;){if(++d>250)return void a(new Error(`Found no marker after ${d} loops 😵`));if(255!==n.getUint8(s))return void a(new Error(`Not a valid marker at offset 0x${s.toString(16)}, found: 0x${n.getUint8(s).toString(16)}`));if(o=n.getUint8(s+1),r&&console.log(`Marker: ${o.toString(16)}`),226===o){r&&console.log("Found APP2 marker (0xffe2)");const e=s+4;if(1297106432===n.getUint32(e)){const r=e+4;let i;if(18761===n.getUint16(r))i=!1;else{if(19789!==n.getUint16(r))return void a(new Error("No valid endianness marker found in TIFF header"));i=!0}if(42!==n.getUint16(r+2,!i))return void a(new Error("Not valid TIFF data! (no 0x002A marker)"));const o=n.getUint32(r+4,!i);if(o<8)return void a(new Error("Not valid TIFF data! (First offset less than 8)"));const s=r+o,d=n.getUint16(s,!i),p=s+2;let c=0;for(let e=p;e<p+12*d;e+=12)45057===n.getUint16(e,!i)&&(c=n.getUint32(e+8,!i));const l=s+2+12*d+4,g=[];for(let e=l;e<l+16*c;e+=16){const t={MPType:n.getUint32(e,!i),size:n.getUint32(e+4,!i),dataOffset:n.getUint32(e+8,!i),dependantImages:n.getUint32(e+12,!i),start:-1,end:-1,isFII:!1};t.dataOffset?(t.start=r+t.dataOffset,t.isFII=!1):(t.start=0,t.isFII=!0),t.end=t.start+t.size,g.push(t)}if(this.options.extractNonFII&&g.length){const e=new Blob([n]),a=[];for(const t of g){if(t.isFII&&!this.options.extractFII)continue;const r=e.slice(t.start,t.end+1,"image/jpeg");a.push(r)}t(a)}}}s+=2+n.getUint16(s+2)}})}}const w=async e=>{const t=u(e);if(!t)throw new f("Gain map XMP metadata not found");const a=new x({extractFII:!0,extractNonFII:!0}),r=await a.extract(e);if(2!==r.length)throw new m("Gain map recovery image not found");return{sdr:new Uint8Array(await r[0].arrayBuffer()),gainMap:new Uint8Array(await r[1].arrayBuffer()),metadata:t}},M=e=>new Promise((t,a)=>{const r=document.createElement("img");r.onload=()=>{t(r)},r.onerror=e=>{a(e)},r.src=URL.createObjectURL(e)});class F extends r{_renderer;_renderTargetOptions;_internalLoadingManager;_config;constructor(e,t){super(t),this._config=e,e.renderer&&(this._renderer=e.renderer),this._internalLoadingManager=new n}setRenderer(e){return this._renderer=e,this}setRenderTargetOptions(e){return this._renderTargetOptions=e,this}prepareQuadRenderer(){this._renderer||console.warn("WARNING: A Renderer was not passed to this Loader constructor or in setRenderer, the result of this Loader will need to be converted to a Data Texture with toDataTexture() before you can use it in your renderer.");const e=this._config.createMaterial({gainMapMax:[1,1,1],gainMapMin:[0,0,0],gamma:[1,1,1],offsetHdr:[1,1,1],offsetSdr:[1,1,1],hdrCapacityMax:1,hdrCapacityMin:0,maxDisplayBoost:1,gainMap:new i,sdr:new i});return this._config.createQuadRenderer({width:16,height:16,type:a,colorSpace:t,material:e,renderer:this._renderer,renderTargetOptions:this._renderTargetOptions})}async processImages(e,t,a){const r=t?new Blob([t],{type:"image/jpeg"}):void 0,n=new Blob([e],{type:"image/jpeg"});let i,o,s=!1;if("undefined"==typeof createImageBitmap){const e=await Promise.all([r?M(r):Promise.resolve(void 0),M(n)]);o=e[0],i=e[1],s="flipY"===a}else{const e=await Promise.all([r?createImageBitmap(r,{imageOrientation:a||"flipY"}):Promise.resolve(void 0),createImageBitmap(n,{imageOrientation:a||"flipY"})]);o=e[0],i=e[1]}return{sdrImage:i,gainMapImage:o,needsFlip:s}}createTextures(a,r,n){const g=new i(r||new ImageData(2,2),o,s,s,d,p,c,l,1,t);g.flipY=n,g.needsUpdate=!0;const m=new i(a,o,s,s,d,p,c,l,1,e);return m.flipY=n,m.needsUpdate=!0,{gainMap:g,sdr:m}}updateQuadRenderer(e,t,a,r,n){e.width=t.width,e.height=t.height,e.material.gainMap=a,e.material.sdr=r,e.material.gainMapMin=n.gainMapMin,e.material.gainMapMax=n.gainMapMax,e.material.offsetHdr=n.offsetHdr,e.material.offsetSdr=n.offsetSdr,e.material.gamma=n.gamma,e.material.hdrCapacityMin=n.hdrCapacityMin,e.material.hdrCapacityMax=n.hdrCapacityMax,e.material.maxDisplayBoost=Math.pow(2,n.hdrCapacityMax),e.material.needsUpdate=!0}}export{m as G,F as L,x as M,f as X,u as a,g as c,w as e};