Splitting of css, js, html in file
parent
5ddfee50cd
commit
8f04a04c4e
487
index.html
487
index.html
|
|
@ -5,203 +5,8 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
|
||||
<link rel="icon" type="image/png" href="assets/icon.png" />
|
||||
<link rel="stylesheet" type="text/css" href="main.css" />
|
||||
<meta name="author" content="ambc">
|
||||
<style type="text/css">
|
||||
@import url(http://fonts.googleapis.com/css?family=Londrina+Solid|Londrina+Shadow);
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
font-family: "Londrina Solid";
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
body {
|
||||
background-color: #aaa;
|
||||
color: #eee;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
vertical-align: middle;
|
||||
overflow: hidden;
|
||||
}
|
||||
#map_canvas {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#dpf, #dpb, #dpl, #dpr {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
font-size: 20px;
|
||||
border: 1px solid #999;
|
||||
border-radius: 10px;
|
||||
background-color: #bbb;
|
||||
color: #333;
|
||||
opacity: 0.8;
|
||||
z-index: 3;
|
||||
}
|
||||
#dpf:active, #dpb:active, #dpl:active, #dpr:active {
|
||||
background-color: #aaa;
|
||||
border: 1px solid #888;
|
||||
}
|
||||
#dpf {
|
||||
position: absolute;
|
||||
bottom: 130px;
|
||||
right: 60px;
|
||||
}
|
||||
#dpb {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
right: 60px;
|
||||
}
|
||||
#dpl {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
right: 110px;
|
||||
}
|
||||
#dpr {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
#bar {
|
||||
background-color: rgba(0, 0, 0, 0.0);
|
||||
z-index: 1;
|
||||
color: #eee;
|
||||
padding: 10px 0px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
vertical-align: middle;
|
||||
border: 1px solid rgba(0, 0, 0, 0.0);
|
||||
}
|
||||
#you {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#menu, #tgpm {
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 6;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
#menu h1 {
|
||||
font-family: "Londrina Shadow";
|
||||
padding: 30px 10px;
|
||||
font-size: 30px;
|
||||
line-height: 30px;
|
||||
word-spacing: 20px;
|
||||
background: transparent url("assets/the-bunnies.png") center center no-repeat;
|
||||
background-size: 250px 40px;
|
||||
color: transparent;
|
||||
}
|
||||
h1 {
|
||||
font-family: "Londrina Shadow";
|
||||
padding: 30px 10px;
|
||||
font-size: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.btn {
|
||||
color: #fff;
|
||||
padding: 5px 10px;
|
||||
margin: 10px auto;
|
||||
box-shadow: -5px -5px 1px rgba(255, 255, 255, 0.25);
|
||||
border: 1px dashed #fff;
|
||||
font-size: 20px;
|
||||
display: block;
|
||||
width: 200px;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
text-decoration: none;
|
||||
}
|
||||
.btn:hover {
|
||||
box-shadow: -3px -3px 1px rgba(255, 255, 255, 0.25);
|
||||
position: relative;
|
||||
top: -2px;
|
||||
left: -2px;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
#dir {
|
||||
width: 2px;
|
||||
height: 100px;
|
||||
background-color: #fff;
|
||||
}
|
||||
#dirh {
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
z-index: 2;
|
||||
margin: -100px 0 0 -1px;
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
#tgp {
|
||||
margin: 0;
|
||||
width: auto;
|
||||
padding: 10px 5px;
|
||||
z-index: 4;
|
||||
line-height: 20px;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
font-size: 20px;
|
||||
display: none;
|
||||
/* box-shadow: -5px 5px 1px rgba(255, 255, 255, 0.25); */
|
||||
color: #fff;
|
||||
border-radius: 5px;
|
||||
background: transparent url("assets/pauseplay.png") no-repeat right top;
|
||||
width: 42px;
|
||||
background-size: 42px 84px;
|
||||
color: transparent;
|
||||
}
|
||||
#tgp:hover {
|
||||
/* box-shadow: -3px 3px 1px rgba(255, 255, 255, 0.25); */
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 2px;
|
||||
}
|
||||
#tgpm {
|
||||
display: none;
|
||||
}
|
||||
h1 sup {
|
||||
font-size: 13px;
|
||||
line-height: 13px;
|
||||
font-weight: 400;
|
||||
color: red;
|
||||
}
|
||||
#sec {
|
||||
float: center;
|
||||
display: inline-block;
|
||||
}
|
||||
#kills {
|
||||
float: left;
|
||||
display: inline-block;
|
||||
margin-left: 30px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -245,294 +50,6 @@ var mapOptions = {
|
|||
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
|
||||
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
step=3;
|
||||
stti=10;
|
||||
interf=0;
|
||||
interb=0;
|
||||
interl=0;
|
||||
interr=0;
|
||||
|
||||
function angle(x, y, bx, by) {
|
||||
return Math.atan2(bx-x, by-y)/Math.PI*-180;
|
||||
}
|
||||
|
||||
function dpf() {
|
||||
map.panBy(0, -step);
|
||||
}
|
||||
function dpb() {
|
||||
map.panBy(0, step);
|
||||
}
|
||||
function dpl() {
|
||||
map.panBy(-step, 0);
|
||||
}
|
||||
function dpr() {
|
||||
map.panBy(step, 0);
|
||||
}
|
||||
function setin(dir) {
|
||||
//functorun=functor;
|
||||
//functorun();
|
||||
if (dir==0 && !interf) {
|
||||
interf=setInterval(function() {
|
||||
dpf();
|
||||
}, stti);
|
||||
}
|
||||
if (dir==1 && !interb) {
|
||||
interb=setInterval(function() {
|
||||
dpb();
|
||||
}, stti);
|
||||
}
|
||||
if (dir==2 && !interl) {
|
||||
interl=setInterval(function() {
|
||||
dpl();
|
||||
}, stti);
|
||||
}
|
||||
if (dir==3 && !interr) {
|
||||
interr=setInterval(function() {
|
||||
dpr();
|
||||
}, stti);
|
||||
}
|
||||
}
|
||||
function clrin(dir) {
|
||||
if (dir==0) {
|
||||
clearInterval(interf);
|
||||
interf=0;
|
||||
}
|
||||
if (dir==1) {
|
||||
clearInterval(interb);
|
||||
interb=0;
|
||||
}
|
||||
if (dir==2) {
|
||||
clearInterval(interl);
|
||||
interl=0;
|
||||
}
|
||||
if (dir==3) {
|
||||
clearInterval(interr);
|
||||
interr=0;
|
||||
}
|
||||
}
|
||||
|
||||
if (!(("ontouchstart" in window) || ("onmsgesturechange" in window))) {
|
||||
$("#dpf, #dpb, #dpl, #dpr").css("display", "none");
|
||||
}
|
||||
|
||||
//stackoverflow
|
||||
function getPosition(e) {
|
||||
var targ;
|
||||
if (!e)
|
||||
e = window.event;
|
||||
if (e.target)
|
||||
targ = e.target;
|
||||
else if (e.srcElement)
|
||||
targ = e.srcElement;
|
||||
if (targ.nodeType == 3)
|
||||
targ = targ.parentNode;
|
||||
var x = e.pageX - $(targ).offset().left;
|
||||
var y = e.pageY - $(targ).offset().top;
|
||||
$("#dirh").css("transform", "rotate("+angle(x, y, $("#you").width()/2, $("#you").height()/2)+"deg)");
|
||||
|
||||
}
|
||||
|
||||
function start() {
|
||||
|
||||
$("#tgpm").fadeOut();
|
||||
|
||||
counter=setInterval(function() {
|
||||
timenow=new Date().getTime();
|
||||
sec=timenow-timebefore;
|
||||
$("#sec").html(sec+"ms");
|
||||
}, 1);
|
||||
|
||||
|
||||
$("#you").on("mousedown", function(event) {
|
||||
getPosition(event);
|
||||
});
|
||||
$("#you").on("mousemove", function(event) {
|
||||
getPosition(event);
|
||||
});
|
||||
$("#you").on("mouseup", function(event) {
|
||||
getPosition(event);
|
||||
});
|
||||
|
||||
|
||||
if (("ontouchstart" in window) || ("onmsgesturechange" in window)) {
|
||||
$("#dpf").on("touchstart", function() {
|
||||
setin(0);
|
||||
});
|
||||
$("#dpb").on("touchstart", function() {
|
||||
setin(1);
|
||||
});
|
||||
$("#dpl").on("touchstart", function() {
|
||||
setin(2);
|
||||
});
|
||||
$("#dpr").on("touchstart", function() {
|
||||
setin(3);
|
||||
});
|
||||
$("#dpf").on("touchend", function() {
|
||||
clrin(0);
|
||||
});
|
||||
$("#dpb").on("touchend", function() {
|
||||
clrin(1);
|
||||
});
|
||||
$("#dpl").on("touchend", function() {
|
||||
clrin(2);
|
||||
});
|
||||
$("#dpr").on("touchend", function() {
|
||||
clrin(3);
|
||||
});
|
||||
}
|
||||
else {
|
||||
|
||||
$("#dpf").on("mousedown", function() {
|
||||
setin(0);
|
||||
});
|
||||
$("#dpb").on("mousedown", function() {
|
||||
setin(1);
|
||||
});
|
||||
$("#dpl").on("mousedown", function() {
|
||||
setin(2);
|
||||
});
|
||||
$("#dpr").on("mousedown", function() {
|
||||
setin(3);
|
||||
});
|
||||
$("#dpf").on("mouseup", function() {
|
||||
clrin(0);
|
||||
});
|
||||
$("#dpb").on("mouseup", function() {
|
||||
clrin(1);
|
||||
});
|
||||
$("#dpl").on("mouseup", function() {
|
||||
clrin(2);
|
||||
});
|
||||
$("#dpr").on("mouseup", function() {
|
||||
clrin(3);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).off("keydown");
|
||||
|
||||
wasdown=0;
|
||||
$(document).on("keydown", function(eve) {
|
||||
w=eve.which;
|
||||
if (w==87) {
|
||||
setin(0);
|
||||
}
|
||||
else if (w==83) {
|
||||
setin(1);
|
||||
}
|
||||
else if (w==65) {
|
||||
setin(2);
|
||||
}
|
||||
else if (w==68) {
|
||||
setin(3);
|
||||
}
|
||||
else if (w==38) {
|
||||
setin(0);
|
||||
}
|
||||
else if (w==40) {
|
||||
setin(1);
|
||||
}
|
||||
else if (w==37) {
|
||||
setin(2);
|
||||
}
|
||||
else if (w==39) {
|
||||
setin(3);
|
||||
}
|
||||
else if (w==27 || w==81) {
|
||||
end();
|
||||
}
|
||||
});
|
||||
$(document).on("keyup", function(eve) {
|
||||
w=eve.which;
|
||||
if (w==87) {
|
||||
clrin(0);
|
||||
}
|
||||
else if (w==83) {
|
||||
clrin(1);
|
||||
}
|
||||
else if (w==65) {
|
||||
clrin(2);
|
||||
}
|
||||
else if (w==68) {
|
||||
clrin(3);
|
||||
}
|
||||
else if (w==38) {
|
||||
clrin(0);
|
||||
}
|
||||
else if (w==40) {
|
||||
clrin(1);
|
||||
}
|
||||
else if (w==37) {
|
||||
clrin(2);
|
||||
}
|
||||
else if (w==39) {
|
||||
clrin(3);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function end() {
|
||||
clrin(0);
|
||||
clrin(1);
|
||||
clrin(2);
|
||||
clrin(3);
|
||||
clearInterval(counter);
|
||||
$("#you").off("mousedown").off("mousemove").off("mouseup");
|
||||
if (("ontouchstart" in window) || ("onmsgesturechange" in window)) {
|
||||
$("#dpf").off("touchstart").off("touchend");
|
||||
$("#dpb").off("touchstart").off("touchend");
|
||||
$("#dpl").off("touchstart").off("touchend");
|
||||
$("#dpr").off("touchstart").off("touchend");
|
||||
}
|
||||
else {
|
||||
$("#dpf").off("mousedown").off("mouseup");
|
||||
$("#dpb").off("mousedown").off("mouseup");
|
||||
$("#dpl").off("mousedown").off("mouseup");
|
||||
$("#dpr").off("mousedown").off("mouseup");
|
||||
}
|
||||
wasdown=0;
|
||||
$(document).off("keyup").off("keydown");
|
||||
$(document).on("keydown", function(eve) {
|
||||
if (eve.which==27 || eve.which==81) {
|
||||
start();
|
||||
}
|
||||
});
|
||||
$("#tgpm").fadeIn();
|
||||
}
|
||||
|
||||
|
||||
|
||||
function getready() {
|
||||
$("#menu").fadeOut();
|
||||
$("#bar").css("background-color", "rgba(0, 0, 0, 0.5)");
|
||||
$("#sec").html("Ready");
|
||||
setTimeout(function() {
|
||||
$("#sec").html("Set");
|
||||
}, 2000);
|
||||
setTimeout(function() {
|
||||
$("#sec").html("Go! ");
|
||||
}, 4000);
|
||||
setTimeout(function() {
|
||||
$("#kills").html("0 kills");
|
||||
|
||||
$("#tgp").fadeIn().click(function() {
|
||||
end();
|
||||
});
|
||||
$("#cont").click(function() {
|
||||
start();
|
||||
});
|
||||
|
||||
|
||||
timebefore=new Date().getTime();
|
||||
start();
|
||||
}, 4500);
|
||||
}
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,195 @@
|
|||
|
||||
@import url(http://fonts.googleapis.com/css?family=Londrina+Solid|Londrina+Shadow);
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
font-family: "Londrina Solid";
|
||||
box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
body {
|
||||
background-color: #aaa;
|
||||
color: #eee;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 20px;
|
||||
line-height: 20px;
|
||||
vertical-align: middle;
|
||||
overflow: hidden;
|
||||
}
|
||||
#map_canvas {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#dpf, #dpb, #dpl, #dpr {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
font-size: 20px;
|
||||
border: 1px solid #999;
|
||||
border-radius: 10px;
|
||||
background-color: #bbb;
|
||||
color: #333;
|
||||
opacity: 0.8;
|
||||
z-index: 3;
|
||||
}
|
||||
#dpf:active, #dpb:active, #dpl:active, #dpr:active {
|
||||
background-color: #aaa;
|
||||
border: 1px solid #888;
|
||||
}
|
||||
#dpf {
|
||||
position: absolute;
|
||||
bottom: 130px;
|
||||
right: 60px;
|
||||
}
|
||||
#dpb {
|
||||
position: absolute;
|
||||
bottom: 30px;
|
||||
right: 60px;
|
||||
}
|
||||
#dpl {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
right: 110px;
|
||||
}
|
||||
#dpr {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
#bar {
|
||||
background-color: rgba(0, 0, 0, 0.0);
|
||||
z-index: 1;
|
||||
color: #eee;
|
||||
padding: 10px 0px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
vertical-align: middle;
|
||||
border: 1px solid rgba(0, 0, 0, 0.0);
|
||||
}
|
||||
#you {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
#menu, #tgpm {
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 6;
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
#menu h1 {
|
||||
font-family: "Londrina Shadow";
|
||||
padding: 30px 10px;
|
||||
font-size: 30px;
|
||||
line-height: 30px;
|
||||
word-spacing: 20px;
|
||||
background: transparent url("assets/the-bunnies.png") center center no-repeat;
|
||||
background-size: 250px 40px;
|
||||
color: transparent;
|
||||
}
|
||||
h1 {
|
||||
font-family: "Londrina Shadow";
|
||||
padding: 30px 10px;
|
||||
font-size: 30px;
|
||||
line-height: 30px;
|
||||
}
|
||||
.btn {
|
||||
color: #fff;
|
||||
padding: 5px 10px;
|
||||
margin: 10px auto;
|
||||
box-shadow: -5px -5px 1px rgba(255, 255, 255, 0.25);
|
||||
border: 1px dashed #fff;
|
||||
font-size: 20px;
|
||||
display: block;
|
||||
width: 200px;
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
text-decoration: none;
|
||||
}
|
||||
.btn:hover {
|
||||
box-shadow: -3px -3px 1px rgba(255, 255, 255, 0.25);
|
||||
position: relative;
|
||||
top: -2px;
|
||||
left: -2px;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
#dir {
|
||||
width: 2px;
|
||||
height: 100px;
|
||||
background-color: #fff;
|
||||
}
|
||||
#dirh {
|
||||
width: 2px;
|
||||
height: 200px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
z-index: 2;
|
||||
margin: -100px 0 0 -1px;
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
#tgp {
|
||||
margin: 0;
|
||||
width: auto;
|
||||
padding: 10px 5px;
|
||||
z-index: 4;
|
||||
line-height: 20px;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
font-size: 20px;
|
||||
display: none;
|
||||
/* box-shadow: -5px 5px 1px rgba(255, 255, 255, 0.25); */
|
||||
color: #fff;
|
||||
border-radius: 5px;
|
||||
background: transparent url("assets/pauseplay.png") no-repeat right top;
|
||||
width: 42px;
|
||||
background-size: 42px 84px;
|
||||
color: transparent;
|
||||
}
|
||||
#tgp:hover {
|
||||
/* box-shadow: -3px 3px 1px rgba(255, 255, 255, 0.25); */
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 2px;
|
||||
}
|
||||
#tgpm {
|
||||
display: none;
|
||||
}
|
||||
h1 sup {
|
||||
font-size: 13px;
|
||||
line-height: 13px;
|
||||
font-weight: 400;
|
||||
color: red;
|
||||
}
|
||||
#sec {
|
||||
float: center;
|
||||
display: inline-block;
|
||||
}
|
||||
#kills {
|
||||
float: left;
|
||||
display: inline-block;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
|
@ -0,0 +1,288 @@
|
|||
|
||||
step=3;
|
||||
stti=10;
|
||||
interf=0;
|
||||
interb=0;
|
||||
interl=0;
|
||||
interr=0;
|
||||
|
||||
function angle(x, y, bx, by) {
|
||||
return Math.atan2(bx-x, by-y)/Math.PI*-180;
|
||||
}
|
||||
|
||||
function dpf() {
|
||||
map.panBy(0, -step);
|
||||
}
|
||||
function dpb() {
|
||||
map.panBy(0, step);
|
||||
}
|
||||
function dpl() {
|
||||
map.panBy(-step, 0);
|
||||
}
|
||||
function dpr() {
|
||||
map.panBy(step, 0);
|
||||
}
|
||||
function setin(dir) {
|
||||
//functorun=functor;
|
||||
//functorun();
|
||||
if (dir==0 && !interf) {
|
||||
interf=setInterval(function() {
|
||||
dpf();
|
||||
}, stti);
|
||||
}
|
||||
if (dir==1 && !interb) {
|
||||
interb=setInterval(function() {
|
||||
dpb();
|
||||
}, stti);
|
||||
}
|
||||
if (dir==2 && !interl) {
|
||||
interl=setInterval(function() {
|
||||
dpl();
|
||||
}, stti);
|
||||
}
|
||||
if (dir==3 && !interr) {
|
||||
interr=setInterval(function() {
|
||||
dpr();
|
||||
}, stti);
|
||||
}
|
||||
}
|
||||
function clrin(dir) {
|
||||
if (dir==0) {
|
||||
clearInterval(interf);
|
||||
interf=0;
|
||||
}
|
||||
if (dir==1) {
|
||||
clearInterval(interb);
|
||||
interb=0;
|
||||
}
|
||||
if (dir==2) {
|
||||
clearInterval(interl);
|
||||
interl=0;
|
||||
}
|
||||
if (dir==3) {
|
||||
clearInterval(interr);
|
||||
interr=0;
|
||||
}
|
||||
}
|
||||
|
||||
if (!(("ontouchstart" in window) || ("onmsgesturechange" in window))) {
|
||||
$("#dpf, #dpb, #dpl, #dpr").css("display", "none");
|
||||
}
|
||||
|
||||
//stackoverflow
|
||||
function getPosition(e) {
|
||||
var targ;
|
||||
if (!e)
|
||||
e = window.event;
|
||||
if (e.target)
|
||||
targ = e.target;
|
||||
else if (e.srcElement)
|
||||
targ = e.srcElement;
|
||||
if (targ.nodeType == 3)
|
||||
targ = targ.parentNode;
|
||||
var x = e.pageX - $(targ).offset().left;
|
||||
var y = e.pageY - $(targ).offset().top;
|
||||
$("#dirh").css("transform", "rotate("+angle(x, y, $("#you").width()/2, $("#you").height()/2)+"deg)");
|
||||
|
||||
}
|
||||
|
||||
function start() {
|
||||
|
||||
$("#tgpm").fadeOut();
|
||||
|
||||
counter=setInterval(function() {
|
||||
timenow=new Date().getTime();
|
||||
sec=timenow-timebefore;
|
||||
$("#sec").html(sec+"ms");
|
||||
}, 1);
|
||||
|
||||
|
||||
$("#you").on("mousedown", function(event) {
|
||||
getPosition(event);
|
||||
});
|
||||
$("#you").on("mousemove", function(event) {
|
||||
getPosition(event);
|
||||
});
|
||||
$("#you").on("mouseup", function(event) {
|
||||
getPosition(event);
|
||||
});
|
||||
|
||||
|
||||
if (("ontouchstart" in window) || ("onmsgesturechange" in window)) {
|
||||
$("#dpf").on("touchstart", function() {
|
||||
setin(0);
|
||||
});
|
||||
$("#dpb").on("touchstart", function() {
|
||||
setin(1);
|
||||
});
|
||||
$("#dpl").on("touchstart", function() {
|
||||
setin(2);
|
||||
});
|
||||
$("#dpr").on("touchstart", function() {
|
||||
setin(3);
|
||||
});
|
||||
$("#dpf").on("touchend", function() {
|
||||
clrin(0);
|
||||
});
|
||||
$("#dpb").on("touchend", function() {
|
||||
clrin(1);
|
||||
});
|
||||
$("#dpl").on("touchend", function() {
|
||||
clrin(2);
|
||||
});
|
||||
$("#dpr").on("touchend", function() {
|
||||
clrin(3);
|
||||
});
|
||||
}
|
||||
else {
|
||||
|
||||
$("#dpf").on("mousedown", function() {
|
||||
setin(0);
|
||||
});
|
||||
$("#dpb").on("mousedown", function() {
|
||||
setin(1);
|
||||
});
|
||||
$("#dpl").on("mousedown", function() {
|
||||
setin(2);
|
||||
});
|
||||
$("#dpr").on("mousedown", function() {
|
||||
setin(3);
|
||||
});
|
||||
$("#dpf").on("mouseup", function() {
|
||||
clrin(0);
|
||||
});
|
||||
$("#dpb").on("mouseup", function() {
|
||||
clrin(1);
|
||||
});
|
||||
$("#dpl").on("mouseup", function() {
|
||||
clrin(2);
|
||||
});
|
||||
$("#dpr").on("mouseup", function() {
|
||||
clrin(3);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).off("keydown");
|
||||
|
||||
wasdown=0;
|
||||
$(document).on("keydown", function(eve) {
|
||||
w=eve.which;
|
||||
if (w==87) {
|
||||
setin(0);
|
||||
}
|
||||
else if (w==83) {
|
||||
setin(1);
|
||||
}
|
||||
else if (w==65) {
|
||||
setin(2);
|
||||
}
|
||||
else if (w==68) {
|
||||
setin(3);
|
||||
}
|
||||
else if (w==38) {
|
||||
setin(0);
|
||||
}
|
||||
else if (w==40) {
|
||||
setin(1);
|
||||
}
|
||||
else if (w==37) {
|
||||
setin(2);
|
||||
}
|
||||
else if (w==39) {
|
||||
setin(3);
|
||||
}
|
||||
else if (w==27 || w==81) {
|
||||
end();
|
||||
}
|
||||
});
|
||||
$(document).on("keyup", function(eve) {
|
||||
w=eve.which;
|
||||
if (w==87) {
|
||||
clrin(0);
|
||||
}
|
||||
else if (w==83) {
|
||||
clrin(1);
|
||||
}
|
||||
else if (w==65) {
|
||||
clrin(2);
|
||||
}
|
||||
else if (w==68) {
|
||||
clrin(3);
|
||||
}
|
||||
else if (w==38) {
|
||||
clrin(0);
|
||||
}
|
||||
else if (w==40) {
|
||||
clrin(1);
|
||||
}
|
||||
else if (w==37) {
|
||||
clrin(2);
|
||||
}
|
||||
else if (w==39) {
|
||||
clrin(3);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function end() {
|
||||
clrin(0);
|
||||
clrin(1);
|
||||
clrin(2);
|
||||
clrin(3);
|
||||
clearInterval(counter);
|
||||
$("#you").off("mousedown").off("mousemove").off("mouseup");
|
||||
if (("ontouchstart" in window) || ("onmsgesturechange" in window)) {
|
||||
$("#dpf").off("touchstart").off("touchend");
|
||||
$("#dpb").off("touchstart").off("touchend");
|
||||
$("#dpl").off("touchstart").off("touchend");
|
||||
$("#dpr").off("touchstart").off("touchend");
|
||||
}
|
||||
else {
|
||||
$("#dpf").off("mousedown").off("mouseup");
|
||||
$("#dpb").off("mousedown").off("mouseup");
|
||||
$("#dpl").off("mousedown").off("mouseup");
|
||||
$("#dpr").off("mousedown").off("mouseup");
|
||||
}
|
||||
wasdown=0;
|
||||
$(document).off("keyup").off("keydown");
|
||||
$(document).on("keydown", function(eve) {
|
||||
if (eve.which==27 || eve.which==81) {
|
||||
start();
|
||||
}
|
||||
});
|
||||
$("#tgpm").fadeIn();
|
||||
}
|
||||
|
||||
|
||||
|
||||
function getready() {
|
||||
$("#menu").fadeOut();
|
||||
$("#bar").css("background-color", "rgba(0, 0, 0, 0.5)");
|
||||
$("#sec").html("Ready");
|
||||
setTimeout(function() {
|
||||
$("#sec").html("Set");
|
||||
}, 2000);
|
||||
setTimeout(function() {
|
||||
$("#sec").html("Go! ");
|
||||
}, 4000);
|
||||
setTimeout(function() {
|
||||
$("#kills").html("0 kills");
|
||||
|
||||
$("#tgp").fadeIn().click(function() {
|
||||
end();
|
||||
});
|
||||
$("#cont").click(function() {
|
||||
start();
|
||||
});
|
||||
|
||||
|
||||
timebefore=new Date().getTime();
|
||||
start();
|
||||
}, 4500);
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue