diff --git a/assets/四国旅客鉄道徳島線.json b/assets/四国旅客鉄道徳島線.json index fa19f06..92e5e7a 100644 --- a/assets/四国旅客鉄道徳島線.json +++ b/assets/四国旅客鉄道徳島線.json @@ -1,6 +1,29 @@ { "type": "FeatureCollection", "features": [ + { + "properties": { + "name": "阿波池田", + "uri": "https://uedayou.net/jrslod/四国旅客鉄道/土讃線/阿波池田", + "color": "E25885" + }, + "type": "Feature", + "geometry": { + "type": "LineString", + "coordinates": [ + [133.80429, 34.02714], + [133.80515, 34.02656] + ] + } + }, + { + "properties": { + "name": "阿波池田", + "uri": "https://uedayou.net/jrslod/四国旅客鉄道/土讃線/阿波池田" + }, + "type": "Feature", + "geometry": { "type": "Point", "coordinates": [133.80429, 34.02714] } + }, { "properties": { "name": "佃", @@ -561,6 +584,29 @@ "type": "Feature", "geometry": { "type": "Point", "coordinates": [134.53819, 34.08082] } }, + { + "properties": { + "name": "徳島", + "uri": "https://uedayou.net/jrslod/四国旅客鉄道/高徳線/徳島", + "color": "9ACD32" + }, + "type": "Feature", + "geometry": { + "type": "LineString", + "coordinates": [ + [134.55251, 34.07404], + [134.55049, 34.07498] + ] + } + }, + { + "properties": { + "name": "徳島", + "uri": "https://uedayou.net/jrslod/四国旅客鉄道/高徳線/徳島" + }, + "type": "Feature", + "geometry": { "type": "Point", "coordinates": [134.55251, 34.07404] } + }, { "properties": { "name": "徳島線", diff --git a/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js index 8538b65..96b8152 100644 --- a/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js @@ -33,7 +33,7 @@ export const LandscapeTrainInfo = (props) => { stickyHeaderIndices={[1]} scrollEventThrottle={16} onScroll={(d) => { - console.log(d.nativeEvent.contentOffset.y); + // Handle scroll events }} > diff --git a/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx b/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx index 2612f7f..ed642e9 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx +++ b/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx @@ -51,7 +51,6 @@ export const TrainIconStatus: FC = ({ data, navigate, from }) => { ) .then((d) => d.json()) .then((d) => { - console.log(d); if (d.trainStatus == "〇") { //setAnpanmanStatus({name:"checkmark-circle-outline",color:"blue"}); } else if (d.trainStatus == "▲") { @@ -76,7 +75,6 @@ export const TrainIconStatus: FC = ({ data, navigate, from }) => { ) .then((d) => d.json()) .then((d) => { - console.log(d); if (d.trainStatus == "〇") { //setAnpanmanStatus({name:"checkmark-circle-outline",color:"blue"}); } else if (d.trainStatus == "▲") { diff --git a/components/ActionSheetComponents/StationDeteilView.js b/components/ActionSheetComponents/StationDeteilView.js index b4a4626..3cfffd2 100644 --- a/components/ActionSheetComponents/StationDeteilView.js +++ b/components/ActionSheetComponents/StationDeteilView.js @@ -18,6 +18,7 @@ import { TrainBusButton } from "./StationDeteilView/TrainBusButton"; import { 駅構内図 } from "./StationDeteilView/StationInsideMapButton"; import { WebSiteButton } from "./StationDeteilView/WebSiteButton"; import { StationTimeTableButton } from "./StationDeteilView/StationTimeTableButton"; +import { StationTrainPositionButton } from "./StationDeteilView/StationTrainPositionButton"; export const StationDeteilView = (props) => { if (!props.payload) return <>; @@ -104,16 +105,23 @@ export const StationDeteilView = (props) => { } /> - {currentStation[0].JrHpUrl && - currentStation[0].StationNumber != "M12" && ( - <駅構内図 //児島例外/ - navigate={navigate} - goTo={goTo} - useShow={useShow} - address={currentStation[0].JrHpUrl} - onExit={onExit} - /> - )} + + + {currentStation[0].JrHpUrl && + currentStation[0].StationNumber != "M12" && ( + <駅構内図 //児島例外/ + navigate={navigate} + goTo={goTo} + useShow={useShow} + address={currentStation[0].JrHpUrl} + onExit={onExit} + /> + )} + {!currentStation[0].JrHpUrl || ( { useShow={useShow} /> )} - + {!trainBus || ( = (props) => { alignContent: "center", alignItems: "center", margin: 2, + flex: 1, }} onPress={() => { navigate("howto", { info, goTo, useShow }); diff --git a/components/ActionSheetComponents/StationDeteilView/StationTrainPositionButton.tsx b/components/ActionSheetComponents/StationDeteilView/StationTrainPositionButton.tsx new file mode 100644 index 0000000..dcc0a84 --- /dev/null +++ b/components/ActionSheetComponents/StationDeteilView/StationTrainPositionButton.tsx @@ -0,0 +1,54 @@ +import { FC } from "react"; +import { TouchableOpacity, View, Text, Linking } from "react-native"; +import { useStationList } from "@/stateBox/useStationList"; +import { useCurrentTrain } from "@/stateBox/useCurrentTrain"; +import AntDesign from "react-native-vector-icons/AntDesign"; +type Props = { + stationNumber: string; + onExit: () => void; + navigate?: (screen: string, params: { screen: string }) => void; +}; +export const StationTrainPositionButton: FC = (props) => { + const { stationNumber, onExit, navigate } = props; + const { + inject, + } = useCurrentTrain(); + const { getInjectJavascriptAddress } = useStationList(); + return ( + { + navigate("positions", { screen: "Apps" }); + const script = getInjectJavascriptAddress(stationNumber); + inject(script); + onExit(); + }} + > + + + + 走行位置に移動 + + + + ); +}; diff --git a/components/Apps/WebView.jsx b/components/Apps/WebView.jsx index 13d0e13..9cd2c11 100644 --- a/components/Apps/WebView.jsx +++ b/components/Apps/WebView.jsx @@ -139,7 +139,7 @@ export const AppsWebView = ({ openStationACFromEachTrainInfo }) => { if (favoriteStation.length < 1) return () => {}; const string = getInjectJavascriptAddress(favoriteStation[0][0].StationNumber); if (!string) return () => {}; - webview.current?.injectJavaScript(string); + webview?.current.injectJavaScript(string); once = true; }; diff --git a/components/Menu/Carousel/CarouselBox.tsx b/components/Menu/Carousel/CarouselBox.tsx index 950acec..680addf 100644 --- a/components/Menu/Carousel/CarouselBox.tsx +++ b/components/Menu/Carousel/CarouselBox.tsx @@ -1,7 +1,14 @@ import Sign from "@/components/駅名表/Sign"; import React, { useEffect, useRef, useState } from "react"; import { AS } from "@/storageControl"; -import { useWindowDimensions, View, LayoutAnimation } from "react-native"; +import { + useWindowDimensions, + View, + LayoutAnimation, + TouchableOpacity, + Text, + ScrollView, +} from "react-native"; import Carousel, { ICarouselInstance } from "react-native-reanimated-carousel"; import { SheetManager } from "react-native-actions-sheet"; import { StationNumber } from "../StationPagination"; @@ -13,10 +20,22 @@ export const CarouselBox = ({ setListIndex, listIndex, navigate, + stationListMode, }) => { const carouselRef = useRef(null); const { height, width } = useWindowDimensions(); const [dotButton, setDotButton] = useState(false); + const carouselBadgeScrollViewRef = useRef(null); + + useEffect(() => { + if (!carouselBadgeScrollViewRef.current) return; + const dotSize = dotButton ? 28 : 24; + const scrollToIndex = dotSize * listIndex - width / 2 + dotSize - 5; + carouselBadgeScrollViewRef.current.scrollTo({ + x: scrollToIndex, + animated: true, + }); + }, [listIndex, dotButton, width, carouselBadgeScrollViewRef]); const oPSign = () => { const payload = { currentStation: listUpStation[listIndex], @@ -46,13 +65,6 @@ export const CarouselBox = ({ setDotButton(data === "true"); }); }, []); - useEffect(() => { - if (!carouselRef.current) return; - carouselRef?.current.scrollTo({ - count: listIndex - carouselRef.current.getCurrentIndex(), - animated: true, - }); - }, [listIndex]); const RenderItem = ({ item, index }) => { return ( - + {item[0].StationNumber != "null" ? ( + + ) : ( + + + + {stationListMode == "position" + ? "現在地の近くに駅がありません。" + : "お気に入りリストがありません。お気に入りの駅を追加しよう!"} + + + + )} ); @@ -80,7 +118,11 @@ export const CarouselBox = ({ 0 + ? listUpStation + : [[{ StationNumber: "null" }]] + } height={(((width / 100) * 80) / 20) * 9 + 10} pagingEnabled={true} snapEnabled={true} @@ -93,15 +135,29 @@ export const CarouselBox = ({ parallaxScrollingOffset: 100, parallaxAdjacentItemScale: 0.8, }} + scrollAnimationDuration={600} onSnapToItem={setListIndex} renderItem={RenderItem} + overscrollEnabled={false} + defaultIndex={listIndex >= listUpStation.length ? 0 : listIndex} /> - { + // ScrollViewのrefを保存 + if (scrollViewRef) { + carouselBadgeScrollViewRef.current = scrollViewRef; + } }} > {originalStationList && @@ -123,7 +179,7 @@ export const CarouselBox = ({ /> ); })} - + ); }; diff --git a/components/Menu/Carousel/CarouselTypeChanger.tsx b/components/Menu/Carousel/CarouselTypeChanger.tsx index 11f13af..57266ae 100644 --- a/components/Menu/Carousel/CarouselTypeChanger.tsx +++ b/components/Menu/Carousel/CarouselTypeChanger.tsx @@ -1,21 +1,34 @@ import { AS } from "@/storageControl"; import { useBottomTabBarHeight } from "@react-navigation/bottom-tabs"; import React, { useEffect, useRef } from "react"; -import { View, TouchableOpacity, Text, LayoutAnimation } from "react-native"; +import { useWindowDimensions } from "react-native"; +import { + View, + TouchableOpacity, + Text, + LayoutAnimation, + KeyboardAvoidingView, + Platform, +} from "react-native"; import Ionicons from "react-native-vector-icons/Ionicons"; +import { SearchUnitBox } from "@/components/Menu/RailScope/SearchUnitBox"; export const CarouselTypeChanger = ({ locationStatus, position, mapsRef, + scrollRef, stationListMode, setStationListMode, setSelectedCurrentStation, mapMode, setMapMode, + isSearchMode, + setisSearchMode, }) => { const tabBarHeight = useBottomTabBarHeight(); - const returnToDefaultMode = ()=>{ + const { height, width } = useWindowDimensions(); + const returnToDefaultMode = () => { LayoutAnimation.configureNext({ duration: 300, create: { @@ -28,13 +41,32 @@ export const CarouselTypeChanger = ({ }, }); setMapMode(false); - } + }; return ( - + + { + onPressIn={() => { if (!position) return; returnToDefaultMode(); setStationListMode("position"); @@ -99,7 +130,8 @@ export const CarouselTypeChanger = ({ - + ); }; diff --git a/components/Menu/RailScope/SearchUnitBox.tsx b/components/Menu/RailScope/SearchUnitBox.tsx new file mode 100644 index 0000000..9d0c1f2 --- /dev/null +++ b/components/Menu/RailScope/SearchUnitBox.tsx @@ -0,0 +1,114 @@ +import React from "react"; +import { + TouchableOpacity, + Text, + View, + LayoutAnimation, + TextInput, + KeyboardAvoidingView, + Platform, +} from "react-native"; +import Ionicons from "react-native-vector-icons/Ionicons"; +import { useWindowDimensions } from "react-native"; +import lineColorList from "@/assets/originData/lineColorList"; +import { lineList_LineWebID, stationIDPair } from "@/lib/getStationList"; +export const SearchUnitBox = ({ isSearchMode, setisSearchMode }) => { + const { height, width } = useWindowDimensions(); + return ( + <> + { + LayoutAnimation.configureNext({ + duration: 100, + update: { type: "easeInEaseOut", springDamping: 0.6 }, + }); + setisSearchMode(true); + }} + > + {!isSearchMode && } + {!!isSearchMode && ( + + + + { + LayoutAnimation.configureNext({ + duration: 100, + update: { type: "easeInEaseOut", springDamping: 0.6 }, + }); + setisSearchMode(false); + }}> + + + {Object.keys(lineList_LineWebID).map((d) => ( + { + const id = stationIDPair[lineList_LineWebID[d]]; + const s = isSearchMode == id ? undefined : id; + if (!s) return; + setisSearchMode(s); + }} + key={stationIDPair[lineList_LineWebID[d]]} + > + + {stationIDPair[lineList_LineWebID[d]]} + + + ))} + {/* + setKeyBoardVisible(true)} + onEndEditing={() => {}} + //onChange={(ret) => setInput(ret.nativeEvent.text)} + //value={input} + style={{ flex: 1 }} + /> + */} + + + )} + + + ); +}; diff --git a/components/Settings/FavoliteSettings/FavoiliteSettingsItem.js b/components/Settings/FavoliteSettings/FavoiliteSettingsItem.js index 51ba766..cdc84f8 100644 --- a/components/Settings/FavoliteSettings/FavoiliteSettingsItem.js +++ b/components/Settings/FavoliteSettings/FavoiliteSettingsItem.js @@ -8,7 +8,6 @@ import { AS } from "../../../storageControl"; export const FavoriteSettingsItem = ({ currentStation }) => { const lineIDs = []; const EachIDs = []; - console.log(currentStation); currentStation.forEach((d) => { if (!d.StationNumber) return; const textArray = d.StationNumber.split(""); diff --git a/components/trainMenu.js b/components/trainMenu.js index 746084f..cd416f1 100644 --- a/components/trainMenu.js +++ b/components/trainMenu.js @@ -24,7 +24,7 @@ export default function TrainMenu({ style }) { const { originalStationList } = useStationList(); useEffect(() => { const stationPinData = []; - Object.keys(originalStationList).forEach((d, indexBase) => { + Object.keys(lineList_LineWebID).forEach((d, indexBase) => { originalStationList[d].forEach((D, index) => { if (selectedLine && selectedLine != lineList_LineWebID[d]) return; const latlng = [D.lat,D.lng]; @@ -35,14 +35,14 @@ export default function TrainMenu({ style }) { setStationPin(stationPinData); }, [originalStationList, selectedLine]); useLayoutEffect(() => { - mapRef.current.fitToCoordinates( + mapRef?.current.fitToCoordinates( stationPin.map(({ latlng }) => ({ latitude: parseFloat(latlng[0]), longitude: parseFloat(latlng[1]), })), { edgePadding: { top: 80, bottom: 120, left: 50, right: 50 } } // Add margin values here ); - }, [stationPin]); + }, [stationPin,mapRef]); return ( ))} @@ -161,6 +161,7 @@ export default function TrainMenu({ style }) { }); }); }} + key={stationIDPair[d]} > { }} > - { - navigate("positions", { screen: "Apps" }); - const script = getInjectJavascriptAddress(station.StationNumber); - inject(script); - }} - /> diff --git a/lib/getStationList.ts b/lib/getStationList.ts index 02608df..45d3e17 100644 --- a/lib/getStationList.ts +++ b/lib/getStationList.ts @@ -211,15 +211,11 @@ export const getStationList = async () => { 鳴門線, stationList["日英対応表"] ); - const tokushimaCurrent = addStationPosition( + stationList["徳島線(徳島-阿波池田間)[B]"] = addStationPosition( concatBetweenStations(stationList["徳島線(徳島-阿波池田間)[B]"]), 徳島線, stationList["日英対応表"] ); - stationList["徳島線(徳島-阿波池田間)[B]"] = [ - tokushimaCurrent[tokushimaCurrent.length - 1], - ...tokushimaCurrent, - ]; stationList["徳島線(徳島-阿波池田間)[B]"].pop(); stationList["瀬戸大橋線(児島-宇多津間)[M]"] = [ { diff --git a/lib/getTrainType.ts b/lib/getTrainType.ts index 5dda2d3..151630c 100644 --- a/lib/getTrainType.ts +++ b/lib/getTrainType.ts @@ -5,7 +5,7 @@ type nameString = | "SPCL" | "Normal" | string; -type colorString = "aqua" | "red" | "#297bff" | "white"; +type colorString = "aqua" | "red" | "#297bff" | "white" | "pink"; type trainTypeString = | "快速" | "特急" @@ -28,7 +28,7 @@ export const getTrainType: getTrainType = (nameString) => { case "LTDEXP": return { color: "red", name: "特急", data: "express" }; case "NightLTDEXP": - return { color: "red", name: "寝台特急", data: "express" }; + return { color: "pink", name: "寝台特急", data: "express" }; case "SPCL": case "SPCL_Rapid": case "SPCL_EXP": diff --git a/lib/webViewInjectjavascript.ts b/lib/webViewInjectjavascript.ts index cc4076b..c0484d7 100644 --- a/lib/webViewInjectjavascript.ts +++ b/lib/webViewInjectjavascript.ts @@ -1055,6 +1055,8 @@ export const injectJavascriptData: InjectJavascriptData = ( const nameReplace = (列車名データ,列番データ,行き先情報,hasProblem) =>{ let isWanman = false; let trainName = ""; + let trainType = ""; + let trainTypeColor = "black"; let viaData = ""; let ToData = ""; let TrainNumber = 列番データ; @@ -1262,7 +1264,43 @@ export const injectJavascriptData: InjectJavascriptData = ( getThrew(列番データ); if(trainDataList.find(e => e.id === 列番データ) !== undefined){ const data = trainDataList.find(e => e.id === 列番データ); - //{id,isWanman,trainName,viaData,ToData} + //{id,isWanman,trainName,viaData,ToData,TrainNumber,JRF,type,infoUrl,trainNumDistance,info,infogram} + trainType = (()=>{ + switch(data.type){ + case "Normal": + trainTypeColor = "black"; + return "普通"; + case "OneMan": + trainTypeColor = "black"; + return "普通"; + case "Freight": + trainTypeColor = "black"; + return "貨物"; + case "SPCL_Normal": + trainTypeColor = "#297bff"; + return "臨時"; + case "SPCL_Rapid": + trainTypeColor = "#297bff"; + return "臨時快速"; + case "SPCL_LTDEXP": + trainTypeColor = "#297bff"; + return "臨時特急"; + case "LTDEXP": + trainTypeColor = "red"; + return "特急"; + case "NightLTDEXP": + trainTypeColor = "rgb(211, 0, 176)"; + return "寝台特急"; + case "OneManRapid": + trainTypeColor = "rgba(0, 140, 255, 1)"; + return "快速"; + case "Rapid": + trainTypeColor = "rgba(0, 140, 255, 1)"; + return "快速"; + default: + return ""; + } + })(); isWanman = data.isWanman; if(data.trainName != ""){ trainName = data.trainName; @@ -1293,16 +1331,25 @@ export const injectJavascriptData: InjectJavascriptData = ( }); let getColors = []; if(stationLines.length === 0){ - getColors = ["#000"]; + getColors = ["rgba(97, 96, 96, 0.81)"]; }else{ getColors = stationLines.map(e => GetLineBarColor(e)); } + let yosan2Color = undefined; + if(viaData == "(内子経由)"){ + yosan2Color ="#F5AC13"; + } + else if(viaData == "(海経由)"){ + yosan2Color = "#9AA7D7"; + } + const gradient = getColors.length > 1 ? "linear-gradient(130deg, " + getColors[0] + " 0%, "+ getColors[0]+"50%, "+ getColors[1]+"50%, " + getColors[1] + " 100%)" : getColors[0]; 行き先情報.insertAdjacentHTML('beforebegin', "

" + TrainNumber + (JRF ? "":"レ") + "

"); 行き先情報.insertAdjacentHTML('beforebegin', "

" + (isWanman ? "ワンマン " : "") + "

"); - 行き先情報.insertAdjacentHTML('beforebegin', "

" + viaData + "

"); + 行き先情報.insertAdjacentHTML('beforebegin', "

" + viaData + "

"); 行き先情報.insertAdjacentHTML('beforebegin', "

" + trainName + "

"); 行き先情報.insertAdjacentHTML('beforebegin', "

" + (ToData ? ToData + "行" : ToData) + "

"); + 行き先情報.insertAdjacentHTML('beforebegin', "

" + trainType + "

"); 行き先情報.insertAdjacentHTML('beforebegin', "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); `: ` 行き先情報.insertAdjacentHTML('beforebegin', "

" + returnText1 + "

"); @@ -1440,7 +1487,7 @@ const setStrings = () =>{ var 行き先情報 = element.getElementsByTagName("p")[0]; var 列番データ = element.getAttribute('offclick').split('"')[1]; var 列車名データ = element.getAttribute('offclick').split('"')[3]; - const trainData = trainPositionDatas.find(e => e.TrainNum == 列番データ); + const trainData = trainPositionDatas.filter(e=>!(e.Pos && e.Pos.includes("予告窓"))).find(e => e.TrainNum == 列番データ); const hasProblem = probremsData.find((e)=>{ return e.TrainNum == trainData.TrainNum && e.Pos == trainData.Pos; }); diff --git a/menu.js b/menu.js index ac2491e..3f492ba 100644 --- a/menu.js +++ b/menu.js @@ -1,10 +1,12 @@ -import React, { useRef, useState, useEffect } from "react"; +import React, { useRef, useState, useEffect, useLayoutEffect } from "react"; import { Platform, View, ScrollView, useWindowDimensions, LayoutAnimation, + Text, + TouchableOpacity, } from "react-native"; import Constants from "expo-constants"; import { @@ -17,7 +19,7 @@ import LED_vision from "./components/発車時刻表/LED_vidion"; import { TitleBar } from "./components/Menu/TitleBar"; import { FixedContentBottom } from "./components/Menu/FixedContentBottom"; -import { lineList } from "./lib/getStationList"; +import { lineList, stationIDPair } from "./lib/getStationList"; import { useFavoriteStation } from "./stateBox/useFavoriteStation"; import { useNavigation } from "@react-navigation/native"; import { useStationList } from "./stateBox/useStationList"; @@ -30,6 +32,9 @@ import { CarouselBox } from "./components/Menu/Carousel/CarouselBox"; import { CarouselTypeChanger } from "./components/Menu/Carousel/CarouselTypeChanger"; import { useUserPosition } from "./stateBox/useUserPosition"; import { AS } from "./storageControl"; +import { lineList_LineWebID } from "./lib/getStationList"; +import { Ionicons } from "@expo/vector-icons"; +import { SearchUnitBox } from "./components/Menu/RailScope/SearchUnitBox"; configureReanimatedLogger({ level: ReanimatedLogLevel.error, // Set the log level to error strict: true, // Reanimated runs in strict mode by default @@ -167,24 +172,52 @@ export default function Menu(props) { const [listIndex, setListIndex] = useState(0); const [listUpStation, setListUpStation] = useState([]); - useEffect(() => { - if (stationListMode == "position") { - setListUpStation(nearPositionStation.filter((d) => d != undefined)); + const [isSearchMode, setisSearchMode] = useState(false); + useLayoutEffect(() => { + if (!!isSearchMode) { + const returnData = []; + Object.keys(lineList_LineWebID).forEach((d, indexBase) => { + originalStationList[d].forEach((D, index) => { + if ( + isSearchMode && + isSearchMode != stationIDPair[lineList_LineWebID[d]] + ) + return; + const latlng = [D.lat, D.lng]; + if (latlng.length == 0) return null; + if (D.StationNumber == undefined) { + return null; + } + returnData.push([D]); + }); + }); + if (JSON.stringify(returnData) == JSON.stringify(listUpStation)) return; + setListUpStation(returnData); + } else if (stationListMode == "position") { + const returnData = nearPositionStation.filter((d) => d != undefined); + if (JSON.stringify(returnData) == JSON.stringify(listUpStation)) return; + setListUpStation(returnData); } else { - setListUpStation(favoriteStation.filter((d) => d != undefined)); + const returnData = favoriteStation.filter((d) => d != undefined); + if (JSON.stringify(returnData) == JSON.stringify(listUpStation)) return; + setListUpStation(returnData); } - }, [nearPositionStation, favoriteStation, stationListMode]); + }, [nearPositionStation, favoriteStation, stationListMode, isSearchMode]); useEffect(() => { if (listUpStation.length == 0) { setListIndex(0); return; } + if (listUpStation.length == 1) { + setListIndex(0); + return; + } if (listUpStation[listIndex] == undefined) { const count = listIndex - 1; setMapMode(false); setListIndex(count); } - }, [listIndex, nearPositionStation, listUpStation]); + }, [listIndex, listUpStation, isSearchMode]); useEffect(() => { if (originalStationList == undefined) return; if (listUpStation.length == 0) return; @@ -196,9 +229,18 @@ export default function Menu(props) { latitudeDelta: 0.05, longitudeDelta: 0.05, }; - if (mapMode) return; - mapsRef.current.animateToRegion(mapRegion, 1000); - }, [listIndex, nearPositionStation, listUpStation, mapsRef]); + if (mapMode) { + mapsRef?.current.fitToCoordinates( + listUpStation.map((d) => ({ + latitude: parseFloat(d[0].lat), + longitude: parseFloat(d[0].lng), + })), + { edgePadding: { top: 80, bottom: 120, left: 50, right: 50 } } // Add margin values here + ); + } else { + mapsRef.current.animateToRegion(mapRegion, 1000); + } + }, [listIndex, listUpStation]); return ( - + {!mapMode ? ( + + ) : ( + <> + // + // JRShikoku RailScope + // + )} { - console.log(e.nativeEvent.velocity); if (e.nativeEvent.contentOffset.y < mapHeight - 80) { if (scrollStartPosition > e.nativeEvent.contentOffset.y) { goToMap(); @@ -303,16 +364,19 @@ export default function Menu(props) { locationStatus, position, mapsRef, + scrollRef, stationListMode, setStationListMode, setSelectedCurrentStation: setListIndex, mapMode, setMapMode, + isSearchMode, + setisSearchMode, }} /> )} - {listUpStation.length != 0 && originalStationList.length != 0 && ( + {originalStationList.length != 0 && ( <> {listUpStation[listIndex] && ( @@ -349,6 +414,8 @@ export default function Menu(props) { setSelectedCurrentStation: setListIndex, mapMode, setMapMode, + isSearchMode, + setisSearchMode, }} /> )} diff --git a/stateBox/useCurrentTrain.js b/stateBox/useCurrentTrain.js index 2d5d8e2..15f6b44 100644 --- a/stateBox/useCurrentTrain.js +++ b/stateBox/useCurrentTrain.js @@ -15,7 +15,7 @@ const initialState = { currentTrainLoading: "loading", setCurrentTrainLoading: () => {}, getCurrentTrain: () => {}, - inject: () => {}, + inject: (i) => {}, }; const CurrentTrainContext = createContext(initialState); diff --git a/stateBox/useStationList.tsx b/stateBox/useStationList.tsx index 4a0d10a..7073735 100644 --- a/stateBox/useStationList.tsx +++ b/stateBox/useStationList.tsx @@ -92,7 +92,6 @@ export const StationListProvider: FC = ({ children }) => { return; } if (x.StationNumber == StationNumber) { - console.log(originalStationList[d]); if (!x.MyStation) findNearStations = true; else bootStationList.push({ line: lineName, station: x }); }