• How come I don't get a black box when I add an event listener?

    From Chad@21:1/5 to All on Wed Feb 9 09:45:27 2022
    When I add an event listener, I don't get a black box. However, when I comment out event listener, I get a black box. Why?
    <html>
    <canvas id = "canvas"></canvas>
    <script>
    var x = 20;
    var y = 20;

    var canvas = document.getElementById('canvas');
    var ctx = canvas.getContext('2d');
    var i =0;

    addEventListener();

    function drawSnake()
    {
    for (i = 0; i < 20; i++) {
    ctx.fillRect(x, y, 25, 25);
    }
    }

    drawSnake();

    function addListener() {
    document.addEventListener('keydown', function(e)) {
    switch(e.keycode) {
    case 37: break; //left
    case 38: break; //up
    case 39: break; //right
    }
    }
    }



    //ctx.fillRect(50, 100, 150, 150);
    // }

    </script>
    </html>

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Kristjan Robam@21:1/5 to All on Fri Feb 11 07:57:29 2022
    Chad kirjutas KolmapƤev, 9. veebruar 2022 kl 19:45:31 UTC+2:
    When I add an event listener, I don't get a black box. However, when I comment out event listener, I get a black box. Why?
    <html>
    <canvas id = "canvas"></canvas>
    <script>
    var x = 20;
    var y = 20;

    var canvas = document.getElementById('canvas');
    var ctx = canvas.getContext('2d');
    var i =0;

    addEventListener();

    function drawSnake()
    {
    for (i = 0; i < 20; i++) {
    ctx.fillRect(x, y, 25, 25);
    }
    }

    drawSnake();

    function addListener() {
    document.addEventListener('keydown', function(e)) {
    switch(e.keycode) {
    case 37: break; //left
    case 38: break; //up
    case 39: break; //right
    }
    }
    }



    //ctx.fillRect(50, 100, 150, 150);
    // }

    </script>
    </html>

    This thing should even do something? It looks a lot of code missing on the first look at it.

    😫

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)
  • From Julio Di Egidio@21:1/5 to Chad on Sat Feb 12 03:01:39 2022
    On Wednesday, 9 February 2022 at 18:45:31 UTC+1, Chad wrote:
    When I add an event listener, I don't get a black box. However, when I comment out event listener, I get a black box. Why?
    <html>
    <canvas id = "canvas"></canvas>
    <script>
    var x = 20;
    var y = 20;

    var canvas = document.getElementById('canvas');
    var ctx = canvas.getContext('2d');
    var i =0;

    addEventListener();

    function drawSnake()
    {
    for (i = 0; i < 20; i++) {
    ctx.fillRect(x, y, 25, 25);
    }
    }

    drawSnake();

    function addListener() {
    document.addEventListener('keydown', function(e)) {

    That should be:
    document.addEventListener('keydown', function (e) {

    switch(e.keycode) {
    case 37: break; //left
    case 38: break; //up
    case 39: break; //right
    }
    }

    Then there should be:
    )

    }

    Misplaced/mismatched parentheses, if I am not overlooking anything.
    Use proper indentation/formatting to more easily see that kind of stuff:
    and maybe an editor with syntax checking/highlighting which helps.

    That said, your code is indeed quite far from anything solid, but I guess
    you are working on it...

    HTH,

    Julio

    --- SoupGate-Win32 v1.05
    * Origin: fsxNet Usenet Gateway (21:1/5)