feat: Working implementation of a comparisons changer

lib/comparisonView.js

@@ -9,7 +9,7 @@ import { CreateTable, buildRows } from './findPaths'
 import { DataSetChanger } from "./datasetChanger"
 import { ComparisonsChanger } from "./comparisonsChanger"
 import { pushToMongo } from "./pushToMongo.js"
-import { increasingList, maxMergeSortSteps, expectedNumMergeSortSteps } from "./utils.js"
+import { increasingList, maxMergeSortSteps, expectedNumMergeSortSteps, sleep } from "./utils.js"
 
 /* DEFINTIONS */
 const DEFAULT_COMPARE = () => 1 // 1/Math.random() - 1
@@ -83,7 +83,7 @@ export default function ComparisonView({ listOfElementsForView }) {
   let [tableRows, setTableRows] = useState(initialTableRows)
 
   /* Convenience utils: restart + changeDataSet */
-  let restart = (posList) => {//({posList, initialBinaryComparisons2, initialQuantitativeComparisons2}) => {
+  let restart = (posList, initialBinaryComparisons2, initialQuantitativeComparisons2) => {//({posList, initialBinaryComparisons2, initialQuantitativeComparisons2}) => {
     setToComparePair([posList[posList.length - 2], posList[posList.length - 1]])
     setSliderValue(initialSliderValue)
     setBinaryComparisons(initialBinaryComparisons2 || initialBinaryComparisons)
@@ -113,25 +113,31 @@ export default function ComparisonView({ listOfElementsForView }) {
     // restart({posList: newPosList})
   }
 
-  let changeComparisons = (links, listOfElements) => {
+  let changeComparisons = async (links) => {
     let quantitativeComparisons2 = []
     let binaryComparisons2 = []
-    for(let link of links){
+    links.shift()
-      let {source, target, distance, reasoning} = link
+    for (let link of links) {
+      let { source, target, distance, reasoning } = link
       let searchByName = (name, candidate) => candidate.name == name
       let testForSource = (candidate) => searchByName(source, candidate)
       let testForTarget = (candidate) => searchByName(target, candidate)
       let element1 = listOfElements.findIndex(testForSource)
       let element2 = listOfElements.findIndex(testForTarget)
-      if(element1 == -1 || element2 == -1){
+      if (element1 == -1 || element2 == -1) {
+        console.log("link", link)
+        console.log(source)
+        console.log(target)
         throw new Error("Comparisons include unknown elements, please retry")
       }
       quantitativeComparisons2.push([element1, element2, distance, reasoning])
-      binaryComparisons2.push([element1,element2])
+      binaryComparisons2.push([element1, element2])
     }
     // return ({quantitativeComparisons: quantitativeComparisons2, binaryComparisons: binaryComparisons2})
     //restart({posList, initialBinaryComparisons2=initialBinaryComparisons, initialQuantitativeComparisons2=initialQuantitativeComparisons})
-    restart(posList)
+    // restart(posList, binaryComparisons2, quantitativeComparisons2)
+    setQuantitativeComparisons(quantitativeComparisons2)
+    setBinaryComparisons(binaryComparisons2)
   }
 
   // Manipulations
@@ -423,7 +429,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)}>
-              Load comparisons
+              Show/edit comparisons
             </button>
           </div>
           {/* Button: Change dataset */}
@@ -442,17 +448,26 @@ export default function ComparisonView({ listOfElementsForView }) {
 
         {/* Show comparisons section */}
         <div className={showComparisons ? "inline mt-5" : "hidden"}>
-          <h2>Comparisons</h2>
           <div className="text-left">
             <DisplayAsMarkdown
-              markdowntext={JSON.stringify(nicelyFormatLinks(quantitativeComparisons, listOfElements), null, 4)}
+              markdowntext={`
+## Comparisons
+### Binary comparisons
+${JSON.stringify(binaryComparisons, null, 4)}
+
+### Numerical comparisons
+${JSON.stringify(nicelyFormatLinks(quantitativeComparisons, listOfElements), null, 4)}
+              `}
+
               className={""}>
             </DisplayAsMarkdown>
           </div>
         </div>
         {/* Load comparisons section */}
         <div className={showLoadComparisons ? "inline mt-5" : "hidden"}>
-          <ComparisonsChanger handleSubmit={changeComparisons} />
+          <ComparisonsChanger
+            handleSubmit={changeComparisons}
+          />
           {/*<ComparisonsChanger handleSubmit={changeComparisons} />*/}
         </div>
       </main>

lib/comparisonsChanger.js

@@ -1,8 +1,9 @@
 import React, { useState } from 'react';
 
 export function ComparisonsChanger({handleSubmit}){
-  let [value, setValue] = useState(`[
+  // let defaultText=JSON.stringify(nicelyFormatLinks(quantitativeComparisons, listOfElements), null, 4)
-    Blah, blah`)
+
+  let [value, setValue] = useState(``)
   const [displayingDoneMessage, setDisplayingDoneMessage] = useState(false)
   const [displayingDoneMessageTimer, setDisplayingDoneMessageTimer] = useState(null)
 
@@ -22,9 +23,11 @@ export function ComparisonsChanger({handleSubmit}){
       //console.log(typeof(newData))
       //console.log(newData)
       handleSubmit(newData)
+      /*
       if(!newData.length || newData.length < 2){
         throw Error("Not enough objects")
       }
+      */
       setDisplayingDoneMessage(true)
       let timer = setTimeout(() => setDisplayingDoneMessage(false), 3000);
       setDisplayingDoneMessageTimer(timer)
@@ -76,7 +79,7 @@ Your old input was: ${value}`
       <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 p-10"
         onClick={handleSubmitInner}>
-        Change dataset
+        Change comparisons
       </button>
       &nbsp;
       <button

lib/utils.js

@@ -18,6 +18,10 @@ export const truncateValueForDisplay = value => {
 }
 export const _transformSliderValueToPracticalValue = value => truncateValueForDisplay(transformSliderValueToActualValue(value))
 
+export function sleep(ms) {
+    return new Promise(resolve => setTimeout(resolve, ms));
+}
+
 export function numToAlphabeticalString(num) {
     // https://stackoverflow.com/questions/45787459/convert-number-to-alphabet-string-javascript/45787487
     num = num + 1