shrey141102 · shrey141102 · Jan 8, 2024 · Jan 8, 2024
diff --git a/Space-invaders/.DS_Store b/Space-invaders/.DS_Store
diff --git a/Space-invaders/Images/.DS_Store b/Space-invaders/Images/.DS_Store
diff --git a/Space-invaders/Images/alien.png b/Space-invaders/Images/alien.png
diff --git a/Space-invaders/Images/ship.png b/Space-invaders/Images/ship.png
diff --git a/Space-invaders/README.md b/Space-invaders/README.md
@@ -0,0 +1,34 @@
+Space Invaders Game:
+Welcome to the Space Invaders game! This classic arcade game has been brought to life using HTML, CSS, and JavaScript. Defend the Earth from the invading alien forces by maneuvering your spaceship and shooting down the relentless invaders.
+
+Table of Contents:
+1)Getting Started
+2)Gameplay
+3)Controls
+4)Scoring
+5)Game Over
+6)Development
+
+Getting Started:
+To play the game, simply open the index.html file in your web browser. The game will load, and you can start playing immediately.
+
+Gameplay:
+Defend Earth by controlling your spaceship and shooting down the invading aliens. The game features multiple levels, and the difficulty increases as you progress. Can you survive the relentless alien onslaught?
+
+Controls:
+1)Left Arrow- Move the spaceship to the left.
+2)Right Arrow- Move the spaceship to the right.
+3)Spacebar- Shoot bullets to destroy aliens.
+
+Scoring:
+1)Score points by successfully shooting down aliens.
+2)The score is displayed at the top-left corner of the game board.
+
+Game Over:
+The game ends under the following conditions-
+1)An alien reaches the same level as your spaceship.
+2)You successfully shoot down all the invading aliens.
+3)When the game ends, you can restart by refreshing the page.
+
+Development:
+The game was developed using HTML, CSS, and JavaScript. The code is well-structured and easy to understand. Feel free to explore the script.js file for insights into the game mechanics.
diff --git a/Space-invaders/index.html b/Space-invaders/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Space invader</title>
+    <link rel="stylesheet" href="style.css">
+    <script src="script.js"></script>
+</head>
+<body>
+    <h1>Space invaders</h1>
+    <canvas id="board"></canvas>
+</body>
+</html>
diff --git a/Space-invaders/script.js b/Space-invaders/script.js
@@ -0,0 +1,182 @@
+let tileSize = 32;
+let rows = 16;
+let columns = 16;
+
+let board;
+let boardWidth = tileSize * columns;
+let boardHeight = tileSize * rows;
+let context;
+
+let shipWidth = tileSize*2;
+let shipHeight = tileSize;
+let shipX = tileSize * columns/2 - tileSize;
+let shipY = tileSize * rows - tileSize*2;
+
+let  ship = {
+    x : shipX,
+    y : shipY,
+    width : shipWidth,
+    height : shipHeight
+}
+
+let shipImg;
+let shipVelocityX = tileSize;
+
+let alienArray = [];
+let alienWidth = tileSize*2;
+let alienHeight = tileSize;
+let alienX = tileSize;
+let alienY = tileSize;
+let alienImg;
+
+let alienRows = 2;
+let alienColumns = 3;
+let alienCount = 0;
+let alienVelocityX = 1;
+
+let bulletArray = [];
+let bulletVelocityY = -10;
+
+let score = 0;
+let gameOver = false;
+
+window.onload = function(){
+    board = document.getElementById("board");
+    board.width = boardWidth;
+    board.height = boardHeight;
+    context = board.getContext("2d");
+
+    shipImg = new Image();
+    shipImg.src = "./Images/ship.png";
+    shipImg.onload = function(){
+        context.drawImage(shipImg, ship.x, ship.y, ship.width, ship.height);
+    }
+
+    alienImg = new Image();
+    alienImg.src = "./Images/alien.png"
+
+    createAliens()
+
+    requestAnimationFrame(update);
+    document.addEventListener("keydown", moveShip);
+
+    document.addEventListener("keyup", shoot);
+}
+
+function update(){
+    requestAnimationFrame(update);
+
+    if(gameOver){
+        return;
+    }
+
+    context.clearRect(0, 0, board.width, board.height)
+    context.drawImage(shipImg, ship.x, ship.y, ship.width, ship.height)
+
+    for(let i=0; i < alienArray.length; i++){
+        let alien = alienArray[i];
+        if(alien.alive){
+            alien.x += alienVelocityX
+            if(alien.x + alien.width >= board.width || alien.x <= 0){
+                alienVelocityX *= -1;
+                alien.x += alienVelocityX*2;
+
+                for(let j=0; j<alienArray.length; j++)
+                {
+                    alienArray[j].y += alienHeight;
+                }
+            }
+            context.drawImage(alienImg, alien.x, alien.y, alien.width, alien.height);
+
+            if(alien.y >= ship.y){
+                gameOver = true;
+            }
+        }
+    }
+    for(let i=0; i<bulletArray.length; i++){
+        let bullet = bulletArray[i];
+        bullet.y += bulletVelocityY;
+        context.fillStyle = "white";
+        context.fillRect(bullet.x, bullet.y, bullet.width, bullet.height);
+
+        for(let j=0; j < alienArray.length; j++){
+            let alien = alienArray[j];
+            if(!bullet.used && alien.alive && detectCollision(bullet, alien)){
+                bullet.used = true;
+                alien.alive = false;
+                alienCount--;
+                score += 100;
+            }
+        }
+    }
+
+    while(bulletArray.length>0 && bulletArray[0].used || bulletArray[0].y < 0){
+        bulletArray.shift();
+    }
+
+    if(alienCount == 0){
+        alienColumns = Math.min(alienColumns + 1, columns/2 -2);
+        alienRows = Math.min(alienRows + 1, rows-4);
+        alienVelocityX += 0.2;
+        alienArray = [];
+        bulletArray = [];
+        createAliens();
+    }
+    context.fillStyle = "white";
+    context.font = "16px courier";
+    context.fillText(score, 5, 20);
+}
+
+function moveShip(e){
+    if(gameOver){
+        return;
+    }
+
+    if(e.code == "ArrowLeft" && ship.x - shipVelocityX >=0){
+        ship.x -= shipVelocityX;
+    }
+    else if(e.code == "ArrowRight" && ship.x + shipVelocityX + ship.width <= board.width){
+        ship.x += shipVelocityX;
+    }
+}
+
+function createAliens(){
+    for(let c = 0; c < alienColumns; c++){
+        for(let r = 0; r < alienRows; r++){
+            let alien = {
+                img : alienImg,
+                x : alienX + c*alienWidth,
+                y : alienY + r*alienHeight,
+                width : alienWidth,
+                height : alienHeight,
+                alive : true
+            }
+            alienArray.push(alien);
+        }
+    }
+    alienCount = alienArray.length;
+}
+
+function shoot(e){
+if(gameOver){
+    return;
+}
+
+    if(e.code == "Space"){
+        let bullet = {
+            x : ship.x + shipWidth*15/32,
+            y : shipY,
+            width : tileSize/8,
+            height : tileSize/2,
+            used : false
+        }
+        bulletArray.push(bullet);
+    }
+}
+
+function detectCollision(a, b){
+    return a.x < b.x + b.width && 
+           a.x + a.width > b.x &&
+           a.y < b.y + b.height &&
+           a.y + a.height > b.y;
+}
diff --git a/Space-invaders/style.css b/Space-invaders/style.css
@@ -0,0 +1,8 @@
+body{
+    font-family: 'Courier New', Courier, monospace;
+    text-align: center;
+}
+
+#board{
+    background-color: black;
+}
diff --git a/script.js b/script.js
@@ -387,7 +387,12 @@ const projects = [
   discription: "Simple minesweeper game made using HTML, CSS and JS.", 
   link: "Minesweeper/index.html", 
   image: "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHCBIREhISEhEYGBISGhgaGBgYGBgYGBESGRwZHBgYGBgdIS4mHR4rIRgYJjgmKy8xNTY1HCU7QDtAPy40NTEBDAwMEA8QGBIRGDEdGCE0MTE0MTE0MTQxNDQxMTE0NDE0MTExNDQ0NDQxMTQ0MT8xNDExNDExMT80NDQ0NDE/Mf/AABEIAM8A9AMBIgACEQEDEQH/xAAcAAEAAQUBAQAAAAAAAAAAAAAAAQIDBQYHBAj/xABAEAACAQIEBAMFBgUCBAcAAAABAgADEQQSITEFBkFRE2FxByIygZEUQlJicqEjM4KSwbGyU9Hw8RU0Q5OiwtL/xAAWAQEBAQAAAAAAAAAAAAAAAAAAAQL/xAAaEQEBAQADAQAAAAAAAAAAAAAAARExQVEC/9oADAMBAAIRAxEAPwDssREBERAREQEREBERAREQEREBERASDJkQEiIgJSYJkEyoGQZBMgmAMoMkmUkyiDKTJMgmUQZBgmRARIvEDJxETCkREBERAREQERLVGqrjMrBluRcEEXBsRcdQQRAuxEQERIgYTivHkw+JwtBgLVy2Y9aY2Q+hYEfKZucd5w4ga2Jq1E1yEZAdiKZ93X8LWv8A1GdI5Y4suKw6OGuQFBJ3ZWVWRjpuUZSbaBsw6S4jNSImA5l42MMmRD/Gce71yKdMxH1sD28oVnFqA3sQcpsbEGzaGx7GxH1k3mv8o+7RdSbsWDm+pu6qSSetyCfmZniYQJkEwTIJgCZSTBMpJlAmUkwTIJlAmUkwTIJgJSYMQESIgZWIiYUiIgIiICIkQJnM+I4+rw/H18jEI75yu6tnAckr11YjodDYidLnO/aNhrVqVS38xCvzptf9xUH9ssSts4Nx+niQo0Vz0vdW/Q3XcaGx8pmJxLCYpqZ01HUHY/8AI+Ym98C5lJUByXUdT8afq7jz89bAS35NblMTzHjjQw1R1NnICIeoqOcqkel83oDNF4h7RcXXd6fDcD7qkr41c+6SCQSqqbEdjmPpMRXrcQdlqY3FGoqhiqKFVEqHQGyqBopcAnudZFeKpa5sNNgOwGgH7TL+z/i/2dyjmy03FF79KFZy2GcnstV3S3QVr9JhBUW3xD6iefBIftg9xnoYhHo1wgvamwtmvsCDYi56S1Ha+N8WXCoDbNUe4RPxEbseyLcEnzA3IB5ria7VahZ2LMxuxP3m7+WwAHQADpMvgWo+GiYjCUmcIqu9G9B3awzN7ltSRfcSMVw/BBS9HEvTcailVXxM1twuoY9BmLkC9zEGwcAfJiq1K+gw2EceRLYlD/sWbETOLcw8fLVqFXSmzNhqbBWYqadKpnu17BgCze8QNxtOzFr6jY/uIFRMpJkEykmBJMpJgmQTKF5BMgmQTAGREiAiJEBEiIGXiU3i8wqbxeRF4EyJF4vKJvF5TeReBVeal7RqV8LTq/8ABqpfzWpenb0zVE+k2smc39oXMb1qh4Vg7Go1jiKhGZcPTuCEH5zYX7euqkaw4tPfgME+jPdV/DszD83YeW/e2x9mGwaU7E+84HxHp090bD/WRWxQBtcX9df+tZoXiwUW2A6CUHEgTw1K0sNVgZT7Qv4R9BLgrqdxMJ40uLXgZHEuQAKdszdW+FFFrsep3Gg3PUC5GMxNa91Uk7ZmO726eQ8hoIxFRiLr0uCO6m17eYsP3nlZwFuDpA1bmbFfxVA2pAH+rf8AwJ3TBV0rKa3DaoOU3qYVzlUk7hRvRfzF1Otxc5h87cQq52qN+It9Ok7W/K4qCnWw9V8Pi0VbOpsb21VxsR5GTNG4cP4hTxCsUuGQ5aiOMr0am5R16HrfUEEEEggz13miDG4h6y0sQBh+KqtqdVAPB4lRGppnMCubcqD8LajQsDicZx2q5INR2IuCGYqLjQhkWy38iJR0jE4ynT/mVEQ9mYAn0B3mHx3NuDpAnOz5dwq2t6l8o/ec3xOMyqWdgqDUgaD9tzI5P4a3FcTmqLbA4YhnUjSu+6Uz32zEdrD7wgdZ4VjvtNFK2RkWoMyK3xGmfhYjpca27Eek9kiRAmREQEiIlCIvEDJ3i8ovF5gVXkXkXkXgVXmO45xF8LSNVaJqKnxgNlKJ+K1jcDr232vPdeLyjUk58pHekR/Xf9wsuDnSmbZUU+r2/wDoZi+auUyuavg1Gpu9HQA33KHZT5HQk9NxpdN1cG26khlIIamw3VlOqkdjGDonEOaHejUXDimtZgQjs5ZabHTMQE1tuB3Amn8vcNGGp6tmrVCWqObku9zmNzqdb69ZjSSBpf0B3PYTPUxkpqt7kAC/ew1PzjAxFXpNV4vj8RhmOKoPlK1fDqCwZHU0qTpnQ6NvVFzrroRM5WeYuhhTiafF6FtVGGqp+pUYEj6ASjJ8C5q4bi7U8XQTD1WsM6hhRc98yMrof1MR5zJcx8C8BFr0gDQNgStTOFvopuQDY7fe1I1104/M7y9xHEjNh1qN9nYXdDqoykMuUH4TmC7eckGwF4FSUhSZUKcoupUkvSR75hvuQSpPrbf5yFUS4tF3+BCRexPQf8/leBb4VwPCU3VwmZlIK52LBSNiF2v5mdE4ZiM1tZoRSoh1U27jr8viA8yAJn+BY4E2vEStw4xwanj8M1F9D8SOPjo1RqroehBnIsfxB0aquKGXFUGyV+1RholZR+cWv52P3p2bh+JBAnNfbLwgK1LHoPjHg1R+IEEoT+4+kX0jnl63EMRToUhd6jZUU7Dcl28gAST0AM75y/wengcNTw1L4UGrHeo51d28yfoLDpNC9jWCo5MTXvfEKwp6gfw6JAYFf1G9z+QD16dJFIkRNBEXiAvEiICJEQPfeM0t3i8yK7yM0ovF5RVeLym8x3FsbVooGp0DU72P8vzK7sPSBkjNC514BRZlqU69Ohi6hC0y7Kort92lUUm7A7Kw1XbaW8Xx6vVurOyjqqHw7fNffH900nnaqBQVFQKatRc5A1fKCbsd2N8up7SDI8Op1S7LXotTei2V1bZnG2XuBcG/e3nMviWtp2nnwwsKa9gJXim1Mo8VVpHD8Z9nqvUCBs6Gm4JtmS+Ya9CDfp1Pyt1GnnOsDA4jgTPVdlZVpsxIGrMAelrAfvMzgcClFcqj1J3Y9zPUq2kmTBERIlBiQDbexmVGLyAKugUWHpMSwuCDsdJgeN8VqKfDAym2rfjHdfKSjNcV5n8K6qc1TtfRf1H/ABMHw3mCqrNUdrlm6AAAWGwE152l1BZQO+saOyctc1pUspazTM850hiuGYpNyEzr5MnvD/ScHw2JamwZTYidU5W5hGJwtalUPvim/wAxlMsupjVvZPxE0uIClf3MUjIR0LoC6H6Kw/qnbp808ExXgYrDVMxUU6iMSDYhAwz69PdzTttfnLA0z7vEaLqPuuGzf3oD/tPrEq1tN5E8HCeKU8XT8SmGydGKsq1NN0LAZl8575QiREBERARKYgeu8i8iRIKryLyLyIFV5F5EiB4OI8Ho1x76Lm72/cEWIO+oI87zmHOnAGatQpUXLeGzNUDsCtD4ct3A96/vWW2bS5ABBm0c1cyYikzU/Aq0qevv5WPiDuKiAqo8g2bbbUTSjxik/wD6yEDpmAA76QMnmpobsfEfpcWRP0J/k3Py0lCVy2YHpqL7lT3PUj/IngGMp9HX6iXsLVV3srA2VtjfqsCqpFNesqZdZLOo0LAHsSLwBlJlZlJgRIGtyASBuQCQPW209OAorUc5/hW2nRmOwPkLbdbiZpBYMvSxt8oGtBgdjLOIopUGV1DDsRex7jtNk5lGFwvD6derpiKrgU8vxOl/fzjqoW5v0NrbkHXHaBh8bgKNNWZKYDDqSzW9MxNpgCbzP8WrAKR3mvXkoTL8t1HFaykhSrZ7fg2NvM3t/wBpiJn+VV1rH9A/33/x9IgzWO5fweIUeF/AqqLAi5R+2dSd/wAykHqQxme5L5EwiWqYl1r1xqKdv4dPzyn+Z6nTyuJhyBLlLHtTIIqWsdLtax7g3uD5iMTXWxE0rg3PFNmWlWYO50BQh3+aLq39Iv5GbqJpVMqk2kWgIi0WgUxKrRAvRK7RaQURaV5YywKLSLS5ljLAtlb6HY/vNK9oHAMOuDrYmnhaTVaIDWKaGnmGf4SCtlJb3SDpN5yyzicKlWnUp1BenUVkYd0YFWH0JgfPfD8Fg8WrEJUoOth/DZaya/e8OplYD+tjMtwDh64apVBcOXsFbKVug1+E7Ek7X6Ca7kfh+Mq0XOtJ2R/zAGwb5ix+c2d7lQ67d5IPRjM2anTT46rqgP4VN2ZvUIrH1tMpi3VfcUAKOg2mLwNfM/iNtRRrX/4j6A38lV/7piOK8wqLrT94/i6D07yjI4nFU6RW7ABiAR69QOnn856TOfV6zVCSxLMfqfITf0+EA72F/XrEosCrilq5KGGasGGYhL5lIsp07fD9Zm/tb0aefGUXwy6gGrlGbTZQGux8rXmNo4lqTB6bsrLsymxF9JgOK8OfEVGq1MSzM25dczfW4/0ko8HMXGKnEsSDYrTAFOjT38KiNgfzHVmPfyAmaxNcIN9pjqdKlhgSPeci2Y727AdJi8ZizUPlHAoxmILtfpLESm8gXl2hWdTZahQNubkDS9r5de/1lkyCYGX4VhPtVZaXiOwILO4VitNFF2cjVio0v7onUuE+zHAIFeq7VyQDoxSmw3BAUliD+q05NwLi9bBVlr0Hy1FBG1wykglWHUGwnWuT+cKFYlVGQm7Ph9xTO7VMP+JNyybrqQLXlg3HAcNoYZctCilNeyIq39bDX5z1WlxLMAQQQQCCDcEHYg9RJyy6LOWLS9ljLGizaMsvZYyxos5Yl7LEaLuWMsvZYyyCzljLL2WMsaLOWMsvZYyxos5ZiOZOKfZqdkI8apcJf7gFs9QjqFBHqxUdbzMYmslNGqObIgJY9gPLqfKco41xN8TVdzpm0A09xBfKgt2uST1JPSwCDTubcErMK6A2Wyv1La6Ox3J11O50M27k3hwr4Wzagj6TX+I8Vo01ZDZyQQUGtwdwZk/ZVzHSp1WwdZsiVD/CZjoGOyMe56HqdO0djGc08FqUsy5n8O9wFsFY+emu00t0sbXn0rxjgy1FKst1M5bzByC4Jegf6TFnia0HCOEcORcrqOwPeZ6lxoEa6TGYvg2IpEh6baeU8BBG8cK2J+MLPBiOLM2gmLlUaKnqFtSZTErw1B6jhKa3Y/QDqSegkFomUzbcFwCkg/ie+3qQo9AN/nPZzXwfDLwyjiaNFUq06wp1GW4zIyuRmF7Xuq62vrLg0YmVYahUqOtOmjO7fCqKWZrC5sqgk6An0Etmd39l3JZwNM4rEJbFVlAVTvh6R1yns7aZu1gO94OPHl7Ggf8AlK//ALVT/wDMJwfGowYYTEKykEFaVQFSNQVIG/pPqG0Wgcs5F5sxasuHx2FrhW0Wt4FQKHJ3cBbLe+pGnXTW/TcsvWjLAs5Yyy9ljLLos5Yyy9ljLGizliXssiNFy0WlVotMqptFpXaIFFotK4gaJzniMXXb7NhcNVdUILELkR33AFR8qELfoTr5qJrFP2fcUxP86rSw9M/dRmepbzIFvoZ2KJdHOOG+yTB07GrVeo3oqg+qnMDM5W5C4a1FqJw9lYaNmYtTboyEkhCPIW7i2k2uJBoOC47X4Uy4TipLYcnLQx1rq4+6mI/A4HU72PYmbe+Ep1FDKQQwuCNQQdiCN56MVhqdVGp1EV6bizKwDKy9iDvOacw8AxXDEanwzEOcPilrKcNUYsKIFJ2ZqFQnMrWU2He1zLKmNnxvDaTEqHQttbMpPpa853zlyc2tSkmo3UCW8QFJ2Fso0tpbTpLGJ4/WwdO9OoegCN7yHyyHQD9Nj5zXQ0N0KkqwsRuD0lE6xwjhGD49QeslPwq9NglRRsHIuGU9VPnrofU4jinsxrU7lKyZfzMBJhrnpm38k8P8WnWamyvXU60b/wARqAAOdB98XLAga6DymF4hwbwDZ69MnsrZj+0xa1TTZXRyrKQVcEqysNirDUHzkHRDrqP+xleOHicNx9LqqpWX1pumf/43k8GTH4umauLwrqANMUUCeJ2FanpmFr/xFA21zG0vJh2VnouCPGSpTPn4isgIPqR8x3l3Rqns5NNeKYPxUVlZyoDC4WoVbw2A7h8tvXvPpO0+T8DizRqUqy/FSdKi/qRgw/cT6uo1A6K6m6sAQe4IuP8AWRVVpNpVEgptFpVECm0i0qtFoFNotKrRaBTaJVaIExEQEREBERAREQEREBMfxHACuEBOWxbUAE2ZHRgCdj729j173GQiBwnXKl98iX9covMAMDW4ljEwmHFzrdj8NNBbO7flGg8zYDUzYeP06i1qlCihas9V6VJFtdmzMB5AAAkk6ADWdM5G5Up8Mw+T4sRVsa1T8bdFBOuRbm3zPWatRpnEPZh9mRDh+I10RnValwLKXGUPlQr9/IDfYG9/d15tzBhK2Gr1KFSs7lDuS3vA7GxY2n0/XorUR6bC6OCrA9VYWI+hnDfarw1kelVbVxek7fjZQGRz0uysG02uR0kGrcn8F+347D4Y38N2zVCNCKSDM+vS4GW/dhPoLg/KHD8GQ1DCU1cbOQXqD0d7sPkZoPsO4Rpicaw3IoofIWeoR5ElB/SZ1yRSa5xfllKovTAUjULsoYbFD907aWKnXQElpscQPmXmjlavw9yHUtSJ918uWxOyuoJCt21Kn7pOtu5ezjH/AGjheDfqieG1970iUufUKD85neIcPpYmm1OtTV0YEEEA6HeYnlHl3/w1K1BHzUGqF6YN81NWChkJ6gFbg/mMDYYiICIiAiIgIiICIiAiIgIiICIiAiIgIiICIiBgeG8u06OKr4tverVWbIbfyabEFgvmx1J7ADob56IgJontX4T42Aq1FW70grG2pshJB+hdf6vKb3KWUEEEXB3B1BEDD8ocJ+w4HDYe3vogL+dVrs5/uYzNREBERAREQEREBERAREQEREBERAREQEREBERAREQEREBEiLwJiReLwJiReLwJiReLwJiReLwJiReLwJiReLwJiReLwJiReLwJiREBERA//9k=" 
-  }
+  },
+  { title: "Space Invaders",
+  discription: "Welcome to the Space Invaders game! This classic arcade game has been brought to life using HTML, CSS, and JavaScript. Defend the Earth from the invading alien forces by maneuvering your spaceship and shooting down the relentless invaders.", 
+  link: "Space-invaders/index.html", 
+  image: "https://gamerhub.co.uk/wp-content/uploads/2020/11/what.jpg" 
+  },
 ];
 
 const cards = document.getElementsByClassName('cards');