Skip to content

Commit 687c40c

Browse files
committed
offset attribute, cleanup
1 parent 79ae076 commit 687c40c

File tree

7 files changed

+17
-242
lines changed

7 files changed

+17
-242
lines changed

src/App.css

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,12 +56,22 @@ html {
5656
width: 100%;
5757
}
5858

59+
5960
.main {
61+
display: flex;
62+
flex-direction: row;
63+
position: absolute;
64+
/* transform: translate(-50%, -50%); */
65+
/* top: 30%;
66+
left: 30%;
67+
right: 50%; */
68+
}
69+
70+
.main_centered {
6071
display: flex;
6172
flex-direction: row;
6273
position: absolute;
6374
top: 30%;
6475
left: 30%;
65-
/* transform: translate(-50%, -50%); */
6676
right: 50%;
6777
}

src/components/DragWrapper.tsx

Lines changed: 0 additions & 36 deletions
This file was deleted.

src/components/InferenceInterface.tsx

Lines changed: 2 additions & 64 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
11
import { TreeWrapper } from '../components/TreeWrapper';
2-
// import { calculus as color_calculus } from './logic/calculi/color';
32
import * as color from "../logic/calculi/color";
43
import * as type_conversion from "../logic/calculi/type_conversion";
54
import * as expr_ty from "../logic/calculi/static_semantics_expr";
65
import * as stmt_ty from "../logic/calculi/static_semantics_stmt";
76
import * as hoare from "../logic/calculi/hoare";
87
import { StringDispatchRenderer } from '../logic/syntax/renderer';
9-
import React, { useContext } from 'react';
8+
import React from 'react';
109
import { TransformComponent, TransformWrapper } from 'react-zoom-pan-pinch';
1110
import { Options, default_options } from './Options';
1211

@@ -22,18 +21,7 @@ const goal = "typed(Γ, BinOp(Minus, BinOp(Plus,Indir(x),y), 1), ?type)";
2221

