webgl: added some images
This commit is contained in:
parent
994007bec0
commit
786c2811d6
Binary file not shown.
After Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
After Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
After Width: | Height: | Size: 2.8 KiB |
67
index.html
67
index.html
|
@ -30,6 +30,17 @@
|
|||
<div class="controls">
|
||||
<form>
|
||||
<table>
|
||||
<tr>
|
||||
<td>Image</td>
|
||||
<td>
|
||||
<select id="input-image" class="input-image">
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td> </td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Decoder</td>
|
||||
<td>
|
||||
|
@ -136,7 +147,7 @@
|
|||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td><input type="reset" value="Reset"></td>
|
||||
<td><input type="reset" id="reset" value="Reset"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</form>
|
||||
|
@ -175,20 +186,40 @@
|
|||
}
|
||||
|
||||
async function setupScreenView() {
|
||||
const image = await screenEmu.loadImage("images/airheart-560x192.png");
|
||||
// const image = await screenEmu.loadImage("images/battle-chess.png");
|
||||
const [imageCanvas, imageData] = screenEmu.screenData(image, screenEmu.C.NTSC_DETAILS);
|
||||
const images = [
|
||||
["images/airheart-560x192.png", "Airheart", true ],
|
||||
["images/battle-chess.png", "Battle Chess", true ],
|
||||
["images/archon.png", "Archon", false],
|
||||
["images/archon-ii.png", "Archon II", true ],
|
||||
["images/lode-runner.png", "Lode Runner", true ],
|
||||
["images/marty-reader.png", "Marty's Family Reader", true ],
|
||||
];
|
||||
|
||||
const image1 = await screenEmu.loadImage("images/airheart-560x192.png");
|
||||
const image2 = await screenEmu.loadImage("images/battle-chess.png");
|
||||
const image3 = await screenEmu.loadImage("images/archon.png");
|
||||
const image4 = await screenEmu.loadImage("images/archon-ii.png");
|
||||
const image5 = await screenEmu.loadImage("images/lode-runner.png");
|
||||
const image6 = await screenEmu.loadImage("images/marty-reader.png");
|
||||
|
||||
const imsel = document.getElementById('input-image');
|
||||
|
||||
for (let i = 0; i < images.length; i++) {
|
||||
const image = await screenEmu.loadImage(images[i][0]);
|
||||
images[i].push(image);
|
||||
const option = document.createElement("option");
|
||||
option.text = images[i][1];
|
||||
option.value = i;
|
||||
imsel.appendChild(option);
|
||||
}
|
||||
|
||||
let canvas = document.getElementById("d");
|
||||
let sv = new screenEmu.ScreenView(canvas);
|
||||
await sv.initOpenGL();
|
||||
|
||||
let imageInfo = new screenEmu.ImageInfo(imageData);
|
||||
let displayConfig = new screenEmu.DisplayConfiguration();
|
||||
displayConfig.displayResolution = new screenEmu.Size(d.width, d.height);
|
||||
sv.image = imageInfo;
|
||||
sv.displayConfiguration = displayConfig;
|
||||
sv.vsync();
|
||||
|
||||
update = () => {
|
||||
updateDisplayConfig(displayConfig);
|
||||
|
@ -200,10 +231,30 @@
|
|||
elem.onchange = update;
|
||||
}
|
||||
|
||||
updateImage = () => {
|
||||
const index = Number(imsel.value);
|
||||
const [imageCanvas, imageData] = screenEmu.screenData(images[index][3],
|
||||
screenEmu.C.NTSC_DETAILS,
|
||||
images[index][2]);
|
||||
let imageInfo = new screenEmu.ImageInfo(imageData);
|
||||
sv.image = imageInfo;
|
||||
sv.vsync();
|
||||
}
|
||||
|
||||
updateImage();
|
||||
imsel.onchange = updateImage;
|
||||
|
||||
document.getElementById('reset').onclick = () => {
|
||||
setTimeout(() => {
|
||||
update();
|
||||
updateImage();
|
||||
}, 0);
|
||||
}
|
||||
|
||||
// sv.freeOpenGL();
|
||||
}
|
||||
|
||||
setupScreenView().then(() => console.log('setupScreenView: success'));
|
||||
setupScreenView();
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
|
Loading…
Reference in New Issue