There is a problem when using HTMLifier-generated site from iframes. Example of this is when you want to publish the project on Itch.io.
The problem is that the mouse and keyboard are not focused on the iframe, so it is impossible to control the game in it. Based on itchio/itch.io#58, this is a problem with software that generates game, in this case HTMLifier.
Based on comments in that issue, the generated file needs to be modified to handle mouse and keyboard clicks and focus iframe's window on load and mouse click.
To do this, I created a simple SH script which modifies generated file and adds required handlers:
if [[ $# -ne 1 ]]; then
echo "Illegal number of parameters"
echo ""
echo "The first and only parameter has to"
echo "be the path to a file to be patched"
exit 2
fi
SET_WINDOW_FOCUS="function setWindowFocus() { window.focus() }"
PREVENT_USE_OF_DEFAULT_KEYS="function preventUseOfDefaultKeys(event) { if (event.keyCode == 32) { event.preventDefault() } }"
SCRIPT_START="<script>"
SCRIPT_END="</script>"
ORIGINAL_BODY="<body>"
PATCHED_BODY="<body onload=\"setWindowFocus()\" onclick=\"setWindowFocus()\" onkeydown=\"preventUseOfDefaultKeys(event)\">"
ADDITION="${SCRIPT_START} ${SET_WINDOW_FOCUS} ${PREVENT_USE_OF_DEFAULT_KEYS} ${SCRIPT_END}"
grep -qxF "${ADDITION}" "${1}" || echo "${ADDITION}" >> "${1}"
sed -i "s/${ORIGINAL_BODY}/${PATCHED_BODY}/g" "${1}"
Example of the game which uses this is this game (by me).
However, there are still some problems. When the iframe loads, it will not be focused. this means that when you click "Run game" button on Itch, you will still need to click again to actually focus the iframe and control the game. Another problem is that when you click a fullscreen button (in the bottom-right corner), the focus will be lost again so you will need to re-click the iframe to focus it again. Also, in PREVENT_USE_OF_DEFAULT_KEYS
, I only handled space-bar press, as this is the only key which I use in my game. However, I don't know if other keys also need to be handled for other games, or this keypress handler is not needed at all.
The final result should be that when you load iframe, it will be automatically focused. Also, when you press the fullscreen button, the focus shouldn't be lost. And in case you lose focus because you want, you should be able to restore it with a mouse click on iframe.
@SheepTester Do you know how to fix these issues? If so, can you please release that mouse and key handlers directly into default HTMLifier file, so my script won't be needed anymore and everything will work.