From 9268c132011cdda5ff3a61421b644067bcb9059b Mon Sep 17 00:00:00 2001
From: AndreaGuarracino <andreaguarracino@outlook.com>
Date: Sun, 7 Jun 2020 14:38:48 +0200
Subject: [PATCH] fixed nucleotide size visualization

---
 src/App.js                  | 4 +---
 src/ComponentNucleotides.js | 5 +++--
 src/ControlHeader.js        | 2 +-
 src/ViewportInputsStore.js  | 1 -
 4 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/App.js b/src/App.js
index 029aca2c..43c49836 100644
--- a/src/App.js
+++ b/src/App.js
@@ -810,9 +810,7 @@ class App extends Component {
           x={this.props.store.leftOffset} // removed leftOffset to simplify code. Relative coordinates are always better.
           y={-this.props.store.topOffset} // For some reason, I have to put this, but I'd like to put 0
           width={this.state.actualWidth}
-          height={
-            this.visibleHeightPixels() + this.props.store.nucleotideHeight
-          }
+          height={this.visibleHeightPixels() + this.props.store.pixelsPerColumn}
         >
           <Layer ref={this.layerRef}>
             {this.loadingMessage()}
diff --git a/src/ComponentNucleotides.js b/src/ComponentNucleotides.js
index f8fb9a05..7207b6cd 100644
--- a/src/ComponentNucleotides.js
+++ b/src/ComponentNucleotides.js
@@ -17,11 +17,12 @@ class ComponentNucleotides extends React.Component {
         <Text
           key={"nuc_text" + x}
           x={x_val + x * this.props.store.pixelsPerColumn}
-          y={this.props.store.topOffset - this.props.store.nucleotideHeight}
+          y={this.props.store.topOffset - this.props.store.pixelsPerColumn}
           text={this.props.nucleotides[x]}
           align="center"
-          height={this.props.store.nucleotideHeight}
+          height={this.props.store.pixelsPerColumn}
           width={this.props.store.pixelsPerColumn}
+          fontSize={this.props.store.pixelsPerColumn + 2}
         />
       );
     }
diff --git a/src/ControlHeader.js b/src/ControlHeader.js
index 5c4f7287..d3efd0bf 100644
--- a/src/ControlHeader.js
+++ b/src/ControlHeader.js
@@ -164,7 +164,7 @@ class ControlHeader extends React.Component {
           </button>
         </span>
         <span style={{ marginLeft: "30px" }}>
-          Pangenome Last Bin Position: {this.props.store.last_bin_pangenome}
+          Pangenome Length: {this.props.store.last_bin_pangenome}
         </span>
         <div className={"row"}>
           Jump to path at nucleotide position:
diff --git a/src/ViewportInputsStore.js b/src/ViewportInputsStore.js
index 7300d3f9..fc99432d 100644
--- a/src/ViewportInputsStore.js
+++ b/src/ViewportInputsStore.js
@@ -55,7 +55,6 @@ RootStore = types
 
     pathNucPos: types.optional(PathNucPos, { path: "path", nucPos: 0 }), // OR: types.maybe(PathNucPos)
     pathIndexServerAddress: "http://193.196.29.24:3010/",
-    nucleotideHeight: 10,
 
     loading: true,
     copyNumberColorArray: types.optional(types.array(types.string), [