public static extern svgjs.Text font(this svgjs.Text font, string attr, string value);
public void Render(Retyped.dom.HTMLElement root)
{
// define document width and height
width = 640;
height = 480;
// create SVG document and set its size
draw = svgjs2.Self(root);
draw.size(width, height);
draw.viewbox(0, 0, width, height);
// draw background
var background = draw.rect(width, height).fill("#dde3e1");
// draw line
var line = draw.line(width / 2, 0, width / 2, height);
line.stroke(new svgjs.StrokeData
{
width = 5,
color = "#fff",
dasharray = "5,5"
});
// define paddle width and height
paddleWidth = 15;
paddleHeight = 80;
// create and position left paddle
paddleLeft = draw.rect(paddleWidth, paddleHeight);
paddleLeft.x(0).Value.cy(height / 2).Value.fill("#00ff99");
// create and position right paddle
paddleRight = paddleLeft.clone();
paddleRight.x(width - paddleWidth).Value.fill("#ff0066");
// define ball size
var ballSize = 10;
// create ball
ball = draw.circle(ballSize);
ball.center(width / 2, height / 2).Value.fill("#7f7f7f");
// define inital player score
playerLeft = 0.0;
playerRight = 0.0;
// create text for the score, set font properties
scoreLeft = (svgjs.Text)draw.text(playerLeft + "").font(
new svgjs.FontData
{
size = 32,
family = "Menlo, sans-serif",
anchor = "end",
style = "color:#fff"
}).Value.move(width / 2 - 10, 10);
// cloning rocks!
scoreRight = (svgjs.Text)((svgjs.Text)scoreLeft.clone())
.text(playerRight + "").Value
.font("anchor", "start")
.x(width / 2 + 10);
// AI difficulty
difficulty = 2;
callback(0);
paddleDirection = 0;
paddleSpeed = 5;
svgjs2.on(document, "keydown", new Action <KeyboardEvent>(e =>
{
// Let's skip non-control keys
if (e.keyCode == 38)
{
paddleDirection = -1;
e.preventDefault();
}
else if (e.keyCode == 40)
{
paddleDirection = 1;
e.preventDefault();
}
else if (e.keyCode == 32 && vx == 0 && vy == 0)
{
// random velocity for the ball at start
vy = Math.random() * 500 - 150;
vx = Math.random() > 0.5 ? 250 : -250;
e.preventDefault();
}
else
{
paddleDirection = 0;
}
}));
svgjs2.on(document, "keyup", new Action <KeyboardEvent>(e =>
{
// Let's skip non-control keys
if (e.keyCode == 38 || e.keyCode == 40)
{
paddleDirection = 0;
e.preventDefault();
}
}));
// ball color update
ballColor = CreateColor("#ff0066");
ballColor.morph("#00ff99");
}
