|
|
|
@ -1,4 +1,4 @@
|
|
|
|
|
import React, { useRef, useState, useEffect } from "react";
|
|
|
|
|
import React, { useRef, useState, useEffect, useMemo } from "react";
|
|
|
|
|
import Carousel from "react-native-snap-carousel";
|
|
|
|
|
import {
|
|
|
|
|
Platform,
|
|
|
|
@ -47,7 +47,7 @@ export default function Menu(props) {
|
|
|
|
|
const StationBoardAcSR = useRef(null);
|
|
|
|
|
const navigation = useNavigation();
|
|
|
|
|
|
|
|
|
|
//位置情報
|
|
|
|
|
//ここから位置情報
|
|
|
|
|
const [location, setLocation] = useState(null);
|
|
|
|
|
const [locationStatus, setLocationStatus] = useState(null);
|
|
|
|
|
useEffect(() => {
|
|
|
|
@ -70,30 +70,16 @@ export default function Menu(props) {
|
|
|
|
|
if (locationStatus !== "granted") return () => {};
|
|
|
|
|
getCurrentPosition();
|
|
|
|
|
}, 5000);
|
|
|
|
|
//ここまで位置情報
|
|
|
|
|
|
|
|
|
|
//基礎駅情報取得
|
|
|
|
|
const [originalStationList, setOriginalStationList] = useState();
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
getStationList().then(setOriginalStationList);
|
|
|
|
|
}, []);
|
|
|
|
|
|
|
|
|
|
const [locationAndFavorite, setLocationAndFavorite] = useState([]);
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (!favoriteStation) return () => {};
|
|
|
|
|
const data = favoriteStation.filter((d) =>
|
|
|
|
|
JSON.stringify(d) === JSON.stringify(currentStation) ? false : true
|
|
|
|
|
);
|
|
|
|
|
setLocationAndFavorite(data);
|
|
|
|
|
}, [currentStation, favoriteStation]);
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (!(selectedCurrentStation < favoriteStation.length)) {
|
|
|
|
|
setSelectedCurrentStation(favoriteStation.length - 1);
|
|
|
|
|
carouselRef.current.snapToItem(favoriteStation.length - 1);
|
|
|
|
|
}
|
|
|
|
|
}, [favoriteStation]);
|
|
|
|
|
|
|
|
|
|
const [stationName, setStationName] = useState(undefined);
|
|
|
|
|
const [currentStation, setCurrentStation] = useState(undefined);
|
|
|
|
|
//ここから現在地付近の駅情報整理
|
|
|
|
|
const [currentAreaStation, setCurrentAreaStation] = useState([]);
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
if (!location) return () => {};
|
|
|
|
|
if (!originalStationList) return () => {};
|
|
|
|
@ -123,15 +109,43 @@ export default function Menu(props) {
|
|
|
|
|
}, []);
|
|
|
|
|
LayoutAnimation.easeInEaseOut();
|
|
|
|
|
if (returnDataBase.length) {
|
|
|
|
|
let currentStation = currentStation == undefined ? [] : currentStation;
|
|
|
|
|
if (currentStation.toString() != returnDataBase.toString()) {
|
|
|
|
|
setCurrentStation(returnDataBase);
|
|
|
|
|
if (currentAreaStation.toString() != returnDataBase.toString()) {
|
|
|
|
|
setCurrentAreaStation(returnDataBase);
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
setCurrentStation(undefined);
|
|
|
|
|
setCurrentAreaStation([]);
|
|
|
|
|
}
|
|
|
|
|
}, [location, originalStationList]);
|
|
|
|
|
|
|
|
|
|
//Favoriteから現在地を排除し現在地を最初に持ってくるバージョン
|
|
|
|
|
//const [locationAndFavorite, setLocationAndFavorite] = useState([]);
|
|
|
|
|
const locationAndFavorite = useMemo(() => {
|
|
|
|
|
const data = favoriteStation.filter((d) =>
|
|
|
|
|
JSON.stringify(d) === JSON.stringify(currentAreaStation) ? false : true
|
|
|
|
|
);
|
|
|
|
|
return [...currentAreaStation, ...data];
|
|
|
|
|
}, [currentAreaStation, favoriteStation]);
|
|
|
|
|
// useEffect(() => {
|
|
|
|
|
// if (!favoriteStation) return () => {};
|
|
|
|
|
// const data = favoriteStation.filter((d) =>
|
|
|
|
|
// JSON.stringify(d) === JSON.stringify(currentAreaStation) ? false : true
|
|
|
|
|
// );
|
|
|
|
|
// setLocationAndFavorite([...currentAreaStation, ...data]);
|
|
|
|
|
// }, [currentAreaStation, favoriteStation]);
|
|
|
|
|
|
|
|
|
|
const [selectedCurrentStation, setSelectedCurrentStation] = useState(0);
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
console.log(selectedCurrentStation > locationAndFavorite.length);
|
|
|
|
|
if (locationAndFavorite.length == 0) {
|
|
|
|
|
//carouselRef.current.snapToItem(0);
|
|
|
|
|
setSelectedCurrentStation(0);
|
|
|
|
|
}
|
|
|
|
|
if (selectedCurrentStation > locationAndFavorite.length - 1) {
|
|
|
|
|
//carouselRef.current.snapToItem(locationAndFavorite.length - 1);
|
|
|
|
|
setSelectedCurrentStation(locationAndFavorite.length - 1);
|
|
|
|
|
}
|
|
|
|
|
}, [locationAndFavorite]);
|
|
|
|
|
|
|
|
|
|
const [count, setCount] = useState(0);
|
|
|
|
|
const [delayData, setDelayData] = useState(undefined);
|
|
|
|
|
const [getTime, setGetTime] = useState(new Date());
|
|
|
|
@ -139,7 +153,6 @@ export default function Menu(props) {
|
|
|
|
|
const carouselRef = useRef();
|
|
|
|
|
const scrollRef = useRef();
|
|
|
|
|
const [isScroll, setIsScroll] = useState(true);
|
|
|
|
|
const [selectedCurrentStation, setSelectedCurrentStation] = useState(0);
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
|
fetch(
|
|
|
|
@ -162,33 +175,15 @@ export default function Menu(props) {
|
|
|
|
|
>
|
|
|
|
|
<StatusbarDetect />
|
|
|
|
|
<TitleBar />
|
|
|
|
|
<ScrollView ref={scrollRef} scrollEnabled={isScroll}>
|
|
|
|
|
<TopMenuButton />
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL(
|
|
|
|
|
"https://www.jr-shikoku.co.jp/02_information/suspension/sp/"
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 18 }}>
|
|
|
|
|
新型コロナウイルスに関するお知らせ
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 15 }}>
|
|
|
|
|
列車の運行計画・混雑状況・感染症対策への取り組み
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<FixedContent
|
|
|
|
|
scrollRef={scrollRef}
|
|
|
|
|
isScroll={isScroll}
|
|
|
|
|
navigate={navigate}
|
|
|
|
|
>
|
|
|
|
|
<Carousel
|
|
|
|
|
ref={carouselRef}
|
|
|
|
|
layout={"default"}
|
|
|
|
|
data={
|
|
|
|
|
originalStationList &&
|
|
|
|
|
(currentStation
|
|
|
|
|
? [currentStation, ...locationAndFavorite]
|
|
|
|
|
: locationAndFavorite)
|
|
|
|
|
}
|
|
|
|
|
data={originalStationList && locationAndFavorite}
|
|
|
|
|
sliderWidth={wp("100%")}
|
|
|
|
|
itemWidth={wp("80%")}
|
|
|
|
|
enableMomentum
|
|
|
|
@ -211,13 +206,11 @@ export default function Menu(props) {
|
|
|
|
|
);
|
|
|
|
|
}}
|
|
|
|
|
/>
|
|
|
|
|
{locationAndFavorite.length != 0 && originalStationList && (
|
|
|
|
|
{originalStationList && locationAndFavorite[selectedCurrentStation] && (
|
|
|
|
|
<LED_vision
|
|
|
|
|
station={
|
|
|
|
|
originalStationList &&
|
|
|
|
|
(currentStation
|
|
|
|
|
? [currentStation, ...locationAndFavorite]
|
|
|
|
|
: locationAndFavorite)[selectedCurrentStation][0]
|
|
|
|
|
locationAndFavorite[selectedCurrentStation][0]
|
|
|
|
|
}
|
|
|
|
|
navigate={navigate}
|
|
|
|
|
/>
|
|
|
|
@ -229,293 +222,11 @@ export default function Menu(props) {
|
|
|
|
|
loadingDelayData={loadingDelayData}
|
|
|
|
|
delayData={delayData}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<View style={{ flexDirection: "row" }}>
|
|
|
|
|
<TicketBox
|
|
|
|
|
backgroundColor={"#AD7FA8"}
|
|
|
|
|
icon={<Foundation name="ticket" color="white" size={50} />}
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-eki.com/ticket/brand")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
トクトク切符
|
|
|
|
|
</TicketBox>
|
|
|
|
|
<TicketBox
|
|
|
|
|
backgroundColor={"#8F5902"}
|
|
|
|
|
icon={<FontAwesome name="first-order" color="white" size={50} />}
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL(
|
|
|
|
|
"https://www.jr-shikoku.co.jp/01_trainbus/event_train/sp/"
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
観光列車
|
|
|
|
|
</TicketBox>
|
|
|
|
|
<TicketBox
|
|
|
|
|
backgroundColor={"#888A85"}
|
|
|
|
|
icon={<Ionicons name="flag" color="white" size={50} />}
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-eki.com/tour/brand")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
旅行ツアー
|
|
|
|
|
</TicketBox>
|
|
|
|
|
</View>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-eki.com/smart-eki/index.html")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
スマートえきちゃん
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
JR四国のチケットレススマホアプリです。
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL(
|
|
|
|
|
"https://www.jr-shikoku.co.jp/sp/index.html#menu-box"
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
臨時列車などのお知らせ
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
区間縮小・計画運休・イベント・季節臨時列車など
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/03_news/press/")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
ニュースリリース
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
公式プレス記事はこちら
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/teiki/")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
定期運賃計算
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
通常/学生/快て〜き等はこちら
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/04_company/group/sp/")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
JR四国のお店・サービス
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
JR四国グループの施設をご案内
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<View style={{ flexDirection: "row" }}>
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
style={{
|
|
|
|
|
flex: 1,
|
|
|
|
|
backgroundColor: "#729FCF",
|
|
|
|
|
borderColor: "#0099CC",
|
|
|
|
|
padding: 10,
|
|
|
|
|
borderWidth: 1,
|
|
|
|
|
margin: 2,
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
}}
|
|
|
|
|
onPress={() => Linking.openURL("https://www.jr-odekake.net/smt/")}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
時刻・運賃計算
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 18 }}>
|
|
|
|
|
(マイ・ダイヤ)
|
|
|
|
|
</Text>
|
|
|
|
|
<Foundation name="yen" color="white" size={50} />
|
|
|
|
|
<Text style={{ color: "white" }}>
|
|
|
|
|
マイ・ダイヤはJR西日本提供のサービスです。
|
|
|
|
|
</Text>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
style={{
|
|
|
|
|
flex: 1,
|
|
|
|
|
backgroundColor: "#8AE234",
|
|
|
|
|
borderColor: "#0099CC",
|
|
|
|
|
padding: 10,
|
|
|
|
|
borderWidth: 1,
|
|
|
|
|
margin: 2,
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
}}
|
|
|
|
|
onPress={() => Linking.openURL("tel:0570-00-4592")}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
JR四国案内センター
|
|
|
|
|
</Text>
|
|
|
|
|
<Foundation name="telephone" color="white" size={50} />
|
|
|
|
|
<Text style={{ color: "white" }}>0570-00-4592</Text>
|
|
|
|
|
<Text style={{ color: "white" }}>(8:00~20:00 年中無休)</Text>
|
|
|
|
|
<Text style={{ color: "white" }}>(通話料がかかります)</Text>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
</View>
|
|
|
|
|
<View
|
|
|
|
|
style={{
|
|
|
|
|
backgroundColor: "#0099CC",
|
|
|
|
|
borderRadius: 10,
|
|
|
|
|
margin: 10,
|
|
|
|
|
borderColor: "black",
|
|
|
|
|
borderWidth: 2,
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<View
|
|
|
|
|
style={{ padding: 10, flexDirection: "row", alignItems: "center" }}
|
|
|
|
|
>
|
|
|
|
|
<MaterialCommunityIcons
|
|
|
|
|
name="twitter"
|
|
|
|
|
style={{ padding: 5 }}
|
|
|
|
|
color="white"
|
|
|
|
|
size={30}
|
|
|
|
|
/>
|
|
|
|
|
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
|
|
|
|
|
JR四国公式Twitter一族
|
|
|
|
|
</Text>
|
|
|
|
|
</View>
|
|
|
|
|
<View
|
|
|
|
|
style={{
|
|
|
|
|
padding: 10,
|
|
|
|
|
backgroundColor: "white",
|
|
|
|
|
borderBottomLeftRadius: 10,
|
|
|
|
|
borderBottomRightRadius: 10,
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
{((data) =>
|
|
|
|
|
data.map((d) => (
|
|
|
|
|
<ListItem onPress={() => Linking.openURL(d.url)}>
|
|
|
|
|
<Text>{d.name}</Text>
|
|
|
|
|
<View style={{ flex: 1 }} />
|
|
|
|
|
<Icon name="chevron-right" size={20} />
|
|
|
|
|
</ListItem>
|
|
|
|
|
)))([
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_eigyo",
|
|
|
|
|
name: "JR四国営業部【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_tokyo",
|
|
|
|
|
name: "JR四国 東京営業情報【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_osaka",
|
|
|
|
|
name: "JR四国 大阪営業部【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jr_shikoku_info",
|
|
|
|
|
name: "JR四国列車運行情報【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/Smile_Eki_Chan",
|
|
|
|
|
name: "すまいるえきちゃん♡JR四国【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrs_matsuyama",
|
|
|
|
|
name: "JR四国 松山駅 【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrshikoku_kochi",
|
|
|
|
|
name: "JR四国 高知駅【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jr_tokust",
|
|
|
|
|
name: "JR四国 徳島駅【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrshikoku_uwjm",
|
|
|
|
|
name: "JR四国 宇和島駅【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_wkoch",
|
|
|
|
|
name: "JR四国 ワープ高知支店【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrshikoku_nihaw",
|
|
|
|
|
name: "JR四国 ワープ新居浜営業所【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/Yoakemonogatari",
|
|
|
|
|
name: "志国土佐 時代の夜明けのものがたり【公式】",
|
|
|
|
|
},
|
|
|
|
|
])}
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
<Text style={{ fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
このアプリについて
|
|
|
|
|
</Text>
|
|
|
|
|
<Text>
|
|
|
|
|
このアプリはXprocess(HARUKIN)が製作しているJR四国の完全非公式アシストアプリケーションです。このアプリに関することでのJR四国公式へ問合せすることはお控えください。以下のTwitterよりお願いします。
|
|
|
|
|
</Text>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#CC0000"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://twitter.com/Xprocess_main")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
XprocessのTwitter
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
制作運営のTwitterです。
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="black"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() => navigate("setting")}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
アプリの設定
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
アプリの設定画面を表示します。
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
{/*
|
|
|
|
|
<SvgUri
|
|
|
|
|
width="200"
|
|
|
|
|
height="200"
|
|
|
|
|
source={require("./assets/トレインビジョン関係/1.svg")}
|
|
|
|
|
/> */}
|
|
|
|
|
</ScrollView>
|
|
|
|
|
</FixedContent>
|
|
|
|
|
<StationDeteilView
|
|
|
|
|
StationBoardAcSR={StationBoardAcSR}
|
|
|
|
|
currentStation={
|
|
|
|
|
originalStationList &&
|
|
|
|
|
(currentStation
|
|
|
|
|
? [currentStation, ...locationAndFavorite]
|
|
|
|
|
: locationAndFavorite)[selectedCurrentStation]
|
|
|
|
|
originalStationList && locationAndFavorite[selectedCurrentStation]
|
|
|
|
|
}
|
|
|
|
|
originalStationList={originalStationList}
|
|
|
|
|
favoriteStation={favoriteStation}
|
|
|
|
@ -697,3 +408,305 @@ const JRSTraInfoBox = (props) => {
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
);
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const FixedContent = (props) => (
|
|
|
|
|
<>
|
|
|
|
|
<ScrollView ref={props.scrollRef} scrollEnabled={props.isScroll}>
|
|
|
|
|
<TopMenuButton />
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL(
|
|
|
|
|
"https://www.jr-shikoku.co.jp/02_information/suspension/sp/"
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 18 }}>
|
|
|
|
|
新型コロナウイルスに関するお知らせ
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 15 }}>
|
|
|
|
|
列車の運行計画・混雑状況・感染症対策への取り組み
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
{props.children}
|
|
|
|
|
|
|
|
|
|
<View style={{ flexDirection: "row" }}>
|
|
|
|
|
<TicketBox
|
|
|
|
|
backgroundColor={"#AD7FA8"}
|
|
|
|
|
icon={<Foundation name="ticket" color="white" size={50} />}
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-eki.com/ticket/brand")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
トクトク切符
|
|
|
|
|
</TicketBox>
|
|
|
|
|
<TicketBox
|
|
|
|
|
backgroundColor={"#8F5902"}
|
|
|
|
|
icon={<FontAwesome name="first-order" color="white" size={50} />}
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL(
|
|
|
|
|
"https://www.jr-shikoku.co.jp/01_trainbus/event_train/sp/"
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
観光列車
|
|
|
|
|
</TicketBox>
|
|
|
|
|
<TicketBox
|
|
|
|
|
backgroundColor={"#888A85"}
|
|
|
|
|
icon={<Ionicons name="flag" color="white" size={50} />}
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-eki.com/tour/brand")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
旅行ツアー
|
|
|
|
|
</TicketBox>
|
|
|
|
|
</View>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-eki.com/smart-eki/index.html")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
スマートえきちゃん
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
JR四国のチケットレススマホアプリです。
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/sp/index.html#menu-box")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
臨時列車などのお知らせ
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
区間縮小・計画運休・イベント・季節臨時列車など
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/03_news/press/")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
ニュースリリース
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
公式プレス記事はこちら
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/teiki/")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
定期運賃計算
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
通常/学生/快て〜き等はこちら
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#0099CC"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://www.jr-shikoku.co.jp/04_company/group/sp/")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
JR四国のお店・サービス
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
JR四国グループの施設をご案内
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<View style={{ flexDirection: "row" }}>
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
style={{
|
|
|
|
|
flex: 1,
|
|
|
|
|
backgroundColor: "#729FCF",
|
|
|
|
|
borderColor: "#0099CC",
|
|
|
|
|
padding: 10,
|
|
|
|
|
borderWidth: 1,
|
|
|
|
|
margin: 2,
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
}}
|
|
|
|
|
onPress={() => Linking.openURL("https://www.jr-odekake.net/smt/")}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
時刻・運賃計算
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 18 }}>
|
|
|
|
|
(マイ・ダイヤ)
|
|
|
|
|
</Text>
|
|
|
|
|
<Foundation name="yen" color="white" size={50} />
|
|
|
|
|
<Text style={{ color: "white" }}>
|
|
|
|
|
マイ・ダイヤはJR西日本提供のサービスです。
|
|
|
|
|
</Text>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
<TouchableOpacity
|
|
|
|
|
style={{
|
|
|
|
|
flex: 1,
|
|
|
|
|
backgroundColor: "#8AE234",
|
|
|
|
|
borderColor: "#0099CC",
|
|
|
|
|
padding: 10,
|
|
|
|
|
borderWidth: 1,
|
|
|
|
|
margin: 2,
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
}}
|
|
|
|
|
onPress={() => Linking.openURL("tel:0570-00-4592")}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
JR四国案内センター
|
|
|
|
|
</Text>
|
|
|
|
|
<Foundation name="telephone" color="white" size={50} />
|
|
|
|
|
<Text style={{ color: "white" }}>0570-00-4592</Text>
|
|
|
|
|
<Text style={{ color: "white" }}>(8:00~20:00 年中無休)</Text>
|
|
|
|
|
<Text style={{ color: "white" }}>(通話料がかかります)</Text>
|
|
|
|
|
</TouchableOpacity>
|
|
|
|
|
</View>
|
|
|
|
|
<View
|
|
|
|
|
style={{
|
|
|
|
|
backgroundColor: "#0099CC",
|
|
|
|
|
borderRadius: 10,
|
|
|
|
|
margin: 10,
|
|
|
|
|
borderColor: "black",
|
|
|
|
|
borderWidth: 2,
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
<View
|
|
|
|
|
style={{ padding: 10, flexDirection: "row", alignItems: "center" }}
|
|
|
|
|
>
|
|
|
|
|
<MaterialCommunityIcons
|
|
|
|
|
name="twitter"
|
|
|
|
|
style={{ padding: 5 }}
|
|
|
|
|
color="white"
|
|
|
|
|
size={30}
|
|
|
|
|
/>
|
|
|
|
|
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
|
|
|
|
|
JR四国公式Twitter一族
|
|
|
|
|
</Text>
|
|
|
|
|
</View>
|
|
|
|
|
<View
|
|
|
|
|
style={{
|
|
|
|
|
padding: 10,
|
|
|
|
|
backgroundColor: "white",
|
|
|
|
|
borderBottomLeftRadius: 10,
|
|
|
|
|
borderBottomRightRadius: 10,
|
|
|
|
|
}}
|
|
|
|
|
>
|
|
|
|
|
{((data) =>
|
|
|
|
|
data.map((d) => (
|
|
|
|
|
<ListItem onPress={() => Linking.openURL(d.url)}>
|
|
|
|
|
<Text>{d.name}</Text>
|
|
|
|
|
<View style={{ flex: 1 }} />
|
|
|
|
|
<Icon name="chevron-right" size={20} />
|
|
|
|
|
</ListItem>
|
|
|
|
|
)))([
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_eigyo",
|
|
|
|
|
name: "JR四国営業部【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_tokyo",
|
|
|
|
|
name: "JR四国 東京営業情報【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_osaka",
|
|
|
|
|
name: "JR四国 大阪営業部【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jr_shikoku_info",
|
|
|
|
|
name: "JR四国列車運行情報【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/Smile_Eki_Chan",
|
|
|
|
|
name: "すまいるえきちゃん♡JR四国【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrs_matsuyama",
|
|
|
|
|
name: "JR四国 松山駅 【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrshikoku_kochi",
|
|
|
|
|
name: "JR四国 高知駅【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jr_tokust",
|
|
|
|
|
name: "JR四国 徳島駅【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrshikoku_uwjm",
|
|
|
|
|
name: "JR四国 宇和島駅【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/JRshikoku_wkoch",
|
|
|
|
|
name: "JR四国 ワープ高知支店【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/jrshikoku_nihaw",
|
|
|
|
|
name: "JR四国 ワープ新居浜営業所【公式】",
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
url: "https://twitter.com/Yoakemonogatari",
|
|
|
|
|
name: "志国土佐 時代の夜明けのものがたり【公式】",
|
|
|
|
|
},
|
|
|
|
|
])}
|
|
|
|
|
</View>
|
|
|
|
|
</View>
|
|
|
|
|
<Text style={{ fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
このアプリについて
|
|
|
|
|
</Text>
|
|
|
|
|
<Text>
|
|
|
|
|
このアプリはXprocess(HARUKIN)が製作しているJR四国の完全非公式アシストアプリケーションです。このアプリに関することでのJR四国公式へ問合せすることはお控えください。以下のTwitterよりお願いします。
|
|
|
|
|
</Text>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="#CC0000"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() =>
|
|
|
|
|
Linking.openURL("https://twitter.com/Xprocess_main")
|
|
|
|
|
}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
XprocessのTwitter
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
制作運営のTwitterです。
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
<TextBox
|
|
|
|
|
backgroundColor="black"
|
|
|
|
|
flex={1}
|
|
|
|
|
onPressButton={() => props.navigate("setting")}
|
|
|
|
|
>
|
|
|
|
|
<Text style={{ color: "white", fontWeight: "bold", fontSize: 20 }}>
|
|
|
|
|
アプリの設定
|
|
|
|
|
</Text>
|
|
|
|
|
<Text style={{ color: "white", fontSize: 18 }}>
|
|
|
|
|
アプリの設定画面を表示します。
|
|
|
|
|
</Text>
|
|
|
|
|
</TextBox>
|
|
|
|
|
{/*
|
|
|
|
|
<SvgUri
|
|
|
|
|
width="200"
|
|
|
|
|
height="200"
|
|
|
|
|
source={require("./assets/トレインビジョン関係/1.svg")}
|
|
|
|
|
/> */}
|
|
|
|
|
</ScrollView>
|
|
|
|
|
</>
|
|
|
|
|
);
|
|
|
|
|