Merge commit '815734eb07186bf15c58a3befd9b190fd2839170' into develop

2023-02-06 11:24:48 +09:00 · 2023-02-06 11:24:48 +09:00 · 74864da293
commit 74864da293
parent 4e90ecf132 815734eb07
4 changed files with 306 additions and 50 deletions
--- a/assets/originData/lineColorList.js
+++ b/assets/originData/lineColorList.js
@ -0,0 +1,11 @@
+export default {
+  Y: "#F5AC13",
+  U: "#F5AC13",
+  S: "#9AA7D7",
+  D: "#DC4586",
+  K: "#DC4586",
+  B: "#366481",
+  N: "#881F61",
+  T: "#87CA3B",
+  M: "#0071be",
+};
--- a/components/ActionSheetComponents/StationDeteilView.js
+++ b/components/ActionSheetComponents/StationDeteilView.js
@ -1,14 +1,24 @@
-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 {
@ -63,6 +73,15 @@ export const StationDeteilView = (props) => {
              />
            </View>
          )}
+          {currentStation &&
+            currentStation.map((d) => (
+              <NexPreStationLine
+                currentStation={d}
+                originalStationList={originalStationList}
+                favoriteStation={favoriteStation}
+                setFavoriteStation={setFavoriteStation}
+              />
+            ))}
          {currentStation && (
            <View style={{ flexDirection: "row" }}>
              {!currentStation[0].JrHpUrl || (
@ -108,3 +127,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",
+  },
+};
--- a/components/駅名表/Sign.js
+++ b/components/駅名表/Sign.js
@ -65,15 +65,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) => {
--- a/lib/getStationList.js
+++ b/lib/getStationList.js
@ -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.日英対応表
-    );
-    stationList.土讃線 = addStationPosition(
-      concatBetweenStations(stationList.土讃線),
+    stationList["予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]"] =
+      addStationPosition(
+        concatBetweenStations(
+          stationList["予讃線/愛ある伊予灘線(向井原-伊予大洲間)[S]"]
+        ),
+        予讃線,
+        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",