You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
91 lines
2.0 KiB
91 lines
2.0 KiB
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Gravity Pong: Flow Based Programming in Clojure using core.async</title>
|
|
<!--[if lt IE 9]>
|
|
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
|
<![endif]-->
|
|
<style type="text/css">
|
|
body {
|
|
font-family: monospace;
|
|
}
|
|
|
|
#title {
|
|
margin: 0px;
|
|
width: 98%;
|
|
position: absolute;
|
|
}
|
|
|
|
#ball {
|
|
fill: orange;
|
|
}
|
|
|
|
#mass {
|
|
opacity: 0.5;
|
|
fill: khaki;
|
|
}
|
|
|
|
#rpaddle, #lpaddle {
|
|
fill: rgb(108, 182, 108);
|
|
}
|
|
|
|
#state {
|
|
font-size: 1.5em;
|
|
text-align: center;
|
|
}
|
|
|
|
#canvas {
|
|
border: 2px green solid;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
#score {
|
|
font-size: 70px;
|
|
text-anchor: middle;
|
|
dominant-baseline: central;
|
|
}
|
|
|
|
#msg {
|
|
position: absolute;
|
|
width: 98%;
|
|
top: 40px;
|
|
font-size: 1.2em;
|
|
}
|
|
|
|
#msg .imp {
|
|
font-size: xx-large;
|
|
font-weight: bold;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<center>
|
|
<div id="screen">
|
|
<h2 id="title">Gravity Pong!</h2>
|
|
<div style="float: right">
|
|
<a target="_blank" href="http://github.com/abhin4v/frpong">github</a>
|
|
</div>
|
|
<div id="msg">press <space> to start</div>
|
|
<svg id="canvas">
|
|
<circle id="mass" />
|
|
<text id="score">0</text>
|
|
<circle id="ball" />
|
|
<rect id="lpaddle" />
|
|
<rect id="rpaddle" />
|
|
</svg>
|
|
<div>
|
|
<div style="float: left">
|
|
fps <span id="fps">0</span>
|
|
</div>
|
|
use W-S and Up-Down keys to move the paddles / use Left-Right keys to change gravity
|
|
<div style="float: right; font-size: smaller">Works only on Google Chrome</div>
|
|
</div>
|
|
</div>
|
|
</center>
|
|
|
|
<!-- pointing to cljsbuild generated js file -->
|
|
<script src="js/frpong.js"></script>
|
|
<script type="text/javascript">frpong.core.frpong()</script>
|
|
</body>
|
|
</html> |