Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Need this wrote in javascript constructor (name, radius, speed) Parameters name radius (range of values: 10 to 50) speed (range of values: 0 to 25)

Need this wrote in javascript

constructor(name, radius, speed)

  • Parameters
    • name
    • radius (range of values: 10 to 50)
    • speed (range of values: 0 to 25)
  • Process
    • Assign the name, radius, and speed values to the appropriate class variables
      • Be sure to use the this keyword
    • Generate a random starting position (xPos and yPos) for the circlethis.xPos = Math.floor(Math.random() * (MAX_WIDTH - radius * 2)); this.yPos = Math.floor(Math.random() * (MAX_HEIGHT - radius * 2));
  • Output
    • None

get name() , get radius() and get speed() functions Note: Each of these functions differ only by the variable value affected.

  • Parameters
    • None
  • Process
    • Return the value of the requested class variable (name, radius or speed)
      • Be sure to use the this keyword
  • Output
    • The requested value

set name(name), set radius(radius), and set speed(speed) functions Note: Each of these functions differ only by the variable value affected.

  • Parameters
    • Various (i.e., name, radius or speed)
  • Process
    • Assign the provided value to the appropriate call variable (name, radius or speed)
      • Be sure to use the this keyword
  • Output
    • None

checkForWallCollision()

  • Parameters
    • None
  • Process Note: Use the movingDown and movingRight class variables to control the circle's direction.
    • Determine if the circle has hit the right edge of the canvasthis.xPos >= (MAX_WIDTH - this.radius * 2)
      • If so, change the horizontal direction of the circle from right to left
    • Determine if the circle has hit the left edge of the canvasthis.xPos <= 0
      • If so, change the horizontal direction of the circle from left to right
    • Determine if the circle has hit the bottom edge of the canvasthis.yPos >= (MAX_HEIGHT - this.radius * 2)
      • If so, change the vertical direction of the circle from down to up
    • Determine if the circle has hit the top edge of the canvasthis.movingDown = true;
      • If so, change the vertical direction of the circle from up to down
    • Update the circle's color by calling the updateColor() function
  • Output
    • None

draw(canvas) Note: This is the only class function that is called directly from the general JavaScript code.

  • Parameters
    • canvas
  • Process
    • Check to see if a collision has occurred by calling the checkForWallCollision() function
    • Update the circle's position by calling the updatePosition() function
    • Prepare to draw the circle using the current color
    • Draw the circle on the canvascanvas.arc(this.xPos + this.radius, this.yPos + this.radius, this.radius, 0, 2 * Math.PI);
    • Prepare to draw the circle's name on the circlecanvas.font = "bold 14pt Calibri";
    • Draw the circle's name on the circlecanvas.fillText(this.name, this.xPos + this.radius, this.yPos + this.radius + 5);
  • Output
    • None

updateColor() Note: Use the movingDown and movingRight class variables to determine the circle's direction.

  • Parameters
    • None
  • Process
    • Determine the color of the circle based on its current direction
      • Red - If the circle is traveling down and to the right
      • Green - If the circle is traveling down and to the left
      • Blue - If the circle is traveling up and to the right
      • Orange - If the circle is traveling up and to the left
  • Output
    • None

updatePosition()

  • Parameters
    • None
  • Process
    • Compute the new horizontal position (xPos) of the circle
      • Moving from left to right: xPos + speed
      • Moving from right to left: xPos - speed
    • Compute the new vertical position (yPos) of the circle
      • Moving from top to bottom: yPos + speed
      • Moving from bottom to top: yPos - speed
  • Output
    • None

Step by Step Solution

3.45 Rating (168 Votes )

There are 3 Steps involved in it

Step: 1

Heres a basic implementation of the described functionality in JavaScript javascript const MAXWIDTH ... blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image_2

Step: 3

blur-text-image_3

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Algebra and Trigonometry

Authors: Ron Larson

10th edition

9781337514255, 1337271179, 133751425X, 978-1337271172

More Books

Students also viewed these Programming questions

Question

The symbol Answered: 1 week ago

Answered: 1 week ago

Question

Solve the following the equation. 3y-4=3(y+6)-2(y+3)

Answered: 1 week ago

Question

Solve the following the equation. 8-0.5(x+3)=0.25(x-1)

Answered: 1 week ago