quantified.uncertainty/squiggle
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Adds inputs

Browse Source
This commit is contained in:
Roman Galochkin 2020-02-27 10:00:03 +03:00
parent 95585fb43d
commit 1742a38724
1 changed files with 167 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

206
src/components/DistBuilder.re
View File

@ -6,14 +6,18 @@ module FormConfig = [%lenses
guesstimatorString: string, guesstimatorString: string,
// //
domainType: string, // Complete, LeftLimited(...), RightLimited(...), LeftAndRightLimited(..., ...) domainType: string, // Complete, LeftLimited(...), RightLimited(...), LeftAndRightLimited(..., ...)
xPoint: string, xPoint: float,
xPoint2: string, xPoint2: float,
excludingProbabilityMass: string, excludingProbabilityMass: float,
excludingProbabilityMass2: string, excludingProbabilityMass2: float,
// //
unitType: string, // UnspecifiedDistribution, TimeDistribution(zero, unit) unitType: string, // UnspecifiedDistribution, TimeDistribution(zero, unit)
zero: MomentRe.Moment.t, zero: MomentRe.Moment.t,
unit: string, unit: string,
//
sampleCount: int,
outputXYPoints: int,
truncateTo: int,
} }
]; ];
@ -39,6 +43,48 @@ module FieldString = {
}; };
}; };
module FieldNumber = {
[@react.component]
let make = (~field, ~label) => {
<Form.Field
field
render={({handleChange, error, value, validate}) =>
<Antd.Form.Item label={label |> E.ste}>
<Antd.InputNumber
value
onChange={e => {
e |> handleChange;
();
}}
onBlur={_ => validate()}
/>
</Antd.Form.Item>
}
/>;
};
};
module FieldFloat = {
[@react.component]
let make = (~field, ~label) => {
<Form.Field
field
render={({handleChange, error, value, validate}) =>
<Antd.Form.Item label={label |> E.ste}>
<Antd.InputFloat
value
onChange={e => {
e |> handleChange;
();
}}
onBlur={_ => validate()}
/>
</Antd.Form.Item>
}
/>;
};
};
module Styles = { module Styles = {
open Css; open Css;
let rows = let rows =
@ -51,42 +97,38 @@ module Styles = {
">.ant-col:last-child", ">.ant-col:last-child",
[paddingLeft(em(0.125)), paddingRight(em(0.25))], [paddingLeft(em(0.125)), paddingRight(em(0.25))],
), ),
selector(
">.ant-col:not(:first-child):not(:last-child)",
[paddingLeft(em(0.125)), paddingRight(em(0.125))],
),
]); ]);
let parent =
style([selector(".ant-input-number", [width(`percent(100.))])]);
let form = style([backgroundColor(hex("eee")), padding(em(1.))]); let form = style([backgroundColor(hex("eee")), padding(em(1.))]);
let dist = style([padding(em(1.))]); let dist = style([padding(em(1.))]);
let spacer = style([marginTop(em(1.))]); let spacer = style([marginTop(em(1.))]);
}; };
module FieldFloat = {
[@react.component]
let make = (~field, ~label) => {
<Form.Field
field
render={({handleChange, error, value, validate}) =>
<Antd.Form.Item label={label |> E.ste}>
<Antd.Input
value
onChange={BsReform.Helpers.handleChange(handleChange)}
onBlur={_ => validate()}
/>
</Antd.Form.Item>
}
/>;
};
};
module DemoDist = { module DemoDist = {
[@react.component] [@react.component]
let make = (~guesstimatorString, ~domain, ~unit) => { let make =
(
~guesstimatorString,
~domain,
~unit,
~sampleCount,
~outputXYPoints,
~truncateTo,
) => {
<Antd.Card title={"Distribution" |> E.ste}> <Antd.Card title={"Distribution" |> E.ste}>
<div className=Styles.spacer /> <div className=Styles.spacer />
<div> <div>
<div> <div>
{DistPlusIngredients.make(~guesstimatorString, ~domain, ~unit, ()) {DistPlusIngredients.make(~guesstimatorString, ~domain, ~unit, ())
|> DistPlusIngredients.toDistPlus( |> DistPlusIngredients.toDistPlus(
~sampleCount=10000, ~sampleCount,
~outputXYPoints=2000, ~outputXYPoints,
~truncateTo=Some(1000), ~truncateTo,
) )
|> E.O.React.fmapOrNull(distPlus => <DistPlusPlot distPlus />)} |> E.O.React.fmapOrNull(distPlus => <DistPlusPlot distPlus />)}
</div> </div>
@ -105,13 +147,16 @@ let make = () => {
~initialState={ ~initialState={
guesstimatorString: "mm(5 to 20, floor(normal(20,2)), [.5, .5])", guesstimatorString: "mm(5 to 20, floor(normal(20,2)), [.5, .5])",
domainType: "Complete", domainType: "Complete",
xPoint: "50.0", xPoint: 50.0,
xPoint2: "60.0", xPoint2: 60.0,
excludingProbabilityMass2: "0.5", excludingProbabilityMass2: 0.5,
excludingProbabilityMass: "0.3", excludingProbabilityMass: 0.3,
unitType: "UnspecifiedDistribution", unitType: "UnspecifiedDistribution",
zero: MomentRe.momentNow(), zero: MomentRe.momentNow(),
unit: "days", unit: "days",
sampleCount: 10000,
outputXYPoints: 2000,
truncateTo: 1000,
}, },
(), (),
); );
@ -126,27 +171,25 @@ let make = () => {
| "Complete" => DistTypes.Complete | "Complete" => DistTypes.Complete
| "LeftLimited" => | "LeftLimited" =>
LeftLimited({ LeftLimited({
xPoint: reform.state.values.xPoint |> float_of_string, xPoint: reform.state.values.xPoint,
excludingProbabilityMass: excludingProbabilityMass: reform.state.values.excludingProbabilityMass,
reform.state.values.excludingProbabilityMass |> float_of_string,
}) })
| "RightLimited" => | "RightLimited" =>
RightLimited({ RightLimited({
xPoint: reform.state.values.xPoint |> float_of_string, xPoint: reform.state.values.xPoint,
excludingProbabilityMass: excludingProbabilityMass: reform.state.values.excludingProbabilityMass,
reform.state.values.excludingProbabilityMass |> float_of_string,
}) })
| "LeftAndRightLimited" => | "LeftAndRightLimited" =>
LeftAndRightLimited( LeftAndRightLimited(
{ {
xPoint: reform.state.values.xPoint |> float_of_string, xPoint: reform.state.values.xPoint,
excludingProbabilityMass: excludingProbabilityMass:
reform.state.values.excludingProbabilityMass |> float_of_string, reform.state.values.excludingProbabilityMass,
}, },
{ {
xPoint: reform.state.values.xPoint2 |> float_of_string, xPoint: reform.state.values.xPoint2,
excludingProbabilityMass: excludingProbabilityMass:
reform.state.values.excludingProbabilityMass2 |> float_of_string, reform.state.values.excludingProbabilityMass2,
}, },
) )
| _ => Js.Exn.raiseError("domain is unknown") | _ => Js.Exn.raiseError("domain is unknown")
@ -164,36 +207,55 @@ let make = () => {
}; };
let guesstimatorString = reform.state.values.guesstimatorString; let guesstimatorString = reform.state.values.guesstimatorString;
let sampleCount = reform.state.values.sampleCount;
let outputXYPoints = reform.state.values.outputXYPoints;
let truncateTo = reform.state.values.truncateTo |> E.O.some;
let demoDist = let demoDist =
React.useMemo1( React.useMemo1(
() => {<DemoDist guesstimatorString domain unit />}, () => {
<DemoDist
guesstimatorString
domain
unit
sampleCount
outputXYPoints
truncateTo
/>
},
[| [|
reform.state.values.guesstimatorString, reform.state.values.guesstimatorString,
reform.state.values.domainType, reform.state.values.domainType,
reform.state.values.xPoint, reform.state.values.xPoint |> string_of_float,
reform.state.values.xPoint2, reform.state.values.xPoint2 |> string_of_float,
reform.state.values.xPoint2, reform.state.values.xPoint2 |> string_of_float,
reform.state.values.excludingProbabilityMass, reform.state.values.excludingProbabilityMass |> string_of_float,
reform.state.values.excludingProbabilityMass2, reform.state.values.excludingProbabilityMass2 |> string_of_float,
reform.state.values.unitType, reform.state.values.unitType,
reform.state.values.zero |> E.M.format(E.M.format_standard), reform.state.values.zero |> E.M.format(E.M.format_standard),
reform.state.values.unit, reform.state.values.unit,
reform.state.values.sampleCount |> string_of_int,
reform.state.values.outputXYPoints |> string_of_int,
reform.state.values.truncateTo |> string_of_int,
|], |],
); );
<div> <div className=Styles.parent>
<div className=Styles.spacer /> <div className=Styles.spacer />
demoDist demoDist
<div className=Styles.spacer /> <div className=Styles.spacer />
<Antd.Card title={"Distribution Form" |> E.ste}> <Antd.Card title={"Distribution Form" |> E.ste}>
<Form.Provider value=reform> <Form.Provider value=reform>
<Antd.Form onSubmit> <Antd.Form onSubmit>
<Row _type=`flex className=Styles.rows>
<Col span=8>
<FieldString <FieldString
field=FormConfig.GuesstimatorString field=FormConfig.GuesstimatorString
label="Guesstimator String" label="Guesstimator String"
/> />
<Row _type=`flex> </Col>
</Row>
<Row _type=`flex className=Styles.rows>
<Col span=4> <Col span=4>
<Form.Field <Form.Field
field=FormConfig.DomainType field=FormConfig.DomainType
@ -217,34 +279,26 @@ let make = () => {
} }
/> />
</Col> </Col>
<Col span=10> <Col span=4>
<Row _type=`flex className=Styles.rows> <FieldFloat field=FormConfig.XPoint label="X-point" />
<Col span=12>
<FieldString field=FormConfig.XPoint label="X-point" />
</Col> </Col>
<Col span=12> <Col span=4>
<FieldString <FieldFloat
field=FormConfig.ExcludingProbabilityMass field=FormConfig.ExcludingProbabilityMass
label="Excluding Probability Mass" label="Excluding Probability Mass"
/> />
</Col> </Col>
</Row> <Col span=4>
<FieldFloat field=FormConfig.XPoint2 label="X-point (2)" />
</Col> </Col>
<Col span=10> <Col span=4>
<Row _type=`flex className=Styles.rows> <FieldFloat
<Col span=12>
<FieldString field=FormConfig.XPoint2 label="X-point (2)" />
</Col>
<Col span=12>
<FieldString
field=FormConfig.ExcludingProbabilityMass2 field=FormConfig.ExcludingProbabilityMass2
label="Excluding Probability Mass (2)" label="Excluding Probability Mass (2)"
/> />
</Col> </Col>
</Row> </Row>
</Col> <Row _type=`flex className=Styles.rows>
</Row>
<Row _type=`flex>
<Col span=4> <Col span=4>
<Form.Field <Form.Field
field=FormConfig.UnitType field=FormConfig.UnitType
@ -262,9 +316,7 @@ let make = () => {
} }
/> />
</Col> </Col>
<Col span=10> <Col span=4>
<Row _type=`flex className=Styles.rows>
<Col span=12>
<Form.Field <Form.Field
field=FormConfig.Zero field=FormConfig.Zero
render={({handleChange, value}) => render={({handleChange, value}) =>
@ -280,18 +332,30 @@ let make = () => {
} }
/> />
</Col> </Col>
<Col span=12> <Col span=4>
<FieldString <FieldFloat
field=FormConfig.ExcludingProbabilityMass field=FormConfig.ExcludingProbabilityMass
label="Excluding Probability Mass" label="Excluding Probability Mass"
/> />
</Col> </Col>
</Row> </Row>
<Row _type=`flex className=Styles.rows>
<Col span=4>
<FieldNumber field=FormConfig.SampleCount label="Sample Count" />
</Col>
<Col span=4>
<FieldNumber
field=FormConfig.OutputXYPoints
label="Output XY-points"
/>
</Col>
<Col span=4>
<FieldNumber field=FormConfig.TruncateTo label="Truncate To" />
</Col> </Col>
<Col span=10 />
</Row> </Row>
</Antd.Form> </Antd.Form>
</Form.Provider> </Form.Provider>
</Antd.Card> </Antd.Card>
<div className=Styles.spacer />
</div>; </div>;
}; };