Merge commit '816d96d37be6537c9ebcf0be30c74fd154b80dc5'
This commit is contained in:
harukin-DeskMini
commit
8bc7069c4e
225
App.js
225
App.js
@ -1,4 +1,4 @@
|
||||
import React, { useEffect, useRef } from "react";
|
||||
import React, { useEffect, useRef, useState } from "react";
|
||||
import { NavigationContainer } from "@react-navigation/native";
|
||||
import {
|
||||
createStackNavigator,
|
||||
@ -8,14 +8,23 @@ import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
|
||||
import { AntDesign, Ionicons } from "@expo/vector-icons";
|
||||
import { Platform, UIManager } from "react-native";
|
||||
import { UpdateAsync } from "./UpdateAsync.js";
|
||||
import { getStationList2 } from "./lib/getStationList2";
|
||||
import { AS } from "./storageControl";
|
||||
import Apps from "./Apps";
|
||||
import tndView from "./ndView";
|
||||
import trainbase from "./trainbaseview";
|
||||
import howto from "./howto";
|
||||
import menu from "./menu";
|
||||
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 TrainMenu from "./components/trainMenu.js";
|
||||
import FavoriteList from "./components/FavoriteList.js";
|
||||
import { LogBox } from "react-native";
|
||||
|
||||
LogBox.ignoreLogs([
|
||||
"ViewPropTypes will be removed",
|
||||
"ColorPropType will be removed",
|
||||
]);
|
||||
const Stack = createStackNavigator();
|
||||
const Tab = createBottomTabNavigator();
|
||||
if (Platform.OS === "android") {
|
||||
@ -24,95 +33,245 @@ if (Platform.OS === "android") {
|
||||
}
|
||||
}
|
||||
export default function App() {
|
||||
const navigationRef = useRef();
|
||||
useEffect(() => {
|
||||
UpdateAsync();
|
||||
}, []);
|
||||
const [favoriteStation, setFavoriteStation] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
AS.getItem("favoriteStation")
|
||||
.then((d) => {
|
||||
const returnData = JSON.parse(d);
|
||||
setFavoriteStation(returnData);
|
||||
})
|
||||
.catch((d) => console.log(d));
|
||||
}, []);
|
||||
const [busAndTrainData, setBusAndTrainData] = useState([]);
|
||||
useEffect(() => {
|
||||
AS.getItem("busAndTrain")
|
||||
.then((d) => {
|
||||
const returnData = JSON.parse(d);
|
||||
setBusAndTrainData(returnData);
|
||||
})
|
||||
.catch((d) => {
|
||||
fetch(
|
||||
"https://script.google.com/macros/s/AKfycbw0UW6ZeCDgUYFRP0zxpc_Oqfy-91dBdbWv-cM8n3narKp14IyCd2wy5HW7taXcW7E/exec"
|
||||
)
|
||||
.then((d) => d.json())
|
||||
.then((d) => {
|
||||
setBusAndTrainData(d);
|
||||
AS.setItem("busAndTrain", JSON.stringify(d));
|
||||
});
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<NavigationContainer name="Root" ref={navigationRef} style={{ flex: 1 }}>
|
||||
<Tab.Navigator>
|
||||
<Stack.Screen
|
||||
<NavigationContainer name="Root" style={{ flex: 1 }}>
|
||||
<Tab.Navigator detachInactiveScreens={false}>
|
||||
<Tab.Screen
|
||||
name="login"
|
||||
component={top}
|
||||
options={{
|
||||
tabBarLabel: "位置情報",
|
||||
headerTransparent: true,
|
||||
gestureEnabled: true,
|
||||
tabBarIcon: () => <AntDesign name="barchart" size={32} />,
|
||||
tabBarIcon: initIcon("barchart", "AntDesign"),
|
||||
}}
|
||||
>
|
||||
{(props) => (
|
||||
<Top
|
||||
{...props}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
busAndTrainData={busAndTrainData}
|
||||
/>
|
||||
<Stack.Screen
|
||||
)}
|
||||
</Tab.Screen>
|
||||
<Tab.Screen
|
||||
name="menuPage"
|
||||
component={menuPage}
|
||||
options={{
|
||||
tabBarLabel: "リンク",
|
||||
headerTransparent: true,
|
||||
gestureEnabled: true,
|
||||
tabBarIcon: () => <Ionicons name="ios-radio" size={32} />,
|
||||
tabBarIcon: initIcon("ios-radio", "Ionicons"),
|
||||
}}
|
||||
>
|
||||
{(props) => (
|
||||
<MenuPage
|
||||
{...props}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
busAndTrainData={busAndTrainData}
|
||||
/>
|
||||
<Stack.Screen
|
||||
)}
|
||||
</Tab.Screen>
|
||||
<Tab.Screen
|
||||
name="home"
|
||||
component={tndView}
|
||||
options={{
|
||||
tabBarLabel: "運行情報",
|
||||
headerTransparent: true,
|
||||
gestureEnabled: true,
|
||||
tabBarIcon: () => <Ionicons name="md-train" size={32} />,
|
||||
tabBarIcon: initIcon("md-train", "Ionicons"),
|
||||
}}
|
||||
/>
|
||||
>
|
||||
{(props) => <TNDView {...props} />}
|
||||
</Tab.Screen>
|
||||
</Tab.Navigator>
|
||||
</NavigationContainer>
|
||||
);
|
||||
}
|
||||
const top = () => (
|
||||
|
||||
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,
|
||||
}) => {
|
||||
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"
|
||||
component={Apps}
|
||||
options={{
|
||||
headerShown: false,
|
||||
gestureEnabled: true,
|
||||
headerTransparent: true,
|
||||
}}
|
||||
>
|
||||
{(props) => (
|
||||
<Apps
|
||||
{...props}
|
||||
webview={webview}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
busAndTrainData={busAndTrainData}
|
||||
/>
|
||||
)}
|
||||
</Stack.Screen>
|
||||
<Stack.Screen
|
||||
name="trainbase"
|
||||
component={trainbase}
|
||||
options={{
|
||||
title: "トレインビジョン",
|
||||
gestureEnabled: true,
|
||||
...TransitionPresets.SlideFromRightIOS,
|
||||
}}
|
||||
/>
|
||||
>
|
||||
{(props) => <TrainBase {...props} />}
|
||||
</Stack.Screen>
|
||||
<Stack.Screen
|
||||
name="howto"
|
||||
component={howto}
|
||||
options={{
|
||||
title: "使い方",
|
||||
...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 name="news" component={News} options={optionData} />
|
||||
<Stack.Screen name="trainMenu" component={trainMenu} options={optionData} />
|
||||
)}
|
||||
</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() {
|
||||
);
|
||||
};
|
||||
function MenuPage({
|
||||
navigation,
|
||||
favoriteStation,
|
||||
setFavoriteStation,
|
||||
busAndTrainData,
|
||||
}) {
|
||||
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"
|
||||
component={menu}
|
||||
options={{
|
||||
headerShown: false,
|
||||
gestureEnabled: true,
|
||||
headerTransparent: true,
|
||||
}}
|
||||
>
|
||||
{(props) => (
|
||||
<Menu
|
||||
{...props}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
busAndTrainData={busAndTrainData}
|
||||
/>
|
||||
<Stack.Screen name="setting" component={Setting} options={optionData} />
|
||||
)}
|
||||
</Stack.Screen>
|
||||
<Stack.Screen name="setting" options={optionData}>
|
||||
{(props) => <Setting {...props} />}
|
||||
</Stack.Screen>
|
||||
<Stack.Screen
|
||||
name="trainbase"
|
||||
component={trainbase}
|
||||
options={{
|
||||
...TransitionPresets.ModalPresentationIOS,
|
||||
cardOverlayEnabled: true,
|
||||
@ -121,7 +280,9 @@ function menuPage() {
|
||||
headerTransparent: true,
|
||||
gestureResponseDistance: { vertical: 300 },
|
||||
}}
|
||||
/>
|
||||
>
|
||||
{(props) => <TrainBase {...props} />}
|
||||
</Stack.Screen>
|
||||
</Stack.Navigator>
|
||||
);
|
||||
}
|
||||
|
||||
27
Apps.js
27
Apps.js
@ -19,23 +19,21 @@ import { getStationList2 } from "./lib/getStationList2";
|
||||
import StatusbarDetect from './StatusbarDetect';
|
||||
var Status = StatusbarDetect(); */
|
||||
|
||||
export default function Apps(props) {
|
||||
const {
|
||||
navigation: { navigate },
|
||||
} = props;
|
||||
export default function Apps({
|
||||
navigation,
|
||||
webview,
|
||||
favoriteStation,
|
||||
setFavoriteStation,
|
||||
busAndTrainData,
|
||||
}) {
|
||||
const { navigate } = navigation;
|
||||
var urlcache = "";
|
||||
const webview = useRef();
|
||||
|
||||
//画面表示関連
|
||||
const [iconSetting, setIconSetting] = useState(undefined);
|
||||
const [mapSwitch, setMapSwitch] = useState(undefined);
|
||||
const [stationMenu, setStationMenu] = useState(undefined);
|
||||
|
||||
//地図用
|
||||
const [mapsStationData, setMapsStationData] = useState(undefined);
|
||||
useEffect(() => {
|
||||
getStationList2().then(setMapsStationData);
|
||||
}, []);
|
||||
|
||||
//駅情報画面用
|
||||
const StationBoardAcSR = useRef(null);
|
||||
const [stationBoardData, setStationBoardData] = useState(undefined);
|
||||
@ -187,9 +185,7 @@ export default function Apps(props) {
|
||||
onTouchMove={() => StationBoardAcSR.current?.hide()}
|
||||
/>
|
||||
<MapsButton
|
||||
onPress={() =>
|
||||
navigate("trainMenu", { webview, stationData: mapsStationData })
|
||||
}
|
||||
onPress={() => navigate("trainMenu", { webview })}
|
||||
top={Platform.OS == "ios" ? Constants.statusBarHeight : 0}
|
||||
mapSwitch={mapSwitch == "true" ? "flex" : "none"}
|
||||
/>
|
||||
@ -202,6 +198,9 @@ export default function Apps(props) {
|
||||
StationBoardAcSR={StationBoardAcSR}
|
||||
currentStation={stationBoardData}
|
||||
originalStationList={originalStationList}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
busAndTrainData={busAndTrainData}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
|
||||
24
app.json
24
app.json
@ -3,8 +3,11 @@
|
||||
"name": "JR四国運行状況",
|
||||
"slug": "jrshikoku",
|
||||
"privacy": "public",
|
||||
"platforms": ["ios", "android"],
|
||||
"version": "4.4",
|
||||
"platforms": [
|
||||
"ios",
|
||||
"android"
|
||||
],
|
||||
"version": "4.5",
|
||||
"orientation": "portrait",
|
||||
"icon": "./assets/icon.png",
|
||||
"splash": {
|
||||
@ -15,9 +18,11 @@
|
||||
"updates": {
|
||||
"fallbackToCacheTimeout": 0
|
||||
},
|
||||
"assetBundlePatterns": ["**/*"],
|
||||
"assetBundlePatterns": [
|
||||
"**/*"
|
||||
],
|
||||
"ios": {
|
||||
"buildNumber": "23",
|
||||
"buildNumber": "25",
|
||||
"supportsTablet": true,
|
||||
"bundleIdentifier": "jrshikokuinfo.xprocess.hrkn",
|
||||
"config": {
|
||||
@ -26,14 +31,21 @@
|
||||
},
|
||||
"android": {
|
||||
"package": "jrshikokuinfo.xprocess.hrkn",
|
||||
"versionCode": 16,
|
||||
"permissions": ["ACCESS_FINE_LOCATION"],
|
||||
"versionCode": 17,
|
||||
"permissions": [
|
||||
"ACCESS_FINE_LOCATION"
|
||||
],
|
||||
"googleServicesFile": "./google-services.json",
|
||||
"config": {
|
||||
"googleMaps": {
|
||||
"apiKey": "AIzaSyAmFb-Yj033bXZWlSzNrfq_0jc1PgRrWcE"
|
||||
}
|
||||
}
|
||||
},
|
||||
"extra": {
|
||||
"eas": {
|
||||
"projectId": "398abf60-57a7-11e9-970c-8f04356d08bf"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
1
assets/939-star.json
Normal file
1
assets/939-star.json
Normal file
File diff suppressed because one or more lines are too long
11
assets/originData/lineColorList.js
Normal file
11
assets/originData/lineColorList.js
Normal file
@ -0,0 +1,11 @@
|
||||
export default {
|
||||
Y: "#F5AC13",
|
||||
U: "#F5AC13",
|
||||
S: "#9AA7D7",
|
||||
D: "#DC4586",
|
||||
K: "#DC4586",
|
||||
B: "#366481",
|
||||
N: "#881F61",
|
||||
T: "#87CA3B",
|
||||
M: "#0071be",
|
||||
};
|
||||
@ -1,13 +1,45 @@
|
||||
import React from "react";
|
||||
import { View, Linking } from "react-native";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import {
|
||||
StatusBar,
|
||||
View,
|
||||
LayoutAnimation,
|
||||
ScrollView,
|
||||
Linking,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
} from "react-native";
|
||||
import { FontAwesome, Foundation, Ionicons } from "@expo/vector-icons";
|
||||
import ActionSheet from "react-native-actions-sheet";
|
||||
import Sign from "../../components/駅名表/Sign";
|
||||
import { useInterval } from "../../lib/useInterval";
|
||||
|
||||
import { TicketBox } from "../atom/TicketBox";
|
||||
import {
|
||||
widthPercentageToDP as wp,
|
||||
heightPercentageToDP as hp,
|
||||
} from "react-native-responsive-screen";
|
||||
import lineColorList from "../../assets/originData/lineColorList";
|
||||
|
||||
export const StationDeteilView = (props) => {
|
||||
const { StationBoardAcSR, currentStation, originalStationList } = props;
|
||||
const {
|
||||
StationBoardAcSR,
|
||||
currentStation,
|
||||
originalStationList,
|
||||
favoriteStation,
|
||||
setFavoriteStation,
|
||||
busAndTrainData,
|
||||
} = props;
|
||||
const [trainBus, setTrainBus] = useState();
|
||||
useEffect(() => {
|
||||
if (!currentStation) return () => {};
|
||||
const data = busAndTrainData.filter((d) => {
|
||||
return d.name === currentStation[0].Station_JP;
|
||||
});
|
||||
if (data.length == 0) {
|
||||
setTrainBus();
|
||||
}
|
||||
setTrainBus(data[0]);
|
||||
}, [currentStation]);
|
||||
|
||||
return (
|
||||
<ActionSheet
|
||||
@ -38,12 +70,30 @@ export const StationDeteilView = (props) => {
|
||||
</View>
|
||||
<View>
|
||||
{currentStation && (
|
||||
<View
|
||||
style={{
|
||||
margin: 10,
|
||||
marginHorizontal: wp("10%"),
|
||||
}}
|
||||
>
|
||||
<Sign
|
||||
currentStation={currentStation}
|
||||
originalStationList={originalStationList}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
oP={() => Linking.openURL(currentStation[0].StationTimeTable)}
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
{currentStation &&
|
||||
currentStation.map((d) => (
|
||||
<NexPreStationLine
|
||||
currentStation={d}
|
||||
originalStationList={originalStationList}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
/>
|
||||
))}
|
||||
{currentStation && (
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
{!currentStation[0].JrHpUrl || (
|
||||
@ -79,7 +129,17 @@ export const StationDeteilView = (props) => {
|
||||
Linking.openURL(currentStation[0].StationMap)
|
||||
}
|
||||
>
|
||||
GoogleMap
|
||||
Map
|
||||
</TicketBox>
|
||||
)}
|
||||
{!trainBus || (
|
||||
<TicketBox
|
||||
backgroundColor={"#CE5C00"}
|
||||
icon={<Ionicons name="bus" color="white" size={50} />}
|
||||
flex={1}
|
||||
onPressButton={() => Linking.openURL(trainBus.address)}
|
||||
>
|
||||
平行バス
|
||||
</TicketBox>
|
||||
)}
|
||||
</View>
|
||||
@ -89,3 +149,226 @@ export const StationDeteilView = (props) => {
|
||||
</ActionSheet>
|
||||
);
|
||||
};
|
||||
|
||||
const StationName = (props) => {
|
||||
const { stringData, ss } = props;
|
||||
return (
|
||||
<View style={ss}>
|
||||
<Text style={styleSheet.下枠駅名}>{stringData.Station_JP}</Text>
|
||||
<Text style={styleSheet.下枠駅名}>{stringData.Station_EN}</Text>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const NexPreStationLine = ({
|
||||
currentStation,
|
||||
originalStationList,
|
||||
oP,
|
||||
favoriteStation,
|
||||
setFavoriteStation,
|
||||
}) => {
|
||||
const [preStation, setPreStation] = useState();
|
||||
const [nexStation, setNexStation] = useState();
|
||||
const [lineName, setLineName] = useState();
|
||||
|
||||
useEffect(() => {
|
||||
getPreNextStation(currentStation);
|
||||
}, [currentStation]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!currentStation) return () => {};
|
||||
getPreNextStation(currentStation);
|
||||
}, []);
|
||||
const getPreNextStation = (now) => {
|
||||
const lineList = [
|
||||
"予讃線(高松-松山間)[Y]",
|
||||
"予讃線(松山-宇和島間)[U]",
|
||||
"予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]",
|
||||
"土讃線(多度津-高知間)[D]",
|
||||
"土讃線(高知-窪川間)[K]",
|
||||
"高徳線(高松-徳島間)[T]",
|
||||
"徳島線(徳島-阿波池田)[B]",
|
||||
"鳴門線(池谷-鳴門間)[N]",
|
||||
"瀬戸大橋線(宇多津-児島間)[M]",
|
||||
];
|
||||
let returnData;
|
||||
lineList.forEach((d) => {
|
||||
let cache = originalStationList[d].findIndex(
|
||||
(data) => data.StationNumber == now.StationNumber
|
||||
);
|
||||
if (cache != -1) {
|
||||
returnData = [
|
||||
originalStationList[d][cache - 1],
|
||||
originalStationList[d][cache + 1],
|
||||
d,
|
||||
];
|
||||
}
|
||||
});
|
||||
setPreStation(returnData[0]);
|
||||
setNexStation(returnData[1]);
|
||||
setLineName(returnData[2]);
|
||||
};
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
height: 50,
|
||||
backgroundColor: lineName
|
||||
? lineColorList[lineName.split("[")[1].replace("]", "")]
|
||||
: "red",
|
||||
flexDirection: "row",
|
||||
alignContent: "center",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<View style={styleSheet.下枠フレーム}>
|
||||
{preStation ? (
|
||||
<>
|
||||
<Text style={styleSheet.下枠左右マーク}>◀</Text>
|
||||
{preStation.StationNumber ? (
|
||||
<View style={styleSheet.下枠駅ナンバー}>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text
|
||||
style={{
|
||||
fontSize: parseInt("10%"),
|
||||
color: "white",
|
||||
}}
|
||||
>
|
||||
{preStation.StationNumber}
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<StationName
|
||||
stringData={preStation}
|
||||
ss={{ flex: 1, alignItems: "flex-start" }}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
|
||||
<Text
|
||||
style={{
|
||||
fontSize: parseInt("10%"),
|
||||
color: "white",
|
||||
textAlign: "center",
|
||||
}}
|
||||
>
|
||||
{lineName &&
|
||||
lineName
|
||||
.split("(")
|
||||
.map((d, index) => (index == 1 ? "(" + d : d))
|
||||
.join("\n")}
|
||||
</Text>
|
||||
<View style={styleSheet.下枠フレーム}>
|
||||
{nexStation ? (
|
||||
<>
|
||||
<StationName
|
||||
stringData={nexStation}
|
||||
ss={{ flex: 1, alignItems: "flex-end" }}
|
||||
/>
|
||||
{nexStation.StationNumber ? (
|
||||
<View style={styleSheet.下枠駅ナンバー}>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: parseInt("15%"), color: "white" }}>
|
||||
{nexStation.StationNumber}
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styleSheet.下枠左右マーク}>▶</Text>
|
||||
</>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const styleSheet = {
|
||||
外枠: {
|
||||
width: wp("80%"),
|
||||
height: (wp("80%") / 20) * 9,
|
||||
borderColor: "#2E94BB",
|
||||
borderWidth: 1,
|
||||
backgroundColor: "white",
|
||||
},
|
||||
下帯: {
|
||||
position: "absolute",
|
||||
bottom: "0%",
|
||||
left: "0%",
|
||||
width: "100%",
|
||||
height: "30%",
|
||||
backgroundColor: "#2E94BB",
|
||||
},
|
||||
JRStyle: {
|
||||
position: "absolute",
|
||||
top: "2%",
|
||||
left: "2%",
|
||||
fontWeight: "bold",
|
||||
fontSize: parseInt("30%"),
|
||||
color: "#2E94BB",
|
||||
},
|
||||
stationNameAreaOverWrap: {
|
||||
position: "absolute",
|
||||
top: "10%",
|
||||
alignContent: "center",
|
||||
flexDirection: "row",
|
||||
},
|
||||
Station_JP: {
|
||||
fontWeight: "bold",
|
||||
fontSize: parseInt("40%"),
|
||||
color: "#005170",
|
||||
},
|
||||
Station_EN: {
|
||||
fontWeight: "bold",
|
||||
fontSize: parseInt("15%"),
|
||||
color: "#005170",
|
||||
},
|
||||
下帯内容: {
|
||||
position: "absolute",
|
||||
bottom: "0%",
|
||||
height: "30%",
|
||||
width: "100%",
|
||||
alignItems: "center",
|
||||
flexDirection: "column",
|
||||
},
|
||||
下枠フレーム: {
|
||||
flex: 1,
|
||||
flexDirection: "row",
|
||||
alignContent: "center",
|
||||
height: wp("10%"),
|
||||
},
|
||||
下枠左右マーク: {
|
||||
fontWeight: "bold",
|
||||
fontSize: parseInt("20%"),
|
||||
color: "white",
|
||||
paddingHorizontal: 10,
|
||||
textAlignVertical: "center",
|
||||
},
|
||||
下枠駅ナンバー: {
|
||||
alignContent: "center",
|
||||
alignItems: "center",
|
||||
width: wp("8%"),
|
||||
height: wp("8%"),
|
||||
margin: wp("1%"),
|
||||
borderColor: "white",
|
||||
borderWidth: parseInt("2%"),
|
||||
borderRadius: parseInt("100%"),
|
||||
},
|
||||
下枠駅名: {
|
||||
fontWeight: "bold",
|
||||
fontSize: parseInt("15%"),
|
||||
color: "white",
|
||||
flex: 1,
|
||||
paddingHorizontal: 0,
|
||||
marginVertical: 0,
|
||||
textAlignVertical: "center",
|
||||
},
|
||||
};
|
||||
|
||||
111
components/FavoriteList.js
Normal file
111
components/FavoriteList.js
Normal file
@ -0,0 +1,111 @@
|
||||
import React, { Component, useRef, useState, useEffect } from "react";
|
||||
import { View, Text, TouchableOpacity, ScrollView } from "react-native";
|
||||
import { WebView } from "react-native-webview";
|
||||
import { ListItem } from "native-base";
|
||||
import Icon from "react-native-vector-icons/Entypo";
|
||||
import StatusbarDetect from "../StatusbarDetect";
|
||||
import { AS } from "../storageControl";
|
||||
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;
|
||||
|
||||
return (
|
||||
<View style={{ height: "100%", backgroundColor: "#0099CC" }}>
|
||||
<Text
|
||||
style={{
|
||||
textAlign: "center",
|
||||
fontSize: 25,
|
||||
color: "white",
|
||||
fontWeight: "bold",
|
||||
paddingVertical: 10,
|
||||
}}
|
||||
>
|
||||
位置情報クイック移動メニュー
|
||||
</Text>
|
||||
<ScrollView style={{ height: "100%", backgroundColor: "white" }}>
|
||||
{favoriteStation
|
||||
.filter((d) => d[0].StationMap)
|
||||
.map((currentStation) => {
|
||||
return (
|
||||
<ListItem
|
||||
onPress={() => {
|
||||
const getStationLine = (now) => {
|
||||
const returnData = Object.keys(stationData).filter((d) => {
|
||||
const cache = stationData[d].findIndex(
|
||||
(data) => data.Station_JP == now.Station_JP
|
||||
);
|
||||
return cache != -1;
|
||||
});
|
||||
return returnData[0];
|
||||
};
|
||||
const lineName = getStationLine(currentStation[0]);
|
||||
|
||||
webview.current?.injectJavaScript(
|
||||
`MoveDisplayStation('${lineName}_${currentStation[0].MyStation}_${currentStation[0].Station_JP}')`
|
||||
);
|
||||
navigate("Apps");
|
||||
}}
|
||||
>
|
||||
<Text style={{ fontSize: 20, flex: 2 }}>
|
||||
{currentStation
|
||||
.map((d) => d.StationNumber)
|
||||
.filter((d) => d !== null)
|
||||
.join("/")}
|
||||
</Text>
|
||||
<Text style={{ fontSize: 20, flex: 3 }}>
|
||||
{currentStation[0].Station_JP}
|
||||
</Text>
|
||||
<View
|
||||
style={{
|
||||
flex: 2,
|
||||
flexDirection: "row",
|
||||
alignContent: "center",
|
||||
alignItems: "center",
|
||||
}}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: 20 }}>移動する</Text>
|
||||
<Icon name="chevron-right" size={20} />
|
||||
</View>
|
||||
</ListItem>
|
||||
);
|
||||
})}
|
||||
</ScrollView>
|
||||
<Text
|
||||
style={{
|
||||
backgroundColor: "white",
|
||||
borderWidth: 1,
|
||||
borderStyle: "solid",
|
||||
}}
|
||||
>
|
||||
お気に入り登録した駅のうち、位置情報システムで移動可能な駅が表示されています。タップすることで位置情報システムの当該の駅に移動します。
|
||||
</Text>
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
padding: 10,
|
||||
flexDirection: "row",
|
||||
borderColor: "white",
|
||||
borderWidth: 1,
|
||||
margin: 10,
|
||||
borderRadius: 5,
|
||||
alignItems: "center",
|
||||
}}
|
||||
onPress={() => navigation.goBack()}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: 25, fontWeight: "bold", color: "white" }}>
|
||||
閉じる
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
@ -102,7 +102,7 @@ export default function Setting(props) {
|
||||
textAlignVertical: "center",
|
||||
}}
|
||||
>
|
||||
内部バージョン: 4.4.2.9
|
||||
内部バージョン: 4.5 beta-2
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
|
||||
@ -2,11 +2,10 @@ import React, { useRef } from "react";
|
||||
import { View, Text, TouchableOpacity, Linking } from "react-native";
|
||||
import MapView, { Marker } from "react-native-maps";
|
||||
import { MaterialCommunityIcons } from "@expo/vector-icons";
|
||||
export default function trainMenu({
|
||||
route: {
|
||||
params: { webview, stationData },
|
||||
},
|
||||
export default function TrainMenu({
|
||||
navigation: { navigate },
|
||||
webview,
|
||||
stationData,
|
||||
}) {
|
||||
const mapRef = useRef();
|
||||
return (
|
||||
@ -67,12 +66,7 @@ export default function trainMenu({
|
||||
backgroundColor={"#EA4752"}
|
||||
icon="star"
|
||||
flex={1}
|
||||
onPressButton={() =>
|
||||
/* Linking.openURL(
|
||||
"https://www.jr-shikoku.co.jp/01_trainbus/jikoku/sp/#mainprice-box"
|
||||
) */
|
||||
alert("お気に入り駅登録機能は現在開発中です！レイアウト募集中！")
|
||||
}
|
||||
onPressButton={() => navigate("favoriteList")}
|
||||
>
|
||||
お気に入り
|
||||
</UsefulBox>
|
||||
@ -99,9 +93,7 @@ export default function trainMenu({
|
||||
borderRadius: 5,
|
||||
alignItems: "center",
|
||||
}}
|
||||
onPress={() => {
|
||||
navigate("Apps");
|
||||
}}
|
||||
onPress={() => navigate("Apps")}
|
||||
>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: 25, fontWeight: "bold", color: "white" }}>
|
||||
|
||||
@ -138,7 +138,6 @@ export default function LED_vision(props) {
|
||||
});
|
||||
return { train: d, time: a.time, lastStation: a.lastStation };
|
||||
});
|
||||
console.log(returnData);
|
||||
return returnData.sort((a, b) => {
|
||||
switch (true) {
|
||||
case parseInt(a.time.split(":")[0]) < parseInt(b.time.split(":")[0]):
|
||||
@ -280,7 +279,7 @@ const Footer = ({
|
||||
setFinalSwitch,
|
||||
}) => {
|
||||
return (
|
||||
<View style={{ flexDirection: "row", padding: 10 }}>
|
||||
<View style={{ flexDirection: "row", padding: 10, alignItems: "center" }}>
|
||||
<Text
|
||||
style={{
|
||||
alignItems: "center",
|
||||
@ -404,7 +403,7 @@ const TrainName = ({ train, trainIDSwitch, d, getTrainType }) => {
|
||||
<View style={{ flex: 9 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: trainName.length > 6 ? 15 : 20,
|
||||
fontSize: trainName.length > 6 ? parseInt("13%") : parseInt("18%"),
|
||||
color: getTrainType.color,
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
@ -422,7 +421,8 @@ const LastStation = ({ d }) => {
|
||||
<View style={{ flex: 4, flexDirection: "row" }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: d.lastStation.length > 4 ? 15 : 20,
|
||||
fontSize:
|
||||
d.lastStation.length > 4 ? parseInt("13%") : parseInt("18%"),
|
||||
color: "white",
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
@ -437,7 +437,7 @@ const DependTime = ({ d }) => {
|
||||
<View style={{ flex: 3 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
fontSize: parseInt("18%"),
|
||||
color: "white",
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
@ -486,9 +486,10 @@ const StatusAndDelay = ({ currentTrain, d, props, trainDescriptionSwitch }) => {
|
||||
<View style={{ flex: 4 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
fontSize: parseInt("18%"),
|
||||
color: "white",
|
||||
fontWeight: "bold",
|
||||
paddingLeft: 1,
|
||||
}}
|
||||
>
|
||||
{status}
|
||||
@ -512,7 +513,7 @@ const Description = ({ train }) => {
|
||||
<View style={{ flex: 4 }}>
|
||||
<Text
|
||||
style={{
|
||||
fontSize: 20,
|
||||
fontSize: parseInt("18%"),
|
||||
color: "green",
|
||||
fontWeight: "bold",
|
||||
}}
|
||||
|
||||
@ -12,21 +12,42 @@ import {
|
||||
widthPercentageToDP as wp,
|
||||
heightPercentageToDP as hp,
|
||||
} from "react-native-responsive-screen";
|
||||
import LottieView from "lottie-react-native";
|
||||
import { useInterval } from "../../lib/useInterval";
|
||||
import { AS } from "../../storageControl";
|
||||
|
||||
export default function Sign(props) {
|
||||
const { currentStation, originalStationList, oP } = props;
|
||||
const {
|
||||
currentStation,
|
||||
originalStationList,
|
||||
oP,
|
||||
favoriteStation,
|
||||
setFavoriteStation,
|
||||
} = props;
|
||||
const [nexPrePosition, setNexPrePosition] = useState(0);
|
||||
|
||||
const [preStation, setPreStation] = useState();
|
||||
const [nexStation, setNexStation] = useState();
|
||||
const [testButtonStatus, setTestButtonStatus] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const isFavorite = favoriteStation.filter((d) => {
|
||||
const compare = JSON.stringify(d);
|
||||
const current = JSON.stringify(currentStation);
|
||||
if (compare === current) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
setTestButtonStatus(isFavorite.length != 0);
|
||||
}, [favoriteStation, currentStation]);
|
||||
|
||||
useInterval(() => {
|
||||
if (currentStation.length == 1) {
|
||||
setNexPrePosition(0);
|
||||
return () => {};
|
||||
}
|
||||
LayoutAnimation.easeInEaseOut();
|
||||
setNexPrePosition(
|
||||
nexPrePosition + 1 == currentStation.length ? 0 : nexPrePosition + 1
|
||||
);
|
||||
@ -43,15 +64,15 @@ export default function Sign(props) {
|
||||
}, [nexPrePosition]);
|
||||
const getPreNextStation = (now) => {
|
||||
const lineList = [
|
||||
"予讃線",
|
||||
"松宇線",
|
||||
"伊予灘線",
|
||||
"土讃線",
|
||||
"窪川線",
|
||||
"高徳線",
|
||||
"徳島線",
|
||||
"鳴門線",
|
||||
"瀬戸大橋線",
|
||||
"予讃線(高松-松山間)[Y]",
|
||||
"予讃線(松山-宇和島間)[U]",
|
||||
"予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]",
|
||||
"土讃線(多度津-高知間)[D]",
|
||||
"土讃線(高知-窪川間)[K]",
|
||||
"高徳線(高松-徳島間)[T]",
|
||||
"徳島線(徳島-阿波池田)[B]",
|
||||
"鳴門線(池谷-鳴門間)[N]",
|
||||
"瀬戸大橋線(宇多津-児島間)[M]",
|
||||
];
|
||||
let returnData;
|
||||
lineList.forEach((d) => {
|
||||
@ -68,10 +89,45 @@ export default function Sign(props) {
|
||||
setPreStation(returnData[0]);
|
||||
setNexStation(returnData[1]);
|
||||
};
|
||||
const lottieRef = useRef();
|
||||
return (
|
||||
<TouchableOpacity style={styleSheet.外枠} onPress={oP}>
|
||||
<StationNumberMaker currentStation={currentStation} />
|
||||
<StationNameArea currentStation={currentStation} />
|
||||
<TouchableOpacity
|
||||
style={{ position: "absolute", right: -15, top: -20 }}
|
||||
onPress={() => {
|
||||
if (testButtonStatus) {
|
||||
const otherData = favoriteStation.filter((d) => {
|
||||
const compare = JSON.stringify(d);
|
||||
const current = JSON.stringify(currentStation);
|
||||
if (compare !== current) {
|
||||
return true;
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
AS.setItem("favoriteStation", JSON.stringify(otherData));
|
||||
setFavoriteStation(otherData);
|
||||
} else {
|
||||
let ret = favoriteStation;
|
||||
ret.push(currentStation);
|
||||
AS.setItem("favoriteStation", JSON.stringify(ret));
|
||||
setFavoriteStation(ret);
|
||||
}
|
||||
setTestButtonStatus(!testButtonStatus);
|
||||
}}
|
||||
>
|
||||
<LottieDelayView
|
||||
progress={testButtonStatus ? 1 : 0}
|
||||
speed={1.4}
|
||||
style={{ width: 80, height: 80 }}
|
||||
source={require("../../assets/939-star.json")}
|
||||
lottieRef={lottieRef}
|
||||
loop={false}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
|
||||
<Text style={styleSheet.JRStyle}>JR</Text>
|
||||
<View style={styleSheet.下帯} />
|
||||
<View style={styleSheet.下帯内容}>
|
||||
@ -81,14 +137,45 @@ export default function Sign(props) {
|
||||
);
|
||||
}
|
||||
|
||||
const LottieDelayView = ({
|
||||
progress,
|
||||
speed,
|
||||
style,
|
||||
source,
|
||||
lottieRef,
|
||||
loop,
|
||||
}) => {
|
||||
const [progressState, setProgressState] = useState(undefined);
|
||||
useEffect(() => {
|
||||
if (progress == 0) {
|
||||
lottieRef.current.play(progressState !== undefined ? 35 : 7, 7);
|
||||
} else {
|
||||
lottieRef.current.play(progressState !== undefined ? 7 : 35, 35);
|
||||
}
|
||||
}, [progress]);
|
||||
return (
|
||||
<LottieView
|
||||
progress={progressState}
|
||||
speed={speed}
|
||||
style={style}
|
||||
source={source}
|
||||
ref={lottieRef}
|
||||
loop={loop}
|
||||
onAnimationFinish={(isCanceled) => {
|
||||
console.log("finish");
|
||||
setProgressState(progress);
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
const NexPreStationLine = ({ nexStation, preStation }) => {
|
||||
return (
|
||||
<View style={styleSheet.下枠フレーム}>
|
||||
<View style={styleSheet.下枠フレーム}>
|
||||
{preStation && (
|
||||
{preStation ? (
|
||||
<>
|
||||
<Text style={styleSheet.下枠左右マーク}>◀</Text>
|
||||
{preStation.StationNumber && (
|
||||
{preStation.StationNumber ? (
|
||||
<View style={styleSheet.下枠駅ナンバー}>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text
|
||||
@ -101,22 +188,26 @@ const NexPreStationLine = ({ nexStation, preStation }) => {
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<StationName
|
||||
stringData={preStation}
|
||||
ss={{ flex: 1, alignItems: "flex-start" }}
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
<View style={styleSheet.下枠フレーム}>
|
||||
{nexStation && (
|
||||
{nexStation ? (
|
||||
<>
|
||||
<StationName
|
||||
stringData={nexStation}
|
||||
ss={{ flex: 1, alignItems: "flex-end" }}
|
||||
/>
|
||||
{nexStation.StationNumber && (
|
||||
{nexStation.StationNumber ? (
|
||||
<View style={styleSheet.下枠駅ナンバー}>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: parseInt("10%"), color: "white" }}>
|
||||
@ -124,9 +215,13 @@ const NexPreStationLine = ({ nexStation, preStation }) => {
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
<Text style={styleSheet.下枠左右マーク}>▶</Text>
|
||||
</>
|
||||
) : (
|
||||
<></>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
@ -199,8 +294,6 @@ const styleSheet = {
|
||||
height: (wp("80%") / 20) * 9,
|
||||
borderColor: "#2E94BB",
|
||||
borderWidth: 1,
|
||||
margin: 10,
|
||||
marginHorizontal: wp("10%"),
|
||||
backgroundColor: "white",
|
||||
},
|
||||
下帯: {
|
||||
@ -247,6 +340,7 @@ const styleSheet = {
|
||||
flex: 1,
|
||||
flexDirection: "row",
|
||||
alignContent: "center",
|
||||
alignItems: "center",
|
||||
},
|
||||
下枠左右マーク: {
|
||||
fontWeight: "bold",
|
||||
|
||||
6
eas.json
6
eas.json
@ -15,6 +15,12 @@
|
||||
},
|
||||
"production": {
|
||||
"releaseChannel": "aliexpress"
|
||||
},
|
||||
"beta4.5": {
|
||||
"releaseChannel": "base"
|
||||
},
|
||||
"production4.5": {
|
||||
"releaseChannel": "buyma"
|
||||
}
|
||||
},
|
||||
"submit": {
|
||||
|
||||
@ -19,15 +19,15 @@ import train_lang from "../assets/originData/train_lang";
|
||||
let status = undefined;
|
||||
|
||||
export const lineList = [
|
||||
"予讃線",
|
||||
"松宇線",
|
||||
"伊予灘線",
|
||||
"土讃線",
|
||||
"窪川線",
|
||||
"高徳線",
|
||||
"徳島線",
|
||||
"鳴門線",
|
||||
"瀬戸大橋線",
|
||||
"予讃線(高松-松山間)[Y]",
|
||||
"予讃線(松山-宇和島間)[U]",
|
||||
"予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]",
|
||||
"土讃線(多度津-高知間)[D]",
|
||||
"土讃線(高知-窪川間)[K]",
|
||||
"高徳線(高松-徳島間)[T]",
|
||||
"徳島線(徳島-阿波池田)[B]",
|
||||
"鳴門線(池谷-鳴門間)[N]",
|
||||
"瀬戸大橋線(宇多津-児島間)[M]",
|
||||
];
|
||||
|
||||
export const getStationList = async (props) => {
|
||||
@ -53,15 +53,15 @@ export const getStationList = async (props) => {
|
||||
]).then((values) => {
|
||||
let stationList = {};
|
||||
[
|
||||
stationList.予讃線,
|
||||
stationList.松宇線,
|
||||
stationList.伊予灘線,
|
||||
stationList.土讃線,
|
||||
stationList.窪川線,
|
||||
stationList.高徳線,
|
||||
stationList.徳島線,
|
||||
stationList.鳴門線,
|
||||
stationList.瀬戸大橋線,
|
||||
stationList["予讃線(高松-松山間)[Y]"],
|
||||
stationList["予讃線(松山-宇和島間)[U]"],
|
||||
stationList["予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]"],
|
||||
stationList["土讃線(多度津-高知間)[D]"],
|
||||
stationList["土讃線(高知-窪川間)[K]"],
|
||||
stationList["高徳線(高松-徳島間)[T]"],
|
||||
stationList["徳島線(徳島-阿波池田)[B]"],
|
||||
stationList["鳴門線(池谷-鳴門間)[N]"],
|
||||
stationList["瀬戸大橋線(宇多津-児島間)[M]"],
|
||||
stationList.駅間リスト,
|
||||
stationList.日英対応表,
|
||||
] = values;
|
||||
@ -115,52 +115,55 @@ export const getStationList = async (props) => {
|
||||
return data;
|
||||
});
|
||||
};
|
||||
stationList.予讃線 = addStationPosition(
|
||||
concatBetweenStations(stationList.予讃線),
|
||||
stationList["予讃線(高松-松山間)[Y]"] = addStationPosition(
|
||||
concatBetweenStations(stationList["予讃線(高松-松山間)[Y]"]),
|
||||
予讃線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.松宇線 = addStationPosition(
|
||||
concatBetweenStations(stationList.松宇線),
|
||||
stationList["予讃線(松山-宇和島間)[U]"] = addStationPosition(
|
||||
concatBetweenStations(stationList["予讃線(松山-宇和島間)[U]"]),
|
||||
予讃線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.伊予灘線 = addStationPosition(
|
||||
concatBetweenStations(stationList.伊予灘線),
|
||||
stationList["予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]"] =
|
||||
addStationPosition(
|
||||
concatBetweenStations(
|
||||
stationList["予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]"]
|
||||
),
|
||||
予讃線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.土讃線 = addStationPosition(
|
||||
concatBetweenStations(stationList.土讃線),
|
||||
stationList["土讃線(多度津-高知間)[D]"] = addStationPosition(
|
||||
concatBetweenStations(stationList["土讃線(多度津-高知間)[D]"]),
|
||||
土讃線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.窪川線 = addStationPosition(
|
||||
concatBetweenStations(stationList.窪川線),
|
||||
stationList["土讃線(高知-窪川間)[K]"] = addStationPosition(
|
||||
concatBetweenStations(stationList["土讃線(高知-窪川間)[K]"]),
|
||||
土讃線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.高徳線 = addStationPosition(
|
||||
concatBetweenStations(stationList.高徳線),
|
||||
stationList["高徳線(高松-徳島間)[T]"] = addStationPosition(
|
||||
concatBetweenStations(stationList["高徳線(高松-徳島間)[T]"]),
|
||||
高徳線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.鳴門線 = addStationPosition(
|
||||
concatBetweenStations(stationList.鳴門線),
|
||||
stationList["鳴門線(池谷-鳴門間)[N]"] = addStationPosition(
|
||||
concatBetweenStations(stationList["鳴門線(池谷-鳴門間)[N]"]),
|
||||
鳴門線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
const tokushimaCurrent = addStationPosition(
|
||||
concatBetweenStations(stationList.徳島線),
|
||||
concatBetweenStations(stationList["徳島線(徳島-阿波池田)[B]"]),
|
||||
徳島線,
|
||||
stationList.日英対応表
|
||||
);
|
||||
stationList.徳島線 = [
|
||||
stationList["徳島線(徳島-阿波池田)[B]"] = [
|
||||
tokushimaCurrent[tokushimaCurrent.length - 1],
|
||||
...tokushimaCurrent,
|
||||
];
|
||||
stationList.徳島線.pop();
|
||||
stationList.瀬戸大橋線 = [
|
||||
stationList["徳島線(徳島-阿波池田)[B]"].pop();
|
||||
stationList["瀬戸大橋線(宇多津-児島間)[M]"] = [
|
||||
{
|
||||
Station_JP: "坂出",
|
||||
Station_EN: "Sakaide",
|
||||
|
||||
519
menu.js
519
menu.js
@ -1,12 +1,13 @@
|
||||
import React, { useRef, useState, useEffect } from "react";
|
||||
import Carousel from "react-native-snap-carousel";
|
||||
import {
|
||||
Platform,
|
||||
View,
|
||||
LayoutAnimation,
|
||||
ScrollView,
|
||||
Linking,
|
||||
Text,
|
||||
TouchableOpacity,
|
||||
ToastAndroid,
|
||||
} from "react-native";
|
||||
import Constants from "expo-constants";
|
||||
import { ListItem } from "native-base";
|
||||
@ -38,44 +39,29 @@ import useInterval from "./lib/useInterval";
|
||||
export default function Menu(props) {
|
||||
const {
|
||||
navigation: { navigate },
|
||||
favoriteStation,
|
||||
setFavoriteStation,
|
||||
busAndTrainData,
|
||||
} = props;
|
||||
const JRSTraInfoEXAcSR = useRef(null);
|
||||
const StationBoardAcSR = useRef(null);
|
||||
const navigation = useNavigation();
|
||||
|
||||
//位置情報
|
||||
const [location, setLocation] = useState(null);
|
||||
const [locationStatus, setLocationStatus] = useState(null);
|
||||
useEffect(() => {
|
||||
Location.requestForegroundPermissionsAsync().then((data) => {
|
||||
setLocationStatus(data.status);
|
||||
});
|
||||
}, []);
|
||||
useEffect(() => {
|
||||
if (locationStatus !== "granted") return () => {};
|
||||
getCurrentPosition();
|
||||
}, [locationStatus]);
|
||||
|
||||
const getCurrentPosition = () => {
|
||||
if (locationStatus !== "granted") return () => {};
|
||||
Location.getCurrentPositionAsync({}).then((location) =>
|
||||
setLocation(location)
|
||||
makeCurrentStation(location)
|
||||
);
|
||||
};
|
||||
|
||||
useInterval(() => {
|
||||
if (locationStatus !== "granted") return () => {};
|
||||
getCurrentPosition();
|
||||
}, 5000);
|
||||
|
||||
const [originalStationList, setOriginalStationList] = useState();
|
||||
useEffect(() => {
|
||||
getStationList().then(setOriginalStationList);
|
||||
}, []);
|
||||
|
||||
const [stationName, setStationName] = useState(undefined);
|
||||
const [currentStation, setCurrentStation] = useState(undefined);
|
||||
useEffect(() => {
|
||||
if (!location) return () => {};
|
||||
const makeCurrentStation = (location) => {
|
||||
if (!originalStationList) return () => {};
|
||||
const findStationEachLine = (selectLine) => {
|
||||
const searchArea = 0.0015;
|
||||
@ -101,7 +87,6 @@ export default function Menu(props) {
|
||||
pre.push(...current);
|
||||
return pre;
|
||||
}, []);
|
||||
LayoutAnimation.easeInEaseOut();
|
||||
if (returnDataBase.length) {
|
||||
let currentStation = currentStation == undefined ? [] : currentStation;
|
||||
if (currentStation.toString() != returnDataBase.toString()) {
|
||||
@ -109,14 +94,23 @@ export default function Menu(props) {
|
||||
}
|
||||
} else {
|
||||
setCurrentStation(undefined);
|
||||
StationBoardAcSR.current?.hide();
|
||||
}
|
||||
}, [location, originalStationList]);
|
||||
};
|
||||
|
||||
useEffect(getCurrentPosition, [locationStatus]);
|
||||
useInterval(getCurrentPosition, 5000);
|
||||
|
||||
const [currentStation, setCurrentStation] = useState(undefined); //第三要素
|
||||
|
||||
const [originalStationList, setOriginalStationList] = useState(); // 第一要素
|
||||
useEffect(() => getStationList().then(setOriginalStationList), []);
|
||||
|
||||
const [count, setCount] = useState(0);
|
||||
const [delayData, setDelayData] = useState(undefined);
|
||||
const [getTime, setGetTime] = useState(new Date());
|
||||
const [loadingDelayData, setLoadingDelayData] = useState(true);
|
||||
const carouselRef = useRef();
|
||||
const [selectedCurrentStation, setSelectedCurrentStation] = useState(0);
|
||||
|
||||
useEffect(() => {
|
||||
fetch(
|
||||
@ -124,11 +118,32 @@ export default function Menu(props) {
|
||||
)
|
||||
.then((response) => response.text())
|
||||
.then((data) => setDelayData(data !== "" ? data.split("^") : null))
|
||||
.then(LayoutAnimation.easeInEaseOut)
|
||||
.then(() => setGetTime(new Date()))
|
||||
.finally(() => setLoadingDelayData(false));
|
||||
}, [loadingDelayData]);
|
||||
|
||||
const allStationData = [currentStation, ...favoriteStation].filter(
|
||||
(d) => d != undefined
|
||||
);
|
||||
console.log(allStationData);
|
||||
useEffect(() => {
|
||||
if (allStationData.length == 0) {
|
||||
setSelectedCurrentStation(0);
|
||||
return;
|
||||
}
|
||||
console.log(allStationData[selectedCurrentStation]);
|
||||
if (allStationData[selectedCurrentStation] == undefined) {
|
||||
const count = selectedCurrentStation - 1;
|
||||
setSelectedCurrentStation(count);
|
||||
}
|
||||
}, [selectedCurrentStation, currentStation, favoriteStation]);
|
||||
useEffect(() => {
|
||||
if (!carouselRef.current) return;
|
||||
console.log(carouselRef.current);
|
||||
if (carouselRef.current?._itemToSnapTo != selectedCurrentStation) {
|
||||
carouselRef.current.snapToItem(0);
|
||||
carouselRef.current.snapToItem(selectedCurrentStation);
|
||||
}
|
||||
}, [selectedCurrentStation]);
|
||||
return (
|
||||
<View
|
||||
style={{
|
||||
@ -140,6 +155,248 @@ export default function Menu(props) {
|
||||
<StatusbarDetect />
|
||||
<TitleBar />
|
||||
<ScrollView>
|
||||
<FixedContentTop navigate={navigate} />
|
||||
{originalStationList && allStationData.length != 0 && (
|
||||
<Carousel
|
||||
ref={carouselRef}
|
||||
layout={"default"}
|
||||
data={originalStationList && allStationData}
|
||||
sliderWidth={wp("100%")}
|
||||
itemWidth={wp("80%")}
|
||||
enableMomentum
|
||||
callbackOffsetMargin={1000}
|
||||
activeAnimationOptions={0.3}
|
||||
onSnapToItem={(d) => {
|
||||
setSelectedCurrentStation(d);
|
||||
}}
|
||||
renderItem={({ item, index }) => {
|
||||
return (
|
||||
<View
|
||||
style={{ marginVertical: 10 }}
|
||||
key={item[0].StationNumber}
|
||||
>
|
||||
<Sign
|
||||
currentStation={item}
|
||||
originalStationList={originalStationList}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
oP={StationBoardAcSR.current?.setModalVisible}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
{allStationData.length != 0 &&
|
||||
originalStationList &&
|
||||
allStationData[selectedCurrentStation] && (
|
||||
<LED_vision
|
||||
station={
|
||||
originalStationList && allStationData[selectedCurrentStation][0]
|
||||
}
|
||||
navigate={navigate}
|
||||
/>
|
||||
)}
|
||||
<JRSTraInfoBox
|
||||
JRSTraInfoEXAcSR={JRSTraInfoEXAcSR}
|
||||
getTime={getTime}
|
||||
setLoadingDelayData={setLoadingDelayData}
|
||||
loadingDelayData={loadingDelayData}
|
||||
delayData={delayData}
|
||||
/>
|
||||
<FixedContentBottom navigate={navigate} />
|
||||
</ScrollView>
|
||||
|
||||
<StationDeteilView
|
||||
StationBoardAcSR={StationBoardAcSR}
|
||||
currentStation={
|
||||
originalStationList &&
|
||||
allStationData.length != 0 &&
|
||||
allStationData[selectedCurrentStation]
|
||||
}
|
||||
originalStationList={originalStationList}
|
||||
favoriteStation={favoriteStation}
|
||||
setFavoriteStation={setFavoriteStation}
|
||||
busAndTrainData={busAndTrainData}
|
||||
/>
|
||||
<JRSTraInfo
|
||||
JRSTraInfoEXAcSR={JRSTraInfoEXAcSR}
|
||||
getTime={getTime}
|
||||
loadingDelayData={loadingDelayData}
|
||||
setLoadingDelayData={setLoadingDelayData}
|
||||
delayData={delayData}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const TitleBar = () => {
|
||||
return (
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<TouchableOpacity
|
||||
onPress={() => Linking.openURL("https://www.jr-shikoku.co.jp")}
|
||||
>
|
||||
<AutoHeightImage
|
||||
source={require("./assets/Header.png")}
|
||||
resizeMode="contain"
|
||||
width={wp("100%")}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const TopMenuButton = () => {
|
||||
const buttonList = [
|
||||
{
|
||||
backgroundColor: "#F89038",
|
||||
icon: "train-car",
|
||||
onPress: () =>
|
||||
Linking.openURL("https://www.jr-shikoku.co.jp/01_trainbus/sp/"),
|
||||
title: "駅・鉄道情報",
|
||||
},
|
||||
{
|
||||
backgroundColor: "#EA4752",
|
||||
icon: "google-spreadsheet",
|
||||
onPress: () =>
|
||||
Linking.openURL(
|
||||
"https://www.jr-shikoku.co.jp/01_trainbus/jikoku/sp/#mainprice-box"
|
||||
),
|
||||
title: "運賃表",
|
||||
},
|
||||
{
|
||||
backgroundColor: "#91C31F",
|
||||
icon: "clipboard-list-outline",
|
||||
onPress: () => Linking.openURL("https://www.jr-shikoku.co.jp/e5489/"),
|
||||
title: "予約",
|
||||
},
|
||||
];
|
||||
return (
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
{buttonList.map((d, index) => (
|
||||
<UsefulBox
|
||||
backgroundColor={d.backgroundColor}
|
||||
icon={d.icon}
|
||||
flex={1}
|
||||
onPressButton={d.onPress}
|
||||
key={index + d.icon}
|
||||
>
|
||||
{d.title}
|
||||
</UsefulBox>
|
||||
))}
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const JRSTraInfoBox = (props) => {
|
||||
const {
|
||||
JRSTraInfoEXAcSR,
|
||||
getTime,
|
||||
setLoadingDelayData,
|
||||
loadingDelayData,
|
||||
delayData,
|
||||
} = props;
|
||||
const styles = {
|
||||
touch: {
|
||||
backgroundColor: "#0099CC",
|
||||
borderRadius: 5,
|
||||
margin: 10,
|
||||
borderColor: "black",
|
||||
borderWidth: 2,
|
||||
overflow: "hidden",
|
||||
},
|
||||
scroll: {
|
||||
backgroundColor: "#0099CC",
|
||||
borderRadius: 5,
|
||||
maxHeight: 300,
|
||||
},
|
||||
bottom: {
|
||||
position: "absolute",
|
||||
top: 250,
|
||||
alignItems: "center",
|
||||
width: "100%",
|
||||
height: 50,
|
||||
backgroundColor: "#007FCC88",
|
||||
},
|
||||
box: {
|
||||
padding: 10,
|
||||
backgroundColor: "white",
|
||||
borderBottomLeftRadius: 5,
|
||||
borderBottomRightRadius: 5,
|
||||
},
|
||||
};
|
||||
return (
|
||||
<TouchableOpacity
|
||||
onPress={JRSTraInfoEXAcSR.current?.setModalVisible}
|
||||
style={styles.touch}
|
||||
>
|
||||
<ScrollView scrollEnabled={false} style={styles.scroll}>
|
||||
<View
|
||||
style={{ padding: 10, flexDirection: "row", alignItems: "center" }}
|
||||
>
|
||||
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
|
||||
列車遅延速報EX
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
|
||||
{getTime
|
||||
? getTime.toLocaleTimeString("ja-JP").split(":")[0] +
|
||||
":" +
|
||||
getTime.toLocaleTimeString("ja-JP").split(":")[1]
|
||||
: NaN}
|
||||
</Text>
|
||||
<Ionicons
|
||||
name="reload"
|
||||
color="white"
|
||||
size={30}
|
||||
style={{ margin: 5 }}
|
||||
onPress={() => {
|
||||
setLoadingDelayData(true);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.box}>
|
||||
{loadingDelayData ? (
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<LottieView
|
||||
autoPlay
|
||||
loop
|
||||
style={{ width: 150, height: 150, backgroundColor: "#fff" }}
|
||||
source={require("./assets/51690-loading-diamonds.json")}
|
||||
/>
|
||||
</View>
|
||||
) : delayData ? (
|
||||
delayData.map((d, index) => {
|
||||
let data = d.split(" ");
|
||||
return (
|
||||
<View style={{ flexDirection: "row" }} key={data[1] + "key"}>
|
||||
<Text style={{ flex: 15, fontSize: 20 }}>
|
||||
{data[0].replace("\n", "")}
|
||||
</Text>
|
||||
<Text style={{ flex: 5, fontSize: 20 }}>{data[1]}</Text>
|
||||
<Text style={{ flex: 6, fontSize: 20 }}>{data[3]}</Text>
|
||||
</View>
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<Text>現在、5分以上の遅れはありません。</Text>
|
||||
)}
|
||||
</View>
|
||||
</ScrollView>
|
||||
<View style={styles.bottom}>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
||||
詳細を見る
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
);
|
||||
};
|
||||
|
||||
const FixedContentTop = (props) => {
|
||||
return (
|
||||
<>
|
||||
<TopMenuButton />
|
||||
<TextBox
|
||||
backgroundColor="#0099CC"
|
||||
@ -157,23 +414,13 @@ export default function Menu(props) {
|
||||
列車の運行計画・混雑状況・感染症対策への取り組み
|
||||
</Text>
|
||||
</TextBox>
|
||||
{currentStation && (
|
||||
<>
|
||||
<Sign
|
||||
currentStation={currentStation}
|
||||
originalStationList={originalStationList}
|
||||
oP={StationBoardAcSR.current?.setModalVisible}
|
||||
/>
|
||||
<LED_vision station={currentStation[0]} navigate={navigate} />
|
||||
</>
|
||||
)}
|
||||
<JRSTraInfoBox
|
||||
JRSTraInfoEXAcSR={JRSTraInfoEXAcSR}
|
||||
getTime={getTime}
|
||||
setLoadingDelayData={setLoadingDelayData}
|
||||
loadingDelayData={loadingDelayData}
|
||||
delayData={delayData}
|
||||
/>
|
||||
);
|
||||
};
|
||||
const FixedContentBottom = (props) => {
|
||||
return (
|
||||
<>
|
||||
{props.children}
|
||||
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
<TicketBox
|
||||
@ -227,9 +474,7 @@ export default function Menu(props) {
|
||||
backgroundColor="#0099CC"
|
||||
flex={1}
|
||||
onPressButton={() =>
|
||||
Linking.openURL(
|
||||
"https://www.jr-shikoku.co.jp/sp/index.html#menu-box"
|
||||
)
|
||||
Linking.openURL("https://www.jr-shikoku.co.jp/sp/index.html#menu-box")
|
||||
}
|
||||
>
|
||||
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
||||
@ -438,7 +683,7 @@ export default function Menu(props) {
|
||||
<TextBox
|
||||
backgroundColor="black"
|
||||
flex={1}
|
||||
onPressButton={() => navigate("setting")}
|
||||
onPressButton={() => props.navigate("setting")}
|
||||
>
|
||||
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
||||
アプリの設定
|
||||
@ -453,184 +698,6 @@ export default function Menu(props) {
|
||||
height="200"
|
||||
source={require("./assets/トレインビジョン関係/1.svg")}
|
||||
/> */}
|
||||
</ScrollView>
|
||||
<StationDeteilView
|
||||
StationBoardAcSR={StationBoardAcSR}
|
||||
currentStation={currentStation}
|
||||
originalStationList={originalStationList}
|
||||
/>
|
||||
<JRSTraInfo
|
||||
JRSTraInfoEXAcSR={JRSTraInfoEXAcSR}
|
||||
getTime={getTime}
|
||||
loadingDelayData={loadingDelayData}
|
||||
setLoadingDelayData={setLoadingDelayData}
|
||||
delayData={delayData}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const TitleBar = () => {
|
||||
return (
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<TouchableOpacity
|
||||
onPress={() => Linking.openURL("https://www.jr-shikoku.co.jp")}
|
||||
>
|
||||
<AutoHeightImage
|
||||
source={require("./assets/Header.png")}
|
||||
resizeMode="contain"
|
||||
width={wp("100%")}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const TopMenuButton = () => {
|
||||
const buttonList = [
|
||||
{
|
||||
backgroundColor: "#F89038",
|
||||
icon: "train-car",
|
||||
onPress: () =>
|
||||
Linking.openURL("https://www.jr-shikoku.co.jp/01_trainbus/sp/"),
|
||||
title: "駅・鉄道情報",
|
||||
},
|
||||
{
|
||||
backgroundColor: "#EA4752",
|
||||
icon: "google-spreadsheet",
|
||||
onPress: () =>
|
||||
Linking.openURL(
|
||||
"https://www.jr-shikoku.co.jp/01_trainbus/jikoku/sp/#mainprice-box"
|
||||
),
|
||||
title: "運賃表",
|
||||
},
|
||||
{
|
||||
backgroundColor: "#91C31F",
|
||||
icon: "clipboard-list-outline",
|
||||
onPress: () => Linking.openURL("https://www.jr-shikoku.co.jp/e5489/"),
|
||||
title: "予約",
|
||||
},
|
||||
];
|
||||
return (
|
||||
<View style={{ flexDirection: "row" }}>
|
||||
{buttonList.map((d, index) => (
|
||||
<UsefulBox
|
||||
backgroundColor={d.backgroundColor}
|
||||
icon={d.icon}
|
||||
flex={1}
|
||||
onPressButton={d.onPress}
|
||||
key={index + d.icon}
|
||||
>
|
||||
{d.title}
|
||||
</UsefulBox>
|
||||
))}
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
const JRSTraInfoBox = (props) => {
|
||||
const {
|
||||
JRSTraInfoEXAcSR,
|
||||
getTime,
|
||||
setLoadingDelayData,
|
||||
loadingDelayData,
|
||||
delayData,
|
||||
} = props;
|
||||
const styles = {
|
||||
touch: {
|
||||
backgroundColor: "#0099CC",
|
||||
borderRadius: 5,
|
||||
margin: 10,
|
||||
borderColor: "black",
|
||||
borderWidth: 2,
|
||||
overflow: "hidden",
|
||||
},
|
||||
scroll: {
|
||||
backgroundColor: "#0099CC",
|
||||
borderRadius: 5,
|
||||
maxHeight: 300,
|
||||
},
|
||||
bottom: {
|
||||
position: "absolute",
|
||||
top: 250,
|
||||
alignItems: "center",
|
||||
width: "100%",
|
||||
height: 50,
|
||||
backgroundColor: "#007FCC88",
|
||||
},
|
||||
box: {
|
||||
padding: 10,
|
||||
backgroundColor: "white",
|
||||
borderBottomLeftRadius: 5,
|
||||
borderBottomRightRadius: 5,
|
||||
},
|
||||
};
|
||||
return (
|
||||
<TouchableOpacity
|
||||
onPress={JRSTraInfoEXAcSR.current?.setModalVisible}
|
||||
style={styles.touch}
|
||||
>
|
||||
<ScrollView scrollEnabled={false} style={styles.scroll}>
|
||||
<View
|
||||
style={{ padding: 10, flexDirection: "row", alignItems: "center" }}
|
||||
>
|
||||
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
|
||||
列車遅延速報EX
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
|
||||
{getTime
|
||||
? getTime.toLocaleTimeString("ja-JP").split(":")[0] +
|
||||
":" +
|
||||
getTime.toLocaleTimeString("ja-JP").split(":")[1]
|
||||
: NaN}
|
||||
</Text>
|
||||
<Ionicons
|
||||
name="reload"
|
||||
color="white"
|
||||
size={30}
|
||||
style={{ margin: 5 }}
|
||||
onPress={() => {
|
||||
LayoutAnimation.easeInEaseOut();
|
||||
setLoadingDelayData(true);
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
<View style={styles.box}>
|
||||
{loadingDelayData ? (
|
||||
<View style={{ alignItems: "center" }}>
|
||||
<LottieView
|
||||
autoPlay
|
||||
loop
|
||||
style={{ width: 150, height: 150, backgroundColor: "#fff" }}
|
||||
source={require("./assets/51690-loading-diamonds.json")}
|
||||
/>
|
||||
</View>
|
||||
) : delayData ? (
|
||||
delayData.map((d, index) => {
|
||||
let data = d.split(" ");
|
||||
return (
|
||||
<View style={{ flexDirection: "row" }} key={data[1] + "key"}>
|
||||
<Text style={{ flex: 15, fontSize: 20 }}>
|
||||
{data[0].replace("\n", "")}
|
||||
</Text>
|
||||
<Text style={{ flex: 5, fontSize: 20 }}>{data[1]}</Text>
|
||||
<Text style={{ flex: 6, fontSize: 20 }}>{data[3]}</Text>
|
||||
</View>
|
||||
);
|
||||
})
|
||||
) : (
|
||||
<Text>現在、5分以上の遅れはありません。</Text>
|
||||
)}
|
||||
</View>
|
||||
</ScrollView>
|
||||
<View style={styles.bottom}>
|
||||
<View style={{ flex: 1 }} />
|
||||
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
||||
詳細を見る
|
||||
</Text>
|
||||
<View style={{ flex: 1 }} />
|
||||
</View>
|
||||
</TouchableOpacity>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@ -36,6 +36,7 @@
|
||||
"react-native-router-flux": "^4.3.1",
|
||||
"react-native-safe-area-context": "4.5.0",
|
||||
"react-native-screens": "~3.20.0",
|
||||
"react-native-snap-carousel": "^3.9.1",
|
||||
"react-native-storage": "^1.0.1",
|
||||
"react-native-svg": "13.4.0",
|
||||
"react-native-svg-uri": "^1.2.3",
|
||||
|
||||
@ -12,7 +12,6 @@ import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons";
|
||||
export default function TrainBase({ route, navigation }) {
|
||||
const { info, from } = route.params;
|
||||
const { navigate } = navigation;
|
||||
console.log(info);
|
||||
const webview = useRef();
|
||||
const jss = `document.getElementById('Footer').style.display = 'none';
|
||||
${
|
||||
|
||||
54
yarn.lock
54
yarn.lock
@ -3614,6 +3614,11 @@ core-js@3.6.5:
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.6.5.tgz#7395dc273af37fb2e50e9bd3d9fe841285231d1a"
|
||||
integrity sha512-vZVEEwZoIsI+vPEuoF9Iqf5H7/M3eeQqWlQnYa8FSKKePuYTf5MWnxb5SDAzCa60b3JBRS5g9b+Dq7b1y/RCrA==
|
||||
|
||||
core-js@^1.0.0:
|
||||
version "1.2.7"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
|
||||
integrity sha512-ZiPp9pZlgxpWRu0M+YWbm6+aQ84XEfH1JRXvfOc/fILWI0VKhLC2LX13X1NYq4fULzLMq7Hfh43CSo2/aIaUPA==
|
||||
|
||||
core-js@^2.4.0:
|
||||
version "2.6.12"
|
||||
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec"
|
||||
@ -4386,6 +4391,19 @@ fbjs-css-vars@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/fbjs-css-vars/-/fbjs-css-vars-1.0.2.tgz#216551136ae02fe255932c3ec8775f18e2c078b8"
|
||||
integrity sha512-b2XGFAFdWZWg0phtAWLHCk836A1Xann+I+Dgd3Gk64MHKZO44FfoD1KxyvbSh0qZsIoXQGGlVztIY+oitJPpRQ==
|
||||
|
||||
fbjs@^0.8.4:
|
||||
version "0.8.18"
|
||||
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.18.tgz#9835e0addb9aca2eff53295cd79ca1cfc7c9662a"
|
||||
integrity sha512-EQaWFK+fEPSoibjNy8IxUtaFOMXcWsY0JaVrQoZR9zC8N2Ygf9iDITPWjUTVIax95b6I742JFLqASHfsag/vKA==
|
||||
dependencies:
|
||||
core-js "^1.0.0"
|
||||
isomorphic-fetch "^2.1.1"
|
||||
loose-envify "^1.0.0"
|
||||
object-assign "^4.1.0"
|
||||
promise "^7.1.1"
|
||||
setimmediate "^1.0.5"
|
||||
ua-parser-js "^0.7.30"
|
||||
|
||||
fbjs@^3.0.0:
|
||||
version "3.0.4"
|
||||
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-3.0.4.tgz#e1871c6bd3083bac71ff2da868ad5067d37716c6"
|
||||
@ -5408,6 +5426,14 @@ isobject@^3.0.0, isobject@^3.0.1:
|
||||
resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
|
||||
integrity sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg==
|
||||
|
||||
isomorphic-fetch@^2.1.1:
|
||||
version "2.2.1"
|
||||
resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9"
|
||||
integrity sha512-9c4TNAKYXM5PRyVcwUZrF3W09nQ+sO7+jydgs4ZGW9dhsLG2VOlISJABombdQqQRXCwuYG3sYV/puGf5rp0qmA==
|
||||
dependencies:
|
||||
node-fetch "^1.0.1"
|
||||
whatwg-fetch ">=0.10.0"
|
||||
|
||||
isstream@~0.1.2:
|
||||
version "0.1.2"
|
||||
resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
|
||||
@ -6834,6 +6860,14 @@ node-fetch@2.6.7:
|
||||
dependencies:
|
||||
whatwg-url "^5.0.0"
|
||||
|
||||
node-fetch@^1.0.1:
|
||||
version "1.7.3"
|
||||
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
|
||||
integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==
|
||||
dependencies:
|
||||
encoding "^0.1.11"
|
||||
is-stream "^1.0.1"
|
||||
|
||||
node-fetch@^2.2.0, node-fetch@^2.6.0, node-fetch@^2.6.1, node-fetch@^2.6.7:
|
||||
version "2.6.9"
|
||||
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.9.tgz#7c7f744b5cc6eb5fd404e0c7a9fec630a55657e6"
|
||||
@ -7644,7 +7678,7 @@ promzard@^0.3.0:
|
||||
dependencies:
|
||||
read "1"
|
||||
|
||||
prop-types@*, prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.2, prop-types@^15.7.2:
|
||||
prop-types@*, prop-types@^15.5.10, prop-types@^15.5.8, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
|
||||
version "15.8.1"
|
||||
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
|
||||
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
|
||||
@ -7806,6 +7840,14 @@ rc@~1.2.7:
|
||||
minimist "^1.2.0"
|
||||
strip-json-comments "~2.0.1"
|
||||
|
||||
react-addons-shallow-compare@15.6.2:
|
||||
version "15.6.2"
|
||||
resolved "https://registry.yarnpkg.com/react-addons-shallow-compare/-/react-addons-shallow-compare-15.6.2.tgz#198a00b91fc37623db64a28fd17b596ba362702f"
|
||||
integrity sha512-yAV9tOObmKPiohqne1jiMcx6kDjfz7GeL8K9KHgI+HvDsbrRv148uyUzrPc6GwepZnQcJ59Q3lp1ghrkyPwtjg==
|
||||
dependencies:
|
||||
fbjs "^0.8.4"
|
||||
object-assign "^4.1.0"
|
||||
|
||||
react-devtools-core@^4.26.1:
|
||||
version "4.27.2"
|
||||
resolved "https://registry.yarnpkg.com/react-devtools-core/-/react-devtools-core-4.27.2.tgz#d20fc57e258c656eedabafc2c851d38b33583148"
|
||||
@ -7997,6 +8039,14 @@ react-native-size-matters@^0.3.1:
|
||||
resolved "https://registry.yarnpkg.com/react-native-size-matters/-/react-native-size-matters-0.3.1.tgz#24d0cfc335a2c730f6d58bd7b43ea5a41be4b49f"
|
||||
integrity sha512-mKOfBLIBFBcs9br1rlZDvxD5+mAl8Gfr5CounwJtxI6Z82rGrMO+Kgl9EIg3RMVf3G855a85YVqHJL2f5EDRlw==
|
||||
|
||||
react-native-snap-carousel@^3.9.1:
|
||||
version "3.9.1"
|
||||
resolved "https://registry.yarnpkg.com/react-native-snap-carousel/-/react-native-snap-carousel-3.9.1.tgz#6fd9bd8839546c2c6043a41d2035afbc6fe0443e"
|
||||
integrity sha512-xWEGusacIgK1YaDXLi7Gao2+ISLoGPVEBR8fcMf4tOOJQufutlNwkoLu0l6B8Qgsrre0nTxoVZikRgGRDWlLaQ==
|
||||
dependencies:
|
||||
prop-types "^15.6.1"
|
||||
react-addons-shallow-compare "15.6.2"
|
||||
|
||||
react-native-storage@^1.0.1:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/react-native-storage/-/react-native-storage-1.0.1.tgz#2c493875ff76ec301987c951a8302f3a54381241"
|
||||
@ -9644,7 +9694,7 @@ whatwg-fetch@2.0.4:
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz#dde6a5df315f9d39991aa17621853d720b85566f"
|
||||
integrity sha512-dcQ1GWpOD/eEQ97k66aiEVpNnapVj90/+R+SXTPYGHpYBBypfKJEQjLrvMZ7YXbKm21gXd4NcuxUTjiv1YtLng==
|
||||
|
||||
whatwg-fetch@^3.0.0:
|
||||
whatwg-fetch@>=0.10.0, whatwg-fetch@^3.0.0:
|
||||
version "3.6.2"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.6.2.tgz#dced24f37f2624ed0281725d51d0e2e3fe677f8c"
|
||||
integrity sha512-bJlen0FcuU/0EMLrdbJ7zOnW6ITZLrZMIarMUVmdKtsGvZna8vxKYaexICWPfZ8qwf9fzNq+UEIZrnSaApt6RA==
|
||||
|
||||
Loading…
Reference in New Issue
Block a user