harukin/jrshikoku
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

一部stateのコンテキストへの移動、不要な要素の一斉消去、コンポーネントのファイル分離

Browse Source
This commit is contained in:
harukin-OneMix4 2023-12-15 00:32:58 +09:00
parent d6f727710f
commit 9306a9cb25
15 changed files with 418 additions and 434 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

295
App.js
View File

@ -1,45 +1,58 @@
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect } from "react";
import { NavigationContainer } from "@react-navigation/native"; import { NavigationContainer } from "@react-navigation/native";
import { import { createStackNavigator } from "@react-navigation/stack";
createStackNavigator,
TransitionPresets,
} from "@react-navigation/stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs"; import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import { AntDesign, Ionicons } from "@expo/vector-icons"; import { Platform, UIManager } from "react-native";
import { Platform, UIManager, Text } from "react-native";
import { UpdateAsync } from "./UpdateAsync.js"; import { UpdateAsync } from "./UpdateAsync.js";
import { getStationList2 } from "./lib/getStationList2";
import { AS } from "./storageControl"; import { AS } from "./storageControl";
import Apps from "./Apps";
import TNDView from "./ndView"; import TNDView from "./ndView";
import TrainBase from "./trainbaseview";
import HowTo from "./howto";
import Menu from "./menu";
import News from "./components/news.js";
import Setting from "./components/settings.js";
import TrainMenu from "./components/trainMenu.js";
import FavoriteList from "./components/FavoriteList.js";
import { LogBox } from "react-native"; import { LogBox } from "react-native";
import useInterval from "./lib/useInterval"; import useInterval from "./lib/useInterval";
import { HeaderConfig } from "./lib/HeaderConfig"; import { HeaderConfig } from "./lib/HeaderConfig";
import { initIcon } from "./lib/initIcon";
import {
useFavoriteStation,
FavoriteStationProvider,
} from "./stateBox/useFavoriteStation";
import { Top } from "./Top.js";
import { MenuPage } from "./MenuPage.js";
import {
useCurrentTrain,
CurrentTrainProvider,
} from "./stateBox/useCurrentTrain.js";
import { useAreaInfo, AreaInfoProvider } from "./stateBox/useAreaInfo.js";
import {
useBusAndTrainData,
BusAndTrainDataProvider,
} from "./stateBox/useBusAndTrainData.js";
LogBox.ignoreLogs([ LogBox.ignoreLogs([
"ViewPropTypes will be removed", "ViewPropTypes will be removed",
"ColorPropType will be removed", "ColorPropType will be removed",
]); ]);
const Stack = createStackNavigator();
const Tab = createBottomTabNavigator(); const Tab = createBottomTabNavigator();
if (Platform.OS === "android") { if (Platform.OS === "android") {
if (UIManager.setLayoutAnimationEnabledExperimental) { if (UIManager.setLayoutAnimationEnabledExperimental) {
UIManager.setLayoutAnimationEnabledExperimental(true); UIManager.setLayoutAnimationEnabledExperimental(true);
} }
} }
export default function App() {
useEffect(() => {
UpdateAsync();
}, []);
const [favoriteStation, setFavoriteStation] = useState([]); export default function App() {
useEffect(() => UpdateAsync(), []);
return (
<FavoriteStationProvider>
<CurrentTrainProvider>
<AreaInfoProvider>
<BusAndTrainDataProvider>
<AppContainer />
</BusAndTrainDataProvider>
</AreaInfoProvider>
</CurrentTrainProvider>
</FavoriteStationProvider>
);
}
export function AppContainer() {
const { setFavoriteStation } = useFavoriteStation();
useEffect(() => { useEffect(() => {
AS.getItem("favoriteStation") AS.getItem("favoriteStation")
.then((d) => { .then((d) => {
@ -48,14 +61,14 @@ export default function App() {
}) })
.catch((d) => console.log(d)); .catch((d) => console.log(d));
}, []); }, []);
const [busAndTrainData, setBusAndTrainData] = useState([]); const { setBusAndTrainData } = useBusAndTrainData();
useEffect(() => { useEffect(() => {
AS.getItem("busAndTrain") AS.getItem("busAndTrain")
.then((d) => { .then((d) => {
const returnData = JSON.parse(d); const returnData = JSON.parse(d);
setBusAndTrainData(returnData); setBusAndTrainData(returnData);
}) })
.catch((d) => { .catch(() => {
fetch( fetch(
"https://script.google.com/macros/s/AKfycbw0UW6ZeCDgUYFRP0zxpc_Oqfy-91dBdbWv-cM8n3narKp14IyCd2wy5HW7taXcW7E/exec" "https://script.google.com/macros/s/AKfycbw0UW6ZeCDgUYFRP0zxpc_Oqfy-91dBdbWv-cM8n3narKp14IyCd2wy5HW7taXcW7E/exec"
) )
@ -67,8 +80,7 @@ export default function App() {
}); });
}, []); }, []);
const [currentTrain, setCurrentTrain] = useState([]); //現在在線中の全列車 { num: 列車番号, delay: 遅延時分(状態), Pos: 位置情報 } const { setCurrentTrain, setCurrentTrainLoading } = useCurrentTrain();
const [currentTrainLoading, setCurrentTrainLoading] = useState("loading"); // success, error, loading
const getCurrentTrain = () => const getCurrentTrain = () =>
fetch( fetch(
@ -83,7 +95,7 @@ export default function App() {
setCurrentTrain(d); setCurrentTrain(d);
setCurrentTrainLoading("success"); setCurrentTrainLoading("success");
}) })
.catch((e) => { .catch(() => {
console.log("えらー"); console.log("えらー");
setCurrentTrainLoading("error"); setCurrentTrainLoading("error");
}); });
@ -92,7 +104,7 @@ export default function App() {
useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得 useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得
const [areaInfo, setAreaInfo] = useState(""); const { areaInfo, setAreaInfo } = useAreaInfo();
const getAreaInfo = () => { const getAreaInfo = () => {
fetch( fetch(
"https://script.google.com/macros/s/AKfycbz80LcaEUrhnlEsLkJy0LG2IRO3DBVQhfNmN1d_0f_HvtsujNQpxM90SrV9yKWH_JG1Ww/exec" "https://script.google.com/macros/s/AKfycbz80LcaEUrhnlEsLkJy0LG2IRO3DBVQhfNmN1d_0f_HvtsujNQpxM90SrV9yKWH_JG1Ww/exec"
@ -114,20 +126,7 @@ export default function App() {
tabBarIcon: initIcon("barchart", "AntDesign"), tabBarIcon: initIcon("barchart", "AntDesign"),
}} }}
> >
{(props) => ( {(props) => <Top {...props} getCurrentTrain={getCurrentTrain} />}
<Top
{...props}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
busAndTrainData={busAndTrainData}
currentTrainState={{ currentTrain, setCurrentTrain }}
currentTrainLoadingState={{
currentTrainLoading,
setCurrentTrainLoading,
}}
getCurrentTrain={getCurrentTrain}
/>
)}
</Tab.Screen> </Tab.Screen>
<Tab.Screen <Tab.Screen
name="menuPage" name="menuPage"
@ -138,21 +137,7 @@ export default function App() {
tabBarIcon: initIcon("ios-radio", "Ionicons"), tabBarIcon: initIcon("ios-radio", "Ionicons"),
}} }}
> >
{(props) => ( {(props) => <MenuPage {...props} getCurrentTrain={getCurrentTrain} />}
<MenuPage
{...props}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
busAndTrainData={busAndTrainData}
currentTrainState={{ currentTrain, setCurrentTrain }}
currentTrainLoadingState={{
currentTrainLoading,
setCurrentTrainLoading,
}}
getCurrentTrain={getCurrentTrain}
areaInfo={areaInfo}
/>
)}
</Tab.Screen> </Tab.Screen>
<Tab.Screen <Tab.Screen
name="home" name="home"
@ -170,199 +155,3 @@ export default function App() {
</NavigationContainer> </NavigationContainer>
); );
} }
const initIcon = (name, type) => {
switch (type) {
case "Ionicons":
return ({ focused, color, size }) => (
<Ionicons name={name} size={32} color={focused ? "#0099CC" : "black"} />
);
case "AntDesign":
return ({ focused, color, size }) => (
<AntDesign
name={name}
size={32}
color={focused ? "#0099CC" : "black"}
/>
);
}
};
const Top = ({
navigation,
favoriteStation,
setFavoriteStation,
busAndTrainData,
currentTrainState,
currentTrainLoadingState,
getCurrentTrain,
}) => {
const webview = useRef();
//地図用
const [mapsStationData, setMapsStationData] = useState(undefined);
useEffect(() => {
getStationList2().then(setMapsStationData);
}, []);
useEffect(() => {
const unsubscribe = navigation.addListener("tabLongPress", (e) => {
navigation.navigate("favoriteList");
});
return unsubscribe;
}, [navigation]);
return (
<Stack.Navigator>
<Stack.Screen
name="Apps"
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
>
{(props) => (
<Apps
{...props}
webview={webview}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
busAndTrainData={busAndTrainData}
stationData={mapsStationData}
currentTrainState={currentTrainState}
currentTrainLoadingState={currentTrainLoadingState}
getCurrentTrain={getCurrentTrain}
/>
)}
</Stack.Screen>
<Stack.Screen
name="trainbase"
options={{
title: "トレインビジョン",
gestureEnabled: true,
...TransitionPresets.SlideFromRightIOS,
}}
>
{(props) => <TrainBase {...props} />}
</Stack.Screen>
<Stack.Screen
name="howto"
options={{
...optionData,
}}
>
{(props) => <HowTo {...props} />}
</Stack.Screen>
<Stack.Screen name="news" options={optionData}>
{(props) => <News {...props} />}
</Stack.Screen>
<Stack.Screen name="trainMenu" options={optionData}>
{(props) => (
<TrainMenu
{...props}
webview={webview}
stationData={mapsStationData}
/>
)}
</Stack.Screen>
<Stack.Screen
name="favoriteList"
options={{ ...optionData, gestureEnabled: false }}
>
{(props) => (
<FavoriteList
{...props}
webview={webview}
stationData={mapsStationData}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
/>
)}
</Stack.Screen>
</Stack.Navigator>
);
};
function MenuPage({
navigation,
favoriteStation,
setFavoriteStation,
busAndTrainData,
currentTrainState,
currentTrainLoadingState,
getCurrentTrain,
areaInfo,
}) {
useEffect(() => {
const unsubscribe = navigation.addListener("tabPress", (e) => {
AS.getItem("favoriteStation")
.then((d) => {
const returnData = JSON.parse(d);
if (favoriteStation.toString() != d) {
setFavoriteStation(returnData);
}
})
.catch((d) => console.log(d));
});
return unsubscribe;
}, [navigation]);
return (
<Stack.Navigator>
<Stack.Screen
name="menu"
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
>
{(props) => (
<Menu
{...props}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
busAndTrainData={busAndTrainData}
currentTrainState={currentTrainState}
currentTrainLoadingState={currentTrainLoadingState}
getCurrentTrain={getCurrentTrain}
areaInfo={areaInfo}
/>
)}
</Stack.Screen>
<Stack.Screen name="setting" options={optionData}>
{(props) => <Setting {...props} />}
</Stack.Screen>
<Stack.Screen
name="trainbase"
options={{
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
gestureResponseDistance: { vertical: 300 },
}}
>
{(props) => <TrainBase {...props} />}
</Stack.Screen>
<Stack.Screen
name="howto"
options={{
...optionData,
}}
>
{(props) => <HowTo {...props} />}
</Stack.Screen>
</Stack.Navigator>
);
}
const optionData = {
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
};

