From a18385befc66e6aff965a721a9e2c25d968327ab Mon Sep 17 00:00:00 2001
From: clp0216 <clp0216@bu.edu>
Date: Tue, 20 Apr 2021 16:23:39 -0400
Subject: [PATCH] added reverseTranscriptor object

---
 index.html                             |   7 +-
 src/app/featureSets/featureSet.js      |   5 +-
 src/app/library/reverseTranscriptor.js | 246 +++++++++++++++++++++++++
 src/app/view/ui/componentToolBar.js    |  13 +-
 src/app/view/viewManager.js            |   1 +
 5 files changed, 269 insertions(+), 3 deletions(-)
 create mode 100644 src/app/library/reverseTranscriptor.js

diff --git a/index.html b/index.html
index 7225f9a5..e1650790 100644
--- a/index.html
+++ b/index.html
@@ -166,7 +166,12 @@
                     <i class="material-icons">settings</i>
                 </button>
             </div>
-
+            <div class="button_row">
+                <a id="reversetranscriptor_button" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--raised feature-button">Reverse Transcriptor</a>
+                <button id="reversetranscriptor_params_button" class="params-button mdl-button mdl-js-button mdl-button--icon">
+                    <i class="material-icons">settings</i>
+                </button>
+            </div>
             <div class="button_row">
                 <a id="curvedmixer_button" class="mdl-button mdl-js-button mdl-js-ripple-effect mdl-button--raised feature-button">Curved Mixer</a>
                 <button id="curvedmixer_params_button" class="params-button mdl-button mdl-js-button mdl-button--icon">
diff --git a/src/app/featureSets/featureSet.js b/src/app/featureSets/featureSet.js
index 7cf6dc23..2e090548 100644
--- a/src/app/featureSets/featureSet.js
+++ b/src/app/featureSets/featureSet.js
@@ -46,6 +46,7 @@ import Node from "../library/node";
 import DropletGeneratorT from "../library/dropletGeneratorT";
 import DropletGeneratorFlowFocus from "../library/dropletGeneratorFlowFocus";
 import LogicArray from "../library/logicArray";
