Restore original proportions tool and bug fixes

Gruntfile.js

@@ -3,112 +3,136 @@ module.exports = function(grunt) {
     require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
 
     grunt.initConfig({
-        pkg: grunt.file.readJSON('package.json'),
+      pkg: grunt.file.readJSON("package.json"),
 
-        jshint: {
-            options: {
-                node: true,
-                browser: true,
-                esnext: true,
-                bitwise: true,
-                curly: true,
-                eqeqeq: true,
-                immed: true,
-                indent: 4,
-                latedef: true,
-                newcap: true,
-                noarg: true,
-                regexp: true,
-                undef: true,
-                unused: 'strict',
-                trailing: true,
-                smarttabs: true,
-                globals: {
-                    L: false,
-                    $: false,
-                    LeafletToolbar: false,
-                    warpWebGl: false,
-                    EXIF: false,
-                    alert: false,
+      jshint: {
+        options: {
+          node: true,
+          browser: true,
+          esnext: true,
+          bitwise: true,
+          curly: true,
+          eqeqeq: true,
+          immed: true,
+          indent: 4,
+          latedef: true,
+          newcap: true,
+          noarg: true,
+          regexp: true,
+          undef: true,
+          unused: "strict",
+          trailing: true,
+          smarttabs: true,
+          globals: {
+            L: false,
+            $: false,
+            LeafletToolbar: false,
+            warpWebGl: false,
+            EXIF: false,
+            alert: false,
 
-                    // Mocha
+            // Mocha
 
-                    describe: false,
-                    it: false,
-                    before: false,
-                    after: false,
-                    beforeEach: false,
-                    afterEach: false,
-                    chai: false,
-                    expect: false,
-                    sinon: false
-                }
-            },
-            source: {
-                src: [ 'src/**/*.js', 'package.json' ]
-            },
-            grunt: {
-                src: [ 'Gruntfile.js' ]
-            }
+            describe: false,
+            it: false,
+            before: false,
+            after: false,
+            beforeEach: false,
+            afterEach: false,
+            chai: false,
+            expect: false,
+            sinon: false
+          }
         },
+        source: {
+          src: ["src/**/*.js", "package.json"]
+        },
+        grunt: {
+          src: ["Gruntfile.js"]
+        }
+      },
 
-        karma: {
-            development: {
-                configFile: 'test/karma.conf.js',
-            },
-            test: {
-                configFile: 'test/karma.conf.js',
-            }
+      karma: {
+        development: {
+          configFile: "test/karma.conf.js"
         },
+        test: {
+          configFile: "test/karma.conf.js"
+        }
+      },
 
-        watch: {
-            options : {
-                livereload: true
+      svg_sprite: {
+        options: {
+          // Task-specific options go here.
+        },
+        dist: {
+          expand: true,
+          cwd: "assets/",
+          src: ["icons/*.svg"],
+          dest: "assets/icons/",
+          options: {
+            log: "info",
+            shape: {
+              dimension: {
+                maxWidth: 18,
+                maxHeight: 18
+              }
             },
-            source: {
-                files: [
-                    'src/**/*.js',
-                    'test/**/*.js',
-                    'Gruntfile.js'
-                ],
-                tasks: [ 'build:js' ]
+            mode: {
+              symbol: {
+                sprite: "sprite.symbol.svg",
+                example: true
+              }
             }
+          }
+        }
+      },
+
+      watch: {
+        options: {
+          livereload: true
         },
+        source: {
+          files: ["src/**/*.js", "test/**/*.js", "Gruntfile.js"],
+          tasks: ["build:js"]
+        }
+      },
 
-        concat: {
-            dist: {
-              src: [
-                  'src/util/*.js',
-                  'src/DistortableImageOverlay.js',
-                  'src/DistortableCollection.js',
-                  'src/edit/getEXIFdata.js',
-                  'src/edit/EditHandle.js',
-                  'src/edit/LockHandle.js',
-                  'src/edit/DistortHandle.js',
-                  'src/edit/RotateScaleHandle.js',
-                  'src/edit/RotateHandle.js',
-                  'src/edit/ScaleHandle.js',
-                  'src/edit/DistortableImage.EditToolbar.js',
-                  'src/edit/DistortableImage.Edit.js',
-                  'src/edit/tools/DistortableImage.Keymapper.js',
-                  'src/edit/BoxSelectHandle.js'
-              ],
-                dest: 'dist/leaflet.distortableimage.js',
-            }
+      concat: {
+        dist: {
+          src: [
+            "src/util/*.js",
+            "src/DistortableImageOverlay.js",
+            "src/DistortableCollection.js",
+            "src/edit/getEXIFdata.js",
+            "src/edit/EditHandle.js",
+            "src/edit/LockHandle.js",
+            "src/edit/DistortHandle.js",
+            "src/edit/RotateScaleHandle.js",
+            "src/edit/RotateHandle.js",
+            "src/edit/ScaleHandle.js",
+            "src/edit/DistortableImage.EditToolbar.js",
+            "src/edit/DistortableImage.Edit.js",
+            "src/edit/tools/DistortableImage.Keymapper.js",
+            "src/edit/BoxSelectHandle.js"
+          ],
+          dest: "dist/leaflet.distortableimage.js"
         }
+      }
     });
 
     /* Run tests once. */
     grunt.registerTask('test', [ 'jshint', 'karma:test' ]);
 
     /* Default (development): Watch files and lint, test, and build on change. */
-    grunt.registerTask('default', ['karma:development:start', 'watch']);
+    grunt.registerTask('default', ['svg_sprite', 'karma:development:start', 'watch',]);
 
     grunt.registerTask('build', [
         'jshint',
         'karma:development:start',
+        'svg_sprite',
         'coverage',
-        'concat:dist'
+        'concat:dist',
     ]);
 
     grunt.registerTask('coverage', 'Custom commmand-line reporter for karma-coverage', function() {

README.md

@@ -64,17 +64,16 @@ img = L.distortableImageOverlay(
       L.latLng(51.50,-0.14),
       L.latLng(51.50,-0.10)
     ],
-  }
-).addTo(map);
+  }).addTo(map);
 
 // enable editing
 L.DomEvent.on(img._image, 'load', img.editing.enable, img.editing);
 ```
 
 Options available to pass during `L.DistortableImageOverlay` initialization:
-- corners
+- [corners](#corners)
 
-- [selected](#selection)
+- [selected](#selected)
 
 - [mode](#mode)
 
@@ -84,6 +83,33 @@ Options available to pass during `L.DistortableImageOverlay` initialization:
 
 - [suppressToolbar](#Suppress-Toolbar)
 
+## Corners
+
+The corners are stored as `L.latLng` objects
+on the image, and can be accessed using our `getCorners()` method after the image is instantiated and added to the map.
+
+Useful usage example:
+
+```js
+// instantiate, add to map and enable
+img = L.distortableImageOverlay(...);
+img.addTo(map);
+L.DomEvent.on(img._image, 'load', img.editing.enable, img.editing);
+
+// grab the initial corner positions
+JSON.stringify(img.getCorners())
+=> "[{"lat":51.52,"lng":-0.14},{"lat":51.52,"lng":-0.1},{"lat":51.5,"lng":-0.14},{"lat":51.5,"lng":-0.1}]"
+
+// ...move the image around...
+
+// check the new corner positions.
+JSON.stringify(img.getCorners())
+=> "[{"lat":51.50685099607552,"lng":-0.06058305501937867},{"lat":51.50685099607552,"lng":-0.02058595418930054},{"lat":51.486652692081925,"lng":-0.06058305501937867},{"lat":51.486652692081925,"lng":-0.02058595418930054}]"
+
+// note there is an added level of precision after dragging the image for debugging purposes
+
+```
+We further added a `getCorner(idx)` method used the same way as its plural counterpart but with an index passed to it.
 
 ## Selected
 
@@ -158,8 +184,7 @@ img = L.distortableImageOverlay(
       L.latLng(51.50,-0.10)
     ],
     fullResolutionSrc: 'large.jpg'
-  }
-).addTo(map);
+  }).addTo(map);
 
 L.DomEvent.on(img._image, 'load', img.editing.enable, img.editing);
 
@@ -212,6 +237,8 @@ imageFeatureGroup.addLayer(img3);
 
 - "EnableEXIF"
 
+- "Restore"
+
 - "Export"
 
 - "Delete"
@@ -226,41 +253,12 @@ imageFeatureGroup.addLayer(img3);
 
 For multiple images, the `ToggleOrder` action switches overlapping images back and forth into view by employing [`bringToFront()`](https://leafletjs.com/reference-1.4.0.html#popup-bringtofront) and [`bringToBack()`](https://leafletjs.com/reference-1.4.0.html#popup-bringtoback) from the Leaflet API.
 
-
 ## Quick API Reference
 
 - [`getCorners()`](corners) and [`getCorner(idx)`](corners)
 
 - `getCenter()` - Calculates the centroid of the image
 
-## Corners
-
-The corners are stored as `L.latLng` objects
-on the image, and can be accessed using our `getCorners()` method after the image is instantiated and added to the map.
-
-Useful usage example:
-
-```js
-// instantiate, add to map and enable
-img = L.distortableImageOverlay(...);
-img.addTo(map);
-L.DomEvent.on(img._image, 'load', img.editing.enable, img.editing);
-
-// grab the initial corner positions
-JSON.stringify(img.getCorners())
-=> "[{"lat":51.52,"lng":-0.14},{"lat":51.52,"lng":-0.1},{"lat":51.5,"lng":-0.14},{"lat":51.5,"lng":-0.1}]"
-
-// ...move the image around...
-
-// check the new corner positions.
-JSON.stringify(img.getCorners())
-=> "[{"lat":51.50685099607552,"lng":-0.06058305501937867},{"lat":51.50685099607552,"lng":-0.02058595418930054},{"lat":51.486652692081925,"lng":-0.06058305501937867},{"lat":51.486652692081925,"lng":-0.02058595418930054}]"
-
-// note there is an added level of precision after dragging the image for debugging purposes
-
-```
-We further added a `getCorner(idx)` method used the same way as its plural counterpart but with an index passed to it.
-
 ## Contributing
 
 1. This project uses `grunt` to do a lot of things, including concatenate source files from /src/ to /DistortableImageOverlay.js. But you may need to install grunt-cli: `npm install -g grunt-cli` first.