Multilanguage support, italian version, free schema
This commit is contained in:
137
assets/css/style.css
Normal file
137
assets/css/style.css
Normal file
@ -0,0 +1,137 @@
|
||||
body {
|
||||
background-image: url(../img/chinese_flag.png);
|
||||
}
|
||||
|
||||
* {
|
||||
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.button {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
border-radius: 3px;
|
||||
margin-left: 5vw;
|
||||
margin-right: 5vw;
|
||||
margin-top: 20vh;
|
||||
margin-bottom: 1vh;
|
||||
display: inline-block;
|
||||
height: 10vh;
|
||||
width: 30vh;
|
||||
padding: 10px;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
#question {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#questionTitle {
|
||||
margin-top: 5vh;
|
||||
}
|
||||
|
||||
.answers-pic {
|
||||
width: 100%;
|
||||
border: 18px ridge yellow;
|
||||
}
|
||||
|
||||
.floattop {
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
z-index: 1;
|
||||
/*hide baby*/
|
||||
}
|
||||
|
||||
#playBegin {
|
||||
background-image: url(../img/chinese_flag.png);
|
||||
}
|
||||
|
||||
.floattop>img {
|
||||
width: 35vw;
|
||||
margin-top: 10vh;
|
||||
}
|
||||
|
||||
#scoreDisplay {
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
#progress {
|
||||
font-size: 25px;
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.floatleft {
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
top: 20%;
|
||||
width: 20%;
|
||||
|
||||
display: none;
|
||||
}
|
||||
|
||||
.floatright {
|
||||
position: absolute;
|
||||
right: 2%;
|
||||
bottom: 5%;
|
||||
width: 20%;
|
||||
|
||||
display: none;
|
||||
}
|
||||
|
||||
#wrong {
|
||||
background-color: black;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#correct {
|
||||
background-color: black;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#mao {
|
||||
background-color: black;
|
||||
display: none;
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
#xi {
|
||||
background-color: black;
|
||||
display: none;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
#square {
|
||||
background-color: black;
|
||||
display: none;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
#mao>img,
|
||||
#xi>img,
|
||||
#square>img {
|
||||
width: 30vw;
|
||||
margin-top: 10vh;
|
||||
}
|
||||
|
||||
#loose {
|
||||
background-color: black;
|
||||
display: none;
|
||||
z-index: 10;
|
||||
font-size: 30px;
|
||||
padding-top: 20vh;
|
||||
}
|
||||
|
||||
#win {
|
||||
background-color: red;
|
||||
display: none;
|
||||
z-index: 10;
|
||||
font-size: 30px;
|
||||
padding-top: 20vh;
|
||||
}
|
||||
6
assets/img/it_flag.svg
Normal file
6
assets/img/it_flag.svg
Normal file
@ -0,0 +1,6 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1500" height="1000" viewBox="0 0 3 2">
|
||||
<rect width="1" height="2" fill="#009246"/>
|
||||
<rect width="1" height="2" x="1" fill="#fff"/>
|
||||
<rect width="1" height="2" x="2" fill="#ce2b37"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 273 B |
16
assets/img/uk_flag.svg
Normal file
16
assets/img/uk_flag.svg
Normal file
@ -0,0 +1,16 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 30" width="1200" height="600">
|
||||
<clipPath id="s">
|
||||
<path d="M0,0 v30 h60 v-30 z"/>
|
||||
</clipPath>
|
||||
<clipPath id="t">
|
||||
<path d="M30,15 h30 v15 z v15 h-30 z h-30 v-15 z v-15 h30 z"/>
|
||||
</clipPath>
|
||||
<g clip-path="url(#s)">
|
||||
<path d="M0,0 v30 h60 v-30 z" fill="#012169"/>
|
||||
<path d="M0,0 L60,30 M60,0 L0,30" stroke="#fff" stroke-width="6"/>
|
||||
<path d="M0,0 L60,30 M60,0 L0,30" clip-path="url(#t)" stroke="#C8102E" stroke-width="4"/>
|
||||
<path d="M30,0 v30 M0,15 h60" stroke="#fff" stroke-width="10"/>
|
||||
<path d="M30,0 v30 M0,15 h60" stroke="#C8102E" stroke-width="6"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 657 B |
2
assets/js/jquery-3.6.0.min.js
vendored
Normal file
2
assets/js/jquery-3.6.0.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
2
assets/js/js-yaml.min.js
vendored
Normal file
2
assets/js/js-yaml.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
192
assets/js/main.js
Normal file
192
assets/js/main.js
Normal file
@ -0,0 +1,192 @@
|
||||
var audio, audiostate;
|
||||
var d = Math.random();
|
||||
// choose random bgm to start
|
||||
if (d < 0.50) {
|
||||
audiostate = "mix";
|
||||
}
|
||||
else {
|
||||
audiostate = "maobgm";
|
||||
}
|
||||
//handles bgm files to create a continous bgm
|
||||
function audiosegm() {
|
||||
if (audiostate != "mix") {
|
||||
audio = new Audio('../assets/music/main.mp3');
|
||||
audiostate = "mix";
|
||||
}
|
||||
else {
|
||||
audio = new Audio('../assets/music/maobgm.mp3');
|
||||
audiostate = "maobgm";
|
||||
}
|
||||
audio.play();
|
||||
audio.onended = audiosegm;
|
||||
}
|
||||
// plays a sound effect
|
||||
function sef(filename) {
|
||||
new Audio("../assets/music/" + filename + ".mp3").play();
|
||||
}
|
||||
$("#playBegin").click(function () {
|
||||
try {// this might fail, expecially on safari
|
||||
document.getElementsByTagName("html")[0].requestFullscreen();
|
||||
} catch (e) { }
|
||||
audiosegm();
|
||||
$(this).fadeOut();
|
||||
});
|
||||
var data = {}, cQuestion = {}, indexeslist = [], indexesProgress = 0, total = 100;
|
||||
var file = "data_en.yaml";
|
||||
switch(getParam("lang")) {
|
||||
case "it":
|
||||
file = "data_it.yaml";
|
||||
break;
|
||||
}
|
||||
$.ajax({
|
||||
type: 'GET',
|
||||
url: "../"+file,
|
||||
complete: function (r) {
|
||||
data = jsyaml.load(r.responseText);
|
||||
total = data["initialScore"];
|
||||
document.title = data["title"];
|
||||
$("#gameTitle").html(data["title"]);
|
||||
$(".playAgain").html(data["playAgain"]);
|
||||
$("#looseTitle").html(data["loose"]["title"]);
|
||||
$("#looseDescription").html(data["loose"]["description"]);
|
||||
$("#winTitle").html(data["win"]["title"]);
|
||||
$("#winSubtitle").html(data["win"]["subtitle"]);
|
||||
$("#winDescription").html(data["win"]["description"]);
|
||||
$("#scoreDisplay").html(data["socialCreditScore"]+": " + total);
|
||||
for (var i = 0; i < data["questions"].length; i++) {
|
||||
indexeslist.push(i);
|
||||
}
|
||||
$("#progress").html("1 "+data["of"]+" " + indexeslist.length);
|
||||
shuffle(indexeslist);
|
||||
displayQuestion();
|
||||
}
|
||||
});
|
||||
function displayQuestion() {
|
||||
$("html, body").scrollTop(0);
|
||||
if (total < 1) {
|
||||
audio.pause();
|
||||
audio = new Audio('../assets/music/anthem.mp3');
|
||||
audio.play();
|
||||
$("#loose").show();
|
||||
}
|
||||
else {
|
||||
|
||||
if (total < 2000) sef("pullup");
|
||||
var index = 0;
|
||||
|
||||
// sends comrad Dwayne to help (or calls him back)
|
||||
if (total > 4000) { // comes when low score
|
||||
$("#rock-approves").hide();
|
||||
$("#rock-disapproves").hide();
|
||||
}
|
||||
else {
|
||||
$("#rock-approves-video").get(0).currentTime = 0;
|
||||
$("#rock-approves").show();
|
||||
}
|
||||
// **************************************
|
||||
// sends comrad baby cha-cha to help (or calls him back)
|
||||
if (indexesProgress != 0) // comes when first question
|
||||
$("#bbchacha").hide();
|
||||
else
|
||||
$("#bbchacha").show();
|
||||
// **************************************
|
||||
|
||||
if (indexesProgress < indexeslist.length) {
|
||||
index = indexeslist[indexesProgress];
|
||||
indexesProgress++;
|
||||
}
|
||||
else {
|
||||
audio.pause();
|
||||
sef("applause");
|
||||
audio = new Audio('../assets/music/march_vol_charged.mp3');
|
||||
audio.play();
|
||||
$("#win").show();
|
||||
}
|
||||
cQuestion = data["questions"][index];
|
||||
$("[data-ans=1]").html(data["questions"][index]["answers"][0]["text"]);
|
||||
$("[data-ans=2]").html(data["questions"][index]["answers"][1]["text"]);
|
||||
if (data["questions"][index]["answers"][2]) $("[data-ans=3]").html(data["questions"][index]["answers"][2]["text"]);
|
||||
else $("[data-ans=3]").html("");
|
||||
if (data["questions"][index]["answers"][3]) $("[data-ans=4]").html(data["questions"][index]["answers"][3]["text"]);
|
||||
else $("[data-ans=4]").html("");
|
||||
$("#questionTitle").html(data["questions"][index]["title"]);
|
||||
}
|
||||
}
|
||||
|
||||
// comrad Dwaynes feedback *************************
|
||||
$(".ans").mouseenter(function () {
|
||||
try {
|
||||
var res = cQuestion["answers"][$(this).attr("data-ans") - 1]["effect"];
|
||||
|
||||
if ((total <= 4000) && (res < 0)) {
|
||||
$("#rock-approves").hide();
|
||||
$("#rock-disapproves").show();
|
||||
$("#rock-disapproves-video").get(0).currentTime = 0;
|
||||
$("#rock-disapproves-video").get(0).play();
|
||||
}
|
||||
} catch (e) {
|
||||
if (e instanceof TypeError) return true;
|
||||
else throw e;
|
||||
}
|
||||
});
|
||||
$(".ans").mouseleave(function () {
|
||||
try {
|
||||
var res = cQuestion["answers"][$(this).attr("data-ans") - 1]["effect"];
|
||||
|
||||
if ((total <= 4000) && (res < 0)) {
|
||||
$("#rock-disapproves").hide();
|
||||
$("#rock-approves").show();
|
||||
$("#rock-approves-video").get(0).currentTime = 0;
|
||||
$("#rock-approves-video").get(0).play();
|
||||
}
|
||||
} catch (e) {
|
||||
if (e instanceof TypeError) return true;
|
||||
else throw e;
|
||||
}
|
||||
});
|
||||
// ***8888888************************************8
|
||||
|
||||
$(".ans").click(function () {
|
||||
$("#progress").html(indexesProgress + 1 + " " + data["of"] + " " + indexeslist.length);
|
||||
var res = cQuestion["answers"][$(this).attr("data-ans") - 1]["effect"];
|
||||
total += res;
|
||||
$("#scoreDisplay").html(data["socialCreditScore"] + ": " + total);
|
||||
var d = Math.random();
|
||||
if (d < 0.10) {
|
||||
d = Math.random();
|
||||
if (d < 0.30) {
|
||||
$("#mao").fadeIn();
|
||||
$("#mao").fadeOut();
|
||||
sef("mao");
|
||||
}
|
||||
else if (d < 0.60) {
|
||||
$("#xi").fadeIn();
|
||||
$("#xi").fadeOut();
|
||||
}
|
||||
else {
|
||||
$("#square").fadeIn();
|
||||
$("#square").fadeOut();
|
||||
}
|
||||
}
|
||||
if (res < 0) {
|
||||
$("#wrong").fadeIn();
|
||||
sef("wrong");
|
||||
if (res < -1000) {
|
||||
sef("boo");
|
||||
}
|
||||
$("#wrong").fadeOut();
|
||||
}
|
||||
else {
|
||||
sef("correct");
|
||||
$("#correct").fadeIn();
|
||||
if (res > 1000) {
|
||||
sef("applause");
|
||||
}
|
||||
}
|
||||
displayQuestion();
|
||||
$("#correct").fadeOut();
|
||||
});
|
||||
|
||||
$('.fadeOutVideo').on('ended', function () {
|
||||
$(this).parent().fadeOut();
|
||||
})
|
||||
31
assets/js/util.js
Normal file
31
assets/js/util.js
Normal file
@ -0,0 +1,31 @@
|
||||
function shuffle(array) {
|
||||
let currentIndex = array.length, randomIndex;
|
||||
|
||||
// While there remain elements to shuffle...
|
||||
while (currentIndex != 0) {
|
||||
|
||||
// Pick a remaining element...
|
||||
randomIndex = Math.floor(Math.random() * currentIndex);
|
||||
currentIndex--;
|
||||
|
||||
// And swap it with the current element.
|
||||
[array[currentIndex], array[randomIndex]] = [
|
||||
array[randomIndex], array[currentIndex]];
|
||||
}
|
||||
|
||||
return array;
|
||||
|
||||
}
|
||||
|
||||
function getParam(parameterName) {
|
||||
var result = null,
|
||||
tmp = [];
|
||||
location.search
|
||||
.substr(1)
|
||||
.split("&")
|
||||
.forEach(function (item) {
|
||||
tmp = item.split("=");
|
||||
if (tmp[0] === parameterName) result = decodeURIComponent(tmp[1]);
|
||||
});
|
||||
return result;
|
||||
}
|
||||
Reference in New Issue
Block a user