Option to suppress Toolbar

[jywarren]

Some downstream uses (as described in #105) don't need or want a toolbar, so we should make it suppress-able with a constructor parameter, like:

      img = new L.DistortableImageOverlay(
        'example.jpg', {
          suppressToolbar: true, // <= here we suppress it
          corners: [
            new L.latLng(51.52,-0.10),
            new L.latLng(51.52,-0.14),
            new L.latLng(51.50,-0.10),
            new L.latLng(51.50,-0.14)
          ]
        }
      ).addTo(map);

This way, we can suppress the whole var EditOverlayAction = LeafletToolbar.ToolbarAction.extend({ section based on this constructor parameter, within the toolbar source file here:

Leaflet.DistortableImage/src/edit/DistortableImage.Edit.js

Line 243 in dc9e64c

this.toolbar = new L.DistortableImage.EditToolbar(raised_point).addTo(map, overlay);

Here's an example of using a constructor parameter:

Leaflet.DistortableImage/src/edit/DistortableImage.Edit.js

Line 21 in dc9e64c

this._mode = this._overlay.options.mode || 'distort';

So we can do a conditional like:

if (this._overlay.options.suppressToolbar !== false) {
  ...
}

And/or on this line where we instantiate the toolbar where we can also put a conditional:

Leaflet.DistortableImage/src/edit/DistortableImage.Edit.js

Line 243 in dc9e64c

this.toolbar = new L.DistortableImage.EditToolbar(raised_point).addTo(map, overlay);

This should get us one step closer to @ChrisLowe-Takor being able to directly include this library in https://github.com/ChrisLowe-Takor/react-leaflet-distortable-imageoverlay/ and share code more easily!

[jywarren]

@gauravano @rexagod @sashadev-sky @IgorWilbert this is actually the next step towards making this more compatible with the React-based wrapper in #105. I think more broadly we should consider how to make the tools more UI independent, and offer more README guidance for that, both because all the new things we want to do (ordering, maybe ImageSequencer work) will start to outgrow the popup-style menu.

We could show examples of how to bind buttons to different tools, for example. What do you think?

[jywarren]

An alternative to the above syntax might be:

toolbar: false

or we could even pass in the toolbar as a parameter, like:

var altToolbar = new SomeOtherToolbarUI();

img = new L.DistortableImageOverlay(
        'example.jpg', {
          tools: altToolbar,
          corners: [
            new L.latLng(51.52,-0.10),
            new L.latLng(51.52,-0.14),
            new L.latLng(51.50,-0.10),
            new L.latLng(51.50,-0.14)
          ]
        }
).addTo(map);

...with the current toolbar as the default if it's not set.

ideas welcome here, although probably being able to just turn off the toolbar is a good initial step.

[sashadev-sky]

Hi, I am writing up a proposal for this right now @jywarren

[jywarren]

awesome!

…

On Tue, Feb 12, 2019 at 9:36 AM Sasha Boginsky ***@***.***> wrote: Hi, I am writing up a proposal for this right now @jywarren <https://github.com/jywarren> — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#111 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AABfJ3K3HKd3g43HG0fpML5mVAcdjx9nks5vMtExgaJpZM4XytNK> .

[jywarren]

Moved the remaining portions of the abstraction changes to #140