Untitled

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <canvas id="canv" width="1000" height="600"></canvas>
        <script>
            var c = document.getElementById("canv");
            var ctx = c.getContext("2d");

            class sniezka {
                constructor(x,y,r)
                {
                    this.x=x;
                    this.y=y;
                    this.r=r;
                }

                sniezynka()
                {
                    ctx.beginPath();

                    ctx.moveTo(this.x-this.r, this.y);
                    ctx.lineTo(this.x+this.r, this.y);

                    ctx.moveTo(this.x, this.y-this.r);
                    ctx.lineTo(this.x, this.y+this.r);

                    ctx.moveTo(this.x-this.r, this.y+this.r);
                    ctx.lineTo(this.x+this.r, this.y-this.r);

                    ctx.moveTo(this.x+this.r, this.y+this.r);
                    ctx.lineTo(this.x-this.r, this.y-this.r);

                    ctx.stroke();
                    ctx.closePath();
                }

                przesun(dx, dy)
                {
                    this.dx=dx;
                    this.dy=dy;

                    this.x += this.dx;
                    this.y += this.dy;

                    ctx.clearRect(0,0,1000,600);

                    this.sniezynka();
                }

            };

           var zm = new sniezka(20,20,10);
           zm.sniezynka();
           zm.przesun(40,20);
        </script>
    </body>
</html>