diff --git a/index.js b/index.js index 19bad7092f..8e09a1eb5c 100644 --- a/index.js +++ b/index.js @@ -29,14 +29,18 @@ function checkCollision(rock) { const dodgerLeftEdge = positionToInteger(DODGER.style.left) // FIXME: The DODGER is 40 pixels wide -- how do we get the right edge? - const dodgerRightEdge = 0; + const dodgerRightEdge = dodgerLeftEdge + 40; const rockLeftEdge = positionToInteger(rock.style.left) // FIXME: The rock is 20 pixel's wide -- how do we get the right edge? - const rockRightEdge = 0; + const rockRightEdge = rockLeftEdge + 20; - if (false /** + if ((rockLeftEdge <= dodgerLeftEdge && rockRightEdge > dodgerLeftEdge) || (rockLeftEdge >= dodgerLeftEdge && rockRightEdge <= dodgerRightEdge) || (rockLeftEdge <= dodgerRightEdge && rockRightEdge >= dodgerRightEdge) && top >360){ + //rock collided + return true + } + /** * Think about it -- what's happening here? * There's been a collision if one of three things is true: * 1. The rock's left edge is < the DODGER's left edge, @@ -45,9 +49,11 @@ function checkCollision(rock) { * and the rock's right edge is < the DODGER's right edge; * 3. The rock's left edge is < the DODGER's right edge, * and the rock's right edge is > the DODGER's right edge. - */) { - return true + */ + else{ + return false } + } } @@ -58,6 +64,7 @@ function createRock(x) { rock.style.left = `${x}px` // Hmmm, why would we have used `var` here? + // So it will be attached to each rock individually? var top = 0 rock.style.top = top @@ -66,6 +73,8 @@ function createRock(x) { * Now that we have a rock, we'll need to append * it to GAME and move it downwards. */ + ROCKS.push(rock) + GAME.appendChild(rock) /** @@ -79,19 +88,54 @@ function createRock(x) { * If a rock collides with the DODGER, * we should call endGame(). */ + + + /** + Originl attempt at checking for collisions + for(var i = 0; i= 360){ + rock.remove() + } + } + // We should kick off the animation of the rock around here. + if(top < 360){ + window.requestAnimationFrame(moveRock) + } + // Add the rock to ROCKS so that we can remove all rocks // when there's a collision. @@ -108,6 +152,17 @@ function createRock(x) { * Finally, alert "YOU LOSE!" to the player. */ function endGame() { + for(var i = 0 ; i< ROCKS.length;i++){ + ROCKS[i].remove() + } + + DODGER.removeEventListener('keydown',moveDodger); + var times = ROCKS.length + for(var b = 0 ; b< times;b++){ + ROCKS.unshift(); + } + clearInterval(gameInterval) + alert("YOU LOSE!") } function moveDodger(e) { @@ -119,6 +174,18 @@ function moveDodger(e) { * we've declared for you above.) * And be sure to use the functions declared below! */ + + if (e.which === LEFT_ARROW) { + moveDodgerLeft() + e.stopPropagation() + e.preventDefault() + } + else if(e.which === RIGHT_ARROW){ + moveDodgerRight() + e.stopPropagation() + e.preventDefault() + } + } function moveDodgerLeft() { @@ -127,6 +194,14 @@ function moveDodgerLeft() { * This function should move DODGER to the left * (mabye 4 pixels?). Use window.requestAnimationFrame()! */ + + var leftNumbers = dodger.style.left.replace('px', '') + var left = parseInt(leftNumbers, 10) + + if (left > 0) { + dodger.style.left = `${left - 4}px` + } + } function moveDodgerRight() { @@ -135,6 +210,14 @@ function moveDodgerRight() { * This function should move DODGER to the right * (mabye 4 pixels?). Use window.requestAnimationFrame()! */ + var rightNumbers = dodger.style.left.replace('px', '') + var right = parseInt(rightNumbers, 10) + + if (right < 360) { + dodger.style.left = `${right + 4}px` + + } + } /**