Car race javascript assignment expert

Question

Car Race

the goal of this code is to get output using with Classes.

input

first line of input contains a string playerName

second line of input contains a number nitro

third line of input contains a number speed

output

the output contains multiple lines with the appropriate texts

input1

Alyssa

100

1

output1

Race has started

Speed 50; Nitro 50

speed 70; Nitro 60

Alyssa is the winner

Speed 0; Nitro 60

function readLine() {

return inputString[currentLine++];

}

// Create your Super Class Race and Sub Class Car here

function main() {

const playerName = readLine();

const nitro = JSON.parse(readLine());

const speed = JSON.parse(readLine());

const car1 = new Car(playerName, nitro, speed);

console.log(car1.startRace());

car1.nitroBoost();

console.log(`Speed ${car1.speed}; Nitro ${car1.nitro}`);

car1.accelerate();

console.log(`Speed ${car1.speed}; Nitro ${car1.nitro}`);

console.log(car1.endRace());

car1.applyBreak();

console.log(`Speed ${car1.speed}; Nitro ${car1.nitro}`);

}

Answer to Question #295727 in HTML/JavaScript Web Application for chethan

the goal of this code is quickly to get off the ground with classes.

given playerName, Nitro and speed are inputs write a super class Race with property and methods

inputs

the first line of input containing as string playerName
the second line of input containing as string Nitro
the third line of input containing as string speed

outputs

the output consists of multiple lines with the appropriate texts

sample input1

Alyssa

100

sample output1

Race has started

speed 50; Nitro 50

speed 70; Nitro 60

Alyssa is the winner

speed 0; Nitro 60

sample input2

Joel

100

sample output2

Race has started

speed 150; Nitro 50

speed 170; Nitro 60

Joel is the winner

speed 0; Nitro 60

class Race {
    constructor(playerName, nitro, speed) {
        this.playerName = playerName;
        this.nitro = nitro;
        this.speed = speed;
    }

    boostSpeed() {
        this.speed = this.speed + 50;
        this.nitro = this.nitro - 50;
    }

    ride() {
        this.speed = this.speed + 20;
        this.nitro = this.nitro + 10;
    }

    stopRace() {
        this.speed = 0;
    }

    speedAndNitroMessage() {
        console.log(`speed ${this.speed} nitro ${this.nitro}`)
    }

    winMessage () {
        console.log(`${this.playerName} is the winner`)
    }

    startRace() {
        console.log('Race has started')
        this.boostSpeed()
        this.speedAndNitroMessage()
        this.ride()
        this.speedAndNitroMessage()
        this.winMessage()
        this.stopRace()
        this.speedAndNitroMessage()
    }
}


const race = new Race('Alina', 100, 0);
race.startRace()

Here is an animated car race game using HTML/CSS and Javascript. In which two car will move ,the one first cross the line will win. There is a button ,the game will start after the button is clicked.

HTML Code

 <div class="track">
        <div>
            <button onclick=start1()>Click Here to Start</button>
        </div>
        <div class="line"></div>
        <div id="car"></div>
        <div id="car2"></div>
    </div>


    <script src="script.js"></script>

CSS Code

*{
    margin: 0;
    padding: 0;
}
/* Track Styling and positioning */
.track {
   
    background-color: blue;
     
    position: absolute;
    
    width: 100vw;
    height: 100vh;
     
}
#car {
    background-image: url('./Images/car1.png');
    
    background-repeat: no-repeat;
    background-size: cover;
    width: 35rem;
    height: 15.699rem;
    position: absolute;
    bottom: 50px;
    margin-top: 500px;
    left: 0;
}
#car2 {
    background-image: url('./Images/car2.png');
    background-color: aliceblue; 
    background-repeat: no-repeat;
    background-size: cover;
    width: 35rem;
    height: 15.699rem;
    position: absolute;
    top: 20%;
    left: 0;
}
.line{
    background-color: black;
    width: .5%;
    margin-left: 1200px;
    height: 100vh;
}
@keyframes trackanimation {
    100% {
        transform: translate(-500vw);
    }
}

Javascript Code

const car = document.getElementById('car');
var computedStyle=window.getComputedStyle(car)
const car2=document.getElementById('car2')
var computedStyle2=window.getComputedStyle(car2)
car2.style.left="0px"

var count=0;
var count2=0;
var x=0;
var y;
function start1(){
    
y=setInterval(
function start(){
    
        let a=Math.floor(Math.random() * 100);
        let b=Math.floor(Math.random() * 100);
        
        count+=a;
        
        count2+=b;
        car2.style.left=`${count}px`;
        car.style.left=`${count2}px`;
        if(count>=700 || count2>=700)
        {
            
            clearInterval(y);
            stop();
            
        }
    
},1000)
}
function stop(){
    car2.style.left=`${count}px`;
        car.style.left=`${count2}px`;
if(count>=700)
        {
            
            alert("Car 1 has won");
            
        }
       else if(count2>=700)
        {
            alert("Car 2 has won");
            
        }
    }