Skip to content

Commit

Permalink
Simplify layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@skosch
skosch committed May 14, 2018
1 parent 51089dc commit 077228e
Show file tree
Hide file tree
Showing 14 changed files with 350 additions and 231 deletions.
114 changes: 60 additions & 54 deletions src/App.bs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
var List = require("bs-platform/lib/js/list.js");
var Block = require("bs-platform/lib/js/block.js");
var Curry = require("bs-platform/lib/js/curry.js");
var Graph = require("./graph/Graph.bs.js");
var React = require("react");
var Result = require("./result/Result.bs.js");
var RunMatch = require("./matching/RunMatch.bs.js");
Expand Down Expand Up @@ -51,63 +50,67 @@ function make() {
];
})));
var match = List.length(self[/* state */1][/* matchResult */9]) > 0;
return React.createElement("div", {
className: "page-split"
}, React.createElement("div", {
className: "input-pane"
return React.createElement("div", undefined, React.createElement("div", {
className: "page-content"
}, React.createElement("div", {
className: "names-question"
}, React.createElement("input", {
type: "text",
value: self[/* state */1][/* selectingName */0],
onChange: (function (_event) {
return Curry._1(self[/* send */3], /* UpdateSelectingName */Block.__(0, [_event.target.value]));
})
}), React.createElement("span", undefined, " are ranking "), React.createElement("input", {
type: "text",
value: self[/* state */1][/* selectedName */1],
onChange: (function (_event) {
return Curry._1(self[/* send */3], /* UpdateSelectedName */Block.__(1, [_event.target.value]));
})
}), React.createElement("span", undefined), React.createElement("div", {
className: "mdc-switch"
className: "input-pane"
}, React.createElement("div", {
className: "names-question"
}, React.createElement("input", {
className: "mdc-switch__native-control",
id: "mutual-switch",
role: "switch",
checked: self[/* state */1][/* mutualMatch */2],
type: "checkbox",
type: "text",
value: self[/* state */1][/* selectingName */0],
onChange: (function (_event) {
return Curry._1(self[/* send */3], /* UpdateMutualMatch */Block.__(2, [_event.target.checked]));
return Curry._1(self[/* send */3], /* UpdateSelectingName */Block.__(0, [_event.target.value]));
})
}), React.createElement("div", {
className: "mdc-switch__background"
}, React.createElement("div", {
className: "mdc-switch__knob"
}))), React.createElement("label", {
htmlFor: "mutual-switch"
}, "and vice versa")), ReasonReact.element(/* None */0, /* None */0, SideDataImporter.make(state[/* selectingRawData */5], state[/* selectingName */0], state[/* selectedName */1], state[/* selectingRowFormat */3], (function (rowFormat) {
return Curry._1(self[/* send */3], /* UpdateSelectingRowFormat */Block.__(3, [rowFormat]));
}), (function (rawData) {
return Curry._1(self[/* send */3], /* UpdateSelectingRawData */Block.__(5, [rawData]));
}), true, /* array */[])), ReasonReact.element(/* None */0, /* None */0, SideDataImporter.make(state[/* selectedRawData */6], state[/* selectedName */1], state[/* selectingName */0], state[/* selectedRowFormat */4], (function (rowFormat) {
return Curry._1(self[/* send */3], /* UpdateSelectedRowFormat */Block.__(4, [rowFormat]));
}), (function (rawData) {
return Curry._1(self[/* send */3], /* UpdateSelectedRawData */Block.__(6, [rawData]));
}), state[/* mutualMatch */2], /* array */[])), React.createElement("div", {
className: "bottom-buttons"
}, React.createElement("button", {
className: "mdc-button",
onClick: Curry._1(self[/* handle */0], loadSampleData)
}, "Load Sample Data"), React.createElement("button", {
className: "mdc-button mdc-button--raised",
disabled: List.length(self[/* state */1][/* selectingParsedData */7]) === 0 || List.length(self[/* state */1][/* selectedParsedData */8]) === 0,
onClick: (function () {
return Curry._1(self[/* send */3], /* MatchNow */0);
})
}, "Match now"))), React.createElement("div", {
className: "graph-pane"
}, ReasonReact.element(/* None */0, /* None */0, Graph.make(state[/* selectingParsedData */7], state[/* selectedParsedData */8], resultData, /* array */[])), match ? ReasonReact.element(/* None */0, /* None */0, Result.make(state, resultData, /* array */[])) : null));
}), React.createElement("span", undefined, " are ranking "), React.createElement("input", {
type: "text",
value: self[/* state */1][/* selectedName */1],
onChange: (function (_event) {
return Curry._1(self[/* send */3], /* UpdateSelectedName */Block.__(1, [_event.target.value]));
})
}), React.createElement("span", undefined), React.createElement("div", {
className: "mdc-switch"
}, React.createElement("input", {
className: "mdc-switch__native-control",
id: "mutual-switch",
role: "switch",
checked: self[/* state */1][/* mutualMatch */2],
type: "checkbox",
onChange: (function (_event) {
return Curry._1(self[/* send */3], /* UpdateMutualMatch */Block.__(2, [_event.target.checked]));
})
}), React.createElement("div", {
className: "mdc-switch__background"
}, React.createElement("div", {
className: "mdc-switch__knob"
}))), React.createElement("label", {
htmlFor: "mutual-switch"
}, "and vice versa")), React.createElement("div", {
className: "data-importers"
}, ReasonReact.element(/* None */0, /* None */0, SideDataImporter.make(state[/* selectingRawData */5], state[/* selectingName */0], state[/* selectedName */1], state[/* selectingRowFormat */3], (function (rowFormat) {
return Curry._1(self[/* send */3], /* UpdateSelectingRowFormat */Block.__(3, [rowFormat]));
}), (function (rawData) {
return Curry._1(self[/* send */3], /* UpdateSelectingRawData */Block.__(5, [rawData]));
}), true, /* array */[])), ReasonReact.element(/* None */0, /* None */0, SideDataImporter.make(state[/* selectedRawData */6], state[/* selectedName */1], state[/* selectingName */0], state[/* selectedRowFormat */4], (function (rowFormat) {
return Curry._1(self[/* send */3], /* UpdateSelectedRowFormat */Block.__(4, [rowFormat]));
}), (function (rawData) {
return Curry._1(self[/* send */3], /* UpdateSelectedRawData */Block.__(6, [rawData]));
}), state[/* mutualMatch */2], /* array */[]))), React.createElement("div", {
className: "bottom-buttons"
}, React.createElement("button", {
className: "mdc-button",
onClick: Curry._1(self[/* handle */0], loadSampleData)
}, "Load Sample Data"), React.createElement("button", {
className: "mdc-button mdc-button--raised",
disabled: List.length(self[/* state */1][/* selectingParsedData */7]) === 0 || List.length(self[/* state */1][/* selectedParsedData */8]) === 0,
onClick: (function () {
return Curry._1(self[/* send */3], /* MatchNow */0);
})
}, "Match now")))), React.createElement("div", {
className: "page-content"
}, React.createElement("div", {
className: "graph-pane"
}, match ? ReasonReact.element(/* None */0, /* None */0, Result.make(state, resultData, /* array */[])) : null)));
}),
/* initialState */(function () {
return /* record */[
Expand Down Expand Up @@ -247,6 +250,8 @@ function make() {
];
}

var ifEmptyString = DataParser.ifEmptyString;

var parseData = DataParser.parseData;

var positions = SampleData.positions;
Expand All @@ -263,6 +268,7 @@ var minCostMaxFlow = RunMatch.minCostMaxFlow;

var runMatch = RunMatch.runMatch;

exports.ifEmptyString = ifEmptyString;
exports.parseData = parseData;
exports.positions = positions;
exports.candidates = candidates;
Expand Down
15 changes: 8 additions & 7 deletions src/App.re
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
/*include SharedTypes;*/
include DataParser;

include Graph;

include SampleData;

Expand Down Expand Up @@ -127,7 +126,8 @@ let make = _children => {
self.state.matchResult
|. Belt.List.map(((p1, p2)) => [|p1, p2|])
|> Belt.List.toArray;
<div className="page-split">
<div>
<div className="page-content">
<div className="input-pane">
<div className="names-question">
<input
Expand Down Expand Up @@ -186,6 +186,7 @@ let make = _children => {
(ReasonReact.string("and vice versa"))
</label>
</div>
<div className="data-importers">
<SideDataImporter
selectingName=state.selectingName
selectedName=state.selectedName
Expand All @@ -212,6 +213,7 @@ let make = _children => {
rawData => self.send(UpdateSelectedRawData(rawData))
)
/>
</div>
<div className="bottom-buttons">
<button
onClick=(self.handle(loadSampleData)) className="mdc-button">
Expand All @@ -228,17 +230,16 @@ let make = _children => {
</button>
</div>
</div>

</div>
<div className="page-content">
<div className="graph-pane">
<Graph
selectingParsedData=state.selectingParsedData
selectedParsedData=state.selectedParsedData
resultData
/>
(
List.length(self.state.matchResult) > 0 ?
<Result currentState=state resultData /> : ReasonReact.null
)
</div>
</div>
</div>;
},
};
Expand Down
18 changes: 11 additions & 7 deletions src/dataImporter/AutosizeHotTable.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
// ES2015
import React from 'react';
import HotTable from 'react-handsontable';
import sizer from 'react-sizer';
import React from "react";
import HotTable from "react-handsontable";
import sizer from "react-sizer";

interface IAutosizeHotTableProps {
height: number;
Expand All @@ -10,11 +10,15 @@ interface IAutosizeHotTableProps {

class AutosizeHotTable extends React.Component<IAutosizeHotTableProps> {
render() {
const height = Math.min(500, window.innerHeight * 0.4);
return (
<HotTable settings={{
...this.props.settings,
height: this.props.height,
}} />
<div className="table-wrapper">
<HotTable
settings={{
...this.props.settings,
height
}}/>
</div>
);
}
}
Expand Down
23 changes: 16 additions & 7 deletions src/dataImporter/DataParser.bs.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,21 @@ var Belt_Array = require("bs-platform/lib/js/belt_Array.js");
var Caml_format = require("bs-platform/lib/js/caml_format.js");
var Belt_HashMapString = require("bs-platform/lib/js/belt_HashMapString.js");

function ifEmptyString(str, alt) {
if (str === "") {
return alt;
} else {
return str;
}
}

function parseData(rawData, rowFormat) {
var sideDataEntries = rowFormat ? Belt_List.fromArray(Belt_HashMapString.valuesToArray(Belt_Array.reduce(rawData, Belt_HashMapString.make(rawData.length), (function (nameMap, cols) {
if (cols.length >= 2) {
var name = Js_option.getWithDefault("", Belt_Array.get(cols, 0));
var canMatchWith = Js_option.getWithDefault("1", Belt_Array.get(cols, 1));
var name = Js_option.getWithDefault("", Belt_Array.get(cols, 0));
if (name !== "" && cols.length >= 2) {
var canMatchWith = ifEmptyString(Js_option.getWithDefault("1", Belt_Array.get(cols, 1)), "1");
var selectedName = Js_option.getWithDefault("", Belt_Array.get(cols, 2));
var rank = Js_option.getWithDefault("1", Belt_Array.get(cols, 3));
var rank = ifEmptyString(Js_option.getWithDefault("1", Belt_Array.get(cols, 3)), "1");
var match = Belt_HashMapString.get(nameMap, name);
var previouslyFoundSelectedNames = match ? match[0][/* selectedNames */2] : /* [] */0;
var entry_000 = /* name */$$String.trim(name);
Expand All @@ -36,9 +44,9 @@ function parseData(rawData, rowFormat) {
return nameMap;
}
})))) : Belt_List.reverse(Belt_Array.reduce(rawData, /* [] */0, (function (allRows, cols) {
if (cols.length >= 2) {
var name = Js_option.getWithDefault("", Belt_Array.get(cols, 0));
var canMatchWith = Js_option.getWithDefault("1", Belt_Array.get(cols, 1));
var name = Js_option.getWithDefault("", Belt_Array.get(cols, 0));
if (name !== "" && cols.length >= 2) {
var canMatchWith = ifEmptyString(Js_option.getWithDefault("1", Belt_Array.get(cols, 1)), "1");
var selectedNames = Belt_Array.slice(cols, 2, cols.length);
var __x = Belt_List.mapWithIndex(Belt_List.fromArray(selectedNames), (function (i, sn) {
return /* tuple */[
Expand Down Expand Up @@ -90,5 +98,6 @@ function parseData(rawData, rowFormat) {
];
}

exports.ifEmptyString = ifEmptyString;
exports.parseData = parseData;
/* No side effect */
Loading

0 comments on commit 077228e

Please sign in to comment.