Add prettier formatting of JavaScript, style, and HTML files, and che…

…ck formatting in a workflow.

Prettier is used to format JavaScript, style, and HTML files in htdocs.
The configuration chosen is in .prettierrc and .editorconfig.  Prettier
doesn't really have many options as it is very opinionated.  I am not
entirely happy with everything prettier does, but it does give a more
uniform code format to files.  Furthermore, it is nice to be able to be
able to just run prettier and not need to worry about formatting code.

A workflow now checks formatting of JavaScript, style, and HTML files
with prettier in addition checking formatting of perl files with
perltidy.  Note the "linter" workflow has been renamed to
"check-formats", because that is what it does, and this really does not
have anything to do with linting.

Note that developers can (and should) run `npm run prettier-format` in
the htdocs directory to format files.  You can also run `npm run
prettier-check` to check that formatting of these files is correct, and
not actually change the files.  This is what the workflow does.

.editorconfig

@@ -0,0 +1,17 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+insert_final_newline = true
+max_line_length = 120
+trim_trailing_whitespace = true
+indent_style = tab
+indent_size = 4
+
+[*.yml]
+indent_style = space
+indent_size = 2
+
+[*.pg]
+trim_trailing_whitespace = false

.github/workflows/check-formats.yml

@@ -0,0 +1,44 @@
+---
+name: Check Formatting of Code Base
+
+defaults:
+  run:
+    shell: bash
+
+on:
+  push:
+    branches-ignore: [main, develop]
+  pull_request:
+
+jobs:
+  perltidy:
+    name: Check Perl file formatting with perltidy
+    runs-on: ubuntu-22.04
+    container:
+      image: perl:5.34
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+      - name: Install dependencies
+        run: cpanm -n Perl::Tidy@20220613
+      - name: Run perltidy
+        shell: bash
+        run: |
+          git config --global --add safe.directory "$GITHUB_WORKSPACE"
+          shopt -s extglob globstar nullglob
+          perltidy --pro=./.perltidyrc -b -bext='/' ./**/*.p[lm] ./**/*.t && git diff --exit-code
+
+  prettier:
+    name: Check JavaScript, style, and HTML file formatting with prettier
+    runs-on: ubuntu-22.04
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+      - name: Install Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+      - name: Install Dependencies
+        run: cd htdocs && npm ci --ignore-scripts
+      - name: Check formatting with prettier
+        run: cd htdocs && npm run prettier-check

.prettierrc

@@ -0,0 +1,8 @@
+{
+	"arrowParens": "always",
+	"bracketSpacing": true,
+	"printWidth": 120,
+	"semi": true,
+	"singleQuote": true,
+	"trailingComma": "none"
+}

htdocs/package.json

@@ -4,7 +4,9 @@
     "license": "GPL-2.0+",
     "scripts": {
         "generate-assets": "node generate-assets",
-        "prepare": "npm run generate-assets"
+        "prepare": "npm run generate-assets",
+        "prettier-format": "prettier --ignore-path=../.gitignore --write \"**/*.{js,css,scss,html}\"",
+        "prettier-check": "prettier --ignore-path=../.gitignore --check \"**/*.{js,css,scss,html}\""
     },
     "repository": {
         "type": "git",
@@ -28,6 +30,7 @@
         "chokidar": "^3.5.3",
         "cssnano": "^6.0.1",
         "postcss": "^8.4.31",
+        "prettier": "^3.1.1",
         "rtlcss": "^4.1.1",
         "sass": "^1.69.5",
         "terser": "^5.24.0",