Recently, I set up a Django server for my personal/local use and wanted to incorporate an interactive game into it (not for deployment, just for myself). After some searching, I came across this cool open-source game: https://github.com/MattSkala/html5-bombergirl.git
Although I was able to run the game from a simple HTML page, integrating it into a Django template proved to be challenging.
Here is the valid HTML code where the game launches successfully in a web browser:
<!doctype html>
<html>
<head>
<script type="text/javascript" src="bower_components/EaselJS/lib/easeljs-0.8.1.min.js"></script>
<script type="text/javascript" src="bower_components/PreloadJS/lib/preloadjs-0.6.1.min.js"></script>
<!-- more script imports -->
<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/docs/assets/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head;
<canvas id="canvas" width="545" height="416"></canvas>
<script>
gGameEngine = new GameEngine();
gGameEngine.load();
</script>
</html>
In my Django setup, I made sure to update and load all the required static files (JavaScript, CSS, bower_components).
This is my views.py in Django:
def game(request):
return render(request, 'game.html')
And here's my game.html template:
{% extends "base.html" %}
{% block content %}
<canvas id="canvas" width="545" height="416"></canvas>
<script>
gGameEngine = new GameEngine();
gGameEngine.load();
</script>
{% endblock %}
Unfortunately, my page remains blank with no game loading or errors on the webpage or terminal. It seems as though nothing is happening at all.
I even attempted to add a function within the GameEngine.js file:
function my_run()
{
//document.getElementById("canvas").innerHTML = "Hi there, do I work ?";
gGameEngine = new GameEngine();
document.getElementById("canvas").innerHTML = gGameEngine.load()
}
Then adjusted my template to include:
<script src = {% static "game/js/GameEngine.js" %}> </script>
//<p id="canvas">Text for test.</p>
<canvas id="canvas" width="545" height="416"></canvas>
<button type = "button" onClick="my_run()">Click me!</button>
But still, no success!
Interestingly, displaying "Hi there, do I work?" in the "Text for test" paragraph works fine, indicating that the static files are being loaded correctly. However, the game itself still doesn't run. Any ideas on what could be causing this issue?
Thank you in advance for your assistance.