chore(developer): refactor undo actions out of builder.js

keymanapp · Jul 1, 2022 · 2743574 · 2743574
1 parent e6a321d
commit 2743574
Show file tree

Hide file tree

Showing 3 changed files with 99 additions and 92 deletions.
diff --git a/developer/src/tike/xml/layoutbuilder/builder.js b/developer/src/tike/xml/layoutbuilder/builder.js
@@ -8,8 +8,6 @@ $(function() {
     }
   })(location.search);
 
-  this.undoStack = [];
-  this.redoStack = [];
   this.xscale = 1;
   this.yscale = 1;
   this.uniqId = 1;
@@ -1061,62 +1059,6 @@ $(function() {
     }
   }
 
-  this.undo = function () {
-    if (builder.undoStack.length == 0) {
-      return;
-    }
-    builder.saveUndo(1);
-    var s = builder.undoStack.pop();
-    this.loadUndo(s);
-  }
-
-  this.redo = function () {
-    if (builder.redoStack.length == 0) {
-      return;
-    }
-    builder.saveUndo(2);
-    var s = builder.redoStack.pop();
-    this.loadUndo(s);
-  }
-
-  this.loadUndo = function (s) {
-    KVKL = JSON.parse(s.KVKL);
-
-    builder.preparePlatforms();
-    builder.enableUndoControls();
-
-    $('#selPlatform').val(s.platform);
-    builder.selectPlatform();
-    $('#selLayer').val(s.layer);
-    builder.selectLayer();
-    builder.selectKey($('#kbd .key').filter(function (index) { return $(this).data('id') === s.id; }).first());
-    if (s.subkey) builder.selectSubKey($('#sk .key').filter(function (index) { return $(this).data('id') === s.subkey; }).first());
-  }
-
-  this.saveUndo = function (saveToRedo) {
-    if (!saveToRedo) {
-      builder.redoStack = [];
-    }
-    builder.generate(true,false);
-    var s = {
-      KVKL: JSON.stringify(KVKL),
-      platform: builder.lastPlatform,
-      layer: builder.lastLayerIndex,
-      key: builder.selectedKey().data('id')
-    };
-    var key = builder.selectedSubKey();
-    if (key.length > 0) {
-      s.subkey = $(key).data('id');
-    }
-
-    var stack = (saveToRedo == 1 ? builder.redoStack : builder.undoStack);
-    stack.push(s);
-    if (stack.length > 100) {
-      stack.shift();
-    }
-    builder.enableUndoControls();
-    builder.command('modified');
-  }
 
   this.commands = [];
 
@@ -1138,23 +1080,6 @@ $(function() {
     builder.commands.push(cmd);
   }
 
-  this.enableUndoControls = function () {
-    if (builder.undoStack.length == 0) {
-      builder.command('undo-disable');
-      $('#btnUndo').attr('disabled', 'disabled');
-    } else {
-      builder.command('undo-enable');
-      $('#btnUndo').removeAttr('disabled');
-    }
-    if (builder.redoStack.length == 0) {
-      builder.command('redo-disable');
-      $('#btnRedo').attr('disabled', 'disabled');
-    } else {
-      builder.command('redo-enable');
-      $('#btnRedo').removeAttr('disabled');
-    }
-  }
-
   this.addRow = function (position) {
     var row = document.createElement('div');
     $(row).addClass('row');
@@ -1913,14 +1838,6 @@ $(function() {
     builder.lastFocus = this;
   });
 
-  $('#btnUndo').click(function () {
-    builder.undo();
-  });
-
-  $('#btnRedo').click(function () {
-    builder.redo();
-  });
-
   $('#btnTemplate').click(function () {
     builder.command('template');
   });
@@ -2048,8 +1965,12 @@ $(function() {
     }
   };
 
-  builder.preparePlatforms();
-  builder.enableUndoControls();
-
-  builder.loadState();
 }.bind(builder));
+
+function initBuilder() {
+  $(function() {
+    builder.preparePlatforms();
+    builder.enableUndoControls();
+    builder.loadState();
+  });
+}
diff --git a/developer/src/tike/xml/layoutbuilder/builder.xsl b/developer/src/tike/xml/layoutbuilder/builder.xsl
@@ -18,16 +18,13 @@
                 <script><xsl:attribute name="src"><xsl:value-of select="/TouchLayoutBuilder/LibPath"/>jquery-ui.js</xsl:attribute></script>
                 <script>var KVKL = <xsl:value-of select='/TouchLayoutBuilder/LayoutJS' />;</script>
                 <script><xsl:attribute name="src"><xsl:value-of select="/TouchLayoutBuilder/LibPath"/>builder.js</xsl:attribute></script>
