Add startPath option

[legomushroom]

Right now you can get curve's code by clicking the code button and copying the path coordinates from there.

Something like this: M0, 100 C0, 100 28.155286227103208, 95.35825418399047 30, 52.42857142857143 C31.844713772896824, 9.498888673152383 75.15078407720145, 24.857142857142858 75.15078407720145, 24.857142857142858 C75.15078407720145, 24.857142857142858 100, 0 100, 0

We need to do the opposite - parse this path coordinates data back to js objects:

// an array of points, where each point has the next structure:
point: {
     x: 30,
     y: 52.42,
     handle1: {x:28.15, y: 95.35},
     handle2: {x:31.84, y: 9.49}
}

There is how the SVG path data maps to js objects:

/*
  Input: M0, 100 C0, 100 28.155286227103208, 95.35825418399047 30, 52.42857142857143 C31.844713772896824, 9.498888673152383 75.15078407720145, 24.857142857142858 75.15078407720145, 24.857142857142858 C75.15078407720145, 24.857142857142858 100, 0 100, 0

  Sudo: [point1] [point1.handle2] [point2.handle1] [point2] [point2.handle2] [point3.handle1] [point3] [point3.handle2] [point4.handle1] [point4]
  
  Output:
    point1:
     x: 0, y: 100,
     handle2: x:0, y: 100
     
    point2:
     x: 30, y: 52.42857142857143,
     handle1: x:28.155286227103208, y: 95.35825418399047
     handle2: x:31.844713772896824, y: 9.498888673152383
    
    point3:
     x: 75.15078407720145, y: 24.857142857142858,
     handle1: x:75.15078407720145, y: 24.857142857142858
     handle2: x:75.15078407720145, y: 24.857142857142858

    point4:
     x: 100, y: 0
     handle1: x: 100, y: 0
*/

We can use getPathData polyfill that will make the parsing of theSVG coordinates data simple. After this, we need to fire few redux actions to send this data to redux store which will update components automatically. With this functionality, we can easily add startPath option to the curve editor which will allow launching(loading) the plugin with a predefined path - import the path back.

If you have any question, please feel free to ask, would love to help!

Cheers!

[dev99problems]

Will do

[legomushroom]

Oh, nice! This one will be big. 👍

[dev99problems]

Please, take a look
#15

[Sandstedt]

Merged: #15