feat: Working implementation of a comparisons changer

This commit is contained in:
NunoSempere 2022-01-28 13:48:47 -05:00
parent dfa0a38a29
commit c7ae6d6586
3 changed files with 37 additions and 15 deletions

View File

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

View File

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

View File

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