First of all, thank you for maintaining this repository.
While I'm making a third-party app using Jeri, I found that it cannot load the HDR image in URI format, that is in data:image/x-exr;base64,~, whereas other types of LDR images (tested jpg, png) are loaded successfully.
Here is a sample code that reproduces the problem. Run the HTML then press the Choose File button to select any images like the image images/test_image.exr or images/test_image.jpg given in this repository
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Example: Basic</title>
<style>
.stretch {
width: 100%;
height: 100%;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
</style>
</head>
<body>
<div style="width:100%; height: 80vh; position: relative;">
<canvas id="image-layer" class="stretch"></canvas>
<div id="mouse-layer" class="stretch"></div>
</div>
<input type="file" onchange="encodeImageFileAsURL(this)" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.8.6/umd/react.development.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.8.6/umd/react-dom.development.js"></script>
<script src="./jeri.js"></script>
</script>
<script>
const ImageLayer = Jeri.ImageLayer;
const MouseLayer = Jeri.MouseLayer;
const cache = new Jeri.ImageCache();
function encodeImageFileAsURL(element) {
var file = element.files[0];
var reader = new FileReader();
reader.onloadend = function () {
cache.get(reader.result)
.then((image) => {
const imageLayer = new ImageLayer(document.getElementById('image-layer'), image);
const mouseLayer = new MouseLayer(document.getElementById('mouse-layer'), image);
mouseLayer.setEnableMouseEvents(true);
mouseLayer.onTransformationChange(function (transformation) {
imageLayer.setTransformation(transformation);
});
})
.catch((error) => console.error(error));
}
reader.readAsDataURL(file);
}
</script>
</body>
</html>
First of all, thank you for maintaining this repository.
While I'm making a third-party app using Jeri, I found that it cannot load the HDR image in URI format, that is in
data:image/x-exr;base64,~, whereas other types of LDR images (tested jpg, png) are loaded successfully.Here is a sample code that reproduces the problem. Run the HTML then press the
Choose Filebutton to select any images like the imageimages/test_image.exrorimages/test_image.jpggiven in this repository