Merge commit '59d7d425e5f52f547ac569aa7874fbd5adbefca1' into develop

2025-07-08 16:27:33 +00:00 · 2025-07-08 16:27:33 +00:00 · 54fba616b5
commit 54fba616b5
parent 156912302d 59d7d425e5
19 changed files with 497 additions and 90 deletions
--- 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": "徳島線",
--- 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
        }}
      >
        <View style={{ height: 0 }} />
--- a/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx
+++ b/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx
@ -51,7 +51,6 @@ export const TrainIconStatus: FC<Props> = ({ 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<Props> = ({ 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 == "▲") {
--- 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) => {
                  }
                />
              </View>
-              {currentStation[0].JrHpUrl &&
-                currentStation[0].StationNumber != "M12" && (
-                  <駅構内図 //児島例外/
-                    navigate={navigate}
-                    goTo={goTo}
-                    useShow={useShow}
-                    address={currentStation[0].JrHpUrl}
-                    onExit={onExit}
-                  />
-                )}
+              <View style={{ flexDirection: "row" }}>
+                <StationTrainPositionButton
+                  stationNumber={currentStation[0].StationNumber}
+                  onExit={onExit}
+                  navigate={navigate}
+                />
+                {currentStation[0].JrHpUrl &&
+                  currentStation[0].StationNumber != "M12" && (
+                    <駅構内図 //児島例外/
+                      navigate={navigate}
+                      goTo={goTo}
+                      useShow={useShow}
+                      address={currentStation[0].JrHpUrl}
+                      onExit={onExit}
+                    />
+                  )}
+              </View>
              <View style={{ flexDirection: "row" }}>
                {!currentStation[0].JrHpUrl || (
                  <WebSiteButton
@ -135,7 +143,12 @@ export const StationDeteilView = (props) => {
                    useShow={useShow}
                  />
                )}
-                <StationMapButton stationMap={currentStation[0].StationMap || `https://www.google.co.jp/maps/place/${currentStation[0].lat},${currentStation[0].lng}`} />
+                <StationMapButton
+                  stationMap={
+                    currentStation[0].StationMap ||
+                    `https://www.google.co.jp/maps/place/${currentStation[0].lat},${currentStation[0].lng}`
+                  }
+                />
                {!trainBus || (
                  <TrainBusButton
                    address={trainBus.address}
--- a/components/ActionSheetComponents/StationDeteilView/StationInsideMapButton.tsx
+++ b/components/ActionSheetComponents/StationDeteilView/StationInsideMapButton.tsx
@ -19,6 +19,7 @@ export const 駅構内図:FC<Props> = (props) => {
        alignContent: "center",
        alignItems: "center",
        margin: 2,
+        flex: 1,
      }}
      onPress={() => {
        navigate("howto", { info, goTo, useShow });
--- a/components/ActionSheetComponents/StationDeteilView/StationTrainPositionButton.tsx
+++ 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> = (props) => {
+  const { stationNumber, onExit, navigate } = props;
+  const {
+    inject,
+  } = useCurrentTrain();
+  const { getInjectJavascriptAddress } = useStationList();
+  return (
+    <TouchableOpacity
+      style={{
+        height: 50,
+        backgroundColor: "#0099CC",
+        flexDirection: "row",
+        alignContent: "center",
+        alignItems: "center",
+        margin: 2,
+        flex: 1
+      }}
+      onPress={() => {
+        navigate("positions", { screen: "Apps" });
+        const script = getInjectJavascriptAddress(stationNumber);
+        inject(script);
+        onExit();
+      }}
+    >
+      <View style={{ flex: 1 }} />
+      <AntDesign
+        name={"barchart"}
+        size={20}
+        color={"white"}
+        style={{ marginHorizontal: 5, marginVertical: 5 }}
+      />
+      <Text
+        style={{
+          color: "white",
+          textAlign: "center",
+          textAlignVertical: "center",
+        }}
+      >
+        走行位置に移動
+      </Text>
+      <View style={{ flex: 1 }} />
+    </TouchableOpacity>
+  );
+};
--- 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;
  };

--- 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<ICarouselInstance>(null);
  const { height, width } = useWindowDimensions();
  const [dotButton, setDotButton] = useState(false);
+  const carouselBadgeScrollViewRef = useRef<ScrollView>(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 (
      <View
@ -66,12 +78,38 @@ export const CarouselBox = ({
        key={item[0].StationNumber}
      >
        <View style={{ flex: 1 }} />
-        <Sign
-          stationID={item[0].StationNumber}
-          isCurrentStation={item == nearPositionStation}
-          oP={oPSign}
-          oLP={oLPSign}
-        />
+        {item[0].StationNumber != "null" ? (
+          <Sign
+            stationID={item[0].StationNumber}
+            isCurrentStation={item == nearPositionStation}
+            oP={oPSign}
+            oLP={oLPSign}
+          />
+        ) : (
+          <TouchableOpacity
+            style={{
+              width: width * 0.8,
+              height: ((width * 0.8) / 20) * 9,
+              borderColor: "#0099CC",
+              borderWidth: 1,
+              backgroundColor: "white",
+            }}
+          >
+            <View
+              style={{
+                flex: 1,
+                justifyContent: "center",
+                alignItems: "center",
+              }}
+            >
+              <Text style={{ color: "#0099CC", fontSize: 20 }}>
+                {stationListMode == "position"
+                  ? "現在地の近くに駅がありません。"
+                  : "お気に入りリストがありません。お気に入りの駅を追加しよう！"}
+              </Text>
+            </View>
+          </TouchableOpacity>
+        )}
        <View style={{ flex: 1 }} />
      </View>
    );
@ -80,7 +118,11 @@ export const CarouselBox = ({
    <View style={{ flex: 1, paddingTop: 10 }}>
      <Carousel
        ref={carouselRef}
-        data={listUpStation}
+        data={
+          listUpStation.length > 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}
      />
-      <View
-        style={{
+      <ScrollView
+        horizontal
+        showsHorizontalScrollIndicator={false}
+        contentContainerStyle={{
          flexDirection: "row",
          justifyContent: "center",
          alignContent: "center",
          alignItems: "center",
+          paddingVertical: 2,
+          paddingHorizontal: 10,
+          minWidth: width,
+        }}
+        ref={(scrollViewRef) => {
+          // ScrollViewのrefを保存
+          if (scrollViewRef) {
+            carouselBadgeScrollViewRef.current = scrollViewRef;
+          }
        }}
      >
        {originalStationList &&
@ -123,7 +179,7 @@ export const CarouselBox = ({
              />
            );
          })}
-      </View>
+      </ScrollView>
    </View>
  );
 };
--- 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 (
-    <View style={{ width: "100%", height: 40, flexDirection: "row", position: mapMode ? "absolute" : "relative", bottom: mapMode ? 0 : undefined}} key={"carouselTypeChanger"} >
+    <KeyboardAvoidingView
+      behavior="padding"
+      keyboardVerticalOffset={80}
+      enabled={Platform.OS === "ios"}
+      style={{
+        width: "100%",
+        height: 40,
+        flexDirection: "row",
+        position: mapMode ? "absolute" : "relative",
+        bottom: mapMode ? 0 : undefined,
+        zIndex: 1000,
+        backgroundColor: "white",
+      }}
+      key={"carouselTypeChanger"}
+    >
+      <SearchUnitBox
+        isSearchMode={isSearchMode}
+        setisSearchMode={setisSearchMode}
+      />
      <TouchableOpacity
        style={{
          flex: 1,
-          backgroundColor: stationListMode == "position" ? "#0099CC" : "#0099CC80",
+          backgroundColor:
+            stationListMode == "position" ? "#0099CC" : "#0099CC80",
          padding: 5,
          alignItems: "center",
          flexDirection: "row",
@ -45,8 +77,7 @@ export const CarouselTypeChanger = ({
          borderBottomRightRadius: mapMode ? 0 : 20,
        }}
        disabled={!locationStatus}
-        
-        onPressIn={() =>{
+        onPressIn={() => {
          if (!position) return;
          returnToDefaultMode();
          setStationListMode("position");
@ -99,7 +130,8 @@ export const CarouselTypeChanger = ({
      <TouchableOpacity
        style={{
          flex: 1,
-          backgroundColor: stationListMode == "favorite" ? "#0099CC" : "#0099CC80",
+          backgroundColor:
+            stationListMode == "favorite" ? "#0099CC" : "#0099CC80",
          padding: 5,
          alignItems: "center",
          flexDirection: "row",
@ -137,6 +169,6 @@ export const CarouselTypeChanger = ({
          お気に入りリスト
        </Text>
      </TouchableOpacity>
-    </View>
+    </KeyboardAvoidingView>
  );
 };
--- a/components/Menu/RailScope/SearchUnitBox.tsx
+++ 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 (
+    <>
+      <TouchableOpacity
+        style={{
+          position: "absolute",
+          bottom: !!isSearchMode ? 0 : 60,
+          right: 0,
+          padding: !!isSearchMode ? 5 : 10,
+          margin: !!isSearchMode ? 0 : 10,
+          backgroundColor: "#0099CC",
+          borderRadius: !!isSearchMode ? 5 : 50,
+          width: !!isSearchMode ? width : 50,
+          zIndex: 1000,
+        }}
+        disabled={!!isSearchMode}
+        onPress={() => {
+          LayoutAnimation.configureNext({
+            duration: 100,
+            update: { type: "easeInEaseOut", springDamping: 0.6 },
+          });
+          setisSearchMode(true);
+        }}
+      >
+        {!isSearchMode && <Ionicons name="search" size={30} color="white" />}
+        {!!isSearchMode && (
+          <View style={{ backgroundColor: "#0099CC" }}>
+            
+            <View style={{ flexDirection: "row", alignItems: "center" }}>
+              <TouchableOpacity onPress={() => {
+                LayoutAnimation.configureNext({
+                  duration: 100,
+                  update: { type: "easeInEaseOut", springDamping: 0.6 },
+                });
+                setisSearchMode(false);
+              }}>
+                <Ionicons
+                  name="arrow-back"
+                  size={20}
+                  color="white"
+                  style={{ marginRight: 10 }}
+                />
+              </TouchableOpacity>
+              {Object.keys(lineList_LineWebID).map((d) => (
+                <TouchableOpacity
+                  style={{
+                    flex: 1,
+                    backgroundColor: lineColorList[stationIDPair[lineList_LineWebID[d]]],
+                    padding: 5,
+                    marginHorizontal: 2,
+                    borderRadius: 10,
+                    borderColor: "white",
+                    borderWidth: 1,
+                    borderStyle: "solid",
+                    alignItems: "center",
+                    opacity: isSearchMode == stationIDPair[lineList_LineWebID[d]] ? 1 : !isSearchMode ? 1 : 0.5,
+                    zIndex: 10,
+                  }}
+                  onPress={() => {
+                    const id = stationIDPair[lineList_LineWebID[d]];
+                    const s = isSearchMode == id ? undefined : id;
+                    if (!s) return;
+                    setisSearchMode(s);
+                  }}
+                  key={stationIDPair[lineList_LineWebID[d]]}
+                >
+                  <Text
+                    style={{ color: "white", fontWeight: "bold", fontSize: 20 }}
+                  >
+                    {stationIDPair[lineList_LineWebID[d]]}
+                  </Text>
+                </TouchableOpacity>
+              ))}
+              {/* <View
+              style={{
+                backgroundColor: "white",
+                borderRadius: 25,
+                height: 30,
+                paddingRight: 10,
+                paddingLeft: 10,
+                flex: 1,
+              }}
+            >
+              <TextInput
+                placeholder="駅名を入力してフィルタリングします。"
+                //onFocus={() => setKeyBoardVisible(true)}
+                onEndEditing={() => {}}
+                //onChange={(ret) => setInput(ret.nativeEvent.text)}
+                //value={input}
+                style={{ flex: 1 }}
+              />
+            </View> */}
+            </View>
+          </View>
+        )}
+      </TouchableOpacity>
+    </>
+  );
+};
--- 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("");
--- 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 (
    <View style={{ height: "100%", backgroundColor: "#0099CC", ...style }}>
      <MapView
@ -70,7 +70,7 @@ export default function TrainMenu({ style }) {
            d={d}
            navigate={navigate}
            webview={webview}
-            key={D.StationNumber + d}
+            key={D.Station_JP + D.StationNumber + d}
          />
        ))}
      </MapView>
@ -161,6 +161,7 @@ export default function TrainMenu({ style }) {
                  });
                });
              }}
+              key={stationIDPair[d]}
            >
              <Text
                style={{ color: "white", fontWeight: "bold", fontSize: 20 }}
--- a/components/発車時刻表/LED_Vision_Component/Header.js
+++ b/components/発車時刻表/LED_Vision_Component/Header.js
@ -25,22 +25,6 @@ export const Header = ({ station }) => {
      }}
    >
      <View style={{ flex: 1, flexDirection: "column", alignItems: "center" }}>
-        <AntDesign
-          name={"barchart"}
-          size={20}
-          color={"white"}
-          style={{
-            borderWidth: 1,
-            borderColor: "white",
-            padding: 10,
-            borderRadius: 10,
-          }}
-          onPress={() => {
-            navigate("positions", { screen: "Apps" });
-            const script = getInjectJavascriptAddress(station.StationNumber);
-            inject(script);
-          }}
-        />
      </View>
      <View style={{}}>
        <Text style={{ fontSize: 25, color: "white", fontWeight: "bold" }}>
--- 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]"] = [
      {
--- 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":
--- 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', "<p style='font-size:6px;padding:0;color:black;text-align:center;'>" + TrainNumber + (JRF ? "":"レ") + "</p>");
      行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:8px;font-weight:bold;padding:0;color: black;text-align:center;'>" + (isWanman ? "ワンマン " : "")  + "</p>");
-      行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:6px;font-weight:bold;padding:0;color: black;text-align:center;'>" + viaData + "</p>");
+      行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:6px;font-weight:bold;padding:0;color: black;text-align:center;border-bottom-style:solid;border-bottom-width: "+(!!yosan2Color ? "2px" : "0px")+";border-color:" + yosan2Color + "'>" + viaData + "</p>");
      行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:8px;font-weight:bold;padding:0;color: black;text-align:center;'>" + trainName + "</p>");
      行き先情報.insertAdjacentHTML('beforebegin', "<div style='width:100%;background:" + gradient + ";'><p style='font-size:10px;font-weight:bold;padding:0;margin:0;color:white;align-items:center;align-content:center;text-align:center;text-shadow:1px 1px 0px #00000030, -1px -1px 0px #00000030,-1px 1px 0px #00000030,  1px -1px 0px #00000030,1px 0px 0px #00000030, -1px  0px 0px #00000030,0px 1px 0px #00000030,  0px -1px 0px #00000030;'>" + (ToData ? ToData + "行" : ToData) + "</p></div>");
+      行き先情報.insertAdjacentHTML('beforebegin', "<div style='width:100%;background:" + trainTypeColor + ";'><p style='font-size:10px;font-weight:bold;font-style:italic;padding:0;color: white;text-align:center;'>" + trainType + "</p></div>");
      行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:8px;font-weight:bold;padding:0;text-align:center;color: "+(hasProblem ? "red":"black")+";'>" + (hasProblem ? "‼️停止中‼️" : "") + "</p>");
      `: `
      行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;color: black;'>" + returnText1 + "</p>");
@ -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;
      });
--- 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 (
    <View
@ -209,16 +251,35 @@ export default function Menu(props) {
      }}
    >
      <StatusbarDetect />
-      <TitleBar />
+      {!mapMode ? (
+        <TitleBar />
+      ) : (
+        <></>
+        // <Text
+        //   style={{
+        //     fontSize: 30,
+        //     color: "#0099CC",
+        //     fontWeight: "bold",
+        //     position: "absolute",
+        //     top: 0,
+        //     zIndex: 1000,
+        //     fontStyle: "italic",
+        //   }}
+        // >
+        //   JRShikoku RailScope
+        // </Text>
+      )}
      <ScrollView
        ref={scrollRef}
        snapToStart={false}
        snapToEnd={false}
        decelerationRate={"normal"}
        snapToOffsets={[mapHeight - 80]}
+        contentContainerStyle={{
+          position: "relative",
+        }}
        onScrollBeginDrag={onScrollBeginDrag}
        onScrollEndDrag={(e) => {
-          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 && (
          <>
            <CarouselBox
              {...{
@ -322,6 +386,7 @@ export default function Menu(props) {
                setListIndex,
                listIndex,
                navigate,
+                stationListMode,
              }}
            />
            {listUpStation[listIndex] && (
@ -349,6 +414,8 @@ export default function Menu(props) {
            setSelectedCurrentStation: setListIndex,
            mapMode,
            setMapMode,
+            isSearchMode,
+            setisSearchMode,
          }}
        />
      )}
--- 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);
--- a/stateBox/useStationList.tsx
+++ b/stateBox/useStationList.tsx
@ -92,7 +92,6 @@ export const StationListProvider: FC<Props> = ({ children }) => {
          return;
        }
        if (x.StationNumber == StationNumber) {
-          console.log(originalStationList[d]);
          if (!x.MyStation) findNearStations = true;
          else bootStationList.push({ line: lineName, station: x });
        }