]> git.localhorst.tv Git - alttp.git/blob - resources/js/components/tracker/ConfigDialog.js
adlib chat
[alttp.git] / resources / js / components / tracker / ConfigDialog.js
1 import PropTypes from 'prop-types';
2 import React from 'react';
3 import { Col, Form, Modal, Row } from 'react-bootstrap';
4 import { useTranslation } from 'react-i18next';
5
6 import LargeCheck from '../common/LargeCheck';
7 import { getConfigValue } from '../../helpers/tracker';
8 import { useTracker } from '../../hooks/tracker';
9
10 const ConfigDialog = ({
11         onHide,
12         show,
13 }) => {
14         const { config, saveConfig } = useTracker();
15         const { t } = useTranslation();
16
17         const handleChange = React.useCallback(({ target: { name, value } }) => {
18                 saveConfig({ [name]: value });
19         }, [saveConfig]);
20
21         return <Modal className="tracker-config-dialog" onHide={onHide} show={show} size="lg">
22                 <Modal.Header closeButton>
23                         <Modal.Title>
24                                 {t('tracker.config.title')}
25                         </Modal.Title>
26                 </Modal.Header>
27                 <Modal.Body>
28                         <Row>
29                                 <Col sm={6}>
30                                         <h3>{t('tracker.config.logic')}</h3>
31                                         <Form.Group
32                                                 className="d-flex justify-content-between my-2"
33                                                 controlId="tracker.worldState"
34                                         >
35                                                 <Form.Label>{t('tracker.config.worldState')}</Form.Label>
36                                                 <Form.Select
37                                                         className="w-auto"
38                                                         name="worldState"
39                                                         onChange={handleChange}
40                                                         value={getConfigValue(config, 'worldState', 'open')}
41                                                 >
42                                                         {['open', 'inverted'].map(n =>
43                                                                 <option key={n} value={n}>
44                                                                         {t(`tracker.config.worldStates.${n}`)}
45                                                                 </option>
46                                                         )}
47                                                 </Form.Select>
48                                         </Form.Group>
49                                         <Form.Group
50                                                 className="d-flex justify-content-between my-2"
51                                                 controlId="tracker.glitches"
52                                         >
53                                                 <Form.Label>{t('tracker.config.glitches')}</Form.Label>
54                                                 <Form.Select
55                                                         className="w-auto"
56                                                         name="glitches"
57                                                         onChange={handleChange}
58                                                         value={getConfigValue(config, 'glitches', 'none')}
59                                                 >
60                                                         {['none', 'owg', 'hmg', 'mg', 'nl'].map(n =>
61                                                                 <option key={n} value={n}>
62                                                                         {t(`tracker.config.glitchRules.${n}`)}
63                                                                 </option>
64                                                         )}
65                                                 </Form.Select>
66                                         </Form.Group>
67                                         <Form.Group
68                                                 className="d-flex justify-content-between my-2"
69                                                 controlId="tracker.bossShuffle"
70                                         >
71                                                 <Form.Label>{t('tracker.config.bossShuffle')}</Form.Label>
72                                                 <Form.Control
73                                                         as={LargeCheck}
74                                                         name="bossShuffle"
75                                                         onChange={handleChange}
76                                                         value={!!config.bossShuffle}
77                                                 />
78                                         </Form.Group>
79                                 </Col>
80                                 <Col sm={6}>
81                                         <h3>{t('tracker.config.goal')}</h3>
82                                         <Form.Group
83                                                 className="d-flex justify-content-between my-2"
84                                                 controlId="tracker.gtCrystals"
85                                         >
86                                                 <Form.Label>{t('tracker.config.gtCrystals')}</Form.Label>
87                                                 <Form.Select
88                                                         className="w-auto"
89                                                         name="gt-crystals"
90                                                         onChange={handleChange}
91                                                         value={getConfigValue(config, 'gt-crystals', 7)}
92                                                 >
93                                                         {['?', 0, 1, 2, 3, 4, 5, 6, 7].map(n =>
94                                                                 <option key={n} value={n}>
95                                                                         {n}
96                                                                 </option>
97                                                         )}
98                                                 </Form.Select>
99                                         </Form.Group>
100                                         <Form.Group
101                                                 className="d-flex justify-content-between my-2"
102                                                 controlId="tracker.ganonCrystals"
103                                         >
104                                                 <Form.Label>{t('tracker.config.ganonCrystals')}</Form.Label>
105                                                 <Form.Select
106                                                         className="w-auto"
107                                                         name="ganon-crystals"
108                                                         onChange={handleChange}
109                                                         value={getConfigValue(config, 'ganon-crystals', 7)}
110                                                 >
111                                                         {['?', 0, 1, 2, 3, 4, 5, 6, 7].map(n =>
112                                                                 <option key={n} value={n}>
113                                                                         {n}
114                                                                 </option>
115                                                         )}
116                                                 </Form.Select>
117                                         </Form.Group>
118                                         <Form.Group
119                                                 className="d-flex justify-content-between my-2"
120                                                 controlId="tracker.goal"
121                                         >
122                                                 <Form.Label>{t('tracker.config.goal')}</Form.Label>
123                                                 <Form.Select
124                                                         className="w-auto"
125                                                         name="goal"
126                                                         onChange={handleChange}
127                                                         value={getConfigValue(config, 'goal', 'ganon')}
128                                                 >
129                                                         {['ganon', 'fast', 'ad', 'ped', 'trinity', 'thunt', 'ghunt'].map(n =>
130                                                                 <option key={n} value={n}>
131                                                                         {t(`tracker.config.goals.${n}`)}
132                                                                 </option>
133                                                         )}
134                                                 </Form.Select>
135                                         </Form.Group>
136                                 </Col>
137                         </Row>
138                         <Row className="mt-3">
139                                 <Col sm={6}>
140                                         <h3>{t('tracker.config.wildItems')}</h3>
141                                         <Form.Group
142                                                 className="d-flex justify-content-between my-2"
143                                                 controlId="tracker.wildMap"
144                                         >
145                                                 <Form.Label>{t('tracker.config.wildMap')}</Form.Label>
146                                                 <Form.Control
147                                                         as={LargeCheck}
148                                                         name="wildMap"
149                                                         onChange={handleChange}
150                                                         value={!!config.wildMap}
151                                                 />
152                                         </Form.Group>
153                                         <Form.Group
154                                                 className="d-flex justify-content-between my-2"
155                                                 controlId="tracker.wildCompass"
156                                         >
157                                                 <Form.Label>{t('tracker.config.wildCompass')}</Form.Label>
158                                                 <Form.Control
159                                                         as={LargeCheck}
160                                                         name="wildCompass"
161                                                         onChange={handleChange}
162                                                         value={!!config.wildCompass}
163                                                 />
164                                         </Form.Group>
165                                         <Form.Group
166                                                 className="d-flex justify-content-between my-2"
167                                                 controlId="tracker.wildSmall"
168                                         >
169                                                 <Form.Label>{t('tracker.config.wildSmall')}</Form.Label>
170                                                 <Form.Control
171                                                         as={LargeCheck}
172                                                         name="wildSmall"
173                                                         onChange={handleChange}
174                                                         value={!!config.wildSmall}
175                                                 />
176                                         </Form.Group>
177                                         <Form.Group
178                                                 className="d-flex justify-content-between my-2"
179                                                 controlId="tracker.wildBig"
180                                         >
181                                                 <Form.Label>{t('tracker.config.wildBig')}</Form.Label>
182                                                 <Form.Control
183                                                         as={LargeCheck}
184                                                         name="wildBig"
185                                                         onChange={handleChange}
186                                                         value={!!config.wildBig}
187                                                 />
188                                         </Form.Group>
189                                 </Col>
190                                 <Col sm={6}>
191                                         <h3>{t('tracker.config.showItems')}</h3>
192                                         <Form.Group
193                                                 className="d-flex justify-content-between my-2"
194                                                 controlId="tracker.showMap"
195                                         >
196                                                 <Form.Label>{t('tracker.config.showMap')}</Form.Label>
197                                                 <Form.Select
198                                                         className="w-auto"
199                                                         name="showMap"
200                                                         onChange={handleChange}
201                                                         value={config.showMap || 'always'}
202                                                 >
203                                                         <option value="never">
204                                                                 {t('tracker.config.showItemOptions.never')}
205                                                         </option>
206                                                         <option value="situational">
207                                                                 {t('tracker.config.showItemOptions.situational')}
208                                                         </option>
209                                                         <option value="always">
210                                                                 {t('tracker.config.showItemOptions.always')}
211                                                         </option>
212                                                 </Form.Select>
213                                         </Form.Group>
214                                         <Form.Group
215                                                 className="d-flex justify-content-between my-2"
216                                                 controlId="tracker.showCompass"
217                                         >
218                                                 <Form.Label>{t('tracker.config.showCompass')}</Form.Label>
219                                                 <Form.Select
220                                                         className="w-auto"
221                                                         name="showCompass"
222                                                         onChange={handleChange}
223                                                         value={config.showCompass || 'always'}
224                                                 >
225                                                         <option value="never">
226                                                                 {t('tracker.config.showItemOptions.never')}
227                                                         </option>
228                                                         <option value="situational">
229                                                                 {t('tracker.config.showItemOptions.situational')}
230                                                         </option>
231                                                         <option value="always">
232                                                                 {t('tracker.config.showItemOptions.always')}
233                                                         </option>
234                                                 </Form.Select>
235                                         </Form.Group>
236                                         <Form.Group
237                                                 className="d-flex justify-content-between my-2"
238                                                 controlId="tracker.showSmall"
239                                         >
240                                                 <Form.Label>{t('tracker.config.showSmall')}</Form.Label>
241                                                 <Form.Select
242                                                         className="w-auto"
243                                                         name="showSmall"
244                                                         onChange={handleChange}
245                                                         value={config.showSmall || 'always'}
246                                                 >
247                                                         <option value="never">
248                                                                 {t('tracker.config.showItemOptions.never')}
249                                                         </option>
250                                                         <option value="situational">
251                                                                 {t('tracker.config.showItemOptions.situational')}
252                                                         </option>
253                                                         <option value="always">
254                                                                 {t('tracker.config.showItemOptions.always')}
255                                                         </option>
256                                                 </Form.Select>
257                                         </Form.Group>
258                                         <Form.Group
259                                                 className="d-flex justify-content-between my-2"
260                                                 controlId="tracker.showBig"
261                                         >
262                                                 <Form.Label>{t('tracker.config.showBig')}</Form.Label>
263                                                 <Form.Select
264                                                         className="w-auto"
265                                                         name="showBig"
266                                                         onChange={handleChange}
267                                                         value={config.showBig || 'always'}
268                                                 >
269                                                         <option value="never">
270                                                                 {t('tracker.config.showItemOptions.never')}
271                                                         </option>
272                                                         <option value="situational">
273                                                                 {t('tracker.config.showItemOptions.situational')}
274                                                         </option>
275                                                         <option value="always">
276                                                                 {t('tracker.config.showItemOptions.always')}
277                                                         </option>
278                                                 </Form.Select>
279                                         </Form.Group>
280                                 </Col>
281                         </Row>
282                         <Row>
283                                 <Col sm={6}>
284                                         <h3>{t('tracker.config.layout')}</h3>
285                                         <Form.Group
286                                                 className="d-flex justify-content-between my-2"
287                                                 controlId="tracker.mapLayout"
288                                         >
289                                                 <Form.Label>{t('tracker.config.mapLayout')}</Form.Label>
290                                                 <Form.Select
291                                                         className="w-auto"
292                                                         name="mapLayout"
293                                                         onChange={handleChange}
294                                                         value={getConfigValue(config, 'mapLayout', 'horizontal')}
295                                                 >
296                                                         {['horizontal', 'vertical'].map(n =>
297                                                                 <option key={n} value={n}>
298                                                                         {t(`tracker.config.mapLayouts.${n}`)}
299                                                                 </option>
300                                                         )}
301                                                 </Form.Select>
302                                         </Form.Group>
303                                         <Form.Group
304                                                 className="d-flex justify-content-between my-2"
305                                                 controlId="tracker.compactKeysanity"
306                                         >
307                                                 <Form.Label>{t('tracker.config.compactKeysanity')}</Form.Label>
308                                                 <Form.Control
309                                                         as={LargeCheck}
310                                                         name="compactKeysanity"
311                                                         onChange={handleChange}
312                                                         value={!!config.compactKeysanity}
313                                                 />
314                                         </Form.Group>
315                                 </Col>
316                                 <Col sm={6}>
317                                         <h3>{t('tracker.config.calculation')}</h3>
318                                         <Form.Group
319                                                 className="d-flex justify-content-between my-2"
320                                                 controlId="tracker.checkCalculation"
321                                         >
322                                                 <Form.Label>{t('tracker.config.checkCalculation')}</Form.Label>
323                                                 <Form.Select
324                                                         className="w-auto"
325                                                         name="checkCalculation"
326                                                         onChange={handleChange}
327                                                         value={getConfigValue(config, 'checkCalculation', 'room-data')}
328                                                 >
329                                                         {['inventory', 'room-data'].map(n =>
330                                                                 <option key={n} value={n}>
331                                                                         {t(`tracker.config.checkCalculations.${n}`)}
332                                                                 </option>
333                                                         )}
334                                                 </Form.Select>
335                                         </Form.Group>
336                                 </Col>
337                         </Row>
338                 </Modal.Body>
339         </Modal>;
340 };
341
342 ConfigDialog.propTypes = {
343         onHide: PropTypes.func,
344         show: PropTypes.bool,
345 };
346
347 export default ConfigDialog;