117 lines
3.7 KiB
TypeScript
117 lines
3.7 KiB
TypeScript
import React, { useCallback, useEffect, useRef } from "react";
|
|
import { createStackNavigator } from "@react-navigation/stack";
|
|
import { useNavigation } from "@react-navigation/native";
|
|
import { useColorScheme } from "react-native";
|
|
import Apps from "./components/Apps";
|
|
import TrainBase from "./components/trainbaseview";
|
|
import HowTo from "./howto";
|
|
import News from "./components/news";
|
|
import TrainMenu from "./components/trainMenu";
|
|
import { FavoriteList } from "./components/FavoriteList";
|
|
import { optionData } from "./lib/stackOption";
|
|
import { useCurrentTrain } from "./stateBox/useCurrentTrain";
|
|
import { useTrainMenu } from "./stateBox/useTrainMenu";
|
|
import { AS } from "./storageControl";
|
|
import { news } from "./config/newsUpdate";
|
|
import { Linking, Platform } from "react-native";
|
|
import GeneralWebView from "./GeneralWebView";
|
|
import { StationDiagramView } from "@/components/StationDiagram/StationDiagramView";
|
|
import { positionsStackNavRef } from "./lib/rootNavigation";
|
|
const Stack = createStackNavigator();
|
|
export const Top = () => {
|
|
const { webview } = useCurrentTrain();
|
|
const { navigate, addListener, isFocused } = useNavigation<any>();
|
|
const isDark = useColorScheme() === "dark";
|
|
const bgColor = isDark ? "#1c1c1e" : "#ffffff";
|
|
|
|
//地図用
|
|
const { mapSwitch } = useTrainMenu();
|
|
const mapSwitchRef = useRef(mapSwitch);
|
|
useEffect(() => {
|
|
mapSwitchRef.current = mapSwitch;
|
|
}, [mapSwitch]);
|
|
|
|
const goToFavoriteList = () =>
|
|
navigate("positions", { screen: "favoriteList" });
|
|
|
|
useEffect(() => {
|
|
const unsubscribe = addListener("tabLongPress", goToFavoriteList);
|
|
return unsubscribe;
|
|
}, []);
|
|
|
|
const stackNavRef = positionsStackNavRef;
|
|
|
|
const goToTrainMenu = useCallback((e: any) => {
|
|
if (Platform.OS === "web") {
|
|
Linking.openURL("https://train.jr-shikoku.co.jp/");
|
|
setTimeout(() => navigate("topMenu", { screen: "menu" }), 100);
|
|
return;
|
|
}
|
|
if (!isFocused()) return;
|
|
const stackNav = stackNavRef.current;
|
|
if (stackNav && stackNav.getState()?.index > 0) {
|
|
e.preventDefault();
|
|
stackNav.goBack();
|
|
return;
|
|
}
|
|
if (mapSwitchRef.current == "true")
|
|
navigate("positions", { screen: "trainMenu" });
|
|
else webview.current?.injectJavaScript(`AccordionClassEvent()`);
|
|
return;
|
|
}, [isFocused, navigate, webview]);
|
|
|
|
useEffect(() => {
|
|
const unsubscribe = addListener("tabPress", goToTrainMenu);
|
|
return unsubscribe;
|
|
}, [addListener, goToTrainMenu]);
|
|
|
|
return (
|
|
<Stack.Navigator
|
|
id={null}
|
|
screenOptions={{ cardStyle: { backgroundColor: bgColor } }}
|
|
screenListeners={({ navigation: stackNav }) => {
|
|
stackNavRef.current = stackNav;
|
|
return {};
|
|
}}
|
|
>
|
|
<Stack.Screen
|
|
name="Apps"
|
|
options={{
|
|
headerShown: false,
|
|
gestureEnabled: true,
|
|
headerTransparent: true,
|
|
detachPreviousScreen: false,
|
|
}}
|
|
component={Apps}
|
|
/>
|
|
<Stack.Screen
|
|
name="trainbase"
|
|
options={{ ...optionData }}
|
|
component={TrainBase}
|
|
/>
|
|
<Stack.Screen
|
|
name="stDiagram"
|
|
options={{ ...optionData, gestureEnabled: false }}
|
|
component={StationDiagramView}
|
|
/>
|
|
<Stack.Screen name="howto" options={optionData} component={HowTo} />
|
|
<Stack.Screen
|
|
name="generalWebView"
|
|
options={optionData}
|
|
component={GeneralWebView}
|
|
/>
|
|
<Stack.Screen name="news" options={optionData} component={News} />
|
|
<Stack.Screen
|
|
name="trainMenu"
|
|
options={optionData}
|
|
component={TrainMenu}
|
|
/>
|
|
<Stack.Screen
|
|
name="favoriteList"
|
|
options={{ ...optionData, gestureEnabled: false }}
|
|
component={FavoriteList}
|
|
/>
|
|
</Stack.Navigator>
|
|
);
|
|
};
|