2322
export function InferenceInterface() {
2423

25-
// let initial_scale = 1.0;
26-
2724
const urlParams = new URLSearchParams(window.location.search);
28-
// if (window.location.search) {
29-
// const scale = urlParams.get('scale');
30-
// if (scale) {
31-
// initial_scale = parseFloat(scale);
32-
// }
33-
// }
34-
35-
// parse options
36-
// for (const [key : keyof typeof options, value] of Object.entries(options)) {
3725

3826
let options: Options = {
3927
...default_options
@@ -58,57 +46,13 @@ export function InferenceInterface() {
5846
}
5947
}
6048

61-
// options =
62-
// Object.fromEntries(
63-
// Object.entries(options).map(([key, value]) => {
64-
// const option = urlParams.get(key);
65-
// if (option) {
66-
// let new_value: any;
67-
// if (typeof value === "boolean") {
68-
// new_value = (option === "true") as any;
69-
// } else if (typeof value === "number") {
70-
// new_value = parseFloat(option) as any;
71-
// } else {
72-
// new_value = option as any;
73-
// }
74-
// return [key, new_value];
75-
// } else {
76-
// return [key, value];
77-
// }
78-
// })
79-
// ) as typeof options;
80-
81-
// let key: keyof typeof options;
82-
// for (key in options) {
83-
// const value = options[key];
84-
// const option = urlParams.get(key);
85-
// if (option) {
86-
// const indexer = key as (keyof (typeof options));
87-
// let new_value: any;
88-
// if (typeof value === "boolean") {
89-
// new_value = (option === "true") as any;
90-
// options[indexer] = new_value as (typeof value);
91-
// } else if (typeof value === "number") {
92-
// new_value = parseFloat(option) as any;
93-
// options[indexer] = new_value as (typeof value);
94-
// } else {
95-
// new_value = option as any;
96-
// options[indexer] = new_value as (typeof value);
97-
// }
98-
// // options[indexer] = new_value as (typeof value);
99-
// }
100-
// }
101-
102-
// const context = useContext(AppContext)
10349
const [isMoveable, setIsMoveable] = React.useState<boolean>(false);
10450

10551
const onDrag = () => {
10652
setIsMoveable(true)
107-
//etc
10853
}
10954
const onStop = () => {
11055
setIsMoveable(false)
111-
//etc
11256
}
11357

11458
return (
@@ -119,28 +63,22 @@ export function InferenceInterface() {
11963
minScale={.25}
12064
maxScale={1.5}
12165
limitToBounds={false}
122-
// onPanning={updateXarrow}
123-
// onZoom={updateXarrow}
12466
pinch={{ step: 5 }}
12567
>
12668

12769
<TransformComponent
128-
contentClass='main'
70+
contentClass={"main" + (options.offset === "center" ? "_centered" : "")}
12971
wrapperStyle={{
13072
height: '100vh', width: '100vw'
13173
}}>
132-
{/* <div> */}
13374
<div className='InferenceArea'>
13475
<TreeWrapper
13576
init={goal}
13677
calculus={calculus} renderer={renderer}
13778
onDrag={onDrag} onStop={onStop}
138-
// onClick={onInteracting} onEndClick={onInteractingEnd}
139-
// onClick={onDrag} onEndClick={onStop}
14079
options={options}
14180
/>
14281
</div>
143-
{/* </div> */}
14482

14583
</TransformComponent>
14684
</TransformWrapper >

src/components/Options.tsx

Lines changed: 1 addition & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,10 @@
1-
2-
31
export let default_options = {
42
highlight: true,
53
showSideConditions: true,
64
scale: 1.0,
75
goal: (undefined as undefined | string),
86
tree: (undefined as undefined | string),
7+
offset: ("center" as "0,0" | "center"),
98
}
109

1110
export type Options = typeof default_options;
12-
13-
14-
// if (window.location.search) {
15-
// const urlParams = new URLSearchParams(window.location.search);
16-
// const goal = urlParams.get('goal');
17-
// if (goal) {
18-
// init_tree = goal_tree(valuePremise(parse(goal)));
19-
// }
20-
// const tree = urlParams.get('tree');
21-
// if (tree) {
22-
// init_tree = stringTreeToTree(JSON.parse(tree) as StringTree);
23-
// }
24-
// }
25-
// if (!init_tree) {
26-
// init_tree = typeof props.init === "string" ? goal_tree(valuePremise(parse(props.init))) : props.init;
27-
// }

src/components/TreeComponent.tsx

Lines changed: 0 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -90,14 +90,6 @@ export const TreeComponent = (props: TreeProps) => {
9090
>
9191
<DeleteIcon fontSize="inherit" />
9292
</IconButton>
93-
{/* <button
94-
className="delete_button"
95-
onClick={(e) => {
96-
props.update_assumptions(props.tree)(undefined, []);
97-
}}
98-
>
99-
<FontAwesomeIcon icon={faTrash} />
100-
</button> */}
10193
</span>
10294
)
10395
:
@@ -108,11 +100,6 @@ export const TreeComponent = (props: TreeProps) => {
108100
({ value: rule.name, label: rule.name })
109101
)
110102
}
111-
// onChange={(e) => {
112-
// props.onEndClick?.();
113-
// handleRule(e.value);
114-
// return false;
115-
// }}
116103
className={
117104
hadError ? "error" : ""
118105
}
@@ -128,67 +115,17 @@ export const TreeComponent = (props: TreeProps) => {
128115
: provided,
129116
}}
130117

131-
132-
// inputValue="Select rule"
133-
// value={null}
134-
135118
onChange={(e) => {
136-
// props.onEndClick?.();
137119
if (e?.value) {
138120
handleRule(e.value);
139121
}
140-
// console.log("change");
141-
// return false;
142122
}}
143123

144124
onInputChange={(e) => { }}
145125
onMenuClose={() => { }}
146126
onMenuOpen={() => { }}
147127
/>
148-
// <Select
149-
// // onClick={(e) => {
150-
// // console.log("click");
151-
// // props.onClick?.();
152-
// // }}
153-
// // onAbort={(e) => {
154-
// // console.log("abort");
155-
// // props.onEndClick?.();
156-
// // }}
157-
// // onAbortCapture={(e) => {
158-
// // console.log("abort capture");
159-
// // props.onEndClick?.();
160-
// // }}
161-
// // onAuxClick={(e) => {
162-
// // console.log("aux click");
163-
// // props.onEndClick?.();
164-
// // }}
165-
// // onLostPointerCapture={(e) => {
166-
// // console.log("lost pointer capture");
167-
// // props.onEndClick?.();
168-
// // }}
169-
170-
171-
// onChange={(e) => {
172-
// props.onEndClick?.();
173-
// handleRule(e.target.value);
174-
// return false;
175-
// }}
176-
// className={
177-
// hadError ? "error" : ""
178-
// }
179-
// >
180-
// <option value="">Select rule</option>
181-
// {
182-
// props.calculus.rules.map((rule, index) =>
183-
// <option key={index} value={rule.name}>{rule.name}</option>
184-
// )
185-
// }
186-
// </Select>
187128
)
188-
// <button onClick={() => props.update_assumptions(props.tree)("Rule", ["ABC"])
189-
// }>
190-
// Add hypothesis
191-
// </button>
192129
}
193130
</div >
194131
);

src/components/TreeWrapper.tsx

Lines changed: 0 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import { StringTree, Tree, applyTreeSubst, copyTree, goal_tree, isClosed, string
55
import { useEffect, useState } from "react";
66
import { Renderer } from "../logic/syntax/renderer";
77
import { parse } from "../logic/syntax/parser";
8-
import { Expr } from "../logic/syntax/syntactic_logic";
98
import { Subst } from "../logic/unification/unification";
109
import "./tree.css";
1110
import { Options } from "./Options";
@@ -19,8 +18,6 @@ interface TreeWrapperProps {
1918
renderer: Renderer<string>;
2019
onDrag?: DraggableEventHandler;
2120
onStop?: DraggableEventHandler;
22-
// onClick?: () => void;
23-
// onEndClick?: () => void;
2421
options: Options;
2522
}
2623

@@ -30,21 +27,6 @@ export function TreeWrapper(props: TreeWrapperProps) {
3027

3128
// we use stringTree instead of Tree to safe a bit of space in the URL
3229

33-
// if (window.location.search) {
34-
// const urlParams = new URLSearchParams(window.location.search);
35-
// const goal = urlParams.get('goal');
36-
// if (goal) {
37-
// init_tree = goal_tree(valuePremise(parse(goal)));
38-
// }
39-
// const tree = urlParams.get('tree');
40-
// if (tree) {
41-
// init_tree = stringTreeToTree(JSON.parse(tree) as StringTree);
42-
// }
43-
// }
44-
// if (!init_tree) {
45-
// init_tree = typeof props.init === "string" ? goal_tree(valuePremise(parse(props.init))) : props.init;
46-
// }
47-
4830
if (props.options.tree) {
4931
init_tree = stringTreeToTree(JSON.parse(props.options.tree) as StringTree);
5032
} else if (props.options.goal) {
@@ -62,20 +44,15 @@ export function TreeWrapper(props: TreeWrapperProps) {
6244
_global.exportTree = () => {
6345
const urlParams = new URLSearchParams(window.location.search);
6446
urlParams.set('tree', JSON.stringify(treeToStringTree(tree)));
65-
// window.location.search = urlParams.toString();
66-
// console.log(urlParams.toString());
6747
const url = window.location.origin + window.location.pathname + "?" + urlParams.toString();
6848
console.log(url);
6949
};
70-
// console.log("Use exportTree() to export the current tree.")
7150
});
7251

7352
const update_assumptions = (subtree: Tree) => (rule: string | undefined, assumptions: Premise[]) => {
7453
subtree.assumptions = assumptions.map(a => goal_tree(a));
7554
subtree.rule = rule;
7655
// TODO: find better way to update tree components
77-
// setTree({ ...tree });
78-
// force update
7956
setForceUpdate(!forceUpdate);
8057
};
8158

@@ -85,22 +62,15 @@ export function TreeWrapper(props: TreeWrapperProps) {
8562

8663
// TODO: handle non-local variable overlap => always use fresh variables
8764
const propagateSubst = (subst: Subst) => {
88-
// const treeCopy = copyTree(tree);
8965
setTree(
9066
(tree) => {
9167
const new_tree = applyTreeSubst(tree, subst);
9268
return new_tree;
9369
});
94-
// const new_tree = applyTreeSubst(tree, subst);
95-
// setTree(new_tree);
9670
};
9771

9872
const closed = isClosed(tree);
9973

100-
// useEffect(() => {
101-
// console.log("closed: " + closed);
102-
// }, [closed]);
103-
10474
useEffect(() => {
10575
console.log(props.options);
10676
}, []);
@@ -122,8 +92,6 @@ export function TreeWrapper(props: TreeWrapperProps) {
12292
capture={() => copyTree(tree)}
12393
restore={restore}
12494
options={props.options}
125-
// onClick={props.onClick}
126-
// onEndClick={props.onEndClick}
12795
/>
12896
</div>
12997
</ Draggable>

0 commit comments

Comments
 (0)