bloack braker game added and merge conflict solved

.github/workflows/pr_tags.yaml

@@ -0,0 +1,78 @@
+# name: Pull Request Labels
+
+# on:
+#   pull_request_target:
+#     types:
+#       - opened
+#       - synchronize
+
+# jobs:
+#   pr-validation:
+#     runs-on: ubuntu-latest
+
+#     steps:
+#       - name: Checkout repository
+#         uses: actions/checkout@v2
+
+#       - name: Set up Node.js
+#         uses: actions/setup-node@v2
+#         with:
+#           node-version: '14'
+
+#       - name: Install dependencies
+#         run: npm install --prefix .github octokit
+
+#       - name: Fetch related issue and labels
+#         id: fetch_issue
+#         uses: actions/github-script@v4
+#         with:
+#           github-token: ${{ secrets.PERSONAL_ACCESS_TOKEN }}
+#           script: |
+#             const prNumber = context.payload.pull_request.number;
+#             const repoOwner = context.payload.repository.owner.login;
+#             const repoName = context.payload.repository.name;
+
+#             const { data: pr } = await github.pulls.get({
+#               owner: repoOwner,
+#               repo: repoName,
+#               pull_number: prNumber
+#             });
+
+#             const issueNumber = pr.body.match(/#([0-9]+)/)[1];
+
+#             const { data: issue } = await github.issues.get({
+#               owner: repoOwner,
+#               repo: repoName,
+#               issue_number: issueNumber
+#             });
+
+#             return {
+#               issue: issue,
+#               prNumber: prNumber,
+#               repoOwner: repoOwner,
+#               repoName: repoName
+#             };
+
+#       - name: Apply labels to PR
+#         if: |
+#           steps.fetch_issue.outputs.issue.labels.some(function(label) {
+#             return label.name.toLowerCase() === 'gssoc';
+#           })
+#         run: |
+#           const issueLabels = steps.fetch_issue.outputs.issue.labels;
+#           const prNumber = steps.fetch_issue.outputs.prNumber;
+#           const repoOwner = steps.fetch_issue.outputs.repoOwner;
+#           const repoName = steps.fetch_issue.outputs.repoName;
+
+#           const prLabels = issueLabels.filter(function(label) {
+#             return label.name.toLowerCase().startsWith('level');
+#           });
+#           prLabels.push('gssoc');
+#           await github.issues.addLabels({
+#             owner: repoOwner,
+#             repo: repoName,
+#             issue_number: prNumber,
+#             labels: prLabels.map(function(label) {
+#               return label.name;
+#             })
+#           });

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}

Games/16_Puzzle/README.md

@@ -0,0 +1,35 @@
+# Number Puzzle Game
+
+This is a simple and attractive number puzzle game implemented using HTML, CSS, JavaScript, and Bootstrap. The game is inspired by the classic 8-puzzle game, where the objective is to arrange numbered tiles in sequential order by sliding them into an empty space.
+
+## Features
+
+- Interactive 4x4 grid puzzle (16-puzzle).
+- Shuffle button to randomize the tiles.
+- Move counter to track the number of moves.
+- Timer to track the time taken to solve the puzzle.
+- Score calculation based on moves and time taken.
+
+## How to Play
+
+1. Open the game in your web browser.
+2. Click the "Shuffle" button to start a new game.
+3. Slide the tiles by clicking on them to move them into the empty space.
+4. Arrange the tiles in numerical order (1 to 16) with the empty space in the bottom-right corner.
+5. The game ends when you have arranged all the tiles correctly. Your score will be displayed based on the number of moves and time taken.
+
+
+## Installation
+
+No installation is required. Simply open the `index.html` file in your web browser to start playing the game.
+
+## Files
+
+- `index.html`: The main HTML file that contains the structure of the game.
+- `style.css`: The CSS file that styles the game using Bootstrap and custom styles.
+- `script.js`: The JavaScript file that contains the game logic and interactivity.
+
+## Usage
+
+1. Clone the repository or download the files.
+2. Open `index.html` in your preferred web browser.

Games/16_Puzzle/index.html

@@ -0,0 +1,40 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Puzzle game</title>
+    <link rel="stylesheet" type="text/css" href="style.css">
+  </head>
+
+  <body>
+    <div class="game">
+      <div class="grid">
+        <button>1</button>
+        <button>2</button>
+        <button>3</button>
+        <button>4</button>
+        <button>5</button>
+        <button>6</button>
+        <button>7</button>
+        <button>8</button>
+        <button>9</button>
+        <button>10</button>
+        <button>11</button>
+        <button>12</button>
+        <button>13</button>
+        <button>14</button>
+        <button>15</button>
+        <button></button>
+      </div>
+
+      <div class="footer">
+        <button>Play</button>
+        <span id="move">Move: 100</span>
+        <span id="time">Time: 100</span>
+      </div>
+    </div>
+    <h1 class="message">You win!</h1>
+
+
+    <script src="script.js"></script>
+  </body>
+</html>

Games/16_Puzzle/script.js

