JavaScript Ascii animation with while loops and console.log

I was working on figuring out while loops for an exercise in LearnJavaScriptTheHardWay  by Zed Shaw,  and I decided to do this:



The red text console.logs were for debugging, and will take over the animation if the comments are removed.

The bold red number is the point at which the loop stops.  My CPU didn't have too much trouble with that large number, but I'd recommend dialing it down if your CPU is slow.

Also if your CPU is really fast, you'll have to change the pause to something much lower to see the animation better.  That too is in a loop, so the more that pause happens, the more loops your CPU is running.  

Link: https://stackoverflow.com/questions/9006988/node-js-on-windows-how-to-clear-console

To clear screen as described in link above, uncomment the bold purple comment

I tried to comment the code to help learners see what I did,  any comments or suggestions, feel free to drop em in!



                     ex16_ASCII.js

//Trying to make a command line animation with Node while loop

const ani1 =  "             **         ";
const ani2 =  "     ****@@@@@@@@@****  ";
const ani3 =  "    ***@@@   @@   @@@** ";
const ani4 =  "    #@@@@@@@@@@@@@@@@@# ";
const ani5 =  "   #####**        **####";

//var spaces = " "; //To move the strings across the screen
var add_line = "\n" // To make it move up and down (scrolling does this too)
var count = 0;
var break_timer = 0;
i = 0;


function screen_run(){
    var spaces = " "; //if created outside the function this variable
                    //prints undefined on first loop
    run = true;
    speed = 3; //how often ascii gets printed
    interval = 3000; //how long to count between prints
    pause = 0.001; //how slow to count to create pause effect

    while(run){
       spaces += " ";
       count += 1;
       break_timer += 1;
       timer = 0;
       //console.log(break_timer)
       if(break_timer > 10000000)break;
       //  log animation to screen ---------->
       if(count % speed == 0){ //adjust this to speed up, slow down movement
         //console.log('\033[2J');  //clear screen
         console.log(spaces, ani1);
         console.log(spaces, ani2);
         console.log(spaces, ani3);
         console.log(spaces, ani4);
         console.log(spaces, ani5);
         console.log(add_line)
         //----  Move up or down with newline
         add_line += "\n";
         if(add_line.length > 5){
           add_line = "\n"
         }
         //console.log(add_line.length)
         //console.log(count)

       }
       //--- TIMER --
       else{
         // do something that takes up sys time
         // SPEED of animation
         // this is similar to using set interval
         // think of 1000 counts as a milisecond
         while(timer < interval ){
           timer += pause;
           break_timer += .001; //how long to run animation

           // console log here will take up all animation space
           // console.log("timer=", timer);


         }

       }
       //-- reset spaces to keep from filling up the
       //-- screen with empty space
       if(spaces.length > 40){ //increase this to increase distance across prompt
          spaces = " ";
       }
    }
}

screen_run();








Comments

Popular posts from this blog

Statistics, Python, Making a Stem Plot

Pandas Python and a little probability