mlacosta · mlacosta · Feb 25, 2023 · Feb 25, 2023 · Feb 25, 2023 · Feb 26, 2023
diff --git a/.eslintignore b/.eslintignore
@@ -0,0 +1,2 @@
+node_modules
+yarn.lock
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,11 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "extends": "eslint:recommended",
+  "parserOptions": {
+    "ecmaVersion": "latest",
+    "sourceType": "module"
+  }
+}
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+node_modules/
diff --git a/.prettierrc.json b/.prettierrc.json
@@ -0,0 +1 @@
+{ "trailingComma": "es5", "tabWidth": 2, "semi": true, "singleQuote": true }
diff --git a/README.md b/README.md
@@ -1,6 +1,45 @@
-# Marian TETRIS (Ver 1.4.0-alpha)
-Enter [HERE](https://mlacosta.github.io/Marian-TETRIS/index.html) to play the game. Use the arrow keys to control the blocks.
+<h1 align="center">
+  <br>
+  Marian TETRIS
+  <br>
+</h1>
 
-PLEASE NOTE: Try refreshing the page if the game doesn't load.
+<h4 align="center">A TETRIS clone I created using HTML and vanilla Javascript</h4>
+<br/>
 
-![](https://i.imgur.com/Kj7QUBX.jpeg)
+![screenshot](https://i.imgur.com/Kj7QUBX.jpeg)
+
+## Installation
+
+```bash
+# Clone this repository
+$ git clone https://github.com/mlacosta/marian-tetris
+
+# Go into the repository
+$ cd marian-tetris
+
+# Install dependencies
+$ yarn install
+```
+
+## How to use
+
+````
+````
+## Packages
+
+This repo uses the following open source packages:
+
+- [Yarn](typicode.github.io/husky)
+- [Jest](https://jestjs.io/)
+- [Eslint](https://nextjs.org)
+- [Prettier](https://www.npmjs.com/package/prettier)
+
+
+## How to contribute
+
+1. Fork the Project
+2. Create your Feature Branch (`git checkout -b feature/newFeature`)
+3. Commit your Changes (`git commit -m 'Add some newFeature'`)
+4. Push to the Branch (`git push origin feature/newFeature`)
+5. Open a Pull Request
diff --git a/index.html b/index.html
@@ -1,59 +1,63 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Tetris by Mariano L. Acosta</title>
-    <script async type="module" src='./resources/JS/main.js'></script>
-    <link rel="stylesheet" href="./resources/CSS/style.css" ref="text/css">
-    <script src="https://kit.fontawesome.com/ad756e6772.js" crossorigin="anonymous"></script>
-</head>
-<body>
-
-
-
-    <section id= "main">
-        <!--div id="message">Level UP!</div-->
-        <canvas id= "playfield" width="300" height="720"></canvas>
-        <div id="info">
-            <h3 id='next-block'>Next Block:</h3>
-            <canvas id="next" width="120" height="120"></canvas>
-            <h3 id='score'>Score:</h3>
-            <h3 id='level'>Level:</h3>
-            <div class="debug">
-                <h3>Debug Mode:</h3>
-                <label  class="switch">
-                    <input id = 'debug-switch' type="checkbox" checked>
-                    <span class="slider"></span>
-                  </label>
-            </div>
-            <div id="controls"> 
-                <h3>Controls:</h3>
-                <br>
-                <ul>
-                    <li><strong>L/R arrows:</strong> move block</li>
-                    <li><strong>Up arrow:</strong> rotate block</li>
-                    <li><strong>Down arrow:</strong> Speed up</li>
-                    <li><strong>Spacebar:</strong> Pause</li>
-                </ul>
-
-            </div>
-
-
-            <h4 id='author'>Coded in pure Javascript by <span style='color:#0367fc;'>Mariano L. Acosta</span></h4>
-            <div id = 'social' class="social-media">
-                <a class="fa fa-github" href="http://www.github.com/mlacosta" target="_blank"></a>
-                <a class="fa fa-linkedin" href="http://www.linkedin.com/in/mlacosta" target="_blank"></a>
-                <a class="fas fa-envelope-square" href="mailto:[email protected]" target="_blank"></a>
-            </div>
-
+    <script async type="module" src="./src/main/index.js"></script>
+    <link rel="stylesheet" href="./src/assets/styles/style.css" ref="text/css" />
+    <script
+      src="https://kit.fontawesome.com/ad756e6772.js"
+      crossorigin="anonymous"
+    ></script>
+  </head>
+  <body>
+    <section id="main">
+      <canvas id="playfield" width="300" height="720"></canvas>
+      <div id="info">
+        <h3 id="next-block">Next Block:</h3>
+        <canvas id="next" width="120" height="120"></canvas>
+        <h3 id="score">Score:</h3>
+        <h3 id="level">Level:</h3>
+        <div class="debug">
+          <h3>Debug Mode:</h3>
+          <label class="switch">
+            <input id="debug-switch" type="checkbox" checked />
+            <span class="slider"></span>
+          </label>
         </div>
-    </section>
-    <!--section id='debug'>
-        <div id='debug window'>
-            Block Position
+        <div id="controls">
+          <h3>Controls:</h3>
+          <br />
+          <ul>
+            <li><strong>L/R arrows:</strong> move block</li>
+            <li><strong>Up arrow:</strong> rotate block</li>
+            <li><strong>Down arrow:</strong> Speed up</li>
+            <li><strong>Spacebar:</strong> Pause</li>
+          </ul>
+        </div>
+        <h4 id="author">
+          Coded in pure Javascript by
+          <span style="color: #0367fc">Mariano L. Acosta</span>
+        </h4>
+        <div id="social" class="social-media">
+          <a
+            class="fa fa-github"
+            href="http://www.github.com/mlacosta"
+            target="_blank"
+          ></a>
+          <a
+            class="fa fa-linkedin"
+            href="http://www.linkedin.com/in/mlacosta"
+            target="_blank"
+          ></a>
+          <a
+            class="fas fa-envelope-square"
+            href="mailto:[email protected]"
+            target="_blank"
+          ></a>
         </div>
-    </section-->
-
-</body>
-</html>
+      </div>
+    </section>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -0,0 +1,20 @@
+{
+  "name": "marian-tetris",
+  "license": "MIT license",
+  "version": "1.4.0",
+  "description": "JS Tetris game",
+  "main": "index.html",
+  "repository": "https://github.com/mlacosta/Marian-TETRIS",
+  "author": "mlacosta <[email protected]>",
+  "private": true,
+  "devDependencies": {
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-import": "^2.25.2",
+    "eslint-plugin-prettier": "^4.2.1",
+    "prettier": "2.8.4"
+  },
+  "scripts": {
+    "lint": "eslint . --ext .js"
+  }
+}
diff --git a/resources/CSS/style.css b/resources/CSS/style.css
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		{ "trailingComma": "es5", "tabWidth": 2, "semi": true, "singleQuote": true }