Better display results at the end
This commit is contained in:
parent
3f5a9fbe04
commit
9c0f1e80a6
28
lib/displayAsMarkdown.js
Normal file
28
lib/displayAsMarkdown.js
Normal file
|
@ -0,0 +1,28 @@
|
|||
import React from "react";
|
||||
import ReactMarkdown from "react-markdown";
|
||||
import gfm from "remark-gfm";
|
||||
|
||||
if (!String.prototype.replaceAll) {
|
||||
String.prototype.replaceAll = function(str, newStr){
|
||||
|
||||
// If a regex pattern
|
||||
if (Object.prototype.toString.call(str).toLowerCase() === '[object regexp]') {
|
||||
return this.replace(str, newStr);
|
||||
}
|
||||
|
||||
// If a string
|
||||
return this.replace(new RegExp(str, 'g'), newStr);
|
||||
|
||||
};
|
||||
}
|
||||
|
||||
export function DisplayAsMarkdown({markdowntext}){
|
||||
console.log(markdowntext)
|
||||
markdowntext = markdowntext.replaceAll("\n", "\n\n")
|
||||
return( <ReactMarkdown
|
||||
plugins={[gfm]}
|
||||
children={markdowntext}
|
||||
allowDangerousHtml
|
||||
className="ml-30"
|
||||
/>)
|
||||
}
|
|
@ -5,8 +5,10 @@ export function DisplayElement({element}){
|
|||
<div>
|
||||
<a href={element.url} target="_blank">
|
||||
<h1>{`${element.name}`}</h1>
|
||||
<p>{`Karma: ${1}`}</p>
|
||||
</a>
|
||||
<p>{`Author: ${element.author}`}</p>
|
||||
<p>{`Karma: ${element.karma}`}</p>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
|
@ -9,7 +9,7 @@ function drawGraphInner(list, quantitativeComparisons){
|
|||
|
||||
// Build the graph object
|
||||
let nodes = list.map((x,i) => ({id: i, name: x}))
|
||||
let links = quantitativeComparisons.map(([element1, element2, weight]) => ({source: list.indexOf(element1), target: list.indexOf(element2), weight: weight}))
|
||||
let links = quantitativeComparisons.map(([element1, element2, distance]) => ({source: list.indexOf(element1), target: list.indexOf(element2), distance: distance}))
|
||||
console.log("Links")
|
||||
console.log(links)
|
||||
|
||||
|
@ -113,7 +113,7 @@ function drawGraphInner(list, quantitativeComparisons){
|
|||
// X position of start node on the X axis
|
||||
let end = x(nodesById[d.target].name)
|
||||
// X position of end node
|
||||
return start + (end-start)/2 -4*getlength(d.weight)
|
||||
return start + (end-start)/2 -4*getlength(d.distance)
|
||||
})
|
||||
.attr("y", function(d){
|
||||
let start = x(nodesById[d.source].name)
|
||||
|
@ -122,7 +122,7 @@ function drawGraphInner(list, quantitativeComparisons){
|
|||
// X position of end node
|
||||
return height-32-(Math.abs(start-end)/2)//height-30
|
||||
})
|
||||
.text(function(d){ return(`${d.weight}`)})
|
||||
.text(function(d){ return(`${d.distance}`)})
|
||||
.style("text-anchor", "top")
|
||||
|
||||
|
||||
|
|
1269
package-lock.json
generated
1269
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
|
@ -14,7 +14,9 @@
|
|||
"path": "^0.12.7",
|
||||
"react": "^17.0.1",
|
||||
"react-compound-slider": "^3.3.1",
|
||||
"react-dom": "^17.0.1"
|
||||
"react-dom": "^17.0.1",
|
||||
"react-markdown": "^6.0.2",
|
||||
"remark-gfm": "^1.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^10.0.4",
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
import 'tailwindcss/tailwind.css'
|
||||
// import 'tailwindcss/tailwind.css'
|
||||
import "../styles/tailwind.css";
|
||||
import "../styles/globals.css";
|
||||
|
||||
function MyApp({ Component, pageProps }) {
|
||||
return <Component {...pageProps} />
|
||||
|
|
|
@ -5,6 +5,8 @@ import path from 'path';
|
|||
import {DrawGraph} from '../lib/labeledgraph';
|
||||
import { SliderElement } from "../lib/slider.js";
|
||||
import {DisplayElement} from '../lib/displayElement'
|
||||
import {DisplayAsMarkdown} from '../lib/displayAsMarkdown'
|
||||
|
||||
// Utilities
|
||||
|
||||
let increasingList = (n) => Array.from(Array(n).keys())
|
||||
|
@ -40,6 +42,8 @@ let displayFunctionSlider = (value) => {
|
|||
|
||||
};
|
||||
|
||||
let nicelyFormatLinks = (quantitativeComparisons , list) => quantitativeComparisons.map(([element1, element2, distance]) => ({source: list.indexOf(element1), target: list.indexOf(element2), distance: distance}))
|
||||
|
||||
// data
|
||||
export async function getStaticProps() {
|
||||
//getServerSideProps
|
||||
|
@ -164,9 +168,9 @@ export default function Home({listOfPosts}) {
|
|||
|
||||
// Html
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center min-h-screen py-2">
|
||||
<div className="flex flex-col items-center justify-center min-h-screen py-2 mt-10">
|
||||
<Head>
|
||||
<title>Welcome to Hot Or Not</title>
|
||||
<title>Utility Function Extractor</title>
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
</Head>
|
||||
|
||||
|
@ -178,7 +182,7 @@ export default function Home({listOfPosts}) {
|
|||
<div className = {`${isListOrdered ? "hidden" : ""}`}>
|
||||
<div className="flex flex-wrap items-center max-w-4xl mt-6 sm:w-full mt-20">
|
||||
<div
|
||||
className="flex m-auto border-gray-300 border-4 h-64 w-64"
|
||||
className="flex m-auto border-gray-300 border-4 h-72 w-72"
|
||||
//onClick={() => nextStep(binaryComparisons, toComparePair[0], toComparePair[1])}
|
||||
>
|
||||
<p className="block m-auto text-center">
|
||||
|
@ -187,7 +191,7 @@ export default function Home({listOfPosts}) {
|
|||
</p>
|
||||
</div>
|
||||
<div
|
||||
className="flex m-auto border-gray-300 border-4 h-64 w-64"
|
||||
className="flex m-auto border-gray-300 border-4 h-72 w-72 p-5"
|
||||
//onClick={() => nextStep(binaryComparisons, toComparePair[1], toComparePair[0])}
|
||||
>
|
||||
<p className="block m-auto text-center">
|
||||
|
@ -217,13 +221,19 @@ export default function Home({listOfPosts}) {
|
|||
quantitativeComparisons={quantitativeComparisons}>
|
||||
</DrawGraph>
|
||||
|
||||
<div className={`mt-10 ${isListOrdered? "": "hidden" }`}>
|
||||
<p>{`Ordered list: ${JSON.stringify(orderedList, null, 4)}`}</p>
|
||||
<p>{`Binary comparisons: ${JSON.stringify(binaryComparisons, null, 4)}`}</p>
|
||||
|
||||
</main>
|
||||
|
||||
<div className={`inline text-left w-full flex-1 px-20 ${isListOrdered? "": "hidden" }`}>
|
||||
<DisplayAsMarkdown markdowntext={"## Ordered list\n\n" + JSON.stringify(orderedList.map(i => listOfPosts[i]), null, 4)}></DisplayAsMarkdown>
|
||||
<DisplayAsMarkdown markdowntext={"## Distances\n\n" + JSON.stringify(nicelyFormatLinks(quantitativeComparisons, list), null, 4)}></DisplayAsMarkdown>
|
||||
{/*
|
||||
<p>{`Binary comparisons: ${JSON.stringify(binaryComparisons, null, 4)}`}</p>
|
||||
<p>{`Quantitative comparisons: ${JSON.stringify(quantitativeComparisons, null, 4)}`}</p>
|
||||
|
||||
*/}
|
||||
|
||||
</div>
|
||||
</main>
|
||||
|
||||
</div>
|
||||
)
|
||||
|
|
|
@ -2,51 +2,71 @@
|
|||
{
|
||||
"id": "0",
|
||||
"name": "Relative Impact of the First 10 EA Forum Prize Winners",
|
||||
"url": "https://forum.effectivealtruism.org/posts/pqphZhx2nJocGCpwc/relative-impact-of-the-first-10-ea-forum-prize-winners"
|
||||
"url": "https://forum.effectivealtruism.org/posts/pqphZhx2nJocGCpwc/relative-impact-of-the-first-10-ea-forum-prize-winners",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 80
|
||||
},
|
||||
{
|
||||
"id": "1",
|
||||
"name": "Introducing Metaforecast: A Forecast Aggregator and Search Tool",
|
||||
"url": "https://forum.effectivealtruism.org/posts/tEo5oXeSNcB3sYr8m/introducing-metaforecast-a-forecast-aggregator-and-search"
|
||||
"url": "https://forum.effectivealtruism.org/posts/tEo5oXeSNcB3sYr8m/introducing-metaforecast-a-forecast-aggregator-and-search",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 115
|
||||
},
|
||||
{
|
||||
"id": "2",
|
||||
"name": "Forecasting Prize Results",
|
||||
"url": "https://forum.effectivealtruism.org/posts/8QFWHzmur4roAcnCf/forecasting-prize-results"
|
||||
"url": "https://forum.effectivealtruism.org/posts/8QFWHzmur4roAcnCf/forecasting-prize-results",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 44
|
||||
},
|
||||
{
|
||||
"id": "3",
|
||||
"name": "A Funnel for Cause Candidates",
|
||||
"url": "https://forum.effectivealtruism.org/posts/iRA4Dd2bfX9nukSo3/a-funnel-for-cause-candidates"
|
||||
"url": "https://forum.effectivealtruism.org/posts/iRA4Dd2bfX9nukSo3/a-funnel-for-cause-candidates",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 34
|
||||
},
|
||||
{
|
||||
"id": "4",
|
||||
"name": "2020: Forecasting in Review",
|
||||
"url": "https://forum.effectivealtruism.org/posts/8shCj2eoQygQvtoZP/2020-forecasting-in-review"
|
||||
"url": "https://forum.effectivealtruism.org/posts/8shCj2eoQygQvtoZP/2020-forecasting-in-review",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 35
|
||||
},
|
||||
{
|
||||
"id": "5",
|
||||
"name": "Big List of Cause Candidates",
|
||||
"url": "https://forum.effectivealtruism.org/posts/SCqRu6shoa8ySvRAa/big-list-of-cause-candidates"
|
||||
"url": "https://forum.effectivealtruism.org/posts/SCqRu6shoa8ySvRAa/big-list-of-cause-candidates",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 182
|
||||
},
|
||||
{
|
||||
"id": "6",
|
||||
"name": "An experiment to evaluate the value of one researcher's work",
|
||||
"url": "https://forum.effectivealtruism.org/posts/udGBF8YWshCKwRKTp/an-experiment-to-evaluate-the-value-of-one-researcher-s-work"
|
||||
"url": "https://forum.effectivealtruism.org/posts/udGBF8YWshCKwRKTp/an-experiment-to-evaluate-the-value-of-one-researcher-s-work",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 55
|
||||
},
|
||||
{
|
||||
"id": "7",
|
||||
"name": "Predicting the Value of Small Altruistic Projects: A Proof of Concept Experiment",
|
||||
"url": "https://forum.effectivealtruism.org/posts/qb56nicbnj9asSemx/predicting-the-value-of-small-altruistic-projects-a-proof-of"
|
||||
"url": "https://forum.effectivealtruism.org/posts/qb56nicbnj9asSemx/predicting-the-value-of-small-altruistic-projects-a-proof-of",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 51
|
||||
},
|
||||
{
|
||||
"id": "8",
|
||||
"name": "Incentive Problems With Current Forecasting Competitions",
|
||||
"url": "https://forum.effectivealtruism.org/posts/ztmBA8v6KvGChxw92/incentive-problems-with-current-forecasting-competitions"
|
||||
"url": "https://forum.effectivealtruism.org/posts/ztmBA8v6KvGChxw92/incentive-problems-with-current-forecasting-competitions",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 54
|
||||
},
|
||||
{
|
||||
"id": "9",
|
||||
"name": "Shapley Values: Better Than Counterfactuals",
|
||||
"url": "https://forum.effectivealtruism.org/posts/XHZJ9i7QBtAJZ6byW/shapley-values-better-than-counterfactuals"
|
||||
"url": "https://forum.effectivealtruism.org/posts/XHZJ9i7QBtAJZ6byW/shapley-values-better-than-counterfactuals",
|
||||
"author": "Nuño Sempere",
|
||||
"karma": 92
|
||||
}
|
||||
]
|
||||
|
|
48
styles/globals.css
Normal file
48
styles/globals.css
Normal file
|
@ -0,0 +1,48 @@
|
|||
html,
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
background-color: #ECECF1;
|
||||
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
|
||||
Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-weight: bold;
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
a {
|
||||
color: blue;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
p, ul {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: square;
|
||||
margin-left: 20px;
|
||||
}
|
3
styles/tailwind.css
Normal file
3
styles/tailwind.css
Normal file
|
@ -0,0 +1,3 @@
|
|||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
Loading…
Reference in New Issue
Block a user