start of ruler preferences and style

- Want to have initial X position.
- initial Y position.
- initial ruler lenght.

pending:

- Don't overlap at creation.
- change polyline width.
- change white and gray polyline.
- Change polyline color.
- Change text label.
- Change text font family.
- Change text font size.

modules/io/load.js

@@ -256,6 +256,10 @@ async function parseLoadedData(data, mapVersion) {
       if (data[2]) mapCoordinates = JSON.parse(data[2]);
       if (data[4]) notes = JSON.parse(data[4]);
       if (data[33]) rulers.fromString(data[33]);
+        const rulerPreferences = JSON.parse(data[33]);
+        localStorage.setItem("rulerInitialX", rulerPreferences.initialX);
+        localStorage.setItem("rulerInitialY", rulerPreferences.initialY);
+        localStorage.setItem("rulerInitialLength", rulerPreferences.initialLength);
       if (data[34]) {
         const usedFonts = JSON.parse(data[34]);
         usedFonts.forEach(usedFont => {

modules/io/save.js

@@ -73,6 +73,11 @@ function prepareMapData() {
   const coords = JSON.stringify(mapCoordinates);
   const biomes = [biomesData.color, biomesData.habitability, biomesData.name].join("|");
   const notesData = JSON.stringify(notes);
+  const rulerPreferences = JSON.stringify({
+    initialX: localStorage.getItem("rulerInitialX") || "50",
+    initialY: localStorage.getItem("rulerInitialY") || "50",
+    initialLength: localStorage.getItem("rulerInitialLength") || "100"
+  });
   const rulersString = rulers.toString();
   const fonts = JSON.stringify(getUsedFonts(svg.node()));
 
@@ -148,6 +153,7 @@ function prepareMapData() {
     provinces,
     namesData,
     rivers,
+    rulerPreferences,
     rulersString,
     fonts,
     markers,