Support rel. graph undo/redo for summary labeler.

Reorder parameters of buildRecord so undo parameter is second.

Author: ranbo

graph/graph.html

@@ -52,21 +52,20 @@
       let isTree = false;
       if (url && url.includes(":")) {
         let matches = url.match(/.*1:1:(.*)/);
-        if (matches) {
+        if (matches) { // CDS/SLS record persona
           let personaId = matches[1];
           url = "https://api.familysearch.org/platform/records/personas/" + personaId + "?access_token=" + sessionId;
         }
         else {
           matches = url.match(/.*4:1:(.*)/);
-          if (matches) {
+          if (matches) { // Family Tree person
             let personId = matches[1];
             isTree = true;
             url = "https://api.familysearch.org/platform/tree/persons/" + personId + "?access_token=" + sessionId;
           }
           else {
             matches = url.match(/.*2:2:(.*)/);
-            if (matches) {
-              let personId = matches[1];
+            if (matches) { // LLS "Genealogies" tree person
               isTree = true;
               url = url + "?access_token=" + sessionId;
             }
@@ -98,12 +97,13 @@
     });
 
     /**
-     * Redraw the chart with an updated GedcomX document.
-     * Note that record.html has "updateRecord(doc)" as well, so we're using the same function name for both.
-     * @param doc - GedcomX document to rebuild the chart with.
+     *  Having made a change to the given record, update the display of it.
+     *
+     * @param doc The record to update.
+     * @param fromUndoLog - flag for whether this update is coming from the undo history, in which case the undo history should not be updated.
      */
-    function updateRecord(doc) {
-      buildRelGraph(doc, prevRelChartOptions(currentRelChart));
+    function updateRecord(doc, fromUndoLog) {
+      buildRelGraph(doc, prevRelChartOptions(currentRelChart, fromUndoLog));
     }
   </script>
 </body>

graph/graph.js

@@ -44,8 +44,8 @@
  * @param isDraggable - Flag for whether the rel chart should be draggable.
  * @returns {RelationshipChart}
  */
-function buildGraph(gx, isEditable, prevChart, ignoreUndo, imgOverlayToGx, isDraggable) {
-  return buildRelGraph(gx, prevChart ? prevRelChartOptions(prevChart): new ChartOptions({
+function buildGraph(gx, isEditable, prevChart, ignoreUndo, imgOverlayToGx = null, isDraggable = false) {
+  return buildRelGraph(gx, prevChart ? prevRelChartOptions(prevChart, ignoreUndo): new ChartOptions({
     isEditable: isEditable,
     prevChart: prevChart,
     ignoreUndo: ignoreUndo,
@@ -74,6 +74,9 @@ function buildMultipleRelGraphs(gxRecordSet, chartOptions) {
  * @returns {RelationshipChart}
  */
 function buildRelGraph(gx, chartOptions, relChartDiv='rel-chart') {
+  if (!chartOptions && currentRelChart) {
+    chartOptions = prevRelChartOptions(currentRelChart);
+  }
   if (!chartOptions.imgOverlayToGx && chartOptions.prevChart) {
     chartOptions.imgOverlayToGx = chartOptions.prevChart.imgOverlayToGx; // in case this is non-null.
   }

graph/tree/TreeFetch.js

@@ -399,7 +399,7 @@ function receivePersons(gx, fetchSpecs) {
   // Draw or update the relationship chart with what we have so far
   if (currentRelChart) {
     currentRelChart.selectedPersonBoxes = []; // clear selections
-    updateRecord(masterGx, null, false, true);
+    updateRecord(masterGx, false, false, null, true);
   }
   else {
     buildRelGraph(masterGx, defaultChartOptions);

graph/view/RelationshipChart.js

@@ -45,7 +45,7 @@ function ChartOptions({ prevChart= null,
   this.isUndo = isUndo;
 }
 
-function prevRelChartOptions(prevRelChart, imgOverlayToGx, isUndo) {
+function prevRelChartOptions(prevRelChart, isUndo, imgOverlayToGx) {
   return new ChartOptions({
     prevChart : prevRelChart,
     imgOverlayToGx: imgOverlayToGx,
@@ -326,7 +326,7 @@ function initUndo(relChart, chartOptions) {
   relChart.gedcomxChangePosition = chartOptions.prevChart ? chartOptions.prevChart.gedcomxChangePosition : 0;
 
   if (!chartOptions.isUndo) {
-    relChart.gedcomxChangeHistory[relChart.gedcomxChangePosition++] = JSON.parse(JSON.stringify(relChart.relGraph.gx));
+    relChart.gedcomxChangeHistory[relChart.gedcomxChangePosition++] = copyGedcomx(relChart.relGraph.gx);
     if (relChart.gedcomxChangePosition < relChart.gedcomxChangeHistory.length) {
       // Did a change after doing multiple "undos". So ignore the rest of the change history.
       relChart.gedcomxChangeHistory.length = relChart.gedcomxChangePosition;
@@ -337,14 +337,14 @@ function initUndo(relChart, chartOptions) {
 function undoGraph(relChart) {
   if (relChart && relChart.gedcomxChangePosition > 1) {
     let gx = copyGedcomx(relChart.gedcomxChangeHistory[--relChart.gedcomxChangePosition - 1]);
-    buildRelGraph(gx, prevRelChartOptions(relChart, null, true));
+    updateRecord(gx, true);
   }
 }
 
 function redoGraph(relChart) {
   if (relChart && relChart.gedcomxChangePosition < relChart.gedcomxChangeHistory.length) {
     let gx = copyGedcomx(relChart.gedcomxChangeHistory[relChart.gedcomxChangePosition++]);
-    buildRelGraph(gx, prevRelChartOptions(relChart, null, true));
+    updateRecord(gx, true);
   }
 }
 

index.html

@@ -202,13 +202,15 @@
           if ((key === 'Z' && e.shiftKey) || key === 'Y') {
             // Ctrl/Cmd-shift Z or Cmd-Y => Redo
             redoRecordSet();
-            e.stopPropagation();
+            // Prevent graph.js from receiving redo, since it is already taken care of.
+            e.stopImmediatePropagation();
             e.preventDefault(); // Prevent browser from treating Cmd-Y as "Show all history".
           }
           else if (key === 'Z') { // lower-case z, no shift
             // Ctrl/Cmd-Z => Undo
             undoRecordSet();
-            e.stopPropagation();
+            // Prevent graph.js from receiving Cmd-Z and re-doing the undo
+            e.stopImmediatePropagation();
             e.preventDefault();
           }
         }
@@ -218,13 +220,13 @@
     /**
      *  Having made a change to the given record, update the display of it.
      *
-     *  @param doc The record to update.
-     *  @param url (optional) The url or filename of the record, if applicable. (Ignored if null)
-     *  @param editorAlreadyUpdated (optional) Flag for whether the 'editor' is already updated (avoids closing editor when it is being edited still).
-     *  @param isClean - flag for whether this is a fresh update of the record, so the dirty bit should be cleared rather than set (like usual).
-     *  @param fromUndoLog - flag for whether this update is coming from the undo history, in which case the undo history should not be updated.
+     * @param doc The record to update.
+     * @param fromUndoLog - flag for whether this update is coming from the undo history, in which case the undo history should not be updated.
+     * @param editorAlreadyUpdated (optional) Flag for whether the 'editor' is already updated (avoids closing editor when it is being edited still).
+     * @param url (optional) The url or filename of the record, if applicable. (Ignored if null)
+     * @param isClean - flag for whether this is a fresh update of the record, so the dirty bit should be cleared rather than set (like usual).
      */
-    function updateRecord(doc, url, editorAlreadyUpdated, isClean, fromUndoLog) {
+    function updateRecord(doc, fromUndoLog, editorAlreadyUpdated, url, isClean) {
       url = url ? url : currentUrl;
       currentUrl = url;
       if (doc.records && doc.records.length > 0) {
@@ -304,7 +306,7 @@
       updateSelectablePersons(doc, $("#copy-person-fact-target-persons"));
 
       // Rebuild the relationship graph. Set global variable (defined in RelChartBuilder.js).
-      relChart = buildGraph(doc, true, relChart, true);
+      relChart = buildGraph(doc, true, relChart, fromUndoLog);
      }
 
     /**
@@ -792,7 +794,7 @@
         if (relChart) {
           relChart = null; // avoid animation at beginning when switching to different records.
         }
-        updateRecord(recordInfo.gxRecord, null, false, true);
+        updateRecord(recordInfo.gxRecord, false, false, null, true);
       }
     }
 
@@ -2730,7 +2732,7 @@
       else if (backup.text) {
         setRecordSourceDocument(backup.text, backup.filename);
       }
-      updateRecord(backup.doc, backup.url, false, true, true);
+      updateRecord(backup.doc, true, false, backup.url, true);
       $("#download-gx").attr("download", backup.filename ? backup.filename.replace(/(.txt|.nbx|.nbx.xml)?$/, ".gx.json") : "gx.json");
     }
 
@@ -2739,7 +2741,7 @@
         setRecordSourceDocument(null);
         recordInfos = [];
         currentRecordIndex = -1;
-        updateRecord({}, null, false, true);
+        updateRecord({}, false, false, null, true);
       }
     }
 
@@ -2807,7 +2809,7 @@
         recordInfos = [];
         currentRecordIndex = -1;
         relChart = null; // clear out any previous RelationshipChart
-        updateRecord(makeEmptyRecord(), null, false, true);
+        updateRecord(makeEmptyRecord(), false, false, null, true);
         for (let i = 0; i < files.length; i++) {
           let f = files[i];
           let reader = new FileReader();

split/time-machine.html

@@ -5,7 +5,6 @@
     <title>FamilySearch Time Machine</title>
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
     <script src="https://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
-<!--    <link href="https://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">-->
     <script src="../gx-util.js"></script>
     <script src="time-machine.js"></script>
     <link rel="stylesheet" type="text/css" href="time-machine.css">

summary/testSummary.html

@@ -58,9 +58,10 @@
      * Redraw the chart with an updated GedcomX document.
      * Note that record.html has "updateRecord(doc)" as well, so we're using the same function name for both.
      * @param doc - GedcomX document to rebuild the chart with.
+     * @param fromUndoLog - Flag for if the update is due to an undo/redo.
      */
-    function updateRecord(doc) {
-      buildRelGraph(doc, prevRelChartOptions(currentRelChart));
+    function updateRecord(doc, fromUndoLog) {
+      buildRelGraph(doc, prevRelChartOptions(currentRelChart, fromUndoLog));
     }
   </script>
 </body>