chore: Cleanup coordinate-converter
Signed-off-by: SindreKjelsrud <sindre@kjelsrud.dev>
This commit is contained in:
parent
647e3740dd
commit
5d2245f978
GPG key ID:
D2BBDF3EDE6BA9A6
2 changed files with 114 additions and 112 deletions
|
|
@ -1,18 +1,17 @@
|
|||
import { useRouter } from "expo-router";
|
||||
import { useRouter } from "expo-router"; // Keep this here
|
||||
import { useCallback, useState } from "react";
|
||||
import {
|
||||
ImageBackground,
|
||||
KeyboardAvoidingView,
|
||||
Platform,
|
||||
ScrollView,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
View,
|
||||
ImageBackground,
|
||||
KeyboardAvoidingView,
|
||||
Platform,
|
||||
ScrollView,
|
||||
Text,
|
||||
TextInput,
|
||||
TouchableOpacity,
|
||||
View,
|
||||
} from "react-native";
|
||||
import { SafeAreaView } from "react-native-safe-area-context";
|
||||
import { styles } from "./styles";
|
||||
const router = useRouter();
|
||||
|
||||
// Define your background image URI
|
||||
const converterBgImage = {
|
||||
|
|
@ -20,6 +19,8 @@ const converterBgImage = {
|
|||
};
|
||||
|
||||
export default function CoordinateConverter() {
|
||||
const router = useRouter();
|
||||
|
||||
const [overworldX, setOverworldX] = useState("");
|
||||
const [overworldZ, setOverworldZ] = useState("");
|
||||
const [netherX, setNetherX] = useState("");
|
||||
|
|
@ -100,94 +101,95 @@ export default function CoordinateConverter() {
|
|||
}, []);
|
||||
|
||||
return (
|
||||
<SafeAreaView style={styles.converterSafeArea}>
|
||||
<View style={styles.converterScreenRoot}>
|
||||
<ImageBackground
|
||||
source={converterBgImage}
|
||||
style={styles.converterBackgroundImage}
|
||||
resizeMode="cover"
|
||||
>
|
||||
<View style={styles.converterBackgroundOverlay}>
|
||||
<KeyboardAvoidingView
|
||||
style={styles.converterContainer}
|
||||
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
||||
>
|
||||
<TouchableOpacity
|
||||
onPress={() => router.back()} // Correct!
|
||||
style={styles.backButton}
|
||||
>
|
||||
<Text style={styles.backButtonText}>← Go Back</Text>
|
||||
</TouchableOpacity>
|
||||
<ScrollView contentContainerStyle={styles.converterScrollContent}>
|
||||
<Text style={styles.converterTitle}>Coordinate Converter</Text>
|
||||
|
||||
{/* Overworld Row */}
|
||||
<View style={styles.dimensionContainer}>
|
||||
<Text style={styles.dimensionTitle}>Overworld (X, Z)</Text>
|
||||
<View style={styles.coordinatesRow}>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>X:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="Enter X"
|
||||
placeholderTextColor="#ccc"
|
||||
value={overworldX}
|
||||
onChangeText={handleOverworldXChange}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>Z:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="Enter Z"
|
||||
placeholderTextColor="#ccc"
|
||||
value={overworldZ}
|
||||
onChangeText={handleOverworldZChange}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* Nether Row */}
|
||||
<View style={styles.dimensionContainer}>
|
||||
<Text style={styles.dimensionTitle}>Nether (X, Z)</Text>
|
||||
<View style={styles.coordinatesRow}>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>X:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="Enter X"
|
||||
placeholderTextColor="#ccc"
|
||||
value={netherX}
|
||||
onChangeText={handleNetherXChange}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>Z:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="Enter Z"
|
||||
placeholderTextColor="#ccc"
|
||||
value={netherZ}
|
||||
onChangeText={handleNetherZChange}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<TouchableOpacity
|
||||
style={styles.clearButton}
|
||||
onPress={handleClear}
|
||||
>
|
||||
<Text style={styles.clearButtonText}>Clear All</Text>
|
||||
</TouchableOpacity>
|
||||
</ScrollView>
|
||||
</KeyboardAvoidingView>
|
||||
</View>
|
||||
<View style={styles.converterBackgroundOverlay} />
|
||||
</ImageBackground>
|
||||
</SafeAreaView>
|
||||
|
||||
<SafeAreaView style={styles.converterContentWrapper}>
|
||||
<KeyboardAvoidingView
|
||||
style={styles.converterContainer}
|
||||
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
||||
>
|
||||
<ScrollView contentContainerStyle={styles.converterScrollContent}>
|
||||
{/* Custom Back Button */}
|
||||
<TouchableOpacity
|
||||
onPress={() => router.back()}
|
||||
style={styles.backButton}
|
||||
>
|
||||
<Text style={styles.backButtonText}>← Go Back</Text>
|
||||
</TouchableOpacity>
|
||||
|
||||
<Text style={styles.converterTitle}>Coordinate Converter</Text>
|
||||
|
||||
{/* Overworld Row */}
|
||||
<View style={styles.dimensionContainer}>
|
||||
<Text style={styles.dimensionTitle}>Overworld</Text>
|
||||
<View style={styles.coordinatesRow}>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>X:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="0"
|
||||
placeholderTextColor="#ccc"
|
||||
value={overworldX}
|
||||
onChangeText={handleOverworldXChange}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>Z:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="0"
|
||||
placeholderTextColor="#ccc"
|
||||
value={overworldZ}
|
||||
onChangeText={handleOverworldZChange}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* Nether Row */}
|
||||
<View style={styles.dimensionContainer}>
|
||||
<Text style={styles.dimensionTitle}>Nether</Text>
|
||||
<View style={styles.coordinatesRow}>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>X:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="0"
|
||||
placeholderTextColor="#ccc"
|
||||
value={netherX}
|
||||
onChangeText={handleNetherXChange}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.coordInputGroup}>
|
||||
<Text style={styles.coordInputLabel}>Z:</Text>
|
||||
<TextInput
|
||||
style={styles.coordTextInput}
|
||||
keyboardType="numeric"
|
||||
placeholder="0"
|
||||
placeholderTextColor="#ccc"
|
||||
value={netherZ}
|
||||
onChangeText={handleNetherZChange}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<TouchableOpacity style={styles.clearButton} onPress={handleClear}>
|
||||
<Text style={styles.clearButtonText}>Clear All</Text>
|
||||
</TouchableOpacity>
|
||||
</ScrollView>
|
||||
</KeyboardAvoidingView>
|
||||
</SafeAreaView>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
|
@ -54,21 +54,22 @@ export const styles = StyleSheet.create({
|
|||
fontFamily: "Minecraft",
|
||||
},
|
||||
|
||||
// --- Coordinate Converter Specific Styles (Adjusted and New) ---
|
||||
converterSafeArea: {
|
||||
// --- Coordinate Converter Specific Styles ---
|
||||
converterScreenRoot: {
|
||||
flex: 1,
|
||||
backgroundColor: "#000",
|
||||
},
|
||||
converterBackgroundImage: {
|
||||
flex: 1,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
...StyleSheet.absoluteFillObject,
|
||||
resizeMode: "cover",
|
||||
},
|
||||
converterBackgroundOverlay: {
|
||||
...StyleSheet.absoluteFillObject,
|
||||
backgroundColor: "rgba(0, 0, 0, 0.6)",
|
||||
},
|
||||
converterContentWrapper: {
|
||||
flex: 1,
|
||||
},
|
||||
converterContainer: {
|
||||
flex: 1,
|
||||
width: "100%",
|
||||
|
|
@ -80,8 +81,9 @@ export const styles = StyleSheet.create({
|
|||
width: "100%",
|
||||
},
|
||||
converterTitle: {
|
||||
fontSize: 28,
|
||||
fontSize: 44,
|
||||
fontWeight: "bold",
|
||||
textAlign: "center",
|
||||
color: "#fff",
|
||||
marginBottom: 30,
|
||||
marginTop: 20,
|
||||
|
|
@ -92,17 +94,13 @@ export const styles = StyleSheet.create({
|
|||
},
|
||||
dimensionContainer: {
|
||||
width: "90%",
|
||||
backgroundColor: "rgba(58, 58, 58, 0.7)",
|
||||
borderRadius: 10,
|
||||
borderColor: "#6a5acd",
|
||||
borderWidth: 2,
|
||||
padding: 15,
|
||||
marginBottom: 20,
|
||||
alignItems: "center",
|
||||
},
|
||||
dimensionTitle: {
|
||||
color: "#fff",
|
||||
fontSize: 20,
|
||||
fontSize: 28,
|
||||
fontWeight: "bold",
|
||||
marginBottom: 15,
|
||||
textShadowColor: "rgba(0, 0, 0, 0.5)",
|
||||
|
|
@ -118,13 +116,15 @@ export const styles = StyleSheet.create({
|
|||
coordInputGroup: {
|
||||
flex: 1,
|
||||
marginHorizontal: 5,
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
},
|
||||
coordInputLabel: {
|
||||
color: "#e0e0e0",
|
||||
fontSize: 16,
|
||||
marginBottom: 5,
|
||||
fontWeight: "500",
|
||||
marginRight: 8,
|
||||
fontWeight: "bold",
|
||||
textShadowColor: "rgba(0, 0, 0, 0.5)",
|
||||
textShadowOffset: { width: 1, height: 1 },
|
||||
textShadowRadius: 2,
|
||||
|
|
@ -133,13 +133,13 @@ export const styles = StyleSheet.create({
|
|||
coordTextInput: {
|
||||
backgroundColor: "rgba(58, 58, 58, 0.8)",
|
||||
color: "#fff",
|
||||
paddingVertical: 10,
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 10,
|
||||
borderRadius: 8,
|
||||
fontSize: 18,
|
||||
borderWidth: 1,
|
||||
borderColor: "#555",
|
||||
width: "100%",
|
||||
flex: 1,
|
||||
textAlign: "center",
|
||||
fontFamily: "Minecraft",
|
||||
},
|
||||
|
|
@ -158,13 +158,13 @@ export const styles = StyleSheet.create({
|
|||
},
|
||||
backButton: {
|
||||
alignSelf: "flex-start",
|
||||
marginTop: 10,
|
||||
marginTop: 0,
|
||||
marginBottom: 20,
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 15,
|
||||
backgroundColor: "rgba(106, 90, 205, 0.7)",
|
||||
borderRadius: 8,
|
||||
marginLeft: 10,
|
||||
marginLeft: 0,
|
||||
},
|
||||
backButtonText: {
|
||||
color: "#fff",
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue