2024-03-29 22:23:01 -07:00
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>PICO-8 Cartridge</title>
|
|
|
|
|
<meta name="viewport" content="width=device-width, user-scalable=no">
|
|
|
|
|
<style>
|
|
|
|
|
.cart-container {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: center;
|
|
|
|
|
}
|
|
|
|
|
.cart-container > canvas {
|
|
|
|
|
width: 512px;
|
2024-03-30 15:07:49 -07:00
|
|
|
max-width: calc(100% - 2px);
|
2024-03-29 22:23:01 -07:00
|
|
|
border: 1px solid white;
|
2024-03-30 15:07:49 -07:00
|
|
|
box-sizing: border-box;
|
2024-03-29 22:23:01 -07:00
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body style="padding:0px; margin:0px; background-color:#222; color:#ccc">
|
|
|
|
|
<div id="container" class="cart-container"></div>
|
|
|
|
|
<button id="start-button">Click</button>
|
|
|
|
|
<script type="module">
|
|
|
|
|
import {makePicoConsole, pngToRom} from "./dist/index.js";
|
2024-03-30 15:07:49 -07:00
|
|
|
import mygame from "./mygamefull.js";
|
|
|
|
|
// const arrayToHex = (a) => {
|
|
|
|
|
// const h = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
|
|
|
|
|
// return a.map(n => h[Math.floor(n/16)]+h[n%16]).join("");
|
|
|
|
|
// };
|
|
|
|
|
const hexToArray = (hex) => {
|
2024-03-29 22:23:01 -07:00
|
|
|
const h = ["0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"];
|
2024-03-30 15:07:49 -07:00
|
|
|
const a = [];
|
|
|
|
|
for (let i = 0; i < hex.length; i+=2) {
|
|
|
|
|
a.push(16*h.indexOf(hex[i])+h.indexOf(hex[i+1]));
|
|
|
|
|
}
|
|
|
|
|
return a;
|
2024-03-29 22:23:01 -07:00
|
|
|
};
|
2024-03-30 15:07:49 -07:00
|
|
|
mygame.carts[0] = ({name: mygame.carts[0].name, rom: hexToArray(mygame.carts[0].hex)});
|
|
|
|
|
// const mainRom = mygame.carts[0].rom;
|
|
|
|
|
// const pngRom = await pngToRom("mygame.p8.png");
|
|
|
|
|
// pngRom.forEach((v,i) => {
|
|
|
|
|
// if (v !== mainRom[i]) {
|
|
|
|
|
// console.log(i, Math.floor(i/160), i%160, v, mainRom[i]);
|
|
|
|
|
// }
|
|
|
|
|
// })
|
|
|
|
|
// console.log(arrayToHex(await pngToRom("secondcart.p8.png")));
|
2024-03-29 22:23:01 -07:00
|
|
|
async function start() {
|
2024-03-30 15:07:49 -07:00
|
|
|
const console1 = await makePicoConsole({carts: mygame.carts});
|
2024-03-29 22:23:01 -07:00
|
|
|
console.log(console1);
|
|
|
|
|
document.getElementById("container").appendChild(console1.canvas);
|
|
|
|
|
}
|
2024-03-29 20:23:14 -07:00
|
|
|
|
2024-03-29 22:23:01 -07:00
|
|
|
document.getElementById("start-button").addEventListener("click", start);
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
2024-03-29 00:00:12 -07:00
|
|
|
</html>
|
|
|
|
|
|
