From abef6da56913f1c55528103e60a50451a39628b1 Mon Sep 17 00:00:00 2001 From: WlodekM Date: Sun, 16 Jun 2024 10:35:45 +0300 Subject: initial commit --- doc/hosting-flask.md | 186 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 186 insertions(+) create mode 100644 doc/hosting-flask.md (limited to 'doc/hosting-flask.md') diff --git a/doc/hosting-flask.md b/doc/hosting-flask.md new file mode 100644 index 0000000..e72c0c2 --- /dev/null +++ b/doc/hosting-flask.md @@ -0,0 +1,186 @@ +The page provides a complete example for how to integrate the webclient into a simple website + +The example website will be structured like so: + +``` +websrv.py +templates/play.html +static/classisphere.js +static/default.zip +static/style.css +static/jquery.js +``` + +## Content +#### websrv.py +```Python +from flask import Flask, render_template, request +app = Flask(__name__) + +@app.route("/") +def index(): + return '

Welcome!

Click here to play' + +@app.route("/play") +@app.route("/play/") +def play(): + user = request.args.get('user') or 'Singleplayer' + ver = request.args.get('mppass') or '' + addr = request.args.get('ip') + port = request.args.get('port') or '25565' + + if addr: + args = "['%s', '%s', '%s', '%s']" % (user, ver, addr, port) + else: + args = "['%s']" % user + return render_template('play.html', game_args=args) + +if __name__ == "__main__": + app.run() +``` + +#### templates/play.html +```HTML +{% set mobile_mode = request.user_agent.platform in ('android', 'iphone', 'ipad') %} + + + + + + + +{% if mobile_mode %} + +{% else %} + +{% endif %} +
+
+
+ + +
+
+ + +
+ + +``` + +#### static/classisphere.js +Download `cs.classicube.net/client/latest/ClassiCube.js` for this + +#### static/default.zip +Download `classicube.net/static/default.zip` for this + +#### static/style.css +```CSS +body { margin: 0; } + +.row { + margin-left: auto; + margin-right: auto; + max-width: 62.5em; +} + +a { text-decoration: none; } + +.columns { display: inline-block; } + +.sec { + background:#f1ecfa; + padding:10px 0 5px; +} + +#header { background-color:#5870b0; } + +#header h1 { + color:#fff; + margin:0px 10px 0px 10px; + width: 200px; +} +``` + +#### static/jquery.js +Download some version of jQuery for this. Version 2.1.1 is known to work. + +## Notes + +* If you don't want the game to resize to fit different resolutions, remove the `resizeGameCanvas` code. + +* mobile_mode is used to deliver a minified page for mobile/tablet devices + +## Results + +After all this setup, you need to install the flask package for python. + +Then in command prompt/terminal enter: `python websrv.py` + +Then navigate to `http://127.0.0.1:5000/play` in your web browser. If all goes well you should see the web client start in singleplayer. + +To start in multiplayer instead, navigate to `http://127.0.0.1:5000/play?user=test&ip=127.0.0.1&port=25565` -- cgit 1.4.1-2-gfad0