Reformat with prettier

.eslintrc.json

@@ -1,18 +1,11 @@
 {
   "root": true,
-  "ignorePatterns": [
-    "projects/**/*"
-  ],
+  "ignorePatterns": ["projects/**/*"],
   "overrides": [
     {
-      "files": [
-        "*.ts"
-      ],
+      "files": ["*.ts"],
       "parserOptions": {
-        "project": [
-          "tsconfig.json",
-          "e2e/tsconfig.json"
-        ],
+        "project": ["tsconfig.json", "e2e/tsconfig.json"],
         "createDefaultProgram": true
       },
       "extends": [
@@ -39,12 +32,8 @@
       }
     },
     {
-      "files": [
-        "*.html"
-      ],
-      "extends": [
-        "plugin:@angular-eslint/template/recommended"
-      ],
+      "files": ["*.html"],
+      "extends": ["plugin:@angular-eslint/template/recommended"],
       "rules": {}
     }
   ]

.prettierrc.json

@@ -0,0 +1,5 @@
+{
+  "bracketSpacing": false,
+  "htmlWhitespaceSensitivity": "ignore",
+  "singleQuote": true
+}

README.md

@@ -1,35 +1,41 @@
 # SvgPathEditor
+
 Edit or create SVG paths in browser: https://yqnn.github.io/svg-path-editor/
 [![Image of Yaktocat](./doc/screenshot.png)](https://yqnn.github.io/svg-path-editor/)
 
 ## How to Use
 
 ##### Basic:
+
 - Paste or edit the raw path in the **path** field
 - Click on **+** to add a new command to the path, select a type, then click on the destination
 - Move points with drag and drop
 - Click on a point, then on the **...** button to insert a command right after the selected one, to remove it, or to change its type
 
 ##### Commands panel:
+
 - Click on the command type to toggle between relative and absolute coordinates
 - Relative command types are **orange**, absolute are **purple**
 - Click on **...** then **Delete** to delete a command
 - Click on **...** then **Insert after** to insert a new command right after the selected one
 - Click on **...** then **Convert to** to convert the selected command to a new type
 
 ##### ViewBox:
+
 - Use mouse wheel, or click **Zoom in** and **Zoom out** to zoom in/out
 - Use drag & drop to move the viewBox
 - Click on **Zoom to Fit** to automatically set the viewBox depending on current path
 - ViewBox can also be set manually with the **x**, **y**, **width** and **height** fields
 
 ##### Path operations:
+
 - Scale the full path with the **Scale** button
 - Translate the full path with the **Translate** button
 - Round all coordinates of the current path with the **Round** button
 - Convert all commands to relative or absolute coordinates with **Convert to relative** or **Convert to absolute** button
 
 ##### Shortcuts:
+
 - Press **m**, **l**, **v**, **h**, **c**, **s**, **q**, **t**, **a** or **z** to insert a command after the selected one
 - Press **shift** + **m**, **l**, **v**, **h**, **c**, **s**, **q**, **t**, **a** or **z** to convert selected command to a new type
 - Press **echap** to delete the command being created, or the undo the current dragging operation
@@ -43,21 +49,27 @@ Edit or create SVG paths in browser: https://yqnn.github.io/svg-path-editor/
 ### With Node.js
 
 ##### Requirements
+
 - [Node.js](https://nodejs.org/) v12.14, v14.15 or higher.
 
 ##### Dependencies
+
 Run `npm install` to retrieve all the depencies of the project.
 
 ##### Development server
+
 Run `npm start` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
 
 ##### Build
+
 Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.
 
 ##### Running unit tests
+
 Run `npm test` to execute the unit tests via [Karma](https://karma-runner.github.io).
 
 ### With Docker
+
 Run `docker build -t svg-path-editor . && docker run -p 4200:4200 svg-path-editor` or `docker-compose up`.
 
 ---

angular.json

@@ -31,10 +31,7 @@
               "src/assets",
               "src/manifest.webmanifest"
             ],
-            "styles": [
-              "src/custom-theme.scss",
-              "src/styles.scss"
-            ],
+            "styles": ["src/custom-theme.scss", "src/styles.scss"],
             "scripts": [],
             "serviceWorker": true,
             "ngswConfigPath": "ngsw-config.json"
@@ -103,19 +100,14 @@
               "src/assets",
               "src/manifest.webmanifest"
             ],
-            "styles": [
-              "src/styles.scss"
-            ],
+            "styles": ["src/styles.scss"],
             "scripts": []
           }
         },
         "lint": {
           "builder": "@angular-eslint/builder:lint",
           "options": {
-            "lintFilePatterns": [
-              "src/**/*.ts",
-              "src/**/*.html"
-            ]
+            "lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
           }
         }
       }

docker-compose.yml

@@ -1,12 +1,12 @@
-version: "3"
+version: '3'
 services:
   web-server:
     build: .
     ports:
       - 4200:4200
     volumes:
       - .:/app
-    command: 
+    command:
       - bash
       - -c
       - |

karma.conf.js

@@ -10,7 +10,7 @@ module.exports = function (config) {
       require('karma-chrome-launcher'),
       require('karma-jasmine-html-reporter'),
       require('karma-coverage'),
-      require('@angular-devkit/build-angular/plugins/karma')
+      require('@angular-devkit/build-angular/plugins/karma'),
     ],
     client: {
       jasmine: {
@@ -19,18 +19,15 @@ module.exports = function (config) {
         // for example, you can disable the random execution with `random: false`
         // or set a specific seed with `seed: 4321`
       },
-      clearContext: false // leave Jasmine Spec Runner output visible in browser
+      clearContext: false, // leave Jasmine Spec Runner output visible in browser
     },
     jasmineHtmlReporter: {
-      suppressAll: true // removes the duplicated traces
+      suppressAll: true, // removes the duplicated traces
     },
     coverageReporter: {
       dir: require('path').join(__dirname, './coverage/svg-path-editor'),
       subdir: '.',
-      reporters: [
-        { type: 'html' },
-        { type: 'text-summary' }
-      ]
+      reporters: [{type: 'html'}, {type: 'text-summary'}],
     },
     reporters: ['progress', 'kjhtml'],
     port: 9876,
@@ -39,6 +36,6 @@ module.exports = function (config) {
     autoWatch: true,
     browsers: ['Chrome'],
     singleRun: false,
-    restartOnFileChange: true
+    restartOnFileChange: true,
   });
 };

package.json

@@ -45,6 +45,7 @@
     "karma-coverage": "~2.0.3",
     "karma-jasmine": "~4.0.0",
     "karma-jasmine-html-reporter": "^1.5.0",
+    "prettier": "^2.5.1",
     "typescript": "~4.2.4"
   }
 }