代码拉取完成，页面将自动刷新
<!DOCTYPE html>
<html>
<head>
<title>Platformre level test</title>
<meta charset="UTF-8">
<style>
body {
font-family: monospace;
}
#player {
position: absolute;
background: #E91E63;
height: 30px;
width: 30px;
border-radius: 50%;
bottom: 0;
left: 0;
}
.level, #message {
margin: auto;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.levelRow {
height: 40px;
}
.levelBlock {
height: 40px;
width: 40px;
display: inline-block;
}
@keyframes lava {
0% {background:#FF6F00;}
25% {background:#FF9100;}
50% {background:#FF9800;}
75% {background:#EF6C00;}
100% {background:#FF6F00;}
}
@keyframes diePainfully {
from {background:#E91E63;opacity:1;transform:scale(1);}
to {background:#212121;opacity:0;transform:scale(0);}
}
.die {
background: #212121;
opacity: 0;
transform: scale(0);
animation: diePainfully 0.5s;
}
@keyframes congrats {
from {transform:scale(1);opacity:1;}
to {transform:scale(2);opacity:0;}
}
.winner {
opacity: 0;
transform: scale(2);
animation: congrats 0.5s;
}
textarea {
display: block;
font-family: inherit;
font-size: inherit;
width: 200px;
height: 200px;
}
#load {
cursor: pointer;
}
#load:hover {
background: gray;
}
#load:active {
background: black;
color: white;
}
#message {
width: 100%;
height: 20px;
text-align: center;
font-size: 20px;
color: #212121;
text-shadow: 0 0 15px white;
}
.air {background:rgba(255,255,255,0.5);}
.ground {background:#212121;}
.lava {background:#FF5722;/*animation: lava 2s linear infinite;*/}
.win {background:#8BC34A;}
.jump {background:#9C27B0;}
.mud {background:#795548;}
.nojump {background:#FFC107;}
.ice {background:#00BCD4;}
.water {background:#2196F3;}
.left {background-color:#009688;background-image:url(materialicon_chevron_left.svg);background-position:center;background-repeat:no-repeat;}
.right {background-color:#004D40;background-image:url(materialicon_chevron_right.svg);background-position:center;background-repeat:no-repeat;}
.text {background-color:#eee;background-image:url(materialicon_title.svg);background-position:center;background-repeat:no-repeat;}
.check {background-color:#4CAF50;background-image:url(materialicon_beenhere.svg);background-position:center;background-repeat:no-repeat;}
.glitch {background-color:magenta;}
</style>
</head>
<body>
<p><b>Use the keys WAD to move the player around.</b></p>
<p>w pressed: <span id="w">no</span></p>
<p>a pressed: <span id="a">no</span></p>
<p>s pressed: <span id="s">no</span></p>
<p>d pressed: <span id="d">no</span></p>
<p id="vels"></p>
<div class="level">
<div id="player"></div>
</div>
<p id="message"></p>
<textarea placeholder="code here"></textarea>
<span id="load">load level</span><br>
<a href="levelmaker.html">make level</a>
<a href="randomlevelgen.html">play randomized level</a>
<script src="../sheep.js"></script>
<script>
var levels=[ /* space=air, @=ground, #=lava, +=win, ^=jumpboost, v=nojumping, ==mud, *=ice, w=water */
[
["In case you haven't noticed, you're standing on a greyish block with a T on it."],
"@@@@@@@@@@@@@@@@@+@@",
"@ @@w@@",
"@ www@",
"@ @===@ www@",
"@ # www@",
"@ # 0w@@@",
"@v^@@###*>><<**@@@@@",
],[
[],
"@@@@",
"@ +",
"@ @",
"@ @",
"@ @",
"@ @",
"@ @",
"@ @",
"@@@@",
],[
[],
"@@@", /* emergency last level */
"@ @",
"@@@",
],
];
function render(level) {
var data="<div id='player'></div>";
for (var i=1;i<levels[level].length;i++) {
data+="<div class='levelRow'>";
for (var j=0;j<levels[level][i].length;j++) {
switch (levels[level][i][j]) {
case " ":
data+="<div class='levelBlock air'></div>";
break;
case "@":
data+="<div class='levelBlock ground'></div>";
break;
case "#":
data+="<div class='levelBlock lava'></div>";
break;
case "+":
data+="<div class='levelBlock win'></div>";
break;
case "^":
data+="<div class='levelBlock jump'></div>";
break;
case "=":
data+="<div class='levelBlock mud'></div>";
break;
case "v":
data+="<div class='levelBlock nojump'></div>";
break;
case "*":
data+="<div class='levelBlock ice'></div>";
break;
case "w":
data+="<div class='levelBlock water'></div>";
break;
case "<":
data+="<div class='levelBlock left'></div>";
break;
case ">":
data+="<div class='levelBlock right'></div>";
break;
default:
if (/[0-9]/.test(levels[level][i][j])) {
data+="<div class='levelBlock text'></div>";
} else {
data+="<div class='levelBlock glitch'></div>";
}
}
}
data+="</div>";
}
document.querySelector(".level").innerHTML=data;
document.querySelector(".level").style.width=(levels[level][1].length*40)+"px";
document.querySelector(".level").style.height=(levels[level].length*40-40)+"px";
}
var wDown=false,aDown=false,dDown=false,sDown=false,pausd=false;
document.body.onkeydown=function(e){
var ele;
switch (e.keyCode) {
case 87:
ele="w";
wDown=true;
break;
case 65:
ele="a";
aDown=true;
break;
case 83:
ele="s";
sDown=true;
break;
case 68:
ele="d";
dDown=true;
break;
case 82:
if (!pausd) {
die();
}
break;
case 32:
if (pausd) {
wow=setInterval(play,33);
} else {
clearInterval(wow);
document.querySelector("#vels").innerHTML="paused";
}
pausd=!pausd;
break;
}
if (ele!==undefined) {
document.querySelector("#"+ele).innerHTML="yes";
}
};
document.body.onkeyup=function(e){
var ele;
switch (e.keyCode) {
case 87:
ele="w";
wDown=false;
break;
case 65:
ele="a";
aDown=false;
break;
case 83:
ele="s";
sDown=false;
break;
case 68:
ele="d";
dDown=false;
break;
}
if (ele!==undefined) {
document.querySelector("#"+ele).innerHTML="no";
}
};
/* plattformre script based off those from Scratch */
var xv=0,yv=0,x=40,y=40,lev=0,collide=["@","^","v","*","=","<",">","0","1","2","3","4","5","6","7","8","9",],play=function(){
x+=xv;y+=yv;
if (getBlock(-15,0)=="#") { /* left wall */
die();
} else if (getBlock(-15,0)=="+") {
die("win");
} else if (collide.includes(getBlock(-15,0))) {
if (aDown||dDown) {
if (wDown) {
yv=10;
xv*=-1;
} else {
xv*=-0.5;
yv=0;
}
} else {
xv*=-0.1;
yv=0;
}
x=Math.ceil((x-5)/40)*40;
}
if (getBlock(15,0)=="#") { /* right wall */
die();
} else if (getBlock(15,0)=="+") {
die("win");
} else if (collide.includes(getBlock(15,0))) {
if (aDown||dDown) {
if (wDown) {
yv=10;
xv*=-1;
} else {
xv*=-0.5;
yv=0;
}
} else {
xv*=-0.1;
yv=0;
}
x=Math.floor((x-5)/40)*40+10;
}
var water;
if (collide.includes(getBlock(0,-16))) {
yv=0;
y=Math.ceil((y-5)/40)*40;
}
if (getBlock(-10,-16)==" "&&getBlock(10,-16)==" ") { /* ground and gravity and swimming */
yv-=1;
water="falling";
} else if (getBlock(0,-16)=="#") {
die();
} else if (getBlock(0,-16)=="+") {
die("win");
} else if (getBlock(0,-16)=="<") {
xv-=2;
} else if (getBlock(0,-16)==">") {
xv+=2;
}
if (/[0-9]/.test(getBlock(0,-16))) {
document.querySelector("#message").innerHTML=levels[lev][0][Number(getBlock(0,-16))];
} else if (document.querySelector("#message").innerHTML) {
document.querySelector("#message").innerHTML="";
}
if ([getBlock(-10,-10),getBlock(10,-10),getBlock(-10,10),getBlock(10,10)].includes("w")) {
water="swimming";
xv=Math.round(xv*950)/1000;
yv=Math.round(yv*950)/1000;
if(wDown){yv+=1;}
if(aDown){xv-=1;}
if(sDown){yv-=1;}
if(dDown){xv+=1;}
}
if (!["#","+"].includes(getBlock(0,-16))&&water===undefined) { /* moving */
if (wDown) {
if(getBlock(0,-16)=="^"){yv=20;}else if(getBlock(0,-16)!="v"){yv=15;}
}
if (aDown&&!dDown&&xv>-10) {
if(getBlock(0,-16)=="="){xv-=0.2;}else if(getBlock(0,-16)=="*"){xv-=1;}else{xv-=1.5;}
} else if (dDown&&!aDown&&xv<10) {
if(getBlock(0,-16)=="="){xv+=0.2;}else if(getBlock(0,-16)=="*"){xv+=1;}else{xv+=1.5;}
} else {
if(getBlock(0,-16)=="="){xv=Math.round(xv*500)/1000;}else if(getBlock(0,-16)=="*"){xv=Math.round(xv*950)/1000;}else{xv=Math.round(xv*800)/1000;}
if (Math.abs(xv)<0.01) {
xv=0;
x=Math.round(x*1000)/1000;
}
}
}
if (getBlock(0,15)=="#") { /* ceiling */
die();
} else if (getBlock(0,15)=="+") {
die("win");
} else if (collide.includes(getBlock(-10,15))||collide.includes(getBlock(10,15))) {
yv=-1;
y=Math.floor((y-5)/40)*40+10;
}
document.querySelector("#vels").innerHTML="{<br>xVelocity: "+xv+",<br>yVelocity: "+yv+",<br>xPosition: "+x+",<br>yPosition: "+y+"<br>}";
document.querySelector("#player").style.left=x+"px";
document.querySelector("#player").style.bottom=y+"px";
};
render(lev);
var wow=setInterval(play,33);
function getBlock(nx,ny) {
nx=Math.round((x+nx-5)/40);ny=Math.round((y+ny-5)/40);
var zzz=levels[lev][levels[lev].length-1-ny];
if (zzz===undefined) {
return "@";
} else {
return zzz[nx];
}
}
function foo(ox,oy) {
console.log(Math.round((x+ox-5)/40));
console.log(Math.round((y+oy-5)/40));
console.log(getBlock(ox,oy));
}
function die(type) {
var type;
clearInterval(wow);
if (type=="win") {
document.querySelector("#player").className="winner";
} else {
document.querySelector("#player").className="die";
}
setTimeout(function(){
xv=0,yv=0,x=40,y=40;
if (document.querySelector("#player").className=="winner") {
lev++;render(lev);
}
play();
if (!pausd) {
wow=setInterval(play,33);
}
document.querySelector("#player").className="";
},500);
}
document.querySelector("#load").onclick=function(){
levels=[JSON.parse(document.querySelector("textarea").value),["@@@","@ @","@@@",]];
lev=0;
render(0);
xv=0,yv=0,x=40,y=40;
}
</script>
<h3>Don't paste level code in levelmaker here!</h3>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手
