Convert to ES6

[sashadev-sky]

we want to start moving towards ES6 implementation.

• RequireJS/Browserify (past suggestions)
• ES version upgrade
• Rollup like Leaflet?

would significantly improve everyone's development experience enough to outweigh the cost of implementing it. The leaflet library itself is already completely transformed for ES6 use.

Checklist:

• [x] method creation syntax

ES5

radiansToDegrees: function(angle) {
  return angle * 180 / Math.PI;
},

ES6

radiansToDegrees(angle) {
  return angle * 180 / Math.PI;
}

• [ ] arrow functions

• [ ] variables - get rid of var use let and const instead

• [x] string interpolation

ES5

confirmDeletes: function(n) {
    const humanized = n === 1 ? 'image' : 'images';

    return window.confirm(
      'Are you sure? ' + n + ' ' + humanized + ' will be permanently deleted from the map.'
    );
},

ES6

confirmDeletes: function(n) {
    const humanized = n === 1 ? 'image' : 'images';

    return window.confirm(
      `Are you sure? ${n} ${humanized} will be permanently deleted from the map.`
    );
},

[sashadev-sky]

@rexagod , how shall we do this?

[rexagod]

I was thinking something like this would make sense after we're at little or no pending PRs, since we could get all that merged code refactored all in one big scoop, rather than rebasing every PR to fit this standard.

What do you think?

[sashadev-sky]

+1

I actually created milestones for version 1 release: https://github.com/publiclab/Leaflet.DistortableImage/milestone/3

I think we are getting there now that the distortion bugs are gone! I guess this is something we would want to add to that list. also adding your matcher project and the dynamic keymapper. let me know your thoughts!

[rexagod]

Sounds good! Let's get these milestones done! 🙌

[rexagod]

Will return back here once those are done.

[sashadev-sky]

I am going to start formulating a checklist in the PR description of thinks we can rewrite in ES6 (not exhaustive just as they come to mind) @rexagod

[jywarren]

Just adding a 👍 ❤️ to this and especially to the browserify or other means of require() part of this, which I feel could be done first, as that could also include some filter steps like... uglify or whatever, easing the transition. Getting away from concatenation seems very worthwhile!

This would set us up for some EXTREMELY powerful new tools like https://github.com/publiclab/matcher-core/issues/1 - and seems like a reasonable chunk to bite off from the broader ES6 upgrade?

[jywarren]

@publiclab/maintainers possibly this contains some more FTOs, or could be mostly complete?

[TildaDares]

@jywarren I created a few issues like this #1037 to update the method creation syntax to ES6.

[Ranecodes]

Hello @TildaDares , I saw that some tasks here are yet to be completed. Please can I be assigned to work on the arrow functions or method creation syntax?

[jywarren]

Hi @Ranecodes -- take a look at this issue to find some! Thank you! https://github.com/publiclab/Leaflet.DistortableImage/issues/1086#issuecomment-1276807029

[Ranecodes]

Hi @Ranecodes -- take a look at this issue to find some! Thank you! #1086 (comment)

Thank you!