Future request: Allow loupe image source to be encoded about loupe

[redoPop]

I understand your request now. This isn't something I'd add to Loupe itself, but the image method could be overridden to perform the decoding or to return a value decoded elsewhere, e.g.:

const loupe = new Loupe(document.getElementById('demo-1'));
const url = atob(loupe.el.getAttribute('data-enc'));
loupe.image = () => url;

[redoPop]

Hi! Based on your example, you should be able to use the data URI scheme to accomplish this; e.g.:

<img src="data:<?php echo mime_content_type('big.jpg'); ?>;base64,<?php echo base64_encode(file_get_contents('big.jpg')); ?>" />

Because Loupe uses CSS background images, a data URI will work just as well for an <a href="…"> scenario as it would for an <img src="…"> scenario.

Does that help you?

[crisc2000]

I never tried to encode a 20Mpx image but I think cpu usage increase will be big for both server and client, usually this type of encode is used for small images like icons. I only suggested to accept base64 encoded file name/path, not to convert all the file to data:base64.
It's just a suggestion, maybe some other people will want to not reveal the path to the big size image.