space invader movement question

tim50

I'm a noob. I can't get the space invaders to move down the y axis. I think I may have made the rows of the invaders badily. How do I get the invaders to move down the y axis? Also I can't run more than one javascript file in my html doc.

Thanks.

var invaders = [];

   function setup(){
       createCanvas(windowWidth, windowHeight);
       colorMode(HSB);
       for (var i = 0; i < 10; i++){
       invaders[i] = new Invader(i*60, 50);
       }
     }
  function draw(){
      background(60, 100, 100);

      var edge = false;
      for (var i =0; i < invaders.length; i++){
      invaders[i].display();
      invaders[i].move();
      if (invaders[i].x > width || invaders[i].x < 0){
          edge = true;
     }
    }

       if (edge){
       for (var i =0; i < invaders.length; i++){
      invaders[i].shiftDown();
   }
  }
 }
  function Invader(x, y){
     this.x = x;
      this.y = y;
      this.xdir = 3;
      this.diameter = 50;
      this.display = function(){
          strokeWeight(2);
          stroke(0, 100, 100);
          noFill();
          ellipse(this.x, this.y, this.diameter, this.diameter);
          ellipse(this.x, this.y*2.2, this.diameter, this.diameter);
          ellipse(this.x, this.y*3.4, this.diameter, this.diameter);
          ellipse(this.x, this.y*4.6, this.diameter, this.diameter);
          ellipse(this.x, this.y*5.8, this.diameter, this.diameter);

      }

      this.shiftDown = function(){
          this.xdir *= -1;
          //this.y = 1; 
 }

  this.move = function(){
  this.x = (this.x + this.xdir);
  }
}

GoToLoop

//this.y = 1;? Shouldn't it be something like: this.y += this.diameter;?! :-/
You should indent your code better. It's hard to study it the way it is now. =;

tim50

That's because I suck at code. I was wondering, don't other people suck too? I mean do you know tons of code? How do people know all this code? Like there is so much stuff to know?

What I'd like to have with my code above is have the constructor object be a variable so I can tell the variable what to do.... I'm not ready to pretty my code up. I can barely write hello world let alone have all the commas spread out in perfect symmetry. For me, it was hard getting the code into the question above. I hoped it worked like reddit and as far as I know, it does.

I'll figure it out somehow. I just got my editor working with the python server, so that's something.

GoToLoop

I'm not ready to pretty my code up.

Paste your code @ https://JSFiddle.net/ in its JavaScript window.
At the top left, there are 4 options: Run, Save, Tidy & Collaborate.
Well, if you click at Tidy, your code gets magically neatly indented and spaced out. \m/

I just got my editor working with the Python server, ...

If you run it under any Firefox-based browser, you don't need any local server at all! :ar!

As another option, you can use any online web editor, for example OpenProcessing: :D
https://OpenProcessing.org/sketch/create

... is have the constructor object be a variable so I can tell the variable what to do...

You should re-write your class Invader to represent just 1 alien, not multiples of them. L-)
Later, if you really prefer, you can make another class to manage each Invader. *-:)

GoToLoop

https://forum.Processing.org/two/discussion/20907/invaders-rows-moving-down-the-y-axis