Commit e3b0ca5d authored by DoNaTio s.r.o.'s avatar DoNaTio s.r.o.
Browse files

create ball

parent 9556cc7f
......@@ -5,25 +5,38 @@
* @constructor
*/
function ClientBall($el){
function ClientBall($el) {
var attributes = {
el: $el,
x: 0,
y: 0
y: 0,
width: 20,
height: 20
};
return {
init: function(){
init: function () {
},
setAxis: function(x,y){
collides: function () {
},
setAxis: function (x, y) {
attributes.x = x;
attributes.y = y;
},
redraw: function(){
attributes.el.css('top',y);
attributes.el.css('left',x);
redraw: function () {
attributes.el.css('top', attributes.y);
attributes.el.css('left', attributes.x);
},
create: function () {
attributes.el.css({
'width': attributes.width,
'height': attributes.height,
});
this.redraw();
}
}
}
......@@ -9,6 +9,9 @@ $(function () {
var log = new Log($('.messages'));
var score = new ClientScore( $('.score') );
var ball = new ClientBall( $('#ball') );
ball.create();
// Prompt for setting a username
var user = new ClientPlayer($('.pages'));
user.setLoginCallback(function () {
......
/**
* Ball
* @type {{x: number, y: number, r: number, c: string, vx: number, vy: number, draw: Function}}
*/
module.exports = {
x: 50,
y: 50,
r: 5,
c: "white",
vx: 4,
vy: 8,
ctx,
init: function(){
var canvas = document.getElementById('table');
ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.arc(100, 10, 2, 0, Math.PI*2, true);
ctx.closePath();
ctx.fill();
},
// Function for drawing ball on canvas
draw: function() {
ctx.beginPath();
ctx.fillStyle = this.c;
ctx.arc(this.x, this.y, this.r, 0, Math.PI*2, false);
ctx.fill();
}
};
\ No newline at end of file
......@@ -51,6 +51,7 @@
<div id="playground">
<div class="score"><span class="team0">0</span>:<span class="team1">0</span></div>
<div id="ball"></div>
<div id="table"></div>
</div>
</div>
......@@ -74,9 +75,8 @@
<script src="/socket.io/socket.io.js"></script>
<script src="/ClientScore.js"></script>
<script src="/ClientScore.js"></script>
<script src="/ClientBall.js"></script>
<script src="/ClientPlayer.js"></script>
<script src="/Log.js"></script>
<script src="/ClientMain.js"></script>
......
......@@ -115,3 +115,15 @@ body {
top: 50px;
left: 458px;
}
#signedInAs{
font-weight: bold;
color: white;
}
#ball{
position: absolute;
top:100px;
left: 100px;
background: url(images/ball.png) no-repeat;
border: 1px solid red;
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment