harukin/jrshikoku
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

StationDeteilViewの項目分離

Browse Source
This commit is contained in:
harukin-expo-dev-env 2025-04-03 09:15:42 +00:00
parent cd08fdc08b
commit 1a2d678ef3
6 changed files with 175 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

188
components/ActionSheetComponents/StationDeteilView.js
View File

@ -18,16 +18,15 @@ import { widthPercentageToDP as wp } from "react-native-responsive-screen";
import { getPDFViewURL } from "../../lib/getPdfViewURL";
import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData";
import { AS } from "../../storageControl";
import { StationMapButton } from "./StationDeteilView/StationMapButton";
import { TrainBusButton } from "./StationDeteilView/TrainBusButton";
import { 駅構内図 } from "./StationDeteilView/StationInsideMapButton";
import { WebSiteButton } from "./StationDeteilView/WebSiteButton";
import { StationTimeTableButton } from "./StationDeteilView/StationTimeTableButton";
export const StationDeteilView = (props) => {
if (!props.payload) return <></>;
const {
currentStation,
navigate,
onExit,
goTo,
useShow,
} = props.payload;
const { currentStation, navigate, onExit, goTo, useShow } = props.payload;
const { busAndTrainData } = useBusAndTrainData();
const [trainBus, setTrainBus] = useState();
@ -90,12 +89,7 @@ export const StationDeteilView = (props) => {
</View>
<View>
{currentStation && (
<View
style={{
margin: 10,
marginHorizontal: wp("10%"),
}}
>
<View style={{ margin: 10, marginHorizontal: wp("10%") }}>
<Sign
currentStation={currentStation}
oP={() => {
@ -115,102 +109,51 @@ export const StationDeteilView = (props) => {
{currentStation &&
currentStation[0].JrHpUrl &&
currentStation[0].StationNumber != "M12" && (
<駅構内図 //高松/阿波池田&後免&須崎kounai.png児島例外/
oP={() => {
navigate("howto", {
info:
currentStation[0].JrHpUrl.replace("/index.html", "/") +
"/kounai_map.html",
goTo,
useShow,
});
onExit();
}}
oLP={() => {
Linking.openURL(
currentStation[0].JrHpUrl.replace("/index.html", "/") +
"/kounai_map.html"
);
}}
uri={currentStation[0].JrHpUrl.replace("/index.html", "/")}
<駅構内図 //児島例外/
navigate={navigate}
goTo={goTo}
useShow={useShow}
address={currentStation[0].JrHpUrl}
onExit={onExit}
/>
)}
{currentStation && (
<View style={{ flexDirection: "row" }}>
{!currentStation[0].JrHpUrl || (
<TicketBox
backgroundColor={"#AD7FA8"}
icon={<Foundation name="web" color="white" size={50} />}
flex={1}
onPressButton={() => {
navigate("howto", {
info: currentStation[0].JrHpUrl,
goTo,
useShow,
});
onExit();
}}
onLongPressButton={() =>
Linking.openURL(currentStation[0].JrHpUrl)
}
>
web
</TicketBox>
<WebSiteButton
navigate={navigate}
info={currentStation[0].JrHpUrl}
goTo={goTo}
useShow={useShow}
onExit={onExit}
/>
)}
{!currentStation[0].StationTimeTable || (
<TicketBox
backgroundColor={"#8F5902"}
icon={<FontAwesome name="table" color="white" size={50} />}
flex={1}
onPressButton={() => {
usePDFView == "true"
? Linking.openURL(currentStation[0].StationTimeTable)
: navigate("howto", {
info,
goTo,
useShow,
});
onExit();
}}
onLongPressButton={() =>
Linking.openURL(currentStation[0].StationTimeTable)
}
>
時刻表
</TicketBox>
<StationTimeTableButton
info={info}
address={currentStation[0].StationTimeTable}
usePDFView={usePDFView}
navigate={navigate}
onExit={onExit}
goTo={goTo}
useShow={useShow}
/>
)}
{!currentStation[0].StationMap || (
<TicketBox
backgroundColor={"#888A85"}
icon={<Ionicons name="map" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].StationMap)
}
>
Map
</TicketBox>
<StationMapButton stationMap={currentStation[0].StationMap} />
)}
{!trainBus || (
<TicketBox
backgroundColor={"#CE5C00"}
icon={<Ionicons name="bus" color="white" size={50} />}
flex={1}
onPressButton={() => {
<TrainBusButton
address={trainBus.address}
press={() => {
navigate("howto", {
info: trainBus.address,
goTo,
useShow,
});
onExit();
}}
onLongPressButton={() => Linking.openURL(trainBus.address)}
>
並行バス
</TicketBox>
/>
)}
</View>
)}
@ -220,67 +163,6 @@ export const StationDeteilView = (props) => {
);
};
const 駅構内図 = (props) => {
const [open, setOpen] = useState(false);
return (
<>
<TouchableOpacity
style={{
height: 50,
backgroundColor: "#888A85",
flexDirection: "column",
alignContent: "center",
alignItems: "center",
margin: 2,
}}
onPress={props.oP}
onLongPress={props.oLP}
//onPress={() => setOpen(!open)}
>
<View style={{ flex: 1 }} />
<Text
style={{
color: "white",
textAlign: "center",
textAlignVertical: "center",
flex: 1,
}}
>
{open ? "駅構内図を非表示" : "駅構内図を表示"}
</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
<View>
{open && (
<>
<AutoHeightImage
source={{ uri: props.uri + "images/kounai.gif" }}
resizeMode="contain"
width={wp("100%")}
/>
<AutoHeightImage
source={{ uri: props.uri + "images/kounai.png" }}
resizeMode="contain"
width={wp("100%")}
/>
<AutoHeightImage
source={{ uri: props.uri + "images/kounai_1f.gif" }}
resizeMode="contain"
width={wp("100%")}
/>
<AutoHeightImage
source={{ uri: props.uri + "images/kounai_2f.png" }}
resizeMode="contain"
width={wp("100%")}
/>
</>
)}
</View>
</>
);
};
const Handler = () => {
useEffect(() => {
const backAction = () => {
@ -294,4 +176,4 @@ const Handler = () => {
return () => backHandler.remove();
}, []);
return <></>;
};
};

43
components/ActionSheetComponents/StationDeteilView/StationInsideMapButton.tsx Normal file
View File

@ -0,0 +1,43 @@
import { FC } from "react";
import { TouchableOpacity, View, Text, Linking } from "react-native";
type Props = {
navigate: (screen: string, params: { info: string; goTo: string; useShow: boolean }) => void;
address: string;
goTo: string;
useShow: boolean;
onExit: () => void;
};
export const 駅構内図:FC<Props> = (props) => {
const { navigate, address, goTo, useShow, onExit } = props;
const info = address.replace("/index.html", "/") + "/kounai_map.html";
return (
<TouchableOpacity
style={{
height: 50,
backgroundColor: "#888A85",
flexDirection: "column",
alignContent: "center",
alignItems: "center",
margin: 2,
}}
onPress={() => {
navigate("howto", { info, goTo, useShow });
onExit();
}}
onLongPress={() => Linking.openURL(info)}
>
<View style={{ flex: 1 }} />
<Text
style={{
color: "white",
textAlign: "center",
textAlignVertical: "center",
flex: 1,
}}
>
駅構内図を表示
</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
);
};

16
components/ActionSheetComponents/StationDeteilView/StationMapButton.tsx Normal file
View File

@ -0,0 +1,16 @@
import React from "react";
import { Linking } from "react-native";
import { Ionicons } from "@expo/vector-icons";
import { TicketBox } from "@/components/atom/TicketBox";
export const StationMapButton = ({stationMap}) => {
return (
<TicketBox
backgroundColor={"#888A85"}
icon={<Ionicons name="map" color="white" size={50} />}
flex={1}
onPressButton={() => Linking.openURL(stationMap)}
>
Map
</TicketBox>
);
};

32
components/ActionSheetComponents/StationDeteilView/StationTimeTableButton.tsx Normal file
View File

@ -0,0 +1,32 @@
import React, { FC } from "react";
import { Linking } from "react-native";
import { FontAwesome } from "@expo/vector-icons";
import { TicketBox } from "@/components/atom/TicketBox";
type Props = {
info: string;
address: string;
usePDFView: string;
navigate: (screen: string, params?: object) => void;
onExit: () => void;
goTo: string;
useShow: string;
};
export const StationTimeTableButton: FC<Props> = (props) => {
const { info, address, usePDFView, navigate, onExit, goTo, useShow } = props;
return (
<TicketBox
backgroundColor={"#8F5902"}
icon={<FontAwesome name="table" color="white" size={50} />}
flex={1}
onPressButton={() => {
usePDFView == "true"
? Linking.openURL(address)
: navigate("howto", { info, goTo, useShow });
onExit();
}}
onLongPressButton={() => Linking.openURL(address)}
>
時刻表
</TicketBox>
);
};

21
components/ActionSheetComponents/StationDeteilView/TrainBusButton.tsx Normal file
View File

@ -0,0 +1,21 @@
import React, { FC } from "react";
import { Linking } from "react-native";
import { Ionicons } from "@expo/vector-icons";
import { TicketBox } from "@/components/atom/TicketBox";
type Props = {
address: string;
press: () => void;
};
export const TrainBusButton: FC<Props> = ({ address, press }) => {
return (
<TicketBox
backgroundColor={"#CE5C00"}
icon={<Ionicons name="bus" color="white" size={50} />}
flex={1}
onPressButton={press}
onLongPressButton={() => Linking.openURL(address)}
>
並行バス
</TicketBox>
);
};

28
components/ActionSheetComponents/StationDeteilView/WebSiteButton.tsx Normal file
View File

@ -0,0 +1,28 @@
import React, { FC } from "react";
import { Linking } from "react-native";
import { Foundation } from "@expo/vector-icons";
import { TicketBox } from "@/components/atom/TicketBox";
type Props = {
navigate: (screen: string, params: any) => void;
info: string;
goTo: string;
useShow: string;
onExit: () => void;
};
export const WebSiteButton: FC<Props> = (Props) => {
const { navigate, info, goTo, useShow, onExit } = Props;
return (
<TicketBox
backgroundColor={"#AD7FA8"}
icon={<Foundation name="web" color="white" size={50} />}
flex={1}
onPressButton={() => {
navigate("howto", { info, goTo, useShow });
onExit();
}}
onLongPressButton={() => Linking.openURL(info)}
>
web
</TicketBox>
);
};