initial static assets
This commit is contained in:
parent
3f71a9c845
commit
3c0128b9b9
28
static/css/style.css
Normal file
28
static/css/style.css
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
body {
|
||||||
|
background-color: #333;
|
||||||
|
color: #52bdce;
|
||||||
|
margin:50px 0px; padding:0px;
|
||||||
|
text-align:center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.short {
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.console {
|
||||||
|
color: #ff6;
|
||||||
|
background-color: #222;
|
||||||
|
border: 1px solid #52bdce;
|
||||||
|
font-family: Courier;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
color: #ff6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: 400px;
|
||||||
|
margin:0px auto;
|
||||||
|
text-align:left;
|
||||||
|
}
|
20
static/html/index.html
Normal file
20
static/html/index.html
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>game</title>
|
||||||
|
<link rel="stylesheet" type="text/css" href="/static/css/style.css"/>
|
||||||
|
<script type="text/JavaScript" src="/static/js/jquery.js"></script>
|
||||||
|
<script type="text/JavaScript" src="/static/js/common.js"></script>
|
||||||
|
<script type="text/JavaScript" src="/static/js/keyboard.js"></script>
|
||||||
|
<script type="text/JavaScript" src="/static/js/game.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="login">
|
||||||
|
<span class="title">username: </span>
|
||||||
|
<input class="console" type="text" value="" name ="input" id="login-input" autofocus />
|
||||||
|
</div>
|
||||||
|
<div id="game">
|
||||||
|
<div id="myname"></div>
|
||||||
|
<div class="console" id="console"></div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
5
static/js/common.js
Normal file
5
static/js/common.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
function wsuri(path) {
|
||||||
|
var loc = window.location;
|
||||||
|
new_uri = "ws://" + loc.host + "/ws" + path;
|
||||||
|
return new_uri;
|
||||||
|
}
|
39
static/js/game.js
Normal file
39
static/js/game.js
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
var conn;
|
||||||
|
var me = {
|
||||||
|
"position": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
$("#game").hide();
|
||||||
|
$("#login-input").keypress(function (event) {
|
||||||
|
if (event.which == 13) {
|
||||||
|
me.name = $("#login-input").val();
|
||||||
|
$("#myname").text(me.name);
|
||||||
|
$("#game").toggle();
|
||||||
|
$("#login").toggle();
|
||||||
|
connect();
|
||||||
|
document.onkeydown = handleKeys;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
function connect() {
|
||||||
|
console.log("connecting");
|
||||||
|
conn = new WebSocket(wsuri("/game/"));
|
||||||
|
conn.onclose = function(event) {
|
||||||
|
console.log("closed");
|
||||||
|
$("#console").text("connection lost");
|
||||||
|
}
|
||||||
|
conn.onmessage = function(event) {
|
||||||
|
var obj = JSON.parse(event.data);
|
||||||
|
$("#console").text(JSON.stringify(obj));
|
||||||
|
console.log(JSON.stringify(obj));
|
||||||
|
}
|
||||||
|
conn.onopen = function(event) {
|
||||||
|
console.log("got open event");
|
||||||
|
conn.send(me.name);
|
||||||
|
}
|
||||||
|
};
|
38
static/js/keyboard.js
Normal file
38
static/js/keyboard.js
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
function handleKeys(event) {
|
||||||
|
var keyCode;
|
||||||
|
if(event == null){
|
||||||
|
keyCode = window.event.keyCode;
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
keyCode = event.keyCode;
|
||||||
|
}
|
||||||
|
|
||||||
|
// up
|
||||||
|
if (keyCode == 38 || keyCode == 87 || keyCode == 75) {
|
||||||
|
console.log("up");
|
||||||
|
me.position.y += 1;
|
||||||
|
conn.send(JSON.stringify(me.position));
|
||||||
|
}
|
||||||
|
// down
|
||||||
|
else if(keyCode == 40 || keyCode == 83 || keyCode == 74) {
|
||||||
|
console.log("down");
|
||||||
|
me.position.y -= 1;
|
||||||
|
conn.send(JSON.stringify(me.position));
|
||||||
|
}
|
||||||
|
// right
|
||||||
|
else if(keyCode == 39 || keyCode == 68 || keyCode == 76) {
|
||||||
|
console.log("right");
|
||||||
|
me.position.x += 1;
|
||||||
|
conn.send(JSON.stringify(me.position));
|
||||||
|
}
|
||||||
|
// left
|
||||||
|
else if(keyCode == 37 || keyCode == 65 || keyCode == 72) {
|
||||||
|
console.log("left");
|
||||||
|
me.position.x -= 1;
|
||||||
|
conn.send(JSON.stringify(me.position));
|
||||||
|
}
|
||||||
|
|
||||||
|
else if( keyCode == 27) {
|
||||||
|
console.log("escape");
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user