Output for glyphs and sprites (#18)

stamen · Apr 19, 2023 · 530bb8d · 530bb8d
1 parent ee3dbc9
commit 530bb8d
Show file tree

Hide file tree

Showing 5 changed files with 161 additions and 32 deletions.
diff --git a/dist/main.js b/dist/main.js
diff --git a/dist/main.js.map b/dist/main.js.map
diff --git a/dist/module.js b/dist/module.js
diff --git a/dist/module.js.map b/dist/module.js.map
diff --git a/src/lib/diff.js b/src/lib/diff.js
@@ -2,11 +2,21 @@ const isEqual = (a, b) => JSON.stringify(a) === JSON.stringify(b);
 
 class diffTracker {
   constructor() {
+    this.glyphs = null;
+    this.sprite = null;
     this.sources = [];
     this.layers = [];
     this.layerProps = {};
   }
 
+  changeGlyphs(change) {
+    this.glyphs = { change: change };
+  }
+
+  changeSprite(change) {
+    this.sprite = { change: change };
+  }
+
   changeSource(source, change) {
     this.sources.push({ source: source, change: change });
   }
@@ -505,9 +515,17 @@ export function diffStylesSetStyle(before, after) {
     }
     if (!isEqual(before.sprite, after.sprite)) {
       commands.push({ command: operations.setSprite, args: [after.sprite] });
+      differ.changeSprite({
+        command: 'setSprite',
+        args: [after.sprite, before.sprite]
+      });
     }
     if (!isEqual(before.glyphs, after.glyphs)) {
       commands.push({ command: operations.setGlyphs, args: [after.glyphs] });
+      differ.changeGlyphs({
+        command: 'setGlyphs',
+        args: [after.glyphs, before.glyphs]
+      });
     }
     if (!isEqual(before.transition, after.transition)) {
       commands.push({
@@ -554,6 +572,7 @@ export function diffStylesSetStyle(before, after) {
   }
 
   commands = detectMovedLayers(commands);
+
   return differ;
 }
 
@@ -587,7 +606,7 @@ function detectMovedLayers(commands) {
 const diffStyles = (before, after) => {
   const originalDiff = diffStylesSetStyle(before, after);
 
-  const { layerProps, layers, sources } = originalDiff;
+  const { layerProps, layers, sources, glyphs, sprite } = originalDiff;
 
   // formatting for source additions and removals
   const nextSources = sources.reduce((acc, s) => {
@@ -711,10 +730,24 @@ const diffStyles = (before, after) => {
     return acc;
   }, {});
 
+  let nextGlyphs;
+  if (glyphs?.change?.args) {
+    const [compareGlyph, currentGlyph] = glyphs?.change?.args;
+    nextGlyphs = { current: currentGlyph, compare: compareGlyph };
+  }
+
+  let nextSprite;
+  if (sprite?.change?.args) {
+    const [compareSprite, currentSprite] = sprite?.change?.args;
+    nextSprite = { current: currentSprite, compare: compareSprite };
+  }
+
   return {
     layerProps: nextLayerProps,
     layers: nextLayers,
-    sources: nextSources
+    sources: nextSources,
+    glyphs: nextGlyphs,
+    sprite: nextSprite
   };
 };