+import ReverseTranscriptor from "../library/reverseTranscriptor";
 
 export default class FeatureSet {
     constructor(definitions, tools, render2D, render3D, setString) {
@@ -123,7 +124,9 @@ export default class FeatureSet {
             DropletGenFlow: { object: new DropletGeneratorFlowFocus(), key: null },
             LogicArray: { object: new LogicArray(), key: "FLOW" },
             LogicArray_control: { object: new LogicArray(), key: "CONTROL" },
-            LogicArray_cell: { object: new LogicArray(), key: "CELL" }
+            LogicArray_cell: { object: new LogicArray(), key: "CELL" },
+            ReverseTranscriptor : { object: new ReverseTranscriptor(), key: "FLOW"}
+
         };
 
         // this.__checkDefinitions();
diff --git a/src/app/library/reverseTranscriptor.js b/src/app/library/reverseTranscriptor.js
new file mode 100644
index 00000000..db63803a
--- /dev/null
+++ b/src/app/library/reverseTranscriptor.js
@@ -0,0 +1,246 @@
+import Template from "./template";
+import paper from "paper";
+import ComponentPort from "../core/componentPort";
+
+export default class ReverseTranscriptor extends Template {
+    constructor() {
+        super();
+    }
+
+    __setupDefinitions() {
+        this.__unique = {
+            position: "Point"
+        };
+
+        this.__heritable = {
+            componentSpacing: "Float",
+            curvermixerRotation: "Float",
+            heaterRotation: "Float",
+            bendSpacing: "Float",
+            numberOfBends: "Float",
+            channelWidth: "Float",
+            bendLength: "Float",
+            curvedmixerHeight: "Float",
+            heaterHeight: "Float",
+            heaterWidth: "Float",
+            heaterLength: "Float",
+            temperature: "Float"
+        };
+
+        this.__defaults = {
+            componentSpacing: 95,
+            curvedmixerRotation: 90,
+            heaterRotation: 0,
+            bendSpacing: 140,
+            numberOfBends: 5,
+            channelWidth: 500,
+            bendLength: 6500,
+            curvedmixerHeight: 250,
+            heaterHeight: 5000,
+            heaterWidth: 20000,
+            heaterLength: 40000,
+            temperature: 52
+
+        };
+
+        this.__units = {
+            componentSpacing: "&mu;m",
+            curvedmixerRotation: "&deg;",
+            heaterRotation: "&deg;",
+            bendSpacing: "&mu;m",
+            numberOfBends: "",
+            channelWidth: "&mu;m",
+            bendLength: "&mu;m",
+            curvedmixerHeight: "&mu;m",
+            heaterHeight: "&mu;m",
+            heaterWidth: "&mu;m",
+            heaterLength: "&mu;m",
+            temperature: "°C"
+        };
+
+        this.__minimum = {
+            componentSpacing: 0,
+            curvedmixerRotation: 0,
+            heaterRotation: 0,
+            bendSpacing: 10,
+            numberOfBends: 1,
+            channelWidth: 10,
+            bendLength: 10,
+            curvedmixerHeight: 10,
+            heaterHeight: 10,
+            heaterWidth: 10,
+            heaterLength: 10,
+            temperature: 0
+        };
+
+        this.__maximum = {
+            componentSpacing: 10000,
+            curvedmixerRotation: 360,
+            heaterRotation: 360,
+            bendSpacing: 6000,
+            numberOfBends: 20,
+            channelWidth: 2000,
+            bendLength: 12 * 1000,
+            curvedmixerHeight: 1200,
+            heaterHeight: 10 * 1000,
+            heaterWidth: 60 * 1000,
+            heaterLength: 60 * 1000,
+            temperature: 100
+        };
+
+        this.__featureParams = {
+            componentSpacing: "componentSpacing",
+            curvedmixerRotation: "curvedmixerRotation",
+            heaterRotation: "heaterRotation",
+            position: "position",
+            bendSpacing: "bendSpacing",
+            numberOfBends: "numberOfBends",
+            channelWidth: "channelWidth",
+            bendLength: "bendLength",
+            heaterWidth: "heaterWidth",
+            heaterLength: "heaterLength",
+            temperature: "temperature"
+
+        };
+
+        this.__targetParams = {
+            componentSpacing: "componentSpacing",
+            curvedmixerRotation: "curvedmixerRotation",
+            heaterRotation: "heaterRotation",
+            channelWidth: "channelWidth",
+            bendSpacing: "bendSpacing",
+            numberOfBends: "numberOfBends",
+            bendLength: "bendLength",
+            heaterWidth: "heaterWidth",
+            heaterLength: "heaterLength",
+            temperature: "temperature"
+        };
+
+        this.__placementTool = "componentPositionTool";
+
+        this.__toolParams = {
+            position: "position"
+        };
+
+        this.__renderKeys = ["FLOW"];
+
+        this.__mint = "REVERSE TRANSCRIPTOR";
+    }
+
+    getPorts(params) {
+        let channelWidth = params["channelWidth"];
+        let bendLength = params["bendLength"];
+        let bendSpacing = params["bendSpacing"];
+        let numberOfBends = params["numberOfBends"];
+        let heaterWidth = params["heaterWidth"];
+        let heaterLength = params["heaterLength"];
+
+
+        let ports = [];
+
+        ports.push(new ComponentPort(-heaterWidth / 2, -heaterLength / 6, "1", "FLOW"));
+        ports.push(new ComponentPort(bendLength / 2 + channelWidth, (2 * numberOfBends + 1) * channelWidth + 2 * numberOfBends * bendSpacing, "2", "FLOW"));
+
+        return ports;
+    }
+
+    render2D(params, key) {
+        let channelWidth = params["channelWidth"];
+        let bendLength = params["bendLength"];
+        let bendSpacing = params["bendSpacing"];
+        let cmRotation = params["curvedmixerRotation"];
+        let hRotation = params["heaterRotation"];
+        let numBends = params["numberOfBends"];
+        let w = params["heaterWidth"];
+        let l = params["heaterLength"];
+        let x = params["position"][0];
+        let y = params["position"][1];
+        let color = params["color"];
+        let 
+        let segHalf = bendLength / 2 + channelWidth;
+        let segLength = bendLength + 2 * channelWidth;
+        let segBend = bendSpacing + 2 * channelWidth;
+        let vRepeat = 2 * bendSpacing + 2 * channelWidth;
+        let vOffset = bendSpacing + channelWidth;
+        let hOffset = bendLength / 2 + channelWidth / 2;
+        let serp = new paper.CompoundPath();
+        let startX = x - w / 2;
+        let startY = y - l / 2;
+        let endX = x + w / 2;
+        let endY = y + l / 2;
+        let startPoint = new paper.Point(startX, startY);
+        let endPoint = new paper.Point(endX, endY);
+
+        let heater_rect = paper.Path.Rectangle({
+            from: startPoint,
+            to: endPoint,
+            radius: 0,
+            fillColor: color,
+            strokeWidth: 0
+        });
+
+        let x = -w / 2;
+        let y = l / 6;
+        //draw first segment
+        let toprect = new paper.Path.Rectangle(x + channelWidth - 1, y, bendLength / 2 + channelWidth / 2 + 1, channelWidth);
+        toprect.closed = true;
+        toprect = toprect.unite(heater_rect);
+        for (let i = 0; i < numBends; i++) {
+            //draw left curved segment
+            let leftCurve = new paper.Path.Arc({
+                from: [x + channelWidth, y + vRepeat * i],
+                through: [x + channelWidth - (channelWidth + bendSpacing / 2), y + vRepeat * i + bendSpacing / 2 + channelWidth],
+                to: [x + channelWidth, y + vRepeat * i + bendSpacing + 2 * channelWidth]
+            });
+            leftCurve.closed = true;
+            let leftCurveSmall = new paper.Path.Arc({
+                from: [x + channelWidth, y + vRepeat * i + bendSpacing + channelWidth],
+                through: [x + channelWidth - bendSpacing / 2, y + vRepeat * i + bendSpacing / 2 + channelWidth],
+                to: [x + channelWidth, y + vRepeat * i + channelWidth]
+            });
+            leftCurveSmall.closed = true;
+            leftCurve = leftCurve.subtract(leftCurveSmall);
+            toprect = toprect.unite(leftCurve);
+            // serp.addChild(leftCurve);
+            //draw horizontal segment
+            let hseg = new paper.Path.Rectangle(x + channelWidth - 1, y + vOffset + vRepeat * i, bendLength + 2, channelWidth);
+            toprect = toprect.unite(hseg);
+            //draw right curved segment
+            let rightCurve = new paper.Path.Arc({
+                from: [x + channelWidth + bendLength, y + vOffset + vRepeat * i],
+                through: [x + channelWidth + bendLength + (channelWidth + bendSpacing / 2), y + vOffset + vRepeat * i + bendSpacing / 2 + channelWidth],
+                to: [x + channelWidth + bendLength, y + vOffset + vRepeat * i + bendSpacing + 2 * channelWidth]
+            });
+            rightCurve.closed = true;
+            let rightCurveSmall = new paper.Path.Arc({
+                from: [x + channelWidth + bendLength, y + vOffset + vRepeat * i + bendSpacing + channelWidth],
+                through: [x + channelWidth + bendLength + bendSpacing / 2, y + vOffset + vRepeat * i + bendSpacing / 2 + channelWidth],
+                to: [x + channelWidth + bendLength, y + vOffset + vRepeat * i + channelWidth]
+            });
+            rightCurveSmall.closed = true;
+            rightCurve = rightCurve.subtract(rightCurveSmall);
+            toprect = toprect.unite(rightCurve);
+
+            if (i == numBends - 1) {
+                //draw half segment to close
+                hseg = new paper.Path.Rectangle(x + channelWidth / 2 + bendLength / 2, y + vRepeat * (i + 1), (bendLength + channelWidth) / 2 + 1, channelWidth);
+                toprect = toprect.unite(hseg);
+            } else {
+                //draw full segment
+                hseg = new paper.Path.Rectangle(x + channelWidth - 1, y + vRepeat * (i + 1), bendLength + 2, channelWidth);
+                toprect = toprect.unite(hseg);
+            }
+            toprect = toprect.unite(hseg);
+        }
+        serp.addChild(toprect);
+
+        serp.fillColor = color;
+        return serp.rotate(rotation, x, y);;
+    }
+
+    render2DTarget(key, params) {
+        let render = this.render2D(params, key);
+        render.fillColor.alpha = 0.5;
+        return render;
+    }
+}
\ No newline at end of file
diff --git a/src/app/view/ui/componentToolBar.js b/src/app/view/ui/componentToolBar.js
index 38148cfc..f2a36372 100644
--- a/src/app/view/ui/componentToolBar.js
+++ b/src/app/view/ui/componentToolBar.js
@@ -64,6 +64,7 @@ export default class ComponentToolBar {
         this.__dropletgenTButton = document.getElementById("dropletgenT_button");
         this.__dropletgenFlowButton = document.getElementById("dropletgenFlow_button");
         this.__logicarrayButton = document.getElementById("logicarray_button");
+        this.__reversetranscriptorButton = document.getElementById("reversetranscriptor_button");
 
         //Create all the parameter menu buttons
 
@@ -115,6 +116,7 @@ export default class ComponentToolBar {
         this.__dropletgenTParams = document.getElementById("dropletgenT_params_button");
         this.__dropletgenFlowParams = document.getElementById("dropletgenFlow_params_button");
         this.__logicarrayParams = document.getElementById("logicarray_params_button");
+        this.__reversetranscriptorParams = document.getElementById("reversetranscriptor_params_button");
 
         this.buttons = {
             SelectButton: this.__selectToolButton,
@@ -164,7 +166,8 @@ export default class ComponentToolBar {
             CapacitanceSensor: this.__capacitancesensorButton,
             DropletGenT: this.__dropletgenTButton,
             DropletGenFlow: this.__dropletgenFlowButton,
-            LogicArray: this.__logicarrayButton
+            LogicArray: this.__logicarrayButton,
+            ReverseTranscriptor: this.__reversetranscriptorButton,
         };
             
 
@@ -177,6 +180,13 @@ export default class ComponentToolBar {
     __setupEventHandlers() {
         let ref = this;
 
+        this.__reversetranscriptorButton.onclick = function() {
+            Registry.viewManager.activateTool("ReverseTranscriptor");
+
+5           ref.setActiveButton("ReverseTranscriptor");
+6           ref.__viewManagerDelegate.switchTo2D();
+        };
+
         this.__channelButton.onclick = function() {
             Registry.viewManager.activateTool("Channel");
 
@@ -541,6 +551,7 @@ export default class ComponentToolBar {
         this.__dropletgenTParams.onclick = ComponentToolBar.getParamsWindowCallbackFunction("DropletGenT", "Basic");
         this.__dropletgenFlowParams.onclick = ComponentToolBar.getParamsWindowCallbackFunction("DropletGenFlow", "Basic");
         this.__logicarrayParams.onclick = ComponentToolBar.getParamsWindowCallbackFunction("LogicArray", "Basic");
+        this.__reversetranscriptorParams.onclick = ComponentToolBar.getParamsWindowCallbackFunction("ReverseTranscriptor", "Basic");
     }
 
     static getParamsWindowCallbackFunction(typeString, setString, isTranslucent = false) {
diff --git a/src/app/view/viewManager.js b/src/app/view/viewManager.js
index 4abf926a..03ec50d5 100644
--- a/src/app/view/viewManager.js
+++ b/src/app/view/viewManager.js
@@ -1233,6 +1233,7 @@ export default class ViewManager {
         this.tools["DropletGenT"] = new ComponentPositionTool("DropletGenT", "Basic");
         this.tools["DropletGenFlow"] = new ComponentPositionTool("DropletGenFlow", "Basic");
         this.tools["LogicArray"] = new ControlCellPositionTool("LogicArray", "Basic");
+        this.tools["ReverseTransciptor"] = new ComponentPositionTool("ReverseTranscriptor", "Basic");
     }
 
     /**