@@ -0,0 +1,201 @@
+class Box {
+  constructor(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+
+  getTopBox() {
+    if (this.y === 0) return null;
+    return new Box(this.x, this.y - 1);
+  }
+
+  getRightBox() {
+    if (this.x === 3) return null;
+    return new Box(this.x + 1, this.y);
+  }
+
+  getBottomBox() {
+    if (this.y === 3) return null;
+    return new Box(this.x, this.y + 1);
+  }
+
+  getLeftBox() {
+    if (this.x === 0) return null;
+    return new Box(this.x - 1, this.y);
+  }
+
+  getNextdoorBoxes() {
+    return [
+      this.getTopBox(),
+      this.getRightBox(),
+      this.getBottomBox(),
+      this.getLeftBox()
+    ].filter(box => box !== null);
+  }
+
+  getRandomNextdoorBox() {
+    const nextdoorBoxes = this.getNextdoorBoxes();
+    return nextdoorBoxes[Math.floor(Math.random() * nextdoorBoxes.length)];
+  }
+}
+
+const swapBoxes = (grid, box1, box2) => {
+  const temp = grid[box1.y][box1.x];
+  grid[box1.y][box1.x] = grid[box2.y][box2.x];
+  grid[box2.y][box2.x] = temp;
+};
+
+const isSolved = grid => {
+  return (
+    grid[0][0] === 1 &&
+    grid[0][1] === 2 &&
+    grid[0][2] === 3 &&
+    grid[0][3] === 4 &&
+    grid[1][0] === 5 &&
+    grid[1][1] === 6 &&
+    grid[1][2] === 7 &&
+    grid[1][3] === 8 &&
+    grid[2][0] === 9 &&
+    grid[2][1] === 10 &&
+    grid[2][2] === 11 &&
+    grid[2][3] === 12 &&
+    grid[3][0] === 13 &&
+    grid[3][1] === 14 &&
+    grid[3][2] === 15 &&
+    grid[3][3] === 0
+  );
+};
+
+const getRandomGrid = () => {
+  let grid = [[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12], [13, 14, 15, 0]];
+
+  // Shuffle
+  let blankBox = new Box(3, 3);
+  for (let i = 0; i < 1000; i++) {
+    const randomNextdoorBox = blankBox.getRandomNextdoorBox();
+    swapBoxes(grid, blankBox, randomNextdoorBox);
+    blankBox = randomNextdoorBox;
+  }
+
+  if (isSolved(grid)) return getRandomGrid();
+  return grid;
+};
+
+class State {
+  constructor(grid, move, time, status) {
+    this.grid = grid;
+    this.move = move;
+    this.time = time;
+    this.status = status;
+  }
+
+  static ready() {
+    return new State(
+      [[0, 0, 0, 0], [0, 0, 0, 0], [0, 0, 0, 0], [0, 0, 0, 0]],
+      0,
+      0,
+      "ready"
+    );
+  }
+
+  static start() {
+    return new State(getRandomGrid(), 0, 0, "playing");
+  }
+}
+
+class Game {
+  constructor(state) {
+    this.state = state;
+    this.tickId = null;
+    this.tick = this.tick.bind(this);
+    this.render();
+    this.handleClickBox = this.handleClickBox.bind(this);
+  }
+
+  static ready() {
+    return new Game(State.ready());
+  }
+
+  tick() {
+    this.setState({ time: this.state.time + 1 });
+  }
+
+  setState(newState) {
+    this.state = { ...this.state, ...newState };
+    this.render();
+  }
+
+  handleClickBox(box) {
+    return function() {
+      const nextdoorBoxes = box.getNextdoorBoxes();
+      const blankBox = nextdoorBoxes.find(
+        nextdoorBox => this.state.grid[nextdoorBox.y][nextdoorBox.x] === 0
+      );
+      if (blankBox) {
+        const newGrid = [...this.state.grid];
+        swapBoxes(newGrid, box, blankBox);
+        if (isSolved(newGrid)) {
+          clearInterval(this.tickId);
+          this.setState({
+            status: "won",
+            grid: newGrid,
+            move: this.state.move + 1
+          });
+        } else {
+          this.setState({
+            grid: newGrid,
+            move: this.state.move + 1
+          });
+        }
+      }
+    }.bind(this);
+  }
+
+  render() {
+    const { grid, move, time, status } = this.state;
+
+    // Render grid
+    const newGrid = document.createElement("div");
+    newGrid.className = "grid";
+    for (let i = 0; i < 4; i++) {
+      for (let j = 0; j < 4; j++) {
+        const button = document.createElement("button");
+
+        if (status === "playing") {
+          button.addEventListener("click", this.handleClickBox(new Box(j, i)));
+        }
+
+        button.textContent = grid[i][j] === 0 ? "" : grid[i][j].toString();
+        newGrid.appendChild(button);
+      }
+    }
+    document.querySelector(".grid").replaceWith(newGrid);
+
+    // Render button
+    const newButton = document.createElement("button");
+    if (status === "ready") newButton.textContent = "Play";
+    if (status === "playing") newButton.textContent = "Reset";
+    if (status === "won") newButton.textContent = "Play";
+    newButton.addEventListener("click", () => {
+      clearInterval(this.tickId);
+      this.tickId = setInterval(this.tick, 1000);
+      this.setState(State.start());
+    });
+    document.querySelector(".footer button").replaceWith(newButton);
+
+    // Render move
+    document.getElementById("move").textContent = `Move: ${move}`;
+
+    // Render time
+    document.getElementById("time").textContent = `Time: ${time}`;
+
+    // Render message
+    if (status === "won") {
+      document.querySelector(".message").textContent = "You win!";
+    } else {
+      document.querySelector(".message").textContent = "";
+    }
+  }
+}
+
+const GAME = Game.ready();