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

Update the format and PCG details

Browse Source 
Update the format and PCG details
This commit is contained in:
Doveliyuchen 2023-04-11 15:22:08 +08:00
parent c03c6dac91
commit 7d041a7fbe
7 changed files with 107 additions and 398 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
templates/GameAnnotation.html
View File

@ -64,47 +64,6 @@
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
} }
.groupname {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 45px;
font-weight: bold;
}
.slogan {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 40px;
font-style: italic;
/* font-weight:Light 300 italic; */
font-family: 'Consolas', monospace;
color: #c4cbcf;
}
.hiddenpart {
opacity: 0;
max-width: 0;
color: #c4cbcf;
transition: 1.3s ease-out;
}
.slogan:hover .hiddenpart {
opacity: 1;
max-width: 10em;
}
.news_prefix {
display: inline-block;
width: 30px;
height: 30px;
background-image: url("static/img/news_prefix.png");
background-size: 150px, 30px;
}
svg { svg {
width: 50px; width: 50px;
height: 26px; height: 26px;

91
templates/GameOver.html
View File

@ -4,6 +4,7 @@
<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> <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>
@ -28,27 +29,11 @@
<link href="../templates/Web/css2" rel="stylesheet"> <link href="../templates/Web/css2" rel="stylesheet">
<style> <style>
#funding:hover+#prove { #funding:hover+#prove {
display: block; display: block;
} }
.popwindow {
width: 500px;
height: 550px;
border: 3px solid #ff928e;
visibility: hidden;
position: absolute;
z-index: 999;
opacity: 1;
overflow: hidden;
background-color: white;
text-align: center;
margin-top: 10%;
margin-left: 35%;
border-radius: 10px;
}
.cirButton { .cirButton {
width: 40%; width: 40%;
@ -64,47 +49,6 @@
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
} }
.groupname {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 45px;
font-weight: bold;
}
.slogan {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 40px;
font-style: italic;
/* font-weight:Light 300 italic; */
font-family: 'Consolas', monospace;
color: #c4cbcf;
}
.hiddenpart {
opacity: 0;
max-width: 0;
color: #c4cbcf;
transition: 1.3s ease-out;
}
.slogan:hover .hiddenpart {
opacity: 1;
max-width: 10em;
}
.news_prefix {
display: inline-block;
width: 30px;
height: 30px;
background-image: url("static/img/news_prefix.png");
background-size: 150px, 30px;
}
svg { svg {
width: 50px; width: 50px;
height: 26px; height: 26px;
@ -193,13 +137,7 @@
<form id="ajaxform"> <form id="ajaxform">
<h3>Do you have any feedback?</h3> <h3>Do you have any feedback?</h3>
<br> <br>
<textarea <textarea id="message" cols="60" rows="10" placeholder="Enter your message"></textarea>
id="message"
cols="60"
rows="10"
placeholder="Enter your message"
></textarea>
<br><br> <br><br>
<input type="submit" value="Submit" class="cirButton" onclick="submit_it()"> <input type="submit" value="Submit" class="cirButton" onclick="submit_it()">
</form> </form>
@ -221,25 +159,23 @@
function submit_it() { function submit_it() {
$("#ajaxform").hide() $("#ajaxform").hide()
$("#ajaxform").submit(function(e) $("#ajaxform").submit(function (e) {
{
var postData = JSON.stringify($("#message").val()); var postData = JSON.stringify($("#message").val());
{#var formURL = $(this).attr("action");#}
$.ajax( $.ajax(
{ {
url: "gameover", url: "gameover",
type: "POST", type: "POST",
data: postData, data: postData,
success:function(data) success: function (data) {
{
//data: return data from server //data: return data from server
} }
}); });
e.preventDefault(); //STOP default action e.preventDefault(); //STOP default action
{#e.unbind(); //unbind. to stop multiple form submit.#}
}); });
} }
@ -256,7 +192,12 @@
</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" target="_blank">Haocheng Du</a>, <a href="https://doveliyuchen.github.io" target="_blank">Yuchen Li</a>; game content is generated by <b>AI </b>designed by<a href="https://github.com/PneuC" target="_blank"> Ziqi Wang</a>.<br> This project is supported by <a href="http://www.liujialin.tech/" target="_blank">Dr. Liu</a> and <a href="https://yannakakis.net/" target="_blank">Prof. Yannakakis</a>.</div> <div class="col-xl-7 justify-content-between align-content-center" style="margin: auto">This platform is created by <a
href="https://github.com/BigJIU" target="_blank">Haocheng Du</a>, <a href="https://doveliyuchen.github.io"
target="_blank">Yuchen Li</a>; game content is generated by <b>procedural content generation (PCG) </b>techniques developed by <a
href="https://github.com/PneuC" target="_blank">Ziqi Wang</a>.<br> This project is supported by <a
href="http://www.liujialin.tech/" target="_blank">Dr. Liu</a> and <a href="https://yannakakis.net/"
target="_blank">Prof. Yannakakis</a>.</div>
<br><br> <br><br>
@ -267,8 +208,10 @@
<div class="row clearfix"> <div class="row clearfix">
<div class="col-md-10 column"> <div class="col-md-10 column">
<div class="col-xl-3 justify-content-center" style="margin: auto" align="center"><a href="/privacy" style="cursor:pointer; color: white;" target="_blank">Privacy Policy</a> </div> <div class="col-xl-3 justify-content-center" style="margin: auto" align="center"><a href="/privacy"
<div class="col-xl-3 justify-content-center text-white" style="margin: auto" align="center">Copyright © Jialin Liu</div> style="cursor:pointer; color: white;" target="_blank">Privacy Policy</a> </div>
<div class="col-xl-3 justify-content-center text-white" style="margin: auto" align="center">Copyright © Jialin
Liu</div>
</div> </div>

49
templates/GamePlay.html
View File

@ -27,52 +27,7 @@
<link href="../templates/Web/css2" rel="stylesheet"> <link href="../templates/Web/css2" rel="stylesheet">
<style> <style>
#funding {
cursor: pointer;
R
}
#prove {
display: none;
}
#funding:hover+#prove {
display: block;
}
.groupname {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 45px;
font-weight: bold;
}
.slogan {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 40px;
font-style: italic;
/* font-weight:Light 300 italic; */
font-family: 'Consolas', monospace;
color: #c4cbcf;
}
.cirButton {
width: 100%;
height: 60px;
border-radius: 40px;
cursor: pointer;
border: none;
font-weight: 600;
}
.cirButton:hover {
background-color: rgba(0, 0, 0, 0.2);
}
svg { svg {
width: 50px; width: 50px;
@ -288,8 +243,8 @@
<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> -->
<div class="col-md-10 column"> <div class="col-md-10 column">
<br><br> <div class="col-xl-3 justify-content-center" style="margin: auto" align="center"><a href="/privacy" style="cursor:pointer; color: white;" target="_blank">Privacy Policy</a> </div>
<p class="m-0 text-center text-white">Copyright © Jialin Liu</p> <div class="col-xl-3 justify-content-center text-white" style="margin: auto" align="center">Copyright © Jialin Liu</div>
</div> </div>

59
templates/GameQuestion.html
View File

@ -31,23 +31,6 @@
<style> <style>
.popwindow {
width: 500px;
height: 550px;
border: 3px solid #ff928e;
visibility: hidden;
position: absolute;
z-index: 999;
opacity: 1;
overflow: hidden;
background-color: white;
text-align: center;
margin-top: 10%;
margin-left: 35%;
border-radius: 10px;
}
.cirButton { .cirButton {
width: 100%; width: 100%;
height: 60px; height: 60px;
@ -61,48 +44,6 @@
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
} }
.groupname {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 45px;
font-weight: bold;
}
.slogan {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 40px;
font-style: italic;
/* font-weight:Light 300 italic; */
font-family: 'Consolas', monospace;
color: #c4cbcf;
}
.hiddenpart {
opacity: 0;
max-width: 0;
color: #c4cbcf;
transition: 1.3s ease-out;
}
.slogan:hover .hiddenpart {
opacity: 1;
max-width: 10em;
}
.news_prefix {
display: inline-block;
width: 30px;
height: 30px;
background-image: url("static/img/news_prefix.png");
background-size: 150px, 30px;
}
svg { svg {
width: 50px; width: 50px;
height: 26px; height: 26px;

8
templates/GameTutorial.html
View File

@ -65,14 +65,6 @@
max-width: 10em; max-width: 10em;
} }
.news_prefix {
display: inline-block;
width: 30px;
height: 30px;
background-image: url("static/img/news_prefix.png");
background-size: 150px, 30px;
}
svg { svg {
width: 50px; width: 50px;
height: 26px; height: 26px;

119
templates/GameWelcome.html
View File

@ -31,22 +31,6 @@
display: block; display: block;
} }
.popwindow {
width: 500px;
height: 550px;
border: 3px solid #ff928e;
visibility: hidden;
position: absolute;
z-index: 999;
opacity: 1;
overflow: hidden;
background-color: white;
text-align: center;
margin-top: 10%;
margin-left: 35%;
border-radius: 10px;
}
.cirButton { .cirButton {
width: 100%; width: 100%;
height: 60px; height: 60px;
@ -60,46 +44,6 @@
background-color: rgba(0, 0, 0, 0.2); background-color: rgba(0, 0, 0, 0.2);
} }
.groupname {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 45px;
font-weight: bold;
}
.slogan {
justify-content: center;
display: flex;
position: relative;
text-align: center;
font-size: 40px;
font-style: italic;
/* font-weight:Light 300 italic; */
font-family: 'Consolas', monospace;
color: #c4cbcf;
}
.hiddenpart {
opacity: 0;
max-width: 0;
color: #c4cbcf;
transition: 1.3s ease-out;
}
.slogan:hover .hiddenpart {
opacity: 1;
max-width: 10em;
}
.news_prefix {
display: inline-block;
width: 30px;
height: 30px;
background-image: url("static/img/news_prefix.png");
background-size: 150px, 30px;
}
svg { svg {
width: 50px; width: 50px;
@ -107,53 +51,6 @@
vertical-align: middle; vertical-align: middle;
} }
{#label {#}
{# display: block;#}
{# line-height: 100px;#}
.option-input {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
position: relative;
top: 13.33333px;
right: 0;
bottom: 0;
left: 0;
height: 40px;
width: 40px;
transition: all 0.15s ease-out 0s;
background: #cbd1d8;
border: none;
color: #fff;
cursor: pointer;
display: inline-block;
margin-right: 0.5rem;
outline: none;
position: relative;
z-index: 1000;
}
.option-input:hover {
background: #9faab7;
}
.option-input:checked {
background: #0d007e;
}
.option-input.radio {
border-radius: 50%;
}
.option-input.radio::after {
border-radius: 50%;
}
@keyframes click-wave { @keyframes click-wave {
0% { 0% {
@ -295,7 +192,8 @@ function validateForm() {
</script> </script>
<input type="checkbox" id="privacyPolicyCheckbox" name="privacyPolicyCheckbox" required> <input type="checkbox" id="privacyPolicyCheckbox" name="privacyPolicyCheckbox" required>
<label for="privacyPolicyCheckbox">I agree to the <a href="/privacy" style="cursor:pointer;" target="_blank">privacy policy</a></label> <label for="privacyPolicyCheckbox">I agree to the <a href="/privacy" style="cursor:pointer;"
target="_blank">privacy policy</a></label>
<br> <br>
<br> <br>
<button class="cirButton" type="submit" onclick=" <button class="cirButton" type="submit" onclick="
@ -307,7 +205,12 @@ function validateForm() {
</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" target="_blank">Haocheng Du</a>, <a href="https://doveliyuchen.github.io" target="_blank">Yuchen Li</a>; game content is generated by <b>AI </b>designed by<a href="https://github.com/PneuC" target="_blank"> Ziqi Wang</a>.<br> This project is supported by <a href="http://www.liujialin.tech/" target="_blank">Dr. Liu</a> and <a href="https://yannakakis.net/" target="_blank">Prof. Yannakakis</a>.</div> <div class="col-xl-7 justify-content-between align-content-center" style="margin: auto">This platform is created by <a
href="https://github.com/BigJIU" target="_blank">Haocheng Du</a>, <a href="https://doveliyuchen.github.io"
target="_blank">Yuchen Li</a>; game content is generated by <b>procedural content generation (PCG) </b>techniques developed by <a
href="https://github.com/PneuC" target="_blank">Ziqi Wang</a>.<br> This project is supported by <a
href="http://www.liujialin.tech/" target="_blank">Dr. Liu</a> and <a href="https://yannakakis.net/"
target="_blank">Prof. Yannakakis</a>.</div>
<br><br> <br><br>
@ -319,8 +222,10 @@ function validateForm() {
<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> -->
<div class="col-md-10 column"> <div class="col-md-10 column">
<div class="col-xl-3 justify-content-center" style="margin: auto" align="center"><a href="/privacy" style="cursor:pointer; color: white;" target="_blank">Privacy Policy</a> </div> <div class="col-xl-3 justify-content-center" style="margin: auto" align="center"><a href="/privacy"
<div class="col-xl-3 justify-content-center text-white" style="margin: auto" align="center">Copyright © Jialin Liu</div> style="cursor:pointer; color: white;" target="_blank">Privacy Policy</a> </div>
<div class="col-xl-3 justify-content-center text-white" style="margin: auto" align="center">Copyright © Jialin
Liu</div>
</div> </div>

30
templates/Privacy.html
View File

@ -4,6 +4,7 @@
<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> <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>
@ -28,8 +29,6 @@
<link href="../templates/Web/css2" rel="stylesheet"> <link href="../templates/Web/css2" rel="stylesheet">
<style> <style>
#funding:hover+#prove { #funding:hover+#prove {
display: block; display: block;
} }
@ -122,18 +121,28 @@
<br> <br>
<h4> <h4>
We are committed to protecting the privacy of our users and ensuring that any data we collect is used only for the purposes of academic usage. As part of this commitment, we collect and use anonymous age, gender, and play behavior data. This policy outlines how we collect and use this data. Participation is voluntary. Participants can choose not to answer a question, or quit anytime. We are committed to protecting the privacy of our users and ensuring that any data we collect is used only for
the purposes of academic usage. As part of this commitment, we collect and use anonymous age, gender, and play
behavior data. This policy outlines how we collect and use this data. Participation is voluntary. Participants
can choose not to answer a question, or quit anytime.
</h4> </h4>
<br> <br>
<h5>Data Collection</h5> <h5>Data Collection</h5>
<p>We collect anonymous age, gender, and play behavior data through our games. This data is collected automatically when participants interact with our designed game, and is used to help us understand how our game are being played and gamer research. IP address and any kind of location information will not be collected.</p> <p>We collect anonymous age, gender, and play behavior data through our games. This data is collected
automatically when participants interact with our designed game, and is used to help us understand how our game
are being played and gamer research. IP address and any kind of location information will not be collected.</p>
<h5>Data Use</h5> <h5>Data Use</h5>
<p>The anonymous data we collect is used only for the game user research. We do not link this data to any personally identifiable information, and we do not use it for marketing purposes.</p> <p>The anonymous data we collect is used only for the game user research. We do not link this data to any
personally identifiable information, and we do not use it for marketing purposes.</p>
<h5>User Rights</h5> <h5>User Rights</h5>
<p>As this data is anonymous, it cannot be used to identify individual users. However, if you have any questions or concerns about our data collection and use practices, please contact us at 8143151122_AT_163.com. We are committed to being transparent about our data collection and use practices and will do our best to address any concerns you may have.</p> <p>As this data is anonymous, it cannot be used to identify individual users. However, if you have any questions
or concerns about our data collection and use practices, please contact us at 8143151122_AT_163.com. We are
committed to being transparent about our data collection and use practices and will do our best to address any
concerns you may have.</p>
<br> <br>
<h4>By playing our games, you consent to the collection and use of anonymous age, gender, and play behavior data as outlined in this policy. If you do not agree with this policy, please do not play.</h4> <h4>By playing our games, you consent to the collection and use of anonymous age, gender, and play behavior data
as outlined in this policy. If you do not agree with this policy, please do not play.</h4>
</div> </div>
@ -146,7 +155,12 @@
</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>AI </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> <div class="col-xl-7 justify-content-between align-content-center" style="margin: auto">This platform is created by <a
href="https://github.com/BigJIU" target="_blank">Haocheng Du</a>, <a href="https://doveliyuchen.github.io"
target="_blank">Yuchen Li</a>; game content is generated by <b>procedural content generation (PCG) </b>techniques developed by <a
href="https://github.com/PneuC" target="_blank">Ziqi Wang</a>.<br> This project is supported by <a
href="http://www.liujialin.tech/" target="_blank">Dr. Liu</a> and <a href="https://yannakakis.net/"
target="_blank">Prof. Yannakakis</a>.</div>
<br><br> <br><br>