|
@@ -1,7 +1,7 @@
|
1
|
1
|
// @flow
|
2
|
2
|
|
3
|
3
|
import * as React from 'react';
|
4
|
|
-import {Alert, View} from 'react-native';
|
|
4
|
+import {View} from 'react-native';
|
5
|
5
|
import {IconButton, Text, withTheme} from 'react-native-paper';
|
6
|
6
|
import MaterialCommunityIcons from "react-native-vector-icons/MaterialCommunityIcons";
|
7
|
7
|
import GameLogic from "../logic/GameLogic";
|
|
@@ -12,6 +12,8 @@ import i18n from "i18n-js";
|
12
|
12
|
import MaterialHeaderButtons, {Item} from "../../../components/Overrides/CustomHeaderButton";
|
13
|
13
|
import {StackNavigationProp} from "@react-navigation/stack";
|
14
|
14
|
import type {CustomTheme} from "../../../managers/ThemeManager";
|
|
15
|
+import type {OptionsDialogButton} from "../../../components/Dialogs/OptionsDialog";
|
|
16
|
+import OptionsDialog from "../../../components/Dialogs/OptionsDialog";
|
15
|
17
|
|
16
|
18
|
type Props = {
|
17
|
19
|
navigation: StackNavigationProp,
|
|
@@ -24,6 +26,12 @@ type State = {
|
24
|
26
|
gameTime: number,
|
25
|
27
|
gameScore: number,
|
26
|
28
|
gameLevel: number,
|
|
29
|
+
|
|
30
|
+ dialogVisible: boolean,
|
|
31
|
+ dialogTitle: string,
|
|
32
|
+ dialogMessage: string,
|
|
33
|
+ dialogButtons: Array<OptionsDialogButton>,
|
|
34
|
+ onDialogDismiss: () => void,
|
27
|
35
|
}
|
28
|
36
|
|
29
|
37
|
class GameMainScreen extends React.Component<Props, State> {
|
|
@@ -39,6 +47,11 @@ class GameMainScreen extends React.Component<Props, State> {
|
39
|
47
|
gameTime: 0,
|
40
|
48
|
gameScore: 0,
|
41
|
49
|
gameLevel: 0,
|
|
50
|
+ dialogVisible: false,
|
|
51
|
+ dialogTitle: "",
|
|
52
|
+ dialogMessage: "",
|
|
53
|
+ dialogButtons: [],
|
|
54
|
+ onDialogDismiss: () => {},
|
42
|
55
|
};
|
43
|
56
|
this.props.navigation.addListener('blur', this.onScreenBlur);
|
44
|
57
|
this.props.navigation.addListener('focus', this.onScreenFocus);
|
|
@@ -120,43 +133,77 @@ class GameMainScreen extends React.Component<Props, State> {
|
120
|
133
|
this.showPausePopup();
|
121
|
134
|
}
|
122
|
135
|
|
|
136
|
+ onDialogDismiss = () => this.setState({dialogVisible: false});
|
|
137
|
+
|
123
|
138
|
showPausePopup = () => {
|
124
|
|
- Alert.alert(
|
125
|
|
- i18n.t("screens.game.pause"),
|
126
|
|
- i18n.t("screens.game.pauseMessage"),
|
127
|
|
- [
|
128
|
|
- {text: i18n.t("screens.game.restart.text"), onPress: this.showRestartConfirm},
|
129
|
|
- {text: i18n.t("screens.game.resume"), onPress: this.togglePause},
|
|
139
|
+ const onDismiss = () => {
|
|
140
|
+ this.togglePause();
|
|
141
|
+ this.onDialogDismiss();
|
|
142
|
+ };
|
|
143
|
+ this.setState({
|
|
144
|
+ dialogVisible: true,
|
|
145
|
+ dialogTitle: i18n.t("screens.game.pause"),
|
|
146
|
+ dialogMessage: i18n.t("screens.game.pauseMessage"),
|
|
147
|
+ dialogButtons: [
|
|
148
|
+ {
|
|
149
|
+ title: i18n.t("screens.game.restart.text"),
|
|
150
|
+ onPress: this.showRestartConfirm
|
|
151
|
+ },
|
|
152
|
+ {
|
|
153
|
+ title: i18n.t("screens.game.resume"),
|
|
154
|
+ onPress: onDismiss
|
|
155
|
+ }
|
130
|
156
|
],
|
131
|
|
- {cancelable: false},
|
132
|
|
- );
|
|
157
|
+ onDialogDismiss: onDismiss,
|
|
158
|
+ });
|
133
|
159
|
}
|
134
|
160
|
|
135
|
161
|
showRestartConfirm = () => {
|
136
|
|
- Alert.alert(
|
137
|
|
- i18n.t("screens.game.restart.confirm"),
|
138
|
|
- i18n.t("screens.game.restart.confirmMessage"),
|
139
|
|
- [
|
140
|
|
- {text: i18n.t("screens.game.restart.confirmNo"), onPress: this.showPausePopup},
|
141
|
|
- {text: i18n.t("screens.game.restart.confirmYes"), onPress: this.startGame},
|
|
162
|
+ this.setState({
|
|
163
|
+ dialogVisible: true,
|
|
164
|
+ dialogTitle: i18n.t("screens.game.restart.confirm"),
|
|
165
|
+ dialogMessage: i18n.t("screens.game.restart.confirmMessage"),
|
|
166
|
+ dialogButtons: [
|
|
167
|
+ {
|
|
168
|
+ title: i18n.t("screens.game.restart.confirmYes"),
|
|
169
|
+ onPress: () => {
|
|
170
|
+ this.onDialogDismiss();
|
|
171
|
+ this.startGame();
|
|
172
|
+ }
|
|
173
|
+ },
|
|
174
|
+ {
|
|
175
|
+ title: i18n.t("screens.game.restart.confirmNo"),
|
|
176
|
+ onPress: this.showPausePopup
|
|
177
|
+ }
|
142
|
178
|
],
|
143
|
|
- {cancelable: false},
|
144
|
|
- );
|
|
179
|
+ onDialogDismiss: this.showPausePopup,
|
|
180
|
+ });
|
145
|
181
|
}
|
146
|
182
|
|
147
|
183
|
showGameOverConfirm() {
|
148
|
184
|
let message = i18n.t("screens.game.gameOver.score") + this.state.gameScore + '\n';
|
149
|
185
|
message += i18n.t("screens.game.gameOver.level") + this.state.gameLevel + '\n';
|
150
|
186
|
message += i18n.t("screens.game.gameOver.time") + this.getFormattedTime(this.state.gameTime) + '\n';
|
151
|
|
- Alert.alert(
|
152
|
|
- i18n.t("screens.game.gameOver.text"),
|
153
|
|
- message,
|
154
|
|
- [
|
155
|
|
- {text: i18n.t("screens.game.gameOver.exit"), onPress: () => this.props.navigation.goBack()},
|
156
|
|
- {text: i18n.t("screens.game.restart.text"), onPress: this.startGame},
|
|
187
|
+ const onDismiss = () => {
|
|
188
|
+ this.onDialogDismiss();
|
|
189
|
+ this.startGame();
|
|
190
|
+ };
|
|
191
|
+ this.setState({
|
|
192
|
+ dialogVisible: true,
|
|
193
|
+ dialogTitle: i18n.t("screens.game.gameOver.text"),
|
|
194
|
+ dialogMessage: message,
|
|
195
|
+ dialogButtons: [
|
|
196
|
+ {
|
|
197
|
+ title: i18n.t("screens.game.gameOver.exit"),
|
|
198
|
+ onPress: () => this.props.navigation.goBack()
|
|
199
|
+ },
|
|
200
|
+ {
|
|
201
|
+ title: i18n.t("screens.game.resume"),
|
|
202
|
+ onPress: onDismiss
|
|
203
|
+ }
|
157
|
204
|
],
|
158
|
|
- {cancelable: false},
|
159
|
|
- );
|
|
205
|
+ onDialogDismiss: onDismiss,
|
|
206
|
+ });
|
160
|
207
|
}
|
161
|
208
|
|
162
|
209
|
startGame = () => {
|
|
@@ -281,6 +328,13 @@ class GameMainScreen extends React.Component<Props, State> {
|
281
|
328
|
color={colors.tetrisScore}
|
282
|
329
|
/>
|
283
|
330
|
</View>
|
|
331
|
+ <OptionsDialog
|
|
332
|
+ visible={this.state.dialogVisible}
|
|
333
|
+ title={this.state.dialogTitle}
|
|
334
|
+ message={this.state.dialogMessage}
|
|
335
|
+ buttons={this.state.dialogButtons}
|
|
336
|
+ onDismiss={this.state.onDialogDismiss}
|
|
337
|
+ />
|
284
|
338
|
</View>
|
285
|
339
|
);
|
286
|
340
|
}
|