feat: Allow for squiggle/guesstimate type inputs

This commit is contained in:
NunoSempere 2022-01-31 16:59:14 -05:00
parent 87722e5ae1
commit 404c720b35
6 changed files with 52 additions and 13 deletions

BIN
lib/.submitButton.js.swp Normal file

Binary file not shown.

Binary file not shown.

View File

@ -2,7 +2,7 @@
import Head from "next/head"; import Head from "next/head";
import React, { useState } from "react"; import React, { useState } from "react";
import { DrawGraph, removeOldSvg } from "./labeledGraph"; import { DrawGraph, removeOldSvg } from "./labeledGraph";
import { InputBox } from "./inputBox"; import { SubmitButton } from "./submitButton";
import { DisplayElement } from "./displayElement"; import { DisplayElement } from "./displayElement";
import { DisplayAsMarkdown } from "./displayAsMarkdown"; import { DisplayAsMarkdown } from "./displayAsMarkdown";
import { CreateTable, buildRows } from "./findPaths"; import { CreateTable, buildRows } from "./findPaths";
@ -48,12 +48,15 @@ let checkIfListIsOrdered = (arr, binaryComparisons) => {
}; };
let nicelyFormatLinks = (quantitativeComparisons, listOfElements) => let nicelyFormatLinks = (quantitativeComparisons, listOfElements) =>
quantitativeComparisons.map(([element1, element2, distance, reasoning]) => ({ quantitativeComparisons.map(
source: listOfElements[element1].name, ([element1, element2, distance, reasoning, squiggleString]) => ({
target: listOfElements[element2].name, source: listOfElements[element1].name,
distance: distance, target: listOfElements[element2].name,
reasoning: reasoning, distance: distance,
})); reasoning: reasoning,
squiggleString: squiggleString,
})
);
// Main react component // Main react component
export default function ComparisonView({ listOfElementsForView }) { export default function ComparisonView({ listOfElementsForView }) {
@ -303,6 +306,7 @@ export default function ComparisonView({ listOfElementsForView }) {
reasoning, reasoning,
element1, element1,
element2, element2,
squiggleString,
}) => { }) => {
if (!dontPushSubmitButtonAnyMore) { if (!dontPushSubmitButtonAnyMore) {
if (inputValue < 1 && inputValue > 0) { if (inputValue < 1 && inputValue > 0) {
@ -323,6 +327,7 @@ export default function ComparisonView({ listOfElementsForView }) {
element2, element2,
inputValue, inputValue,
reasoning, reasoning,
squiggleString || inputValue,
]; ];
let newQuantitativeComparisons = [ let newQuantitativeComparisons = [
...quantitativeComparisons, ...quantitativeComparisons,
@ -396,7 +401,7 @@ export default function ComparisonView({ listOfElementsForView }) {
</div> </div>
</div> </div>
{/* Comparison actuator (text, previously input) */} {/* Comparison actuator (text, previously number) */}
<div className="flex m-auto w-72"> <div className="flex m-auto w-72">
<div className="block m-auto text-center"> <div className="block m-auto text-center">
<br /> <br />
@ -404,7 +409,7 @@ export default function ComparisonView({ listOfElementsForView }) {
{`... is `} {`... is `}
<br /> <br />
<input <input
type="number" type="text"
className="text-center text-blueGray-600 bg-white rounded text-lg border-0 shadow outline-none focus:outline-none focus:ring w-8/12 h-10 m-2" className="text-center text-blueGray-600 bg-white rounded text-lg border-0 shadow outline-none focus:outline-none focus:ring w-8/12 h-10 m-2"
value={inputValue} value={inputValue}
onChange={(event) => { onChange={(event) => {
@ -418,7 +423,7 @@ export default function ComparisonView({ listOfElementsForView }) {
</label> </label>
<br /> <br />
<InputBox <SubmitButton
posList={posList} posList={posList}
binaryComparisons={binaryComparisons} binaryComparisons={binaryComparisons}
inputValue={inputValue} inputValue={inputValue}

0
lib/node Normal file
View File

23
lib/squiggleWrapper.js Normal file
View File

@ -0,0 +1,23 @@
import axios from "axios";
export async function squiggleWrapper(input) {
let response = await axios.post("https://server.loki.red/squiggle", {
model: `mean(${input})`,
});
if (response.status == 200) {
try {
console.log(response.data);
if (!!response.data && !!response.data.value) {
// console.log(response.data.value);
let result = response.data.value.hd.VAL;
console.log(result);
return result;
}
} catch (error) {
console.log(error);
return null;
}
}
return null;
}
// squiggle("1 to 4");

View File

@ -1,7 +1,8 @@
/* Imports */ /* Imports */
import React, { useState } from "react"; import React, { useState } from "react";
import { squiggleWrapper } from "./squiggleWrapper";
export function InputBox({ export function SubmitButton({
posList, posList,
binaryComparisons, binaryComparisons,
inputValue, inputValue,
@ -11,13 +12,14 @@ export function InputBox({
dontPushSubmitButtonAnyMore, dontPushSubmitButtonAnyMore,
}) { }) {
// This element didn't necessarily have to exist, but it made it easier for debugging purposes // This element didn't necessarily have to exist, but it made it easier for debugging purposes
let onClick = (event) => { let onClick = async (event) => {
if (!dontPushSubmitButtonAnyMore) { if (!dontPushSubmitButtonAnyMore) {
//event.preventDefault(); //event.preventDefault();
let obj = { let obj = {
posList, posList,
binaryComparisons, binaryComparisons,
inputValue, inputValue,
squiggleString: inputValue,
reasoning, reasoning,
element1: toComparePair[1], element1: toComparePair[1],
element2: toComparePair[0], element2: toComparePair[0],
@ -30,7 +32,16 @@ export function InputBox({
} else if (!!Number(inputValue) && inputValue < 0) { } else if (!!Number(inputValue) && inputValue < 0) {
alert("Negative numbers not yet allowed"); alert("Negative numbers not yet allowed");
} else { } else {
alert("Your input is not a number"); let potentialSquiggleOutput = await squiggleWrapper(inputValue);
if (!!Number(potentialSquiggleOutput)) {
nextStepInput({
...obj,
inputValue: potentialSquiggleOutput,
squiggleString: inputValue,
});
} else {
alert("Your input is not a number");
}
} }
} }
}; };