+  <script><xsl:attribute name="src"><xsl:value-of select="/TouchLayoutBuilder/LibPath"/>undo.js</xsl:attribute></script>
   <script><xsl:attribute name="src"><xsl:value-of select="/TouchLayoutBuilder/LibPath"/>platform-controls.js</xsl:attribute></script>
   <script><xsl:attribute name="src"><xsl:value-of select="/TouchLayoutBuilder/LibPath"/>layer-controls.js</xsl:attribute></script>
                 <script><xsl:attribute name="src"><xsl:value-of select="/TouchLayoutBuilder/LibPath"/>builder-charmap.js</xsl:attribute></script>
+  <script>initBuilder();</script>
             </head>
             <body>
-              <div id="wedgeAddRowAbove" class="kcontrol wedge-horz"><span>+</span></div>
-              <div id="wedgeAddRowBelow" class="kcontrol wedge-horz"><span>+</span></div>
-              <div id="wedgeAddKeyLeft" class="kcontrol wedge-vert"><span>+</span></div>
-              <div id="wedgeAddKeyRight" class="kcontrol wedge-vert"><span>+</span></div>
-              <div id="btnDelKey">x</div>
 
               <div id='toolbar'>
                     <div id='controlToolbar'>

diff --git a/developer/src/tike/xml/layoutbuilder/undo.js b/developer/src/tike/xml/layoutbuilder/undo.js
@@ -0,0 +1,89 @@
+$(function() {
+
+  this.undoStack = [];
+  this.redoStack = [];
+
+
+  this.undo = function () {
+    if (builder.undoStack.length == 0) {
+      return;
+    }
+    builder.saveUndo(1);
+    var s = builder.undoStack.pop();
+    this.loadUndo(s);
+  }
+
+  this.redo = function () {
+    if (builder.redoStack.length == 0) {
+      return;
+    }
+    builder.saveUndo(2);
+    var s = builder.redoStack.pop();
+    this.loadUndo(s);
+  }
+
+  this.loadUndo = function (s) {
+    KVKL = JSON.parse(s.KVKL);
+
+    builder.preparePlatforms();
+    builder.enableUndoControls();
+
+    $('#selPlatform').val(s.platform);
+    builder.selectPlatform();
+    $('#selLayer').val(s.layer);
+    builder.selectLayer();
+    builder.selectKey($('#kbd .key').filter(function (index) { return $(this).data('id') === s.id; }).first());
+    if (s.subkey) builder.selectSubKey($('#sk .key').filter(function (index) { return $(this).data('id') === s.subkey; }).first());
+  }
+
+  this.saveUndo = function (saveToRedo) {
+    if (!saveToRedo) {
+      builder.redoStack = [];
+    }
+    builder.generate(true,false);
+    var s = {
+      KVKL: JSON.stringify(KVKL),
+      platform: builder.lastPlatform,
+      layer: builder.lastLayerIndex,
+      key: builder.selectedKey().data('id')
+    };
+    var key = builder.selectedSubKey();
+    if (key.length > 0) {
+      s.subkey = $(key).data('id');
+    }
+
+    var stack = (saveToRedo == 1 ? builder.redoStack : builder.undoStack);
+    stack.push(s);
+    if (stack.length > 100) {
+      stack.shift();
+    }
+    builder.enableUndoControls();
+    builder.command('modified');
+  }
+
+  this.enableUndoControls = function () {
+    if (builder.undoStack.length == 0) {
+      builder.command('undo-disable');
+      $('#btnUndo').attr('disabled', 'disabled');
+    } else {
+      builder.command('undo-enable');
+      $('#btnUndo').removeAttr('disabled');
+    }
+    if (builder.redoStack.length == 0) {
+      builder.command('redo-disable');
+      $('#btnRedo').attr('disabled', 'disabled');
+    } else {
+      builder.command('redo-enable');
+      $('#btnRedo').removeAttr('disabled');
+    }
+  }
+
+  $('#btnUndo').click(function () {
+    builder.undo();
+  });
+
+  $('#btnRedo').click(function () {
+    builder.redo();
+  });
+
+}.bind(builder));