From 216f704232875bd2a866c7b9fd2d8e51745e00ee Mon Sep 17 00:00:00 2001
From: NunoSempere <nuno.sempere@protonmail.com>
Date: Fri, 28 Jan 2022 15:09:41 -0500
Subject: [PATCH] feat: comparison changer

---
 lib/comparisonView.js     | 11 +++++++----
 lib/comparisonsChanger.js |  3 ++-
 lib/findPaths.js          |  2 +-
 lib/labeledGraph.js       |  6 ++++++
 4 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/lib/comparisonView.js b/lib/comparisonView.js
index 822f0ff..f523cb0 100644
--- a/lib/comparisonView.js
+++ b/lib/comparisonView.js
@@ -373,17 +373,19 @@ export default function ComparisonView({ listOfElementsForView }) {
         </div>
 
         {/* Results section */}
-        <div>
+        <div className={isListOrdered ? "" : "hidden"}>
           {/* Graph */}
+          <div className="flex items-center text-center ">
           <DrawGraph
             isListOrdered={isListOrdered}
             orderedList={orderedList}
             listOfElements={listOfElements}
             links={buildLinks(quantitativeComparisons)}>
           </DrawGraph>
+          </div>
 
           {/* Comparison table */}
-          <div className={isListOrdered ? "inline items-center text-center mt-10" : "hidden"}>
+          <div className="flex items-center text-center ">
             <CreateTable
               isListOrdered={isListOrdered}
               orderedList={orderedList}
@@ -429,7 +431,7 @@ export default function ComparisonView({ listOfElementsForView }) {
             <button
               className="bg-transparent hover:bg-blue-500 text-blue-700 font-semibold hover:text-white py-2 px-4 border border-blue-500 hover:border-transparent rounded mt-5"
               onClick={() => changeShowLoadComparisons(!showLoadComparisons)}>
-              Show/edit comparisons
+              Load comparisons
             </button>
           </div>
           {/* Button: Change dataset */}
@@ -451,10 +453,11 @@ export default function ComparisonView({ listOfElementsForView }) {
           <div className="text-left">
             <DisplayAsMarkdown
               markdowntext={`
+${""/*
 ## Comparisons
 ### Binary comparisons
 ${JSON.stringify(binaryComparisons, null, 4)}
-
+*/}
 ### Numerical comparisons
 ${JSON.stringify(nicelyFormatLinks(quantitativeComparisons, listOfElements), null, 4)}
               `}
diff --git a/lib/comparisonsChanger.js b/lib/comparisonsChanger.js
index b778ebd..93a5aa4 100644
--- a/lib/comparisonsChanger.js
+++ b/lib/comparisonsChanger.js
@@ -67,7 +67,8 @@ Your old input was: ${value}`
   }
   return (
     <form onSubmit={handleSubmitInner} className="inline">
-      <br/>
+      <p>Load comparisons in the same style as in "Show comparisons".</p>
+      <p>These will override your current comparisons.</p>
       <br/>
       <textarea 
         value={value} 
diff --git a/lib/findPaths.js b/lib/findPaths.js
index 77b348e..058c56a 100644
--- a/lib/findPaths.js
+++ b/lib/findPaths.js
@@ -248,7 +248,7 @@ export function CreateTable({ tableRows }) {
     }
     return (
         <div>
-            <table className="">
+            <table className="w-full">
                 <thead>
                     <tr >
                         <th >Id</th>
diff --git a/lib/labeledGraph.js b/lib/labeledGraph.js
index 011adc5..a0b9aea 100644
--- a/lib/labeledGraph.js
+++ b/lib/labeledGraph.js
@@ -21,6 +21,12 @@ function drawGraphInner({ nodes, links }) {
     // Calculate the dimensions
     let margin = { top: 0, right: 30, bottom: 20, left: 30 };
     let width = 900 - margin.left - margin.right;
+
+   
+    let initialWindowWidth = window.innerWidth
+    let margin = { top: 0, right: 10, bottom: 30, left: 10 };
+    let width = initialWindowWidth*0.7 - margin.left - margin.right;
+    
     var x = d3.scalePoint()
         .range([0, width])
         .domain(nodeids)