From e2ac2971021b173890e62abd440714236493595e Mon Sep 17 00:00:00 2001
From: n1474335 <n1474335@gmail.com>
Date: Thu, 28 Sep 2017 17:35:52 +0000
Subject: [PATCH] Register values now displayed in the recipe

---
 src/core/ChefWorker.js                        | 17 ++++++++++++
 src/core/FlowControl.js                       |  6 +++++
 src/web/RecipeWaiter.js                       | 26 +++++++++++++++++++
 src/web/WorkerWaiter.js                       |  3 +++
 src/web/stylesheets/components/_operation.css |  6 +++++
 5 files changed, 58 insertions(+)

diff --git a/src/core/ChefWorker.js b/src/core/ChefWorker.js
index d3f0c032..d29a3cae 100644
--- a/src/core/ChefWorker.js
+++ b/src/core/ChefWorker.js
@@ -176,3 +176,20 @@ self.setOption = function(option, value) {
         }
     });
 };
+
+
+/**
+ * Send register values back to the app.
+ *
+ * @param {number} opIndex
+ * @param {string[]} registers
+ */
+self.setRegisters = function(opIndex, registers) {
+    self.postMessage({
+        action: "setRegisters",
+        data: {
+            opIndex: opIndex,
+            registers: registers
+        }
+    });
+};
diff --git a/src/core/FlowControl.js b/src/core/FlowControl.js
index aba64ab1..6cc2b5d4 100755
--- a/src/core/FlowControl.js
+++ b/src/core/FlowControl.js
@@ -113,6 +113,12 @@ const FlowControl = {
             input = state.dish.get(Dish.STRING),
             registers = input.match(extractor);
 
+        if (!registers) return state;
+
+        if (ENVIRONMENT_IS_WORKER()) {
+            self.setRegisters(state.progress, registers.slice(1));
+        }
+
         /**
          * Replaces references to registers (e.g. $R0) with the contents of those registers.
          *
diff --git a/src/web/RecipeWaiter.js b/src/web/RecipeWaiter.js
index 121b64d2..ac6bdfd9 100755
--- a/src/web/RecipeWaiter.js
+++ b/src/web/RecipeWaiter.js
@@ -1,5 +1,6 @@
 import HTMLOperation from "./HTMLOperation.js";
 import Sortable from "sortablejs";
+import Utils from "../core/Utils.js";
 
 
 /**
@@ -435,4 +436,29 @@ RecipeWaiter.prototype.opRemove = function(e) {
     window.dispatchEvent(this.manager.statechange);
 };
 
+
+/**
+ * Sets register values.
+ *
+ * @param {number} opIndex
+ * @param {string[]} registers
+ */
+RecipeWaiter.prototype.setRegisters = function(opIndex, registers) {
+    const op = document.querySelector(`#rec-list .operation:nth-child(${opIndex + 1})`),
+        prevRegList = op.querySelector(".register-list");
+
+    // Remove previous div
+    if (prevRegList) prevRegList.remove();
+
+    let registerList = [];
+    for (let i = 0; i < registers.length; i++) {
+        registerList.push(`$R${i} = ${Utils.truncate(Utils.printable(registers[i]), 100)}`);
+    }
+    const registerListEl = `<div class="register-list">
+            ${registerList.join("<br>")}
+        </div>`;
+
+    op.insertAdjacentHTML("beforeend", registerListEl);
+};
+
 export default RecipeWaiter;
diff --git a/src/web/WorkerWaiter.js b/src/web/WorkerWaiter.js
index 362ab128..e8c0f1ce 100644
--- a/src/web/WorkerWaiter.js
+++ b/src/web/WorkerWaiter.js
@@ -61,6 +61,9 @@ WorkerWaiter.prototype.handleChefMessage = function(e) {
         case "optionUpdate":
             this.app.options[r.data.option] = r.data.value;
             break;
+        case "setRegisters":
+            this.manager.recipe.setRegisters(r.data.opIndex, r.data.registers);
+            break;
         case "highlightsCalculated":
             this.manager.highlighter.displayHighlights(r.data.pos, r.data.direction);
             break;
diff --git a/src/web/stylesheets/components/_operation.css b/src/web/stylesheets/components/_operation.css
index 93bc0ddf..c3a80a59 100644
--- a/src/web/stylesheets/components/_operation.css
+++ b/src/web/stylesheets/components/_operation.css
@@ -124,6 +124,12 @@ button.dropdown-toggle {
     background-color: var(--secondary-background-colour);
 }
 
+.register-list {
+    background-color: var(--fc-operation-border-colour);
+    font-family: var(--fixed-width-font-family);
+    padding: 10px;
+}
+
 .op-icon {
     float: right;
     margin-left: 10px;