jpambrun/index.html

## index.html
<!DOCTYPE HTML>
<html>

<head>
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>

<body>
    <div class="container">

        <h1>
            imageloader/index.html, for jpge
        </h1>

        <div id="dicomImage" style="width:512px;height:512px" oncontextmenu="return false" onmousedown="return false">
        </div>

    </div>
</body>

<script src="//unpkg.com/cornerstone-core/dist/cornerstone.js"></script>

<script>
    function loadImage(imageId) {
        return {
            promise: (async () => {
                const response = await fetch(imageId.slice(7))
                const imageDecoder = new ImageDecoder({ data: response.body, type: 'image/jpeg', premultiplyAlpha: "premultiply", colorSpaceConversion: "none" });
                const decoded = await imageDecoder.decode({ completeFramesOnly: true });
                const { codedHeight: height, codedWidth: width } = decoded.image
                const pixelData = new Uint8Array(4 * width * height);
                await decoded.image.copyTo(pixelData)
                decoded.image.close()

                // BGRA to RGBA..
                for (let i = 0, len = pixelData.length, t = 0; i < len; i += 4) {
                    t = pixelData[i];
                    pixelData[i] = pixelData[i + 2]
                    pixelData[i + 2] = t
                }

                return {
                    imageId: imageId,
                    minPixelValue: 0,
                    maxPixelValue: 255,
                    slope: 1.0,
                    intercept: 0,
                    windowCenter: 127,
                    windowWidth: 256,
                    render: cornerstone.renderColorImage,
                    getPixelData: () => pixelData,
                    rows: height,
                    columns: width,
                    height: height,
                    width: width,
                    color: true,
                    columnPixelSpacing: 1.0,
                    rowPixelSpacing: 1.0,
                    invert: false,
                    sizeInBytes: width * height * 3
                };

            })(),
            cancelFn: undefined
        }
    }

    cornerstone.registerImageLoader('jpeg', loadImage);
    const element = document.getElementById('dicomImage');
    cornerstone.enable(element);

    cornerstone.loadImage('jpeg://img.jpeg').then((image) => cornerstone.displayImage(element, image));
</script>

</html>
	<!DOCTYPE HTML>
	<html>

	<head>
	<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
	</head>

	<body>
	<div class="container">

	<h1>
	imageloader/index.html, for jpge
	</h1>

	<div id="dicomImage" style="width:512px;height:512px" oncontextmenu="return false" onmousedown="return false">
	</div>

	</div>
	</body>

	<script src="//unpkg.com/cornerstone-core/dist/cornerstone.js"></script>

	<script>
	function loadImage(imageId) {
	return {
	promise: (async () => {
	const response = await fetch(imageId.slice(7))
	const imageDecoder = new ImageDecoder({ data: response.body, type: 'image/jpeg', premultiplyAlpha: "premultiply", colorSpaceConversion: "none" });
	const decoded = await imageDecoder.decode({ completeFramesOnly: true });
	const { codedHeight: height, codedWidth: width } = decoded.image
	const pixelData = new Uint8Array(4 * width * height);
	await decoded.image.copyTo(pixelData)
	decoded.image.close()

	// BGRA to RGBA..
	for (let i = 0, len = pixelData.length, t = 0; i < len; i += 4) {
	t = pixelData[i];
	pixelData[i] = pixelData[i + 2]
	pixelData[i + 2] = t
	}

	return {
	imageId: imageId,
	minPixelValue: 0,
	maxPixelValue: 255,
	slope: 1.0,
	intercept: 0,
	windowCenter: 127,
	windowWidth: 256,
	render: cornerstone.renderColorImage,
	getPixelData: () => pixelData,
	rows: height,
	columns: width,
	height: height,
	width: width,
	color: true,
	columnPixelSpacing: 1.0,
	rowPixelSpacing: 1.0,
	invert: false,
	sizeInBytes: width * height * 3
	};

	})(),
	cancelFn: undefined
	}
	}

	cornerstone.registerImageLoader('jpeg', loadImage);
	const element = document.getElementById('dicomImage');
	cornerstone.enable(element);

	cornerstone.loadImage('jpeg://img.jpeg').then((image) => cornerstone.displayImage(element, image));
	</script>

	</html>