MapleShrine/mkxp
1
0
Fork 0
Code Issues 32 Pull requests 11 Projects Releases Wiki Activity

Add initial data preload

Browse source
This commit is contained in:
Varun Patil 2020-10-20 04:15:24 +05:30
parent 0fa7a4e687
commit 2f50155ad7
1 changed files with 115 additions and 94 deletions
Download patch file Download diff file Expand all files Collapse all files

209
extra/shell.html
View file

@ -270,6 +270,16 @@
console.error("An error occured!") console.error("An error occured!")
}; };
function preloadList(jsonArray) {
jsonArray.forEach((f) => {
const url = mapping[f.toLowerCase().replace(new RegExp("\\.[^/.]+$"), "")];
if (!url) return;
// Preload the asset
fetch('gameasync/' + url).then().catch();
});
}
window.fileLoadedAsync = function(file) { window.fileLoadedAsync = function(file) {
document.title = wTitle; document.title = wTitle;
@ -281,13 +291,7 @@
}) })
.then(function(jsonResponse) { .then(function(jsonResponse) {
setTimeout(() => { setTimeout(() => {
jsonResponse.forEach((f) => { preloadList(jsonResponse);
const url = mapping[f.toLowerCase().replace(new RegExp("\\.[^/.]+$"), "")];
if (!url) return;
// Preload the asset
fetch('gameasync/' + url).then().catch();
});
}, 200); }, 200);
}); });
}; };
@ -343,9 +347,27 @@
} }
document.title = wTitle; document.title = wTitle;
</script>
<script> // Load important files
preloadList([
'rgss.rb',
'data/scripts',
'data/actors',
'data/classes',
'data/skills',
'data/items',
'data/weapons',
'data/armors',
'data/enemies',
'data/troops',
'data/states',
'data/animations',
'data/tilesets',
'data/commonevents',
'data/system',
'data/mapinfos',
]);
// Load wasm then initialize // Load wasm then initialize
setTimeout(() => { setTimeout(() => {
getLazyAsset('mkxp.wasm', 'Game engine', () => { getLazyAsset('mkxp.wasm', 'Game engine', () => {
@ -353,108 +375,107 @@
s.setAttribute('src', 'mkxp.js'); s.setAttribute('src', 'mkxp.js');
document.body.appendChild(s); document.body.appendChild(s);
}); });
}, 500); }, 200);
function simulateKeyEvent(eventType, keyCode, charCode) { function simulateKeyEvent(eventType, keyCode, charCode) {
var e = document.createEventObject ? document.createEventObject() : document.createEvent("Events"); var e = document.createEventObject ? document.createEventObject() : document.createEvent("Events");
if (e.initEvent) e.initEvent(eventType, true, true); if (e.initEvent) e.initEvent(eventType, true, true);
e.keyCode = keyCode; e.keyCode = keyCode;
e.which = keyCode; e.which = keyCode;
e.charCode = charCode; e.charCode = charCode;
// Dispatch directly to Emscripten's html5.h API (use this if page uses emscripten/html5.h event handling): // Dispatch directly to Emscripten's html5.h API (use this if page uses emscripten/html5.h event handling):
if (typeof JSEvents !== 'undefined' && JSEvents.eventHandlers && JSEvents.eventHandlers.length > 0) { if (typeof JSEvents !== 'undefined' && JSEvents.eventHandlers && JSEvents.eventHandlers.length > 0) {
for(var i = 0; i < JSEvents.eventHandlers.length; ++i) { for(var i = 0; i < JSEvents.eventHandlers.length; ++i) {
if ((JSEvents.eventHandlers[i].target == Module['canvas'] || JSEvents.eventHandlers[i].target == window) if ((JSEvents.eventHandlers[i].target == Module['canvas'] || JSEvents.eventHandlers[i].target == window)
&& JSEvents.eventHandlers[i].eventTypeString == eventType) { && JSEvents.eventHandlers[i].eventTypeString == eventType) {
JSEvents.eventHandlers[i].handlerFunc(e); JSEvents.eventHandlers[i].handlerFunc(e);
}
} }
} else {
// Dispatch to browser for real (use this if page uses SDL or something else for event handling):
Module['canvas'].dispatchEvent ? Module['canvas'].dispatchEvent(e) : Module['canvas'].fireEvent("on" + eventType, e);
} }
} else {
// Dispatch to browser for real (use this if page uses SDL or something else for event handling):
Module['canvas'].dispatchEvent ? Module['canvas'].dispatchEvent(e) : Module['canvas'].fireEvent("on" + eventType, e);
} }
}
// Mappings // Mappings
const keyMap = {}; const keyMap = {};
const keysDown = {}; const keysDown = {};
/** Add virtual key binding */ /** Add virtual key binding */
function bindKey(elem, key) { function bindKey(elem, key) {
keyMap[elem] = key; keyMap[elem] = key;
const ne = document.getElementById(elem); const ne = document.getElementById(elem);
ne.addEventListener('touchstart', function(e) { ne.addEventListener('touchstart', function(e) {
e.preventDefault(); e.preventDefault();
simulateKeyEvent('keydown', key); simulateKeyEvent('keydown', key);
keysDown[e.target.id] = elem; keysDown[e.target.id] = elem;
}); });
ne.addEventListener('touchend', function(e) { ne.addEventListener('touchend', function(e) {
e.preventDefault(); e.preventDefault();
if (keysDown[e.target.id] && keyMap[keysDown[e.target.id]]) { if (keysDown[e.target.id] && keyMap[keysDown[e.target.id]]) {
simulateKeyEvent('keyup', keyMap[keysDown[e.target.id]]); simulateKeyEvent('keyup', keyMap[keysDown[e.target.id]]);
}
keysDown[e.target.id] = 0;
});
ne.addEventListener('touchmove', function(event) {
const myLocation = event.changedTouches[0];
const realTarget = document.elementFromPoint(myLocation.clientX, myLocation.clientY).id;
const origTarget = keysDown[myLocation.target.id];
if (origTarget !== realTarget) {
if (origTarget) {
simulateKeyEvent('keyup', keyMap[origTarget]);
keysDown[myLocation.target.id] = 0;
} }
if (keyMap[realTarget]) { keysDown[e.target.id] = 0;
simulateKeyEvent('keydown', keyMap[realTarget]); });
keysDown[myLocation.target.id] = realTarget;
ne.addEventListener('touchmove', function(event) {
const myLocation = event.changedTouches[0];
const realTarget = document.elementFromPoint(myLocation.clientX, myLocation.clientY).id;
const origTarget = keysDown[myLocation.target.id];
if (origTarget !== realTarget) {
if (origTarget) {
simulateKeyEvent('keyup', keyMap[origTarget]);
keysDown[myLocation.target.id] = 0;
}
if (keyMap[realTarget]) {
simulateKeyEvent('keydown', keyMap[realTarget]);
keysDown[myLocation.target.id] = realTarget;
}
} }
});
}
function is_touch_device() {
try {
document.createEvent("TouchEvent");
return true;
} catch (e) {
return false;
} }
});
}
function is_touch_device() {
try {
document.createEvent("TouchEvent");
return true;
} catch (e) {
return false;
} }
}
if (!is_touch_device()) { if (!is_touch_device()) {
document.getElementById('dpad').style.display = 'none'; document.getElementById('dpad').style.display = 'none';
document.getElementById('apad').style.display = 'none'; document.getElementById('apad').style.display = 'none';
}
// Add all bindings
bindKey('d-up', 38);
bindKey('d-right', 39);
bindKey('d-down', 40);
bindKey('d-left', 37);
bindKey('ap-c', 67);
bindKey('ap-b', 88);
bindKey('ap-a', 90);
bindKey('ap-ka', 65);
const resize = function() {
const el = document.getElementById('canvas');
if (window.innerHeight > window.innerWidth) {
el.style.height = 'unset';
el.style.width = '100%';
} else {
el.style.width = 'unset';
el.style.height = '100%';
} }
}
window.addEventListener('resize', resize); // Add all bindings
resize(); bindKey('d-up', 38);
bindKey('d-right', 39);
bindKey('d-down', 40);
bindKey('d-left', 37);
bindKey('ap-c', 67);
bindKey('ap-b', 88);
bindKey('ap-a', 90);
bindKey('ap-ka', 65);
const resize = function() {
const el = document.getElementById('canvas');
if (window.innerHeight > window.innerWidth) {
el.style.height = 'unset';
el.style.width = '100%';
} else {
el.style.width = 'unset';
el.style.height = '100%';
}
}
window.addEventListener('resize', resize);
resize();
</script> </script>
<!-- {{{ SCRIPT }}} --> <!-- {{{ SCRIPT }}} -->