¡Ya que va, que vuelva la bolita!

Creo que a esta velocidad esta mas entretenido, ahora comprendo como el display de las pantallas que muestran un mensaje y rebota en la pantalla funciona ¡Yeah!

<meta charset="UTF-8">

<canvas width="600" height="400"> </canvas>


<script>

    var screen = document.querySelector ("canvas");

    var pencil = screen.getContext("2d");

        pencil.fillStyle = "lightblue";
        pencil.fillRect (0,0,600,400);


function makingCircunference (sectorX,sectorY,sectorRadius){

    pencil.fillStyle = ("red");
    pencil.beginPath();
    pencil.arc(sectorX,sectorY,sectorRadius,0,2*Math.PI);
    pencil.fill();

}


    function clearScreen (){

        pencil.clearRect(0,0,600,400);
    }


var vectorX = 0;

var orientation = 1;


        function updatingScreen (){

            clearScreen();
            if(vectorX > 600){
                orientation = -1;
            }
                else if (vectorX < 0){
                orientation = 1
                }

            makingCircunference(vectorX,20,10);
            vectorX = vectorX + orientation;

        }


    setInterval(updatingScreen,10);



</script>