From 83705eca9d5daeec959a6dab758934d01b26617c Mon Sep 17 00:00:00 2001
From: Andrew Sutherland <asutherland@asutherland.org>
Date: Mon, 28 May 2018 16:06:35 -0400
Subject: [PATCH] persist trice filter disablings; change major timeline label
 to MTicks

See block comments on TriceLog._applyDiskState for limitations of the
persistence.  In general it should work as long as it's actually the
same JSON file we're loading each time.  But if we get a truncated
file, data could get lost.

The timeline major label was a date before, which was confusing because
the timescale is entirely synthetic.  Now it's also MTicks which is not
an exceedingly useful scale, but is at least consistent.
---
 .eslintrc.json                                         | 2 +-
 src/grok-ui/components/dirtying_component.js           | 1 +
 src/grok-ui/components/sheets/trice_timeline.jsx       | 9 ++++++++-
 src/grok-ui/components/trice_timeline/timeline_vis.jsx | 6 +++++-
 src/grokysis/frontend/trice_log.js                     | 4 ++--
 5 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index 5f41f8c..ca9ccb8 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -70,7 +70,7 @@
     "space-before-function-paren": 0,
     "space-in-parens": 0,
     "strict": 0,
-    "quotes": [2, "single", "avoid-escape"],
+    "quotes": [0, "single", "avoid-escape"],
     "valid-jsdoc": [0, {
       "prefer": {
         "return": "returns"
diff --git a/src/grok-ui/components/dirtying_component.js b/src/grok-ui/components/dirtying_component.js
index f5fdbf9..10ef8a1 100644
--- a/src/grok-ui/components/dirtying_component.js
+++ b/src/grok-ui/components/dirtying_component.js
@@ -58,6 +58,7 @@ export default class DirtyingComponent extends React.PureComponent {
     if (this._extraEvents) {
       for (const eventName of this._extraEvents) {
         const methodName = eventName[0].toUpperCase() + eventName.slice(1);
+        console.log('BINDING', eventName, methodName);
         this.repObj.on(eventName, this[methodName], this);
       }
     }
diff --git a/src/grok-ui/components/sheets/trice_timeline.jsx b/src/grok-ui/components/sheets/trice_timeline.jsx
index a9e877a..5397ad0 100644
--- a/src/grok-ui/components/sheets/trice_timeline.jsx
+++ b/src/grok-ui/components/sheets/trice_timeline.jsx
@@ -9,7 +9,7 @@ import TriceTimelineVis from '../trice_timeline/timeline_vis.jsx';
  */
 export default class TriceTimelineSheet extends React.PureComponent {
   constructor(props) {
-    super(props, 'triceLog', ['persistedStateDirty']);
+    super(props);
 
     const triceLog = this.props.triceLog;
     const sessionThing = this.props.sessionThing;
@@ -47,10 +47,16 @@ export default class TriceTimelineSheet extends React.PureComponent {
   componentWillMount() {
     this.props.sessionThing.handleSlotMessage(
       'triceLog:vis:seek', this.onSeekRequest);
+
+    this.props.triceLog.on(
+      'persistedStateDirty', this.onPersistedStateDirty, this);
   }
 
   componentWillUnmount() {
     this.props.sessionThing.stopHandlingSlotMessage('triceLog:vis:seek');
+
+    this.props.triceLog.removeListener(
+      'persistedStateDirty', this.onPersistedStateDirty, this);
   }
 
   onPersistedStateDirty() {
@@ -60,6 +66,7 @@ export default class TriceTimelineSheet extends React.PureComponent {
     const newState = Object.assign({}, oldState, {
       logPersisted: triceLog.toPersisted()
     });
+    console.log("updating persisted state", newState, "from", oldState);
     sessionThing.updatePersistedState(newState);
   }
 
diff --git a/src/grok-ui/components/trice_timeline/timeline_vis.jsx b/src/grok-ui/components/trice_timeline/timeline_vis.jsx
index 4966be8..e73a2fe 100644
--- a/src/grok-ui/components/trice_timeline/timeline_vis.jsx
+++ b/src/grok-ui/components/trice_timeline/timeline_vis.jsx
@@ -97,7 +97,11 @@ export default class TriceTimelineVis extends DirtyingComponent {
       zoomMin: 10,
       zoomMax: 1 * 1000 * 1000,
       format: {
-        minorLabels: function(date, scale/*, step*/) {
+        minorLabels: function(date/*, scale/*, step*/) {
+          const relTicks = Math.floor(date * triceLog.SCALE / 1000000);
+          return `${relTicks} MTicks`;
+        },
+        majorLabels: function(date/*, scale/*, step*/) {
           const relTicks = Math.floor(date * triceLog.SCALE / 1000000);
           return `${relTicks} MTicks`;
         }
diff --git a/src/grokysis/frontend/trice_log.js b/src/grokysis/frontend/trice_log.js
index 22c2441..fb406a7 100644
--- a/src/grokysis/frontend/trice_log.js
+++ b/src/grokysis/frontend/trice_log.js
@@ -185,7 +185,7 @@ export default class TriceLog extends EE {
    *     potentially be further grouped into "network" and "graphics".
    */
   _applyDiskState(diskRep) {
-    function traverseFacet(diskFacet, facet) {
+    const traverseFacet = (diskFacet, facet) => {
       // Toggle if we don't match.
       if (diskFacet.included !== facet.included) {
         this.toggleFilteringOutFacet(facet, true);
@@ -200,7 +200,7 @@ export default class TriceLog extends EE {
 
         traverseFacet(kidDisk, kidFacet);
       }
-    }
+    };
 
     for (const diskFacet of diskRep.facets) {
       const facet = this.facetsByName.get(diskFacet.name);