46
Apps.js
View File

@ -1,42 +1,26 @@
import React, { useEffect, useRef, useState } from "react"; import React, { useEffect, useRef, useState } from "react";
import { import { View, Platform, Text, TouchableOpacity } from "react-native";
View,
Platform,
ToastAndroid,
Text,
TouchableOpacity,
} from "react-native";
import { WebView } from "react-native-webview"; import { WebView } from "react-native-webview";
import Constants from "expo-constants"; import Constants from "expo-constants";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; import { Ionicons } from "@expo/vector-icons";
import { AS } from "./storageControl"; import { AS } from "./storageControl";
import { news } from "./config/newsUpdate"; import { news } from "./config/newsUpdate";
import { getStationList, lineList } from "./lib/getStationList"; import { getStationList, lineList } from "./lib/getStationList";
import { StationDeteilView } from "./components/ActionSheetComponents/StationDeteilView"; import { StationDeteilView } from "./components/ActionSheetComponents/StationDeteilView";
import { injectJavascriptData } from "./lib/webViewInjectjavascript"; import { injectJavascriptData } from "./lib/webViewInjectjavascript";
import { getStationList2 } from "./lib/getStationList2";
import { EachTrainInfo } from "./components/ActionSheetComponents/EachTrainInfo"; import { EachTrainInfo } from "./components/ActionSheetComponents/EachTrainInfo";
import { checkDuplicateTrainData } from "./lib/checkDuplicateTrainData"; import { checkDuplicateTrainData } from "./lib/checkDuplicateTrainData";
import { useFavoriteStation } from "./stateBox/useFavoriteStation";
import { useCurrentTrain } from "./stateBox/useCurrentTrain";
/* /*
import StatusbarDetect from './StatusbarDetect'; import StatusbarDetect from './StatusbarDetect';
var Status = StatusbarDetect(); */ var Status = StatusbarDetect(); */
export default function Apps({ export default function Apps({ navigation, webview, stationData }) {
navigation, const { currentTrain } = useCurrentTrain();
webview,
favoriteStation,
setFavoriteStation,
busAndTrainData,
stationData,
currentTrainState,
currentTrainLoadingState,
getCurrentTrain,
}) {
const { currentTrain, setCurrentTrain } = currentTrainState;
const { currentTrainLoading, setCurrentTrainLoading } =
currentTrainLoadingState;
const { navigate } = navigation; const { navigate } = navigation;
var urlcache = ""; var urlcache = "";
const { favoriteStation } = useFavoriteStation();
//画面表示関連 //画面表示関連
const [iconSetting, setIconSetting] = useState(undefined); const [iconSetting, setIconSetting] = useState(undefined);
@ -62,7 +46,6 @@ export default function Apps({
getStationList().then(setOriginalStationList); getStationList().then(setOriginalStationList);
}, []); }, []);
useEffect(() => {}, [stationData, favoriteStation]);
//地図表示テキスト //地図表示テキスト
const injectJavascript = injectJavascriptData( const injectJavascript = injectJavascriptData(
mapSwitch, mapSwitch,
@ -77,7 +60,7 @@ export default function Apps({
.then((d) => { .then((d) => {
if (d != news) navigate("news"); if (d != news) navigate("news");
}) })
.catch((e) => navigate("news")); .catch(() => navigate("news"));
}, []); }, []);
useEffect(() => { useEffect(() => {
@ -90,7 +73,7 @@ export default function Apps({
AS.setItem("iconSwitch", "true").then(Updates.reloadAsync); AS.setItem("iconSwitch", "true").then(Updates.reloadAsync);
} }
}) })
.catch((d) => AS.setItem("iconSwitch", "true").then(Updates.reloadAsync)); .catch(() => AS.setItem("iconSwitch", "true").then(Updates.reloadAsync));
}, []); }, []);
useEffect(() => { useEffect(() => {
@ -103,7 +86,7 @@ export default function Apps({
AS.setItem("mapSwitch", "false").then(Updates.reloadAsync); AS.setItem("mapSwitch", "false").then(Updates.reloadAsync);
} }
}) })
.catch((d) => AS.setItem("mapSwitch", "false").then(Updates.reloadAsync)); .catch(() => AS.setItem("mapSwitch", "false").then(Updates.reloadAsync));
}, []); }, []);
useEffect(() => { useEffect(() => {
@ -116,7 +99,7 @@ export default function Apps({
AS.setItem("stationSwitch", "true").then(Updates.reloadAsync); AS.setItem("stationSwitch", "true").then(Updates.reloadAsync);
} }
}) })
.catch((d) => .catch(() =>
AS.setItem("stationSwitch", "true").then(Updates.reloadAsync) AS.setItem("stationSwitch", "true").then(Updates.reloadAsync)
); );
}, []); }, []);
@ -130,9 +113,7 @@ export default function Apps({
AS.setItem("trainSwitch", "true").then(Updates.reloadAsync); AS.setItem("trainSwitch", "true").then(Updates.reloadAsync);
} }
}) })
.catch((d) => .catch(() => AS.setItem("trainSwitch", "true").then(Updates.reloadAsync));
AS.setItem("trainSwitch", "true").then(Updates.reloadAsync)
);
}, []); }, []);
const onMessage = (event) => { const onMessage = (event) => {
@ -310,9 +291,6 @@ export default function Apps({
StationBoardAcSR={StationBoardAcSR} StationBoardAcSR={StationBoardAcSR}
currentStation={stationBoardData} currentStation={stationBoardData}
originalStationList={originalStationList} originalStationList={originalStationList}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
busAndTrainData={busAndTrainData}
navigate={navigate} navigate={navigate}
onExit={() => { onExit={() => {
StationBoardAcSR.current?.setModalVisible(); StationBoardAcSR.current?.setModalVisible();

69
MenuPage.js Normal file
View File

@ -0,0 +1,69 @@
import React, { useEffect } from "react";
import {
createStackNavigator,
TransitionPresets,
} from "@react-navigation/stack";
import { AS } from "./storageControl";
import TrainBase from "./trainbaseview";
import HowTo from "./howto";
import Menu from "./menu";
import Setting from "./components/settings.js";
import { useFavoriteStation } from "./stateBox/useFavoriteStation";
import { optionData } from "./lib/stackOption.js";
const Stack = createStackNavigator();
export function MenuPage({ navigation, getCurrentTrain }) {
const { favoriteStation, setFavoriteStation } = useFavoriteStation();
useEffect(() => {
const unsubscribe = navigation.addListener("tabPress", (e) => {
AS.getItem("favoriteStation")
.then((d) => {
const returnData = JSON.parse(d);
if (favoriteStation.toString() != d) {
setFavoriteStation(returnData);
}
})
.catch((d) => console.log(d));
});
return unsubscribe;
}, [navigation]);
return (
<Stack.Navigator>
<Stack.Screen
name="menu"
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
>
{(props) => <Menu {...props} getCurrentTrain={getCurrentTrain} />}
</Stack.Screen>
<Stack.Screen name="setting" options={optionData}>
{(props) => <Setting {...props} />}
</Stack.Screen>
<Stack.Screen
name="trainbase"
options={{
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
gestureResponseDistance: { vertical: 300 },
}}
>
{(props) => <TrainBase {...props} />}
</Stack.Screen>
<Stack.Screen
name="howto"
options={{
...optionData,
}}
>
{(props) => <HowTo {...props} />}
</Stack.Screen>
</Stack.Navigator>
);
}

98
Top.js Normal file
View File

@ -0,0 +1,98 @@
import React, { useEffect, useRef, useState } from "react";
import {
createStackNavigator,
TransitionPresets,
} from "@react-navigation/stack";
import { getStationList2 } from "./lib/getStationList2";
import Apps from "./Apps";
import TrainBase from "./trainbaseview";
import HowTo from "./howto";
import News from "./components/news.js";
import TrainMenu from "./components/trainMenu.js";
import FavoriteList from "./components/FavoriteList.js";
import { useFavoriteStation } from "./stateBox/useFavoriteStation";
import { optionData } from "./lib/stackOption.js";
const Stack = createStackNavigator();
export const Top = ({ navigation, getCurrentTrain }) => {
const webview = useRef();
const { favoriteStation, setFavoriteStation } = useFavoriteStation();
//地図用
const [mapsStationData, setMapsStationData] = useState(undefined);
useEffect(() => {
getStationList2().then(setMapsStationData);
}, []);
useEffect(() => {
const unsubscribe = navigation.addListener("tabLongPress", (e) => {
navigation.navigate("favoriteList");
});
return unsubscribe;
}, [navigation]);
return (
<Stack.Navigator>
<Stack.Screen
name="Apps"
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
>
{(props) => (
<Apps
{...props}
webview={webview}
stationData={mapsStationData}
getCurrentTrain={getCurrentTrain}
/>
)}
</Stack.Screen>
<Stack.Screen
name="trainbase"
options={{
title: "トレインビジョン",
gestureEnabled: true,
...TransitionPresets.SlideFromRightIOS,
}}
>
{(props) => <TrainBase {...props} />}
</Stack.Screen>
<Stack.Screen
name="howto"
options={{
...optionData,
}}
>
{(props) => <HowTo {...props} />}
</Stack.Screen>
<Stack.Screen name="news" options={optionData}>
{(props) => <News {...props} />}
</Stack.Screen>
<Stack.Screen name="trainMenu" options={optionData}>
{(props) => (
<TrainMenu
{...props}
webview={webview}
stationData={mapsStationData}
/>
)}
</Stack.Screen>
<Stack.Screen
name="favoriteList"
options={{ ...optionData, gestureEnabled: false }}
>
{(props) => (
<FavoriteList
{...props}
webview={webview}
stationData={mapsStationData}
/>
)}
</Stack.Screen>
</Stack.Navigator>
);
};

33
components/ActionSheetComponents/StationDeteilView.js
View File

@ -1,38 +1,25 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { import { View, Linking, Text, TouchableOpacity } from "react-native";
StatusBar,
View,
LayoutAnimation,
ScrollView,
Linking,
Text,
TouchableOpacity,
} from "react-native";
import AutoHeightImage from "react-native-auto-height-image"; import AutoHeightImage from "react-native-auto-height-image";
import { FontAwesome, Foundation, Ionicons } from "@expo/vector-icons"; import { FontAwesome, Foundation, Ionicons } from "@expo/vector-icons";
import ActionSheet from "react-native-actions-sheet"; import ActionSheet from "react-native-actions-sheet";
import Sign from "../../components/駅名表/Sign"; import Sign from "../../components/駅名表/Sign";
import { useInterval } from "../../lib/useInterval";
import { TicketBox } from "../atom/TicketBox"; import { TicketBox } from "../atom/TicketBox";
import { import { widthPercentageToDP as wp } from "react-native-responsive-screen";
widthPercentageToDP as wp,
heightPercentageToDP as hp,
} from "react-native-responsive-screen";
import lineColorList from "../../assets/originData/lineColorList"; import lineColorList from "../../assets/originData/lineColorList";
import { getPDFViewURL } from "../../lib/getPdfViewURL"; import { getPDFViewURL } from "../../lib/getPdfViewURL";
import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData";
export const StationDeteilView = (props) => { export const StationDeteilView = (props) => {
const { const {
StationBoardAcSR, StationBoardAcSR,
currentStation, currentStation,
originalStationList, originalStationList,
favoriteStation,
setFavoriteStation,
busAndTrainData,
navigate, navigate,
onExit, onExit,
} = props; } = props;
const { busAndTrainData } = useBusAndTrainData();
const [trainBus, setTrainBus] = useState(); const [trainBus, setTrainBus] = useState();
useEffect(() => { useEffect(() => {
if (!currentStation) return () => {}; if (!currentStation) return () => {};
@ -87,8 +74,6 @@ export const StationDeteilView = (props) => {
<Sign <Sign
currentStation={currentStation} currentStation={currentStation}
originalStationList={originalStationList} originalStationList={originalStationList}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
oP={() => { oP={() => {
navigate("howto", { navigate("howto", {
info, info,
@ -105,8 +90,6 @@ export const StationDeteilView = (props) => {
<NexPreStationLine <NexPreStationLine
currentStation={d} currentStation={d}
originalStationList={originalStationList} originalStationList={originalStationList}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
/> />
))} ))}
{currentStation && {currentStation &&
@ -218,13 +201,7 @@ const StationName = (props) => {
); );
}; };
const NexPreStationLine = ({ const NexPreStationLine = ({ currentStation, originalStationList }) => {
currentStation,
originalStationList,
oP,
favoriteStation,
setFavoriteStation,
}) => {
const [preStation, setPreStation] = useState(); const [preStation, setPreStation] = useState();
const [nexStation, setNexStation] = useState(); const [nexStation, setNexStation] = useState();
const [lineName, setLineName] = useState(); const [lineName, setLineName] = useState();

18
components/FavoriteList.js
View File

@ -1,21 +1,11 @@
import React, { Component, useRef, useState, useEffect } from "react"; import React from "react";
import { View, Text, TouchableOpacity, ScrollView } from "react-native"; import { View, Text, TouchableOpacity, ScrollView } from "react-native";
import { WebView } from "react-native-webview";
import { ListItem } from "native-base"; import { ListItem } from "native-base";
import Icon from "react-native-vector-icons/Entypo"; import Icon from "react-native-vector-icons/Entypo";
import StatusbarDetect from "../StatusbarDetect"; import { useFavoriteStation } from "../stateBox/useFavoriteStation";
import { AS } from "../storageControl"; export default function FavoriteList({ navigation, webview, stationData }) {
import { news } from "../config/newsUpdate";
import { getStationList, lineList } from "../lib/getStationList";
var Status = StatusbarDetect();
export default function FavoriteList({
navigation,
webview,
stationData,
favoriteStation,
setFavoriteStation,
}) {
const { navigate } = navigation; const { navigate } = navigation;
const { favoriteStation } = useFavoriteStation();
return ( return (
<View style={{ height: "100%", backgroundColor: "#0099CC" }}> <View style={{ height: "100%", backgroundColor: "#0099CC" }}>

37
components/発車時刻表/LED_vidion.js
View File

@ -3,16 +3,15 @@ import { View, Text, TouchableOpacity } from "react-native";
import { Switch } from "react-native-elements"; import { Switch } from "react-native-elements";
import { widthPercentageToDP as wp } from "react-native-responsive-screen"; import { widthPercentageToDP as wp } from "react-native-responsive-screen";
import LottieView from "lottie-react-native"; import LottieView from "lottie-react-native";
import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; import { Ionicons } from "@expo/vector-icons";
import { customTrainDataDetector } from "../custom-train-data"; import { customTrainDataDetector } from "../custom-train-data";
import { useInterval } from "../../lib/useInterval"; import { useInterval } from "../../lib/useInterval";
import { objectIsEmpty } from "../../lib/objectIsEmpty"; import { objectIsEmpty } from "../../lib/objectIsEmpty";
import { getTrainType } from "../../lib/getTrainType"; import { getTrainType } from "../../lib/getTrainType";
import { HeaderConfig } from "../../lib/HeaderConfig";
import { getTrainDelayStatus } from "../../lib/getTrainDelayStatus"; import { getTrainDelayStatus } from "../../lib/getTrainDelayStatus";
import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData"; import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData";
import { useCurrentTrain } from "../../stateBox/useCurrentTrain";
let diagramData = undefined; import { useAreaInfo } from "../../stateBox/useAreaInfo";
/** /**
* *
@ -49,18 +48,14 @@ export default function LED_vision(props) {
setTrainInfo, setTrainInfo,
EachTrainInfoAsSR, EachTrainInfoAsSR,
trainDiagram, trainDiagram,
currentTrainState,
currentTrainLoadingState,
getCurrentTrain, getCurrentTrain,
areaInfo,
} = props; } = props;
const { currentTrain, setCurrentTrain } = currentTrainState; const { currentTrain } = useCurrentTrain();
const { currentTrainLoading, setCurrentTrainLoading } =
currentTrainLoadingState;
const [stationDiagram, setStationDiagram] = useState({}); //当該駅の全時刻表 const [stationDiagram, setStationDiagram] = useState({}); //当該駅の全時刻表
const [finalSwitch, setFinalSwitch] = useState(false); const [finalSwitch, setFinalSwitch] = useState(false);
const [trainIDSwitch, setTrainIDSwitch] = useState(false); const [trainIDSwitch, setTrainIDSwitch] = useState(false);
const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false); const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false);
const { areaInfo } = useAreaInfo();
useEffect(() => { useEffect(() => {
// 現在の駅に停車するダイヤを作成する副作用[列車ダイヤと現在駅情報] // 現在の駅に停車するダイヤを作成する副作用[列車ダイヤと現在駅情報]
@ -187,18 +182,13 @@ export default function LED_vision(props) {
marginHorizontal: wp("1%"), marginHorizontal: wp("1%"),
}} }}
> >
<Header <Header getCurrentTrain={getCurrentTrain} />
currentTrainLoading={currentTrainLoading} {selectedTrain.map((d) => (
setCurrentTrainLoading={setCurrentTrainLoading}
getCurrentTrain={getCurrentTrain}
/>
{selectedTrain.map((d, index) => (
<EachData <EachData
d={d} d={d}
trainIDSwitch={trainIDSwitch} trainIDSwitch={trainIDSwitch}
trainDescriptionSwitch={trainDescriptionSwitch} trainDescriptionSwitch={trainDescriptionSwitch}
station={station} station={station}
currentTrain={currentTrain}
customTrainDataDetector={customTrainDataDetector} customTrainDataDetector={customTrainDataDetector}
setTrainInfo={setTrainInfo} setTrainInfo={setTrainInfo}
EachTrainInfoAsSR={EachTrainInfoAsSR} EachTrainInfoAsSR={EachTrainInfoAsSR}
@ -222,11 +212,9 @@ export default function LED_vision(props) {
</View> </View>
); );
} }
const Header = ({ const Header = ({ getCurrentTrain }) => {
currentTrainLoading, const { currentTrainLoading, setCurrentTrainLoading } = useCurrentTrain();
setCurrentTrainLoading, return (
getCurrentTrain,
}) => (
<View <View
style={{ style={{
alignContent: "center", alignContent: "center",
@ -265,7 +253,8 @@ const Header = ({
) : null} ) : null}
</View> </View>
</View> </View>
); );
};
const Footer = (props) => { const Footer = (props) => {
const { const {
@ -307,11 +296,11 @@ const EachData = ({
trainIDSwitch, trainIDSwitch,
trainDescriptionSwitch, trainDescriptionSwitch,
station, station,
currentTrain,
customTrainDataDetector, customTrainDataDetector,
setTrainInfo, setTrainInfo,
EachTrainInfoAsSR, EachTrainInfoAsSR,
}) => { }) => {
const { currentTrain } = useCurrentTrain();
const openTrainInfo = (d) => { const openTrainInfo = (d) => {
let TrainNumber = ""; let TrainNumber = "";
if (train.trainNumDistance != undefined) { if (train.trainNumDistance != undefined) {

28
components/駅名表/Sign.js
View File

@ -1,30 +1,14 @@
import React, { Component, useRef, useState, useEffect } from "react"; import React, { useRef, useState, useEffect } from "react";
import { import { View, Text, TouchableOpacity } from "react-native";
StatusBar, import { widthPercentageToDP as wp } from "react-native-responsive-screen";
View,
LayoutAnimation,
ScrollView,
Linking,
Text,
TouchableOpacity,
} from "react-native";
import {
widthPercentageToDP as wp,
heightPercentageToDP as hp,
} from "react-native-responsive-screen";
import LottieView from "lottie-react-native"; import LottieView from "lottie-react-native";
import { useInterval } from "../../lib/useInterval"; import { useInterval } from "../../lib/useInterval";
import { AS } from "../../storageControl"; import { AS } from "../../storageControl";
import { useFavoriteStation } from "../../stateBox/useFavoriteStation";
export default function Sign(props) { export default function Sign(props) {
const { const { currentStation, originalStationList, oP, oLP } = props;
currentStation, const { favoriteStation, setFavoriteStation } = useFavoriteStation();
originalStationList,
oP,
oLP,
favoriteStation,
setFavoriteStation,
} = props;
const [nexPrePosition, setNexPrePosition] = useState(0); const [nexPrePosition, setNexPrePosition] = useState(0);
const [preStation, setPreStation] = useState(); const [preStation, setPreStation] = useState();

19
lib/initIcon.js Normal file
View File

@ -0,0 +1,19 @@
import React from "react";
import { Ionicons, AntDesign } from "@expo/vector-icons";
export const initIcon = (name, type) => {
switch (type) {
case "Ionicons":
return ({ focused, color, size }) => (
<Ionicons name={name} size={32} color={focused ? "#0099CC" : "black"} />
);
case "AntDesign":
return ({ focused, color, size }) => (
<AntDesign
name={name}
size={32}
color={focused ? "#0099CC" : "black"}
/>
);
}
};

8
lib/stackOption.js Normal file
View File

@ -0,0 +1,8 @@
import { TransitionPresets } from "@react-navigation/stack";
export const optionData = {
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
};

29
menu.js
View File

@ -7,14 +7,12 @@ import {
Linking, Linking,
Text, Text,
TouchableOpacity, TouchableOpacity,
ToastAndroid,
} from "react-native"; } from "react-native";
import Constants from "expo-constants"; import Constants from "expo-constants";
import { ListItem } from "native-base"; import { ListItem } from "native-base";
import Icon from "react-native-vector-icons/Entypo"; import Icon from "react-native-vector-icons/Entypo";
import * as Location from "expo-location"; import * as Location from "expo-location";
import StatusbarDetect from "./StatusbarDetect"; import StatusbarDetect from "./StatusbarDetect";
import { useNavigation } from "@react-navigation/native";
import AutoHeightImage from "react-native-auto-height-image"; import AutoHeightImage from "react-native-auto-height-image";
import { widthPercentageToDP as wp } from "react-native-responsive-screen"; import { widthPercentageToDP as wp } from "react-native-responsive-screen";
import { import {
@ -39,21 +37,16 @@ import { JRSTraInfo } from "./components/ActionSheetComponents/JRSTraInfo";
import { EachTrainInfo } from "./components/ActionSheetComponents/EachTrainInfo"; import { EachTrainInfo } from "./components/ActionSheetComponents/EachTrainInfo";
import useInterval from "./lib/useInterval"; import useInterval from "./lib/useInterval";
import { HeaderConfig } from "./lib/HeaderConfig"; import { HeaderConfig } from "./lib/HeaderConfig";
import { useFavoriteStation } from "./stateBox/useFavoriteStation";
export default function Menu(props) { export default function Menu(props) {
const { const {
navigation: { navigate }, navigation: { navigate },
favoriteStation,
setFavoriteStation,
busAndTrainData,
currentTrainState,
currentTrainLoadingState,
getCurrentTrain, getCurrentTrain,
areaInfo,
} = props; } = props;
const JRSTraInfoEXAcSR = useRef(null); const JRSTraInfoEXAcSR = useRef(null);
const StationBoardAcSR = useRef(null); const StationBoardAcSR = useRef(null);
const navigation = useNavigation(); const { favoriteStation } = useFavoriteStation();
//位置情報 //位置情報
const [locationStatus, setLocationStatus] = useState(null); const [locationStatus, setLocationStatus] = useState(null);
@ -171,13 +164,13 @@ export default function Menu(props) {
if (d.indexOf("<title>404 Not Found</title>") != -1) throw Error; if (d.indexOf("<title>404 Not Found</title>") != -1) throw Error;
setTrainDiagram(parseAllTrainDiagram(d)); setTrainDiagram(parseAllTrainDiagram(d));
}) })
.catch((d) => { .catch(() => {
console.log("fallback"); console.log("fallback");
setTrainDiagram(trainList); setTrainDiagram(trainList);
}); });
}, []); }, []);
const openStationACFromEachTrainInfo = (stationName) => { const openStationACFromEachTrainInfo = () => {
// EachTrainInfoAsSR.current?.hide(); // EachTrainInfoAsSR.current?.hide();
// const findStationEachLine = (selectLine) => { // const findStationEachLine = (selectLine) => {
// let NearStation = selectLine.filter((d) => d.Station_JP == stationName); // let NearStation = selectLine.filter((d) => d.Station_JP == stationName);
@ -225,7 +218,7 @@ export default function Menu(props) {
onSnapToItem={(d) => { onSnapToItem={(d) => {
setSelectedCurrentStation(d); setSelectedCurrentStation(d);
}} }}
renderItem={({ item, index }) => { renderItem={({ item }) => {
return ( return (
<View <View
style={{ marginVertical: 10 }} style={{ marginVertical: 10 }}
@ -234,8 +227,6 @@ export default function Menu(props) {
<Sign <Sign
currentStation={item} currentStation={item}
originalStationList={originalStationList} originalStationList={originalStationList}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
oP={StationBoardAcSR.current?.setModalVisible} oP={StationBoardAcSR.current?.setModalVisible}
/> />
</View> </View>
@ -253,10 +244,7 @@ export default function Menu(props) {
setTrainInfo={setTrainInfo} setTrainInfo={setTrainInfo}
EachTrainInfoAsSR={EachTrainInfoAsSR} EachTrainInfoAsSR={EachTrainInfoAsSR}
trainDiagram={trainDiagram} trainDiagram={trainDiagram}
currentTrainState={currentTrainState}
currentTrainLoadingState={currentTrainLoadingState}
getCurrentTrain={getCurrentTrain} getCurrentTrain={getCurrentTrain}
areaInfo={areaInfo}
/> />
)} )}
<JRSTraInfoBox <JRSTraInfoBox
@ -277,9 +265,6 @@ export default function Menu(props) {
allStationData[selectedCurrentStation] allStationData[selectedCurrentStation]
} }
originalStationList={originalStationList} originalStationList={originalStationList}
favoriteStation={favoriteStation}
setFavoriteStation={setFavoriteStation}
busAndTrainData={busAndTrainData}
navigate={navigate} navigate={navigate}
onExit={() => { onExit={() => {
StationBoardAcSR.current?.setModalVisible(); StationBoardAcSR.current?.setModalVisible();
@ -441,7 +426,7 @@ const JRSTraInfoBox = (props) => {
/> />
</View> </View>
) : delayData ? ( ) : delayData ? (
delayData.map((d, index) => { delayData.map((d) => {
let data = d.split(" "); let data = d.split(" ");
return ( return (
<View style={{ flexDirection: "row" }} key={data[1] + "key"}> <View style={{ flexDirection: "row" }} key={data[1] + "key"}>
@ -469,7 +454,7 @@ const JRSTraInfoBox = (props) => {
); );
}; };
const FixedContentTop = (props) => { const FixedContentTop = () => {
return ( return (
<> <>
<TopMenuButton /> <TopMenuButton />

21
stateBox/useAreaInfo.js Normal file
View File

@ -0,0 +1,21 @@
import React, { createContext, useContext, useState } from "react";
const initialState = {
areaInfo: [],
setAreainfo: () => {},
};
const AreaInfoContext = createContext(initialState);
export const useAreaInfo = () => {
return useContext(AreaInfoContext);
};
export const AreaInfoProvider = ({ children }) => {
const [areaInfo, setAreaInfo] = useState([]);
return (
<AreaInfoContext.Provider value={{ areaInfo, setAreaInfo }}>
{children}
</AreaInfoContext.Provider>
);
};

23
stateBox/useBusAndTrainData.js Normal file
View File

@ -0,0 +1,23 @@
import React, { createContext, useContext, useState } from "react";
const initialState = {
busAndTrainData: [],
setBusAndTrainData: () => {},
};
const BusAndTrainDataContext = createContext(initialState);
export const useBusAndTrainData = () => {
return useContext(BusAndTrainDataContext);
};
export const BusAndTrainDataProvider = ({ children }) => {
const [busAndTrainData, setBusAndTrainData] = useState([]);
return (
<BusAndTrainDataContext.Provider
value={{ busAndTrainData, setBusAndTrainData }}
>
{children}
</BusAndTrainDataContext.Provider>
);
};

31
stateBox/useCurrentTrain.js Normal file
View File

@ -0,0 +1,31 @@
import React, { createContext, useContext, useState } from "react";
const initialState = {
currentTrain: [],
setCurrentTrain: () => {},
currentTrainLoading: "loading",
setCurrentTrainLoading: () => {},
};
const CurrentTrainContext = createContext(initialState);
export const useCurrentTrain = () => {
return useContext(CurrentTrainContext);
};
export const CurrentTrainProvider = ({ children }) => {
const [currentTrain, setCurrentTrain] = useState([]); //現在在線中の全列車 { num: 列車番号, delay: 遅延時分(状態), Pos: 位置情報 }
const [currentTrainLoading, setCurrentTrainLoading] = useState("loading"); // success, error, loading
return (
<CurrentTrainContext.Provider
value={{
currentTrain,
setCurrentTrain,
currentTrainLoading,
setCurrentTrainLoading,
}}
>
{children}
</CurrentTrainContext.Provider>
);
};

23
stateBox/useFavoriteStation.js Normal file
View File

@ -0,0 +1,23 @@
import React, { createContext, useContext, useState } from "react";
const initialState = {
favoriteStation: [],
setFavoriteStation: () => {},
};
const FavoriteStationContext = createContext(initialState);
export const useFavoriteStation = () => {
return useContext(FavoriteStationContext);
};
export const FavoriteStationProvider = ({ children }) => {
const [favoriteStation, setFavoriteStation] = useState({});
return (
<FavoriteStationContext.Provider
value={{ favoriteStation, setFavoriteStation }}
>
{children}
</FavoriteStationContext.Provider>
);
};