1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
|
import React, { useEffect, useState } from "react"
import { observer } from "mobx-react-lite"
import { ViewStyle } from "react-native"
import { Screen, Text } from "../../components"
// import { useNavigation } from "@react-navigation/native"
// import { useStores } from "../../models"
import { color } from "../../theme"
import { Graph } from "../../components"
import { Tweaks } from "../../components"
import genRandomTree from "../../data/randomdata";
import AsyncStorage from "@react-native-async-storage/async-storage"
const ROOT: ViewStyle = {
backgroundColor: color.palette.black,
flex: 1,
}
export const GraphScreen = observer(function GraphScreen() {
// Pull in one of our MST stores
// const { someStore, anotherStore } = useStores()
// Pull in navigation via hook
// const navigation = useNavigation()
const [charge, setCharge] = useState(-30);
const [collision, setCollision] = useState(false);
const [linkStrength, setLinkStrength] = useState(1);
const [linkIts, setLinkIts] = useState(1);
const [physics, setPhysics] = useState({});
const getData = async () => {
try {
const value = await AsyncStorage.getItem('@physics')
if (value !== null) {
return JSON.parse(value);
} else {
return (
{
charge: -30,
collision: false,
linkStrength: 1,
linkIts: 1,
collapse: false,
threedim: false,
particles: 2,
});
}
} catch (e) {
console.log(e);
}
};
useEffect(() => {
getData()
.then(data => setPhysics(data));
}, []);
const storeData = async (value) => {
try {
const jsonValue = JSON.stringify(value);
await AsyncStorage.setItem('@physics', jsonValue);
console.log("Writing " + jsonValue);
} catch(e) {
console.log(e);
}
}
/* const [physics, setPhysics] = useState(
* {
* charge: -30,
* collision: false,
* linkStrength: 1,
* linkIts: 1,
* collapse: false,
* threedim: false,
* particles: 2,
* }); */
useEffect(() => {
console.log("Physics changed");
storeData(physics);
const test = getData();
console.log(test);
}, [physics]);
const gData = genRandomTree();
return (
<Screen style={ROOT} preset="scroll">
<Text preset="header" text="Graph" />
<Tweaks
physics={physics}
setPhysics={setPhysics}
/>
<Graph
physics={physics}
gData={gData}
/>
</Screen>
);
});
|
