Merge commit '4b51232ccddcba1eb0b90195e9af516f375da3d0' into feature/new-setting-system

2024-03-18 04:03:02 +00:00 · 2024-03-18 04:03:02 +00:00 · 9e0bb9fcbb
commit 9e0bb9fcbb
parent cea17ff46b 4b51232ccd
10 changed files with 314 additions and 182 deletions
--- a/Top.js
+++ b/Top.js
@ -15,9 +15,8 @@ import { optionData } from "./lib/stackOption.js";
 import { useCurrentTrain } from "./stateBox/useCurrentTrain.js";
 const Stack = createStackNavigator();
 export const Top = ({ navigation }) => {
-  const webview = useRef();
  const { favoriteStation, setFavoriteStation } = useFavoriteStation();
-  const { getCurrentTrain } = useCurrentTrain();
+  const { webview, getCurrentTrain } = useCurrentTrain();

  //地図用
  const [mapsStationData, setMapsStationData] = useState(undefined);
--- a/components/ActionSheetComponents/EachTrainInfo/LongHeader.js
+++ b/components/ActionSheetComponents/EachTrainInfo/LongHeader.js
@ -7,6 +7,7 @@ export const LongHeader = ({
  currentPosition,
  nearTrainIDList,
  openTrainInfo,
+  navigate,
 }) => {
  return (
    <ScrollView
@ -27,6 +28,7 @@ export const LongHeader = ({
        currentPosition={currentPosition}
        nearTrainIDList={nearTrainIDList}
        openTrainInfo={openTrainInfo}
+        navigate={navigate}
      />
    </ScrollView>
  );
--- a/components/ActionSheetComponents/EachTrainInfo/ShortHeader.js
+++ b/components/ActionSheetComponents/EachTrainInfo/ShortHeader.js
@ -7,6 +7,7 @@ export const ShortHeader = ({
  currentPosition,
  nearTrainIDList,
  openTrainInfo,
+  navigate,
 }) => {
  return (
    <ScrollView
@ -29,6 +30,7 @@ export const ShortHeader = ({
        currentPosition={currentPosition}
        nearTrainIDList={nearTrainIDList}
        openTrainInfo={openTrainInfo}
+        navigate={navigate}
      />
    </ScrollView>
  );
--- a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js
+++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js
@ -1,7 +1,10 @@
-import React from "react";
+import React, { useState, useEffect } from "react";
 import { View, TouchableOpacity, useWindowDimensions } from "react-native";
 import { StateBox } from "./StateBox";
 import { useDeviceOrientationChange } from "../../../stateBox/useDeviceOrientationChange";
+import { getStationList2 } from "../../../lib/getStationList2";
+import { useCurrentTrain } from "../../../stateBox/useCurrentTrain";
+import { SheetManager } from "react-native-actions-sheet";

 export const TrainDataView = ({
  currentTrainData,
@ -9,10 +12,16 @@ export const TrainDataView = ({
  nearTrainIDList,
  openTrainInfo,
  mode = 0,
+  navigate,
 }) => {
  const { width, height } = useWindowDimensions();
  const { isLandscape } = useDeviceOrientationChange();
-
+  const { webview, getCurrentTrain } = useCurrentTrain();
+  const [mapsStationData, setMapsStationData] = useState(undefined);
+  useEffect(() => {
+    getStationList2().then(setMapsStationData);
+  }, []);
+  const onLine = !!currentPosition?.toString().length;
  return (
    <View
      style={{
@ -23,23 +32,49 @@ export const TrainDataView = ({
        flex: 1,
      }}
    >
-      <StateBox
-        mode={mode}
-        title={`現在地 ${currentPosition.toString()}`}
-        text={
-          currentTrainData?.Pos.match("～")
-            ? `${
-                currentTrainData?.Pos.replace("（下り）", "")
-                  .replace("（上り）", "")
-                  .split("～")[0]
-              }～${
-                currentTrainData?.Pos.replace("（下り）", "")
-                  .replace("（上り）", "")
-                  .split("～")[1]
-              }`
-            : currentTrainData?.Pos
-        }
-      />
+      <TouchableOpacity
+        style={{ flex: 1, flexDirection: "row" }}
+        disabled={!onLine}
+        onPress={() => {
+          const test = [];
+          Object.keys(mapsStationData).forEach((d) => {
+            mapsStationData[d].forEach((x) => {
+              if (x.StationNumber == currentPosition[0])
+                test.push({ line: d, station: x });
+            });
+          });
+          if (!test.length) return;
+          webview.current?.injectJavaScript(
+            `MoveDisplayStation('${test[0].line}_${test[0].station.MyStation}_${test[0].station.Station_JP}')`
+          );
+          navigate("Apps");
+          SheetManager.hide("EachTrainInfo");
+        }}
+      >
+        <StateBox
+          mode={mode}
+          title={`現在地 ${currentPosition?.toString()}${onLine ? "▶️" : ""}`}
+          text={
+            currentTrainData?.Pos.match("～")
+              ? `${
+                  currentTrainData?.Pos.replace("（下り）", "")
+                    .replace("（上り）", "")
+                    .split("～")[0]
+                }～${
+                  currentTrainData?.Pos.replace("（下り）", "")
+                    .replace("（上り）", "")
+                    .split("～")[1]
+                }`
+              : currentTrainData?.Pos
+          }
+          style={
+            onLine
+              ? { borderWidth: 1, borderColor: "red", borderStyle: "solid" }
+              : {}
+          }
+        />
+      </TouchableOpacity>
+
      <View style={{ flex: 1, flexDirection: mode == 2 ? "row" : "column" }}>
        <View style={{ flex: 1, flexDirection: "row" }}>
          <StateBox
--- a/components/ActionSheetComponents/EachTrainInfoCore.js
+++ b/components/ActionSheetComponents/EachTrainInfoCore.js
@ -71,10 +71,10 @@ export const EachTrainInfoCore = ({
  }, []);
  //bconst insets = useSafeAreaInsets();

-  const [headStation, setHeadStation] = useState();
-  const [tailStation, setTailStation] = useState();
-  const [isConcatNear, setIsConcatNear] = useState(false);
-  const [showNearTrain, setShowNearTrain] = useState([]);
+  const [headStation, setHeadStation] = useState([]);
+  const [tailStation, setTailStation] = useState([]);
+  const [showHeadStation, setShowHeadStation] = useState([]);
+  const [showTailStation, setShowTailStation] = useState([]);
  const [nearTrainIDList, setNearTrainIDList] = useState([]);
  const { getInfluencedTrainData } = useBusAndTrainData();
  const [trainPositionSwitch, setTrainPositionSwitch] = useState("false");
@ -120,9 +120,8 @@ export const EachTrainInfoCore = ({
  useEffect(() => {
    if (!data.trainNum) return;
    const TD = trainList[data.trainNum];
-    setIsConcatNear(false);
-    setHeadStation();
-    setTailStation();
+    setHeadStation([]);
+    setTailStation([]);
    if (!TD) {
      const specialTrainActualID = searchSpecialTrain(data.trainNum, trainList);
      setTrueTrainID(specialTrainActualID || undefined);
@ -134,27 +133,38 @@ export const EachTrainInfoCore = ({
  //裏列車探索
  useEffect(() => {
    if (!data.trainNum) return;
-    const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum);
+    const NearTrainList = getInfluencedTrainData(data.trainNum);
+    if (NearTrainList.length == 0) return;
+    const returnArray = NearTrainList.map((d) => d.id);
+    const TDArray = NearTrainList.map((d) => d.TrainData);
    setNearTrainIDList(returnArray);
-    setShowNearTrain(TDArray);
    if (trainData.length == 0) return;
    if (TDArray.length == 0) return;
-    let head;
-    let tail;
-    TDArray.forEach((d) => {
-      const [station, se, time] = d.split(",");
-
-      if (station == trainData[0].split(",")[0]) {
-        head = trainData[0].split(",")[0];
-      }
-      if (station == trainData[trainData.length - 1].split(",")[0]) {
-        tail = trainData[trainData.length - 1].split(",")[0];
-      }
-    });
+    let head = [];
+    let tail = [];
+    TDArray.forEach((data, i) =>
+      data.forEach((d) => {
+        const [station, se, time] = d.split(",");
+        if (station == trainData[0].split(",")[0]) {
+          head.push({
+            station: trainData[0].split(",")[0],
+            dia: data,
+            id: nearTrainIDList[i],
+          });
+        }
+        if (station == trainData[trainData.length - 1].split(",")[0]) {
+          tail.push({
+            station: trainData[trainData.length - 1].split(",")[0],
+            dia: data,
+            id: nearTrainIDList[i],
+          });
+        }
+      })
+    );
    if (head) setHeadStation(head);
-    else setHeadStation();
+    else setHeadStation([]);
    if (tail) setTailStation(tail);
-    else setTailStation();
+    else setTailStation([]);
  }, [trainData, data]);

  useEffect(() => {
@ -256,8 +266,9 @@ export const EachTrainInfoCore = ({
        </Text>
        <View style={{ flex: 1 }} />
        <Text style={{ fontSize: 20, fontWeight: "bold", color: "white" }}>
+          {showHeadStation.map((d) => `${headStation[d].id} + `)}
          {data.trainNum}
-          {isConcatNear ? ` + ${nearTrainIDList}` : ""}
+          {showTailStation.map((d) => ` + ${tailStation[d].id}`)}
        </Text>

        {data.limited != undefined &&
@ -312,6 +323,7 @@ export const EachTrainInfoCore = ({
              currentPosition={currentPosition}
              nearTrainIDList={nearTrainIDList}
              openTrainInfo={openTrainInfo}
+              navigate={navigate}
            />
          )
        }
@ -324,6 +336,7 @@ export const EachTrainInfoCore = ({
              currentPosition={currentPosition}
              nearTrainIDList={nearTrainIDList}
              openTrainInfo={openTrainInfo}
+              navigate={navigate}
            />
          )
        }
@ -331,33 +344,36 @@ export const EachTrainInfoCore = ({
          <ScrollStickyContent currentTrainData={currentTrainData} />
        }
      >
-        {headStation && !isConcatNear && (
-          <TouchableOpacity
-            onPress={() => {
-              const array = openBackTrainInfo(
-                headStation,
-                trainData,
-                showNearTrain
-              );
-              if (!array) return;
-              setTrainData(array);
-              setIsConcatNear(true);
-            }}
-            style={{
-              padding: 10,
-              flexDirection: "row",
-              borderColor: "blue",
-              borderWidth: 1,
-              margin: 10,
-              borderRadius: 5,
-              alignItems: "center",
-            }}
-          >
-            <Text style={{ fontSize: 18, fontWeight: "bold", color: "black" }}>
-              「本当の始発駅」を表示
-            </Text>
-          </TouchableOpacity>
-        )}
+        {headStation.length != 0 &&
+          headStation.map((i, index) =>
+            showHeadStation.findIndex((d) => d == index) == -1 ? (
+              <TouchableOpacity
+                onPress={() => {
+                  const array = openBackTrainInfo(i.station, trainData, i.dia);
+                  if (!array) return;
+                  setTrainData(array);
+                  setShowHeadStation([...showHeadStation, index]);
+                }}
+                style={{
+                  padding: 10,
+                  flexDirection: "row",
+                  borderColor: "blue",
+                  borderWidth: 1,
+                  margin: 10,
+                  borderRadius: 5,
+                  alignItems: "center",
+                }}
+              >
+                <Text
+                  style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
+                >
+                  「本当の始発駅」を表示
+                </Text>
+              </TouchableOpacity>
+            ) : (
+              <></>
+            )
+          )}
        {/* <LottieView
                autoPlay
                loop
@ -397,34 +413,38 @@ export const EachTrainInfoCore = ({
            />
          )
        )}
-        {tailStation && !isConcatNear && (
-          <TouchableOpacity
-            onPress={() => {
-              const array = openBackTrainInfo(
-                tailStation,
-                trainData,
-                showNearTrain
-              );
+        {tailStation.length != 0 &&
+          tailStation.map((i, index) =>
+            showTailStation.findIndex((d) => d == index) == -1 ? (
+              <TouchableOpacity
+                onPress={() => {
+                  const array = openBackTrainInfo(i.station, trainData, i.dia);

-              if (!array) return;
-              setTrainData(array);
-              setIsConcatNear(true);
-            }}
-            style={{
-              padding: 10,
-              flexDirection: "row",
-              borderColor: "blue",
-              borderWidth: 1,
-              margin: 10,
-              borderRadius: 5,
-              alignItems: "center",
-            }}
-          >
-            <Text style={{ fontSize: 18, fontWeight: "bold", color: "black" }}>
-              「本当の終着駅」を表示
-            </Text>
-          </TouchableOpacity>
-        )}
+                  if (!array) return;
+                  setTrainData(array);
+
+                  setShowTailStation([...showTailStation, index]);
+                }}
+                style={{
+                  padding: 10,
+                  flexDirection: "row",
+                  borderColor: "blue",
+                  borderWidth: 1,
+                  margin: 10,
+                  borderRadius: 5,
+                  alignItems: "center",
+                }}
+              >
+                <Text
+                  style={{ fontSize: 18, fontWeight: "bold", color: "black" }}
+                >
+                  「本当の終着駅」を表示
+                </Text>
+              </TouchableOpacity>
+            ) : (
+              <></>
+            )
+          )}

        <View style={{ flexDirection: "row" }}>
          <View
--- a/components/Settings/SettingTopPage.js
+++ b/components/Settings/SettingTopPage.js
@ -84,7 +84,7 @@ export const SettingTopPage = ({
          />
          <View style={{ flexDirection: "row", padding: 10 }}>
            <View style={{ flex: 1 }} />
-            <Text>内部バージョン: 5.0.2.3</Text>
+            <Text>内部バージョン: 5.0.3</Text>
            <View style={{ flex: 1 }} />
          </View>

--- a/components/custom-train-data.js
+++ b/components/custom-train-data.js
@ -243,25 +243,15 @@ export const customTrainDataDetector = (TrainNumber) => {
        trainNumDistance: 5000,
        info: "南風と併結 / 高松-宇多津間進行方向逆転 / 2700系で運転",
      };
-    case "3002D":
    case "3004D":
    case "3010D":
-    case "3012D":
+    case "3014D":
    case "3016D":
-    case "3018D":
-    case "3024D":
    case "3028D":
-    case "3030D":
    case "3003D":
-    case "3005D":
    case "3007D":
-    case "3015D":
-    case "3019D":
-    case "3021D":
    case "3025D":
-    case "3027D":
    case "3031D":
-    case "3033D":
      return {
        type: "LTDEXP",
        trainName: "うずしお",
@ -271,14 +261,24 @@ export const customTrainDataDetector = (TrainNumber) => {
      };

    //2600
-    case "3008D":
-    case "3014D":
+    case "3002D":
+    case "3012D":
+    case "3018D":
    case "3020D":
+    case "3024D":
    case "3026D":
-    case "3001D":
+    case "3030D":
+    case "3032D":
+    case "3005D":
+    case "3009D":
    case "3011D":
+    case "3015D":
    case "3017D":
+    case "3019D":
+    case "3021D":
    case "3023D":
+    case "3027D":
+    case "3033D":
      return {
        type: "LTDEXP",
        trainName: "うずしお",
@ -288,8 +288,8 @@ export const customTrainDataDetector = (TrainNumber) => {
      };

    //キハ185
-    case "3009D":
-    case "3032D":
+    case "3001D":
+    case "3008D":
      return {
        type: "LTDEXP",
        trainName: "うずしお",
@ -484,13 +484,11 @@ export const customTrainDataDetector = (TrainNumber) => {
    case "2074D":
    case "2076D":
    case "2080D":
-    case "2084D":
-    case "2086D":
+    case "2082D":
    case "2071D":
-    case "2075D":
-    case "2077D":
+    case "2073D":
+    case "2079D":
    case "2081D":
-    case "2083D":
      return {
        type: "LTDEXP",
        trainName: "あしずり",
@ -501,12 +499,12 @@ export const customTrainDataDetector = (TrainNumber) => {

    //あしずり 2700
    case "2078D":
-    case "2082D":
+    case "2084D":
    case "2088D":
-    case "2073D":
-    case "2079D":
-    case "2085D":
+    case "2075D":
+    case "2077D":
    case "2072D":
+    case "2083D":
      return {
        type: "LTDEXP",
        trainName: "あしずり",
@ -536,8 +534,8 @@ export const customTrainDataDetector = (TrainNumber) => {
      };

    //むろと
-    case "5051D":
-    case "5052D":
+    case "8051D":
+    case "8052D":
      return {
        type: "LTDEXP",
        trainName: "むろと",
@ -585,8 +583,8 @@ export const customTrainDataDetector = (TrainNumber) => {
      };

    //千年ものがたり
-    case "8011D":
-    case "8012D":
+    case "8021D":
+    case "8022D":
      return {
        type: "LTDEXP",
        trainName: "四国まんなか千年ものがたり",
@ -596,10 +594,10 @@ export const customTrainDataDetector = (TrainNumber) => {
      };

    //夜明けものがたり
-    case "8053D":
-    case "8054D":
-    case "8062D":
-    case "8063D":
+    case "8082D":
+    case "8083D":
+    case "8073D":
+    case "8074D":
      return {
        type: "LTDEXP",
        trainName: "時代の夜明けのものがたり",
--- a/lib/webViewInjectjavascript.js
+++ b/lib/webViewInjectjavascript.js
@ -204,43 +204,43 @@ export const injectJavascriptData = (
    case "5022D":
    case "5013D":
    case "5029D":
-    case "3002D":
    case "3004D":
    case "3010D":
-    case "3012D":
+    case "3014D":
    case "3016D":
-    case "3018D":
-    case "3024D":
    case "3028D":
-    case "3030D":
    case "3003D":
-    case "3005D":
    case "3007D":
-    case "3015D":
-    case "3019D":
-    case "3021D":
    case "3025D":
-    case "3027D":
    case "3031D":
-    case "3033D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s2700_uzu.png');
      break;

    //2600
-    case "3008D":
-    case "3014D":
+    case "3002D":
+    case "3012D":
+    case "3018D":
    case "3020D":
+    case "3024D":
    case "3026D":
-    case "3001D":
+    case "3030D":
+    case "3032D":
+    case "3005D":
+    case "3009D":
    case "3011D":
+    case "3015D":
    case "3017D":
+    case "3019D":
+    case "3021D":
    case "3023D":
+    case "3027D":
+    case "3033D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s2600.png');
      break;

    //キハ185
-    case "3009D":
-    case "3032D":
+    case "3001D":
+    case "3008D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s185tu_uzu.png');
      break;
      
@ -386,24 +386,22 @@ export const injectJavascriptData = (
    case "2074D":
    case "2076D":
    case "2080D":
-    case "2084D":
-    case "2086D":
+    case "2082D":
    case "2071D":
-    case "2075D":
-    case "2077D":
+    case "2073D":
+    case "2079D":
    case "2081D":
-    case "2083D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s2000_asi.png');
    break;

    //あしずり 2700
    case "2078D":
-    case "2082D":
+    case "2084D":
    case "2088D":
-    case "2073D":
-    case "2079D":
-    case "2085D":
+    case "2075D":
+    case "2077D":
    case "2072D":
+    case "2083D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s2700_asi.png');
    break;
    //剣山
@ -421,8 +419,8 @@ export const injectJavascriptData = (
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s185tu.png');
    break;
    //むろと
-    case "5051D":
-    case "5052D":
+    case "8051D":
+    case "8052D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s185_mrt.png');
    break;

@ -452,30 +450,55 @@ export const injectJavascriptData = (


    //千年ものがたり
-    case "8011D":
-    case "8012D":
+    case "8021D":
+    case "8022D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s185mm1.png');
    break;

    //夜明けものがたり
-    case "8053D":
-    case "8054D":
-    case "8062D":
-    case "8063D":
+    case "8082D":
+    case "8083D":
+    case "8073D":
+    case "8074D":
      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/s185ym1.png');
    break;
+    //ラマルドボア
+    case "9253M":
+    case "9256M":
+      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/w213w.png');
+      break;
+
+    // 貨物
+    case "74":
+    case "75":
+      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/ef65_fs.png');
+      break;
+    case "70":
+    case "71":
+    case "73":
+    case "76":
+    case "3070":
+    case "3071":
+    case "3072":
+    case "3073":
+    case "3076":
+    case "3077":
+    case "3078":
+    case "3079":
+    case "8070":
+    case "8071":
+    case "8072":
+    case "8077":
+      setStationIcon(element.querySelector("img"),'https://storage.haruk.in/ef210a.png');
+      break;
    default:
      break;
    }
    `
      : ``;

-  const JRF_icon =
-    iconSetting == "true"
-      ? `JRF || setStationIcon(element.querySelector("img"),'https://storage.haruk.in/ef210a.png');`
-      : ``;
  const normal_train_name = `
-    if(new RegExp(/^4[1-9]\\d\\d[DM]$/).test(列番データ) || new RegExp(/^5[1-7]\\d\\d[DM]$/).test(列番データ)){
+    if(new RegExp(/^4[1-9]\\d\\d[DM]$/).test(列番データ) || new RegExp(/^5[1-7]\\d\\d[DM]$/).test(列番データ) || 列番データ ==="3621D"){
      行き先情報.innerText = "ワンマン\\n"+行き先情報.innerText;
      flag=true;
    }
@ -495,8 +518,7 @@ export const injectJavascriptData = (
      行き先情報.innerText = 行き先情報.innerText+"臨時列車\\n";
    }
  `;
-  const JRF_name =
-    `
+  const JRF_name = `
 let JRF = false;
 const getJRF = num =>{
  switch(num){
@ -535,7 +557,7 @@ const getJRF = num =>{
 const data = getJRF(列番データ);
 行き先情報.innerText = data != null ?  data+行き先情報.innerText : 行き先情報.innerText;

-` + JRF_icon;
+`;

  const TKT_name = `
  //安芸行と併結列車を個別に表示、それ以外をdefaultで下りなら既定の行き先を、上りなら奈半利行を設定
@ -548,9 +570,10 @@ const data = getJRF(列番データ);
      return "ごめん・なはり線直通\\n快速 安芸行";
    case "5874D":
    case "5882D":
+    case "5878D":
      return "ごめん・なはり線直通\\n各停 安芸行";
-    case "742D":
-    case "746D":
+    case "246D":
+    case "750D":
      return "土佐山田/奈半利行\\n(後免にて解結)\\nごめん・なはり線快速";
    default:
      if(new RegExp(/^58[1-3][1,3,5,7,9][DM]$/).test(列番データ)){
--- a/stateBox/useBusAndTrainData.js
+++ b/stateBox/useBusAndTrainData.js
@ -63,11 +63,51 @@ export const BusAndTrainDataProvider = ({ children }) => {
  const getInfluencedTrainData = (trainNum) => {
    const trainPairList = initializeTrainPairList();

+    // 9253M ラマル
+    // 9256M ラマル
+
+    // 4125m-545M
+    //143M-147M
+    // 1261M-4261M
+    // 3621DWANMAN
+    //8091D-IYO-OZU
+    //8093D-IYO-YAWA
+    //8092D-IYO-FUTAMI
+    //8094-IYO-DOGO
+
    const returnArray = [];
    if (!trainNum) return;
    if (trainPairList[trainNum]) {
      returnArray.push(Object.keys(trainPairList[trainNum])[0]);
    }
+    switch (trainNum) {
+      case "4125M":
+        returnArray.push("545M");
+        break;
+      case "545M":
+        returnArray.push("4125M");
+        break;
+      case "143M":
+        returnArray.push("147M");
+        break;
+      case "147M":
+        returnArray.push("143M");
+        break;
+      case "1261M":
+        returnArray.push("4261M");
+        break;
+      case "4261M":
+        returnArray.push("1261M");
+        break;
+      case new RegExp(/^4[1-9]\d\d[DM]$/).test(trainNum):
+        if (trainList["5" + trainNum.substring(1)])
+          returnArray.push("5" + trainNum.substring(1));
+        break;
+      case new RegExp(/^5[1-7]\d\d[DM]$/).test(trainNum):
+        if (trainList["4" + trainNum.substring(1)])
+          returnArray.push("4" + trainNum.substring(1));
+        break;
+    }
    if (
      // 列番が4xxDまたは5xxDの場合はxxDの列番を検索
      new RegExp(/^4[1-9]\d\d[DM]$/).test(trainNum) ||
@ -82,11 +122,14 @@ export const BusAndTrainDataProvider = ({ children }) => {
      if (trainList["4" + trainNum]) returnArray.push("4" + trainNum);
      if (trainList["5" + trainNum]) returnArray.push("5" + trainNum);
    }
-    if (!returnArray[0]) return [[], []];
-    const TD = trainList[returnArray[0]];
-    if (!TD) return [[], []];
-    const TDArray = TD.split("#").filter((d) => d != "");
-    return [returnArray, TDArray];
+
+    if (!returnArray.length) return [];
+    const TDArray = returnArray.map((d) => {
+      const TD = trainList[d];
+      if (!TD) return;
+      return { id: d, TrainData: TD.split("#").filter((d) => d != "") };
+    });
+    return TDArray;
  };
  return (
    <BusAndTrainDataContext.Provider
--- a/stateBox/useCurrentTrain.js
+++ b/stateBox/useCurrentTrain.js
@ -1,8 +1,15 @@
-import React, { createContext, useContext, useState, useEffect } from "react";
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  useRef,
+} from "react";
 import { HeaderConfig } from "../lib/HeaderConfig";

 import useInterval from "../lib/useInterval";
 const initialState = {
+  webview: {},
  currentTrain: [],
  setCurrentTrain: () => {},
  currentTrainLoading: "loading",
@ -40,9 +47,12 @@ export const CurrentTrainProvider = ({ children }) => {
  useEffect(getCurrentTrain, []); //初回だけ現在の全在線列車取得

  useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得
+
+  const webview = useRef();
  return (
    <CurrentTrainContext.Provider
      value={{
+        webview,
        currentTrain,
        setCurrentTrain,
        currentTrainLoading,