Add Prettier and ESLint

momijizukamori · Feb 6, 2024 · 7811019 · 7811019
1 parent 8addbb1
commit 7811019
Show file tree

Hide file tree

Showing 36 changed files with 4,777 additions and 3,237 deletions.
diff --git a/.eslintrc.yml b/.eslintrc.yml
@@ -0,0 +1,24 @@
+env:
+  browser: true
+  es2021: true
+extends: eslint:recommended
+parserOptions:
+  ecmaVersion: latest
+  sourceType: module
+rules:
+  linebreak-style:
+    - error
+    - unix
+  semi:
+    - error
+    - always
+  camelcase:
+    - warn
+  dot-notation:
+    - error
+  no-useless-concat:
+    - error
+  prefer-const:
+    - error
+  prefer-template:
+    - error
diff --git a/.github/workflows/lint.yml b/.github/workflows/lint.yml
@@ -0,0 +1,13 @@
+name: Run tests
+on: push
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - name: Install modules
+        run: npm install
+      - name: Run Prettier
+        run: npm run prettier
+      - name: Run ESLint
+        run: npm run lint
diff --git a/.github/workflows/pages.yml b/.github/workflows/pages.yml
@@ -44,4 +44,4 @@ jobs:
         with:
           folder: dist # The folder the action should deploy.
           clean-exclude: pr-preview/
-          force: false
+          force: false
diff --git a/.github/workflows/test-pages.yml b/.github/workflows/test-pages.yml
@@ -7,9 +7,9 @@ on:
   workflow_dispatch:
     inputs:
       destination:
-        description: "Define destination base path"
+        description: 'Define destination base path'
         required: true
-        default: "manual_run"
+        default: 'manual_run'
 
 # Sets the GITHUB_TOKEN permissions to allow deployment to GitHub Pages
 permissions:
@@ -44,4 +44,4 @@ jobs:
         with:
           source-dir: dist
           umbrella-dir: pr-preview
-          action: auto
+          action: auto
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -4,8 +4,8 @@ jobs:
   test:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v2
-    - name: Install modules
-      run: npm install
-    - name: Run tests
-      run: npm run test
+      - uses: actions/checkout@v2
+      - name: Install modules
+        run: npm install
+      - name: Run tests
+        run: npm run test
diff --git a/.prettierignore b/.prettierignore
@@ -0,0 +1 @@
+public/old/*
diff --git a/.prettierrc.yml b/.prettierrc.yml
@@ -0,0 +1,5 @@
+trailingComma: 'es5'
+tabWidth: 2
+semi: true
+singleQuote: true
+printWidth: 100
diff --git a/.vscode/launch.json b/.vscode/launch.json
@@ -1,30 +1,30 @@
 {
-    "version": "0.2.0",
-    "configurations": [
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "preLaunchTask": "npm: dev",
+      "postDebugTask": "Terminate All Tasks",
+      "type": "chrome",
+      "request": "launch",
+      "name": "Debug Chrome",
+      "url": "http://localhost:5173/bookbinder-js/",
+      "webRoot": "${workspaceFolder}"
+    },
+    {
+      "preLaunchTask": "npm: dev",
+      "postDebugTask": "Terminate All Tasks",
+      "type": "firefox",
+      "request": "launch",
+      "name": "Debug Firefox",
+      "url": "http://localhost:5173/bookbinder-js/",
+      "webRoot": "${workspaceFolder}",
+      "tmpDir": "${workspaceFolder}/tmp",
+      "pathMappings": [
         {
-            "preLaunchTask": "npm: dev",
-            "postDebugTask": "Terminate All Tasks",
-            "type": "chrome",
-            "request": "launch",
-            "name": "Debug Chrome",
-            "url": "http://localhost:5173/bookbinder-js/",
-            "webRoot": "${workspaceFolder}",
-        },
-        {
-            "preLaunchTask": "npm: dev",
-            "postDebugTask": "Terminate All Tasks",
-            "type": "firefox",
-            "request": "launch",
-            "name": "Debug Firefox",
-            "url": "http://localhost:5173/bookbinder-js/",
-            "webRoot": "${workspaceFolder}",
-            "tmpDir": "${workspaceFolder}/tmp",
-            "pathMappings": [
-                {
-                    "url": "http://localhost:5173/bookbinder-js/src",
-                    "path": "${workspaceFolder}/src"
-                }
-            ]
+          "url": "http://localhost:5173/bookbinder-js/src",
+          "path": "${workspaceFolder}/src"
         }
-    ]
+      ]
+    }
+  ]
 }
diff --git a/.vscode/tasks.json b/.vscode/tasks.json
@@ -1,45 +1,45 @@
 {
-	"version": "2.0.0",
-	"inputs": [
-		{
-			"id": "terminate",
-			"type": "command",
-			"command": "workbench.action.tasks.terminate",
-			"args": "terminateAll"
-		}
-	],
-	"tasks": [
-		{
-			"label": "Terminate All Tasks",
-			"command": "echo ${input:terminate}",
-			"type": "shell",
-			"problemMatcher": []
-		},
-		{
-			"type": "npm",
-			"isBackground": true,
-			"script": "dev",
-			"label": "npm: dev",
-			"detail": "vite --port 5173",
-			// All this is needed so that VSCode doesn't wait for the prelaunch
-			// task to complete and just lets it run in the background
-			"problemMatcher": [
-				{
-					"pattern": [
-						{
-							"regexp": ".",
-							"file": 1,
-							"location": 2,
-							"message": 3
-						}
-					],
-					"background": {
-						"activeOnStart": true,
-						"beginsPattern": ".",
-						"endsPattern": ".",
-					}
-				}
-			]
-		}
-	]
+  "version": "2.0.0",
+  "inputs": [
+    {
+      "id": "terminate",
+      "type": "command",
+      "command": "workbench.action.tasks.terminate",
+      "args": "terminateAll"
+    }
+  ],
+  "tasks": [
+    {
+      "label": "Terminate All Tasks",
+      "command": "echo ${input:terminate}",
+      "type": "shell",
+      "problemMatcher": []
+    },
+    {
+      "type": "npm",
+      "isBackground": true,
+      "script": "dev",
+      "label": "npm: dev",
+      "detail": "vite --port 5173",
+      // All this is needed so that VSCode doesn't wait for the prelaunch
+      // task to complete and just lets it run in the background
+      "problemMatcher": [
+        {
+          "pattern": [
+            {
+              "regexp": ".",
+              "file": 1,
+              "location": 2,
+              "message": 3
+            }
+          ],
+          "background": {
+            "activeOnStart": true,
+            "beginsPattern": ".",
+            "endsPattern": "."
+          }
+        }
+      ]
+    }
+  ]
 }
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -1,28 +1,34 @@
 # How to Contribute to This Project
+
 If you require more detailed instructions on any of these steps, please see the [detailed guide](/docs/contributing-details.md).
+
 ## Getting Started
+
 1. Prerequisites: [`node`, `npm`,](https://nodejs.org/en/download/) and [`git`](https://docs.github.com/en/get-started/quickstart/set-up-git), as well as a web browser, somewhere to edit your code, and a way to run commands in the terminal
 1. [Fork](https://docs.github.com/en/get-started/quickstart/fork-a-repo) the repository, [clone](https://docs.github.com/en/get-started/quickstart/fork-a-repo#cloning-your-forked-repository) down your copy, and navigate to the project directory (`bookbinder-js` unless you've renamed it)
 1. Set the parent repository as the upstream remote for your project with `git remote add upstream https://github.com/momijizukamori/bookbinder-js.git`
 1. Run `npm i` to install project dependencies
 
 ## Running the App
+
 1. Run the webpack build step with `npm run build` - this will update the generated `preload.js` file with the latest code from `src/`
 1. At present, this project does not automatically rebuild to reflect your changes. If you have made changes to files in `src/` you will need to run `npm run build` to see them reflected in the app.
 1. Open `index.html` in your browser and you're all set! (if you're not using a tool like VS Code's [LiveServer](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) extension you will need to refresh the page to see changes you've made)
 
 ## Branching and Committing
+
 1. Create a feature branch with `git checkout -b` for whatever you're working on, such as `feature/contribution-docs` or `bugfix/page-layout-issues`
 1. Commit your changes as you go with meaningful commit messages
 1. Ideally, write tests for any new behavior you're introducting
 1. Run tests with `npm run test` as you introduce changes; try to catch any breaking changes early and, as appropriate, either debug your code to find the problem or update the existing tests to reflect the new expected behavior
 1. Push your changes up to the feature branch on your fork as you go with `git push origin [name of branch]`, for example, `git push origin feature/contribution-docs`
 
 ## Pull Requests
+
 1. When you're ready to make a request for your changes to be merged into the parent repository, [open a pull request](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request):
-	- first, [make sure your fork is still up-to-date](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork#syncing-a-fork-from-the-command-line) with the latest version of the upstream repository with `git merge upstream/main`
-	- address any conflicts that may arise with upstream updates (currently outside the scope of this guide, but you can read some docs [here](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/addressing-merge-conflicts/about-merge-conflicts)).
-	- push all your latest changes, including any updates merged from upstream, up to your fork's feature branch as described above
-	- make sure tests are passing with `npm run test`
-	- open a pull request against the parent repository, as described in the link at the start of this section. Choose the parent repository's main branch as the 'base' and your fork's feature branch as the 'head'. Describe the changes you've made and review the changed files to make sure it's what you intended. See the following screenshot for an example:
-	![pull request example](/docs/PR-example.png)
+   - first, [make sure your fork is still up-to-date](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork#syncing-a-fork-from-the-command-line) with the latest version of the upstream repository with `git merge upstream/main`
+   - address any conflicts that may arise with upstream updates (currently outside the scope of this guide, but you can read some docs [here](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/addressing-merge-conflicts/about-merge-conflicts)).
+   - push all your latest changes, including any updates merged from upstream, up to your fork's feature branch as described above
+   - make sure tests are passing with `npm run test`
+   - open a pull request against the parent repository, as described in the link at the start of this section. Choose the parent repository's main branch as the 'base' and your fork's feature branch as the 'head'. Describe the changes you've made and review the changed files to make sure it's what you intended. See the following screenshot for an example:
+     ![pull request example](/docs/PR-example.png)
diff --git a/README.md b/README.md
@@ -1,29 +1,32 @@
 # bookbinder-js
+
 A JS application to format PDFs for bookbinding, based on [Bookbinder](http://quantumelephant.co.uk/bookbinder/bookbinder.html), rewritten to use [PDF-Lib](https://pdf-lib.js.org) as its backend library. Like Bookbinder, it is licensed under the [Mozilla Public License](https://www.mozilla.org/en-US/MPL/).
 
 ## Using
+
 Go to [the project page](https://momijizukamori.github.io/bookbinder-js) to use the app online - saving a complete copy of the webpage will enable you to load it locally without a web connection, too.
 
 A very helpful guide on page size given layout and paper selection has been created and can be found [HERE](https://docs.google.com/spreadsheets/d/1Qi9Qlbd4QBj6lErnFaRe8rdBsrX0tD7cWf0iOW1V0Vs/edit#gid=0).
 
 Snapshot of the size chart as of 2022-08-11
 ![Snapshot of sizes as of 2022-08-11](/docs/sizes_guide_snapshot_2022_08_11.png)
 
-
 ## Building
+
 ```
 npm install
 npm run dev
 ```
+
 And load `index.html` in any modern web browser.
 
 ## Auditing Results
 
 In the [`/docs`](/docs) directory:
 
- - There's 3 sample PDFs (and the `.tex` files to generate them) in [landscape](/docs/example_50cm_wide_10cm_tall.pdf)/[portrait](/docs/example_15cm_wide_40cm_tall.pdf)/[square proportions](/docs/example_20cm_square.pdf) filled with lorum ipsum and colored backgrounds to help test the positioning of the layouts. 
- - There's [a basic PDF](/docs/example_page_numbers.pdf) with just the numbers 1-120 writ large, used for figuring out page ordering.
- - A basic export of the different layouts with proportional/snug settings have been recorded for comparison/reference as well as several shots of `centered` settings. These can be found in the [`/docs/examples`](/docs/examples) folder. 
+- There's 3 sample PDFs (and the `.tex` files to generate them) in [landscape](/docs/example_50cm_wide_10cm_tall.pdf)/[portrait](/docs/example_15cm_wide_40cm_tall.pdf)/[square proportions](/docs/example_20cm_square.pdf) filled with lorum ipsum and colored backgrounds to help test the positioning of the layouts.
+- There's [a basic PDF](/docs/example_page_numbers.pdf) with just the numbers 1-120 writ large, used for figuring out page ordering.
+- A basic export of the different layouts with proportional/snug settings have been recorded for comparison/reference as well as several shots of `centered` settings. These can be found in the [`/docs/examples`](/docs/examples) folder.
 
 Snapshot of layout proof summary as of 2022-08-14
 ![Snapshot of layout proof summary 2022-08-14](/docs/examples_summary_snapshot_2022_08_14.png)
diff --git a/docs/contribution-help.md b/docs/contribution-help.md
@@ -1,17 +1,19 @@
 # Contribution Help
+
 This guide is intended as a supplement to help folks who may be new to coding, the GitHub ecosystem, or the collaboration process; it includes additional details to the process described in [CONTRIBUTING.md](../CONTRIBUTING.md). If you run into issues that aren't covered here, please feel free to add the steps you took and documentation you consulted to resolve them! It may be a big help to a future coder out there.
 
 Detailed instructions for tool installation and machine setup are outside the scope of this guide, but please feel free to reach out if you need assistance!
 
 - If you're unsure whether you have the right tools installed, you can confirm you have these installed by running the following in your terminal: `node --version`, `npm --version`, and `git --version`
- 	- if you do not see a version number as output, you will need to install the relevant tool, see links in [CONTRIBUTING.md](../CONTRIBUTING.md) (note: `npm` is generally part of the `node` installation and does not need to be installed separately)
+
+  - if you do not see a version number as output, you will need to install the relevant tool, see links in [CONTRIBUTING.md](../CONTRIBUTING.md) (note: `npm` is generally part of the `node` installation and does not need to be installed separately)
 
 - You can confirm your remotes are properly configured by running `git remote -v`; this should show your fork as the 'origin' repository and the parent as the 'upstream' repository, as in the following screenshot:
-	!["upstream remote example"](./upstream-remote-example.png)
+  !["upstream remote example"](./upstream-remote-example.png)
 
 - If you are not acquainted with `git`, see general setup and practices [in GitHub's docs](https://docs.github.com/en/get-started/quickstart/set-up-git). As mentioned above, a detailed Git tutorial is outside the scope of this guide, but feel free to reach out for assistance if you'd like to contribute but aren't sure how to get started.
 
 - Some notes on adding changes and making commits:
-	- Add changes to your branch with `git add -A`
-	- Commit changes with `git commit -m 'your commit message here'`
-		- Commit messages should describe your changes succinctly, for example, `git commit -m 'add contributor documentation'`
+  - Add changes to your branch with `git add -A`
+  - Commit changes with `git commit -m 'your commit message here'`
+    - Commit messages should describe your changes succinctly, for example, `git commit -m 'add contributor documentation'`