baiyanlali/MarioWeb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/BigJIU/MarioWeb

Browse Source
This commit is contained in:
bigJIU 2023-04-06 14:37:12 +08:00
commit 8d3b99ad69
10 changed files with 118 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.idea/.name generated Normal file
View File

@ -0,0 +1 @@
main.py

2
.idea/MarioWeb.iml generated
View File

@ -5,7 +5,7 @@
</component> </component>
<component name="NewModuleRootManager"> <component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$" /> <content url="file://$MODULE_DIR$" />
<orderEntry type="inheritedJdk" /> <orderEntry type="jdk" jdkName="VisMOO" jdkType="Python SDK" />
<orderEntry type="sourceFolder" forTests="false" /> <orderEntry type="sourceFolder" forTests="false" />
</component> </component>
<component name="TemplatesService"> <component name="TemplatesService">

2
.idea/misc.xml generated
View File

@ -1,4 +1,4 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<project version="4"> <project version="4">
<component name="ProjectRootManager" version="2" project-jdk-name="Python 3.9" project-jdk-type="Python SDK" /> <component name="ProjectRootManager" version="2" project-jdk-name="VisMOO" project-jdk-type="Python SDK" />
</project> </project>

18
main.py
View File

@ -193,21 +193,27 @@ def gameannoresult2(id):
return redirect(url_for("gameplay2", id=id)) return redirect(url_for("gameplay2", id=id))
@app.route("/gameover") @app.route("/gameover",methods=['POST','GET'])
def over(): def over():
finish = idm.getTimes(getId()) finish = idm.getTimes(getId())
return render_template("GameOver.html", finish=1, stage=1)
@app.route("/gameover/<id>/feedback", methods=['POST'])
def overa():
if request.method == 'POST': if request.method == 'POST':
resultList = list(request.form)[0].split(",") resultList = list(request.form)[0].split(",")
idm.write_csv(feedbackPath, idm.write_csv(feedbackPath,
[getId(), resultList[0], [getId(), resultList[0],
""]) ""])
return render_template("GameOver.html", finish=1, stage=1)
# @app.route('/feedback', methods=['POST'])
# def overa():
# if request.method == 'POST':
# resultList = list(request.form)[0].split(",")
# idm.write_csv(feedbackPath,
# [getId(), resultList[0],
# ""])
# return redirect(url_for("over", id=id))
def saveFile(path, filename, content): def saveFile(path, filename, content):
cp = list(map(int, content)) cp = list(map(int, content))
file_dir = os.path.join(os.getcwd(), path) file_dir = os.path.join(os.getcwd(), path)

39
templates/GameOver.html
View File

@ -3,7 +3,7 @@
<html lang="en"> <html lang="en">
<script <script
id="allow-copy_script">(function t() { var t = !1; document.addEventListener("allow_copy", (function (n) { t = n.detail.unlock })); var n = ["copy", "cut", "contextmenu", "selectstart", "mousedown", "mouseup", "mousemove", "keydown", "keypress", "keyup"], e = function (n) { t && (n.stopPropagation(), n.stopImmediatePropagation && n.stopImmediatePropagation()) }; n.forEach((function (t) { document.documentElement.addEventListener(t, e, { capture: !0 }) })) })()</script> id="allow-copy_script">(function t() { var t = !1; document.addEventListener("allow_copy", (function (n) { t = n.detail.unlock })); var n = ["copy", "cut", "contextmenu", "selectstart", "mousedown", "mouseup", "mousemove", "keydown", "keypress", "keyup"], e = function (n) { t && (n.stopPropagation(), n.stopImmediatePropagation && n.stopImmediatePropagation()) }; n.forEach((function (t) { document.documentElement.addEventListener(t, e, { capture: !0 }) })) })()</script>
<script src="../templates/Web/jquery.min.js"></script>
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="https://cjrtnc.leaningtech.com/2.3/loader.js"></script> <script src="https://cjrtnc.leaningtech.com/2.3/loader.js"></script>
@ -189,9 +189,10 @@
<br> <br>
<br> <br>
<h3>Do you have any feedback?</h3>
<form id="ajaxform">
<h3>Do you have any feedback?</h3>
<br> <br>
<form method="POST" action="feedback">
<textarea <textarea
id="message" id="message"
cols="60" cols="60"
@ -200,7 +201,7 @@
></textarea> ></textarea>
<br><br> <br><br>
<input type="submit" value="Submit" class="cirButton"> <input type="submit" value="Submit" class="cirButton" onclick="submit_it()">
</form> </form>
<script> <script>
document.getElementById("hideButton").addEventListener("click", function () { document.getElementById("hideButton").addEventListener("click", function () {
@ -217,6 +218,32 @@
// var newWindow = window.open("", "_self"); // var newWindow = window.open("", "_self");
// newWindow.close(); // newWindow.close();
// }); // });
function submit_it() {
$("#ajaxform").hide()
$("#ajaxform").submit(function(e)
{
var postData = JSON.stringify($("#message").val());
{#var formURL = $(this).attr("action");#}
$.ajax(
{
url : "gameover",
type: "POST",
data : postData,
success:function(data)
{
//data: return data from server
}
});
e.preventDefault(); //STOP default action
{#e.unbind(); //unbind. to stop multiple form submit.#}
});
}
</script> </script>
</div> </div>
@ -229,7 +256,7 @@
</section> </section>
<div class="col-xl-7 justify-content-between align-content-center" style="margin: auto">This page is created by <a href="https://github.com/BigJIU">Haocheng Du</a>, <a href="doveliyuchen.github.io">Yuchen Li</a>; game content is generated by <a href="https://github.com/PneuC">Ziqi Wang</a>. This project is supported by <a href="http://www.liujialin.tech/">Dr. Liu</a> and <a href="https://yannakakis.net/">Prof. Yannakakis</a>.</div> <div class="col-xl-7 justify-content-between align-content-center" style="margin: auto">This page is created by <a href="https://github.com/BigJIU">Haocheng Du</a>, <a href="https://doveliyuchen.github.io">Yuchen Li</a>; game content is generated by <b>procedural content generator (PCG) </b>designed by<a href="https://github.com/PneuC"> Ziqi Wang</a>.<br> This project is supported by <a href="http://www.liujialin.tech/">Dr. Liu</a> and <a href="https://yannakakis.net/">Prof. Yannakakis</a>.</div>
<br><br> <br><br>
@ -250,7 +277,7 @@
</footer> </footer>
<!-- Bootstrap core JavaScript --> <!-- Bootstrap core JavaScript -->
<script src="../templates/Web/jquery.min.js"></script>
<script src="../templates/Web/bootstrap.bundle.min.js"></script> <script src="../templates/Web/bootstrap.bundle.min.js"></script>
<!-- Plugin JavaScript --> <!-- Plugin JavaScript -->

117
templates/GameTutorial.html
View File

@ -217,18 +217,19 @@
<div class="container" style="font-weight: 600 <div class="container" style="font-weight: 600
;"> ;">
<div class="row clearfix" > <div class="row clearfix">
<!-- <style=" background-color: rgba(255,255,255);height: 130vh; <!-- <style=" background-color: rgba(255,255,255);height: 130vh;
margin-top: -90px;"> --> margin-top: -90px;"> -->
<div class="col-md-12" style=" background-color: rgba(255,255,255);" > <div class="col-md-12" style=" background-color: rgba(255,255,255);">
<div align="center"> <div align="center">
<h3>Super Mario Bros Tutorial</h3> <h3>Super Mario Bros Tutorial</h3>
<p > Before proceeding to the main part of the experiment please familiarize yourself with the game.<br> <p> Before proceeding to the main part of the experiment please familiarize yourself with the game.<br>
You may proceed to the next phase of this survey once you are ready!</p> You may proceed to the next phase of this survey once you are ready!</p>
<b onclick="replay()" style="cursor: pointer;">Click <u style="color:blue; ">ME</u> to show the instruction page again.</b> <b onclick="replay()" style="cursor: pointer;">Click <u style="color:blue; ">ME</u> to show the instruction
page again.</b>
<p class="alert">If the game is not responding to your keyboard, please click on the game screen.</p> <p class="alert">If the game is not responding to your keyboard, please click on the game screen.</p>
</div> </div>
@ -245,7 +246,7 @@
</div> </div>
</div> </div>
<div class="col-md-6" align="center" style="visibility: hidden;" id="next"> <div class="col-md-6" align="center" style="visibility: hidden;" id="next">
<br> <br>
@ -254,7 +255,7 @@
document.getElementById("game").style.visibility = "hidden"; document.getElementById("game").style.visibility = "hidden";
document.getElementById("next").style.visibility = "hidden"; document.getElementById("next").style.visibility = "hidden";
var control = ("{{control}}" == "1");
//var divElement = document.getElementById("GameWindow"); //var divElement = document.getElementById("GameWindow");
tutorialId = tutorialId+1 tutorialId = tutorialId+1
var level = "t"+tutorialId; var level = "t"+tutorialId;
@ -266,7 +267,7 @@
document.getElementById("loading").style.visibility = "hidden"; document.getElementById("loading").style.visibility = "hidden";
$("#mask").hide(); $("#mask").hide();
}) })
var control = ("{{control}}" == "1");
PlayLevel(level,control) PlayLevel(level,control)
.then(function (){ .then(function (){
@ -289,59 +290,64 @@
</button> </button>
</div> </div>
<div id="countdown"
style="z-index:999; position:absolute; left:50px; bottom: 20px; color: #ffffff; font-size: xx-large; ">
</div>
<img style=" height: 90vh;bottom: 3.5vh; left: 0vw; <img style=" height: 90vh;bottom: 3.5vh; left: 0vw;
position: absolute;z-index: 900; visibility: visible; width: 100%;" src="../templates/Web/pic.png" position: absolute;z-index: 900; visibility: visible; width: 100%;" src="../templates/Web/pic.png"
id="windowshow"> id="windowshow">
<img style=" height: 90vh;bottom: 3.5vh; left: 0vw;
position: absolute;z-index: 902; visibility: visible; width: 100%;" src="../templates/Web/top.png" id="top">
<img style=" height: 90vh;bottom: 3.5vh; left: 0vw;
position: absolute;z-index: 902; visibility: visible; width: 100%;" src="../templates/Web/bot.png" id="bot">
<script> <script>
function countdown() {
// var count = 10; // 设置倒计时秒数
// var timer = setInterval(function () {
// count--;
// if (count <= 0) {
// clearInterval(timer);
// $("#countdown").hide();
// $("#windowshow:visible").hide(); // 倒计时结束后隐藏倒计时容器
// } else {
$("#countdown").html("Click to close."); // 更新倒计时容器内容
$("#windowshow").click(function () {
$("#windowshow").hide();
$("#countdown").hide();
});}
// }
// }, 1000);
// }
$(document).ready(function () {
countdown();
});
</script>
<script>
//Init Cheerpj Framework
cheerpjInit(); cheerpjInit();
var divElement = document.getElementById("GameWindow"); var divElement = document.getElementById("GameWindow");
var tutorialId = parseInt("{{tutorial}}") var tutorialId = parseInt("{{tutorial}}")
var level = "t" + "{{tutorial}}"; var level = "t" + "{{tutorial}}";
var img = document.getElementById("windowshow"); var img = document.getElementById("windowshow");
var control = ("{{control}}" == "1");
if (control) {
$("#top:visible").hide();
console.log("1")
} else {
$("#bot:visible").hide();
console.log("2")
}
$("#windowshow").click(function () {
$("#windowshow:visible").hide();
});
$("#bot").click(function () {
$("#bot:visible").hide();
});
$("#top").click(function () {
$("#top:visible").hide();
});
cheerpjCreateDisplay(500, 500, divElement); cheerpjCreateDisplay(500, 500, divElement);
cheerpjRunMain("Play", "/app/Mario-AI-Interface.jar", "0", "f_l"); cheerpjRunMain("Play", "/app/Mario-AI-Interface.jar", "0", "f_l");
GameLoad().then(function () { GameLoad().then(function () {
console.log("Cheerpj Initialize Succeed!");
$("#windowshow:visible").hide(); $("#windowshow:visible").hide();
$("#countdown").hide(); {#console.log("Cheerpj Initialize Succeed!", control);#}
document.getElementById("loading").style.visibility = 'hidden'; document.getElementById("loading").style.visibility = 'hidden';
}) })
var control = ("{{control}}" == "1");
PlayLevel(level, control) PlayLevel(level, control)
.then(function () { .then(function () {
@ -350,9 +356,24 @@
document.getElementById("next").style.visibility = "visible"; document.getElementById("next").style.visibility = "visible";
} }
document.getElementById("game").style.visibility = "visible"; document.getElementById("game").style.visibility = "visible";
$("#mask").hide(); $("#mask").hide();
}); });
function replay() {
$("#windowshow:hidden").show();
if(control){
$("#bot:hidden").show();
}else {
$("#top:hidden").show();
}
}
</script> </script>
</div> </div>
@ -366,19 +387,11 @@
</div> </div>
<!-- <p>more icon-more</p> -->
</div> </div>
<script>
function replay() {
$("#windowshow:hidden").show();
}
</script>
</section> </section>
@ -388,7 +401,7 @@
<!-- Footer mx-auto --> <!-- Footer mx-auto -->
<footer class="py-5 bg-dark"> <footer class="py-5 bg-dark">
<div class="container"> <div class="container">
<div class="row clearfix" > <div class="row clearfix">
<!-- <div class="col-md-2 column"> <!-- <div class="col-md-2 column">
<img class="img-fluid" alt="" src="../templates/Web/Wechat.png" style="width: 100px;"> <img class="img-fluid" alt="" src="../templates/Web/Wechat.png" style="width: 100px;">
</div> --> </div> -->

6
templates/GameWelcome.html
View File

@ -289,6 +289,10 @@
</div> </div>
</section> </section>
<div class="col-xl-7 justify-content-between align-content-center" style="margin: auto">This page is created by <a href="https://github.com/BigJIU">Haocheng Du</a>, <a href="https://doveliyuchen.github.io">Yuchen Li</a>; game content is generated by <b>procedural content generator (PCG) </b>designed by<a href="https://github.com/PneuC"> Ziqi Wang</a>.<br> This project is supported by <a href="http://www.liujialin.tech/">Dr. Liu</a> and <a href="https://yannakakis.net/">Prof. Yannakakis</a>.</div>
<br><br>
<!-- Footer mx-auto --> <!-- Footer mx-auto -->
<footer class="py-5 bg-dark"> <footer class="py-5 bg-dark">
<div class="container"> <div class="container">
@ -321,4 +325,4 @@
</body> </body>
</html> </html>

BIN
templates/Web/bot.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 40 KiB

BIN
templates/Web/pic.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 336 KiB

After

Width:  |  Height:  |  Size: 318 KiB

BIN
templates/Web/top.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 43 KiB