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

Merge commit '15bb692676e546e59ce418c8b7e2847ca7345ceb'

Browse Source
This commit is contained in:
harukin-DeskMini 2022-09-30 00:15:36 +09:00
commit 5474b3eab2
20 changed files with 3104 additions and 1294 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

163
App.js
View File

@ -1,21 +1,25 @@
import React, { useEffect, useRef } from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator,TransitionPresets ,} from '@react-navigation/stack';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import { AntDesign, Ionicons } from '@expo/vector-icons';
import {ToastAndroid, Platform, UIManager,} from 'react-native';
import { UpdateAsync } from './UpdateAsync.js';
import Apps from './Apps';
import tndView from './ndView';
import trainbase from './trainbaseview';
import howto from './howto';
import menu from './menu';
import News from './components/news.js';
import TestArea from './TestArea.js';
import Setting from './components/settings.js';
import React, { useEffect, useRef } from "react";
import { NavigationContainer } from "@react-navigation/native";
import {
createStackNavigator,
TransitionPresets,
} from "@react-navigation/stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import { AntDesign, Ionicons } from "@expo/vector-icons";
import { ToastAndroid, Platform, UIManager } from "react-native";
import { UpdateAsync } from "./UpdateAsync.js";
import Apps from "./Apps";
import tndView from "./ndView";
import trainbase from "./trainbaseview";
import howto from "./howto";
import menu from "./menu";
import News from "./components/news.js";
import TestArea from "./TestArea.js";
import Setting from "./components/settings.js";
import trainMenu from "./components/trainMenu.js";
const Stack = createStackNavigator();
const Tab = createBottomTabNavigator();
if (Platform.OS === 'android') {
if (Platform.OS === "android") {
if (UIManager.setLayoutAnimationEnabledExperimental) {
UIManager.setLayoutAnimationEnabledExperimental(true);
}
@ -23,35 +27,132 @@ if (Platform.OS === 'android') {
export default function App() {
const navigationRef = useRef();
var platform = Platform.OS === "android" ? 70 : 50;
useEffect(()=>UpdateAsync(),[])
useEffect(() => UpdateAsync(), []);
return (
<NavigationContainer name="Root" ref={navigationRef} style={{ flex: 1 }}>
<Tab.Navigator>
<Stack.Screen name="login" component={top} options={{ tabBarLabel: '位置情報',headerTransparent:true,gestureEnabled:true,tabBarIcon: ({ color, size }) => (<AntDesign name="barchart" size={32} />),}}/>
<Stack.Screen name="menuPage" component={menuPage} options={{ tabBarLabel: 'リンク',headerTransparent:true,gestureEnabled:true,tabBarIcon: ({ color, size }) => (<Ionicons name="ios-radio" size={32}/>),}}/>
<Stack.Screen name="home" component={tndView} options={{ tabBarLabel: '運行情報',headerTransparent:true,gestureEnabled:true,tabBarIcon: ({ color, size }) => (<Ionicons name="md-train" size={32}/>),}}/>
<Stack.Screen
name="login"
component={top}
options={{
tabBarLabel: "位置情報",
headerTransparent: true,
gestureEnabled: true,
tabBarIcon: ({ color, size }) => (
<AntDesign name="barchart" size={32} />
),
}}
/>
<Stack.Screen
name="menuPage"
component={menuPage}
options={{
tabBarLabel: "リンク",
headerTransparent: true,
gestureEnabled: true,
tabBarIcon: ({ color, size }) => (
<Ionicons name="ios-radio" size={32} />
),
}}
/>
<Stack.Screen
name="home"
component={tndView}
options={{
tabBarLabel: "運行情報",
headerTransparent: true,
gestureEnabled: true,
tabBarIcon: ({ color, size }) => (
<Ionicons name="md-train" size={32} />
),
}}
/>
</Tab.Navigator>
</NavigationContainer>
)
);
}
function top() {
return (
<Stack.Navigator>
<Stack.Screen name="Apps" component={Apps} options={{headerShown: false,gestureEnabled:true,headerTransparent:true,}}/>
<Stack.Screen name="trainbase" component={trainbase} options={{ title: 'トレインビジョン',gestureEnabled:true,...TransitionPresets.SlideFromRightIOS}}/>
<Stack.Screen name="howto" component={howto} options={{ title: '使い方',gestureEnabled:true,...TransitionPresets.ModalPresentationIOS,cardOverlayEnabled:true,headerTransparent:true,headerShown:false}}/>
<Stack.Screen
name="Apps"
component={Apps}
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
/>
<Stack.Screen
name="trainbase"
component={trainbase}
options={{
title: "トレインビジョン",
gestureEnabled: true,
...TransitionPresets.SlideFromRightIOS,
}}
/>
<Stack.Screen
name="howto"
component={howto}
options={{
title: "使い方",
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
<Stack.Screen name="test" component={TestArea} options={{}} />
<Stack.Screen name="news" component={News} options={{gestureEnabled:true,...TransitionPresets.ModalPresentationIOS,cardOverlayEnabled:true,headerTransparent:true,headerShown:false}} />
<Stack.Screen
name="news"
component={News}
options={{
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
<Stack.Screen
name="trainMenu"
component={trainMenu}
options={{
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
</Stack.Navigator>
)
);
}
function menuPage() {
return (
<Stack.Navigator>
<Stack.Screen name="menu" component={menu} options={{headerShown: false,gestureEnabled:true,headerTransparent:true,}}/>
<Stack.Screen name="setting" component={Setting} options={{gestureEnabled:true,...TransitionPresets.ModalPresentationIOS,cardOverlayEnabled:true,headerTransparent:true,headerShown:false}} />
<Stack.Screen
name="menu"
component={menu}
options={{
headerShown: false,
gestureEnabled: true,
headerTransparent: true,
}}
/>
<Stack.Screen
name="setting"
component={Setting}
options={{
gestureEnabled: true,
...TransitionPresets.ModalPresentationIOS,
cardOverlayEnabled: true,
headerTransparent: true,
headerShown: false,
}}
/>
</Stack.Navigator>
)
);
}

160
Apps.js
View File

@ -1,5 +1,11 @@
import React, { useEffect, useRef, useState } from "react";
import { View, Platform, ToastAndroid } from "react-native";
import {
View,
Platform,
ToastAndroid,
Text,
TouchableOpacity,
} from "react-native";
import { WebView } from "react-native-webview";
import Constants from "expo-constants";
import AsyncStorage from "@react-native-async-storage/async-storage";
@ -8,8 +14,6 @@ import { news } from "./config/newsUpdate";
import StatusbarDetect from './StatusbarDetect';
var Status = StatusbarDetect(); */
export var webview = null;
export default function Apps(props) {
const {
navigation: { navigate },
@ -17,13 +21,81 @@ export default function Apps(props) {
var urlcache = "";
const webview = useRef();
const [iconSetting, setIconSetting] = useState(undefined);
const [mapSwitch, setMapSwitch] = useState(undefined);
const bootData = `
const [stationData, setStationData] = useState(undefined);
useEffect(() => {
const HeaderConfig = {
headers: { referer: "https://train.jr-shikoku.co.jp/sp.html" },
};
Promise.all([
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=yosan",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=uwajima",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=uwajima2",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=dosan",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=dosan2",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=koutoku",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=tokushima",
HeaderConfig
).then((response) => response.json()),
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=naruto",
HeaderConfig
).then((response) => response.json()),
]).then((values) => {
let stationList = {};
[
stationList.yosan,
stationList.uwajima,
stationList.uwajima2,
stationList.dosan,
stationList.dosan2,
stationList.koutoku,
stationList.tokushima,
stationList.naruto,
] = values;
setStationData(stationList);
});
}, []);
const topMenu =
mapSwitch != "true"
? `
document.getElementById('header').querySelector('a').style.display = 'none';
document.getElementById('header').style.height = '50px';
document.getElementById('main').style.paddingTop = '54px';
document.getElementById('headerStr').style.display = 'none';
`
: `
document.getElementsByClassName('accordionClass')[0].style.display = 'none';
document.getElementById('header').style.display = 'none';
document.getElementById('main').style.paddingTop = '0px';
document.getElementById('headerStr').style.display = 'none';
`;
const bootData =
topMenu +
`
const setReload = () =>{
try{
document.getElementById('refreshIcon').click();
@ -700,7 +772,30 @@ observer.observe(target, {
});
`;
const injectJavascriptData = bootData + trainIconMaker + textInsert;
const modal_content = `
const modal_content = document.getElementById('modal_content'); // body要素を監視
const modal_observer = new MutationObserver( (mutations) => {
// observer.disconnect(); // 監視を終了
for(let d of modal_content.getElementsByTagName("button") ){
const data = d.onclick.toString().split("\\"")[1];
d.onclick = () => window.ReactNativeWebView.postMessage(data)
}
});
// 監視を開始
modal_observer.observe(modal_content, {
//attributes: true, // 属性変化の監視
//attributeOldValue: true, // 変化前の属性値を matation.oldValue に格納する
//characterData: true, // テキストノードの変化を監視
//characterDataOldValue: true, // 変化前のテキストを matation.oldValue に格納する
childList: true, // 子ノードの変化を監視
//subtree: true // 子孫ノードも監視対象に含める
});
`;
const injectJavascriptData =
bootData + modal_content + trainIconMaker + textInsert;
useEffect(() => {
AsyncStorage.getItem("status")
@ -729,6 +824,22 @@ observer.observe(target, {
Updates.reloadAsync()
)
);
AsyncStorage.getItem("mapSwitch")
.then((d) => {
if (d) {
setMapSwitch(d);
} else {
AsyncStorage.setItem("mapSwitch", "false").then(() =>
Updates.reloadAsync()
);
}
})
.catch((d) =>
AsyncStorage.setItem("mapSwitch", "false").then(() =>
Updates.reloadAsync()
)
);
}, []);
return (
@ -773,9 +884,46 @@ observer.observe(target, {
}
}
}}
onMessage={(event) => {}}
onMessage={(event) => {
console.log(event.nativeEvent.data);
navigate("trainbase", { info: event.nativeEvent.data });
}}
injectedJavaScript={injectJavascriptData}
/>
<TouchableOpacity
onPress={() => navigate("trainMenu", { webview, stationData })}
style={{
position: "absolute",
top: Platform.OS == "ios" ? Constants.statusBarHeight : 0,
left: 10,
width: 50,
height: 50,
backgroundColor: "#0099CC",
borderColor: "white",
borderStyle: "solid",
borderWidth: 1,
borderRadius: 50,
alignContent: "center",
alignSelf: "center",
alignItems: "center",
display: mapSwitch == "true" ? "flex" : "none",
}}
>
<View style={{ flex: 1 }} />
<Text
style={{
textAlign: "center",
width: "auto",
height: "auto",
textAlignVertical: "center",
fontWeight: "bold",
color: "white",
}}
>
三
</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
</View>
);
}

16
StatusbarDetect.js
View File

@ -1,16 +1,10 @@
import React from 'react';
import {Platform, StatusBar, View} from 'react-native';
import React from "react";
import { Platform, StatusBar, View } from "react-native";
export default function StatusbarDetect() {
if (Platform.OS == "ios") {
return (
<StatusBar barStyle="dark-content"/>
);
return <StatusBar barStyle="dark-content" />;
} else if (Platform.OS == "android") {
return <View />;
}
else if(Platform.OS == "android"){
return (
<View/>
);
}
}

73
TestArea.js
View File

@ -1,21 +1,23 @@
import React, { Component, useEffect, useState } from 'react';
import {StatusBar,View,ScrollView,Linking,Text } from 'react-native';
import Constants from 'expo-constants';
import { ListItem } from 'react-native-elements';
import Icon from 'react-native-vector-icons/Entypo';
import StatusbarDetect from './StatusbarDetect';
import React, { Component, useEffect, useState } from "react";
import { StatusBar, View, ScrollView, Linking, Text } from "react-native";
import Constants from "expo-constants";
import { ListItem } from "react-native-elements";
import Icon from "react-native-vector-icons/Entypo";
import StatusbarDetect from "./StatusbarDetect";
var Status = StatusbarDetect();
let a = [];
export default function TestArea(props) {
const [data, setdata] = useState(null);
useEffect(() => {
data==null ? test().then(res=>{
data == null
? test().then((res) => {
//console.log(res);
setdata(res);
}):null
},[data])
})
: null;
}, [data]);
return (
<View style={{height:"100%",paddingTop: Constants.statusBarHeight,}}>
<View style={{ height: "100%", paddingTop: Constants.statusBarHeight }}>
{Status}
<ScrollView>
<Text>TEST AREA!!</Text>
@ -26,22 +28,45 @@ export default function TestArea(props) {
}
async function test() {
return fetch('https://train.jr-shikoku.co.jp/g?arg1=train&arg2=train', {
return fetch("https://train.jr-shikoku.co.jp/g?arg1=train&arg2=train", {
headers: {
'authority': 'train.jr-shikoku.co.jp',
'cache-control': 'no-cache',
'pragma': 'no-cache',
'if-modified-since': 'Thu, 01 Jun 1970 00:00:00 GMT',
'accept': '*/*',
'sec-fetch-site': 'same-origin',
'sec-fetch-mode': 'cors',
'referer': 'https://train.jr-shikoku.co.jp/sp.html'
}
}).then(res=>res.json()).then(D=>{
authority: "train.jr-shikoku.co.jp",
"cache-control": "no-cache",
pragma: "no-cache",
"if-modified-since": "Thu, 01 Jun 1970 00:00:00 GMT",
accept: "*/*",
"sec-fetch-site": "same-origin",
"sec-fetch-mode": "cors",
referer: "https://train.jr-shikoku.co.jp/sp.html",
},
})
.then((res) => res.json())
.then((D) => {
let d = [];
D.forEach(element => {
console.log(element)
d.push(<ListItem title={"Direction:"+element.Direction+" Index:"+element.Index+" Line:"+element.Line+" Pos:"+element.Pos+" PosNum:"+element.PosNum+" TrainNum:"+element.TrainNum+" Type:"+element.Type+" Delay:"+element.delay}/>);
D.forEach((element) => {
console.log(element);
d.push(
<ListItem
title={
"Direction:" +
element.Direction +
" Index:" +
element.Index +
" Line:" +
element.Line +
" Pos:" +
element.Pos +
" PosNum:" +
element.PosNum +
" TrainNum:" +
element.TrainNum +
" Type:" +
element.Type +
" Delay:" +
element.delay
}
/>
);
});
a = d;
return d;

32
UpdateAsync.js
View File

@ -1,11 +1,25 @@
import { ToastAndroid, } from 'react-native';
import * as Updates from 'expo-updates';
import { ToastAndroid } from "react-native";
import * as Updates from "expo-updates";
export function UpdateAsync(){
Updates.checkForUpdateAsync().then(update=>{
if (update.isAvailable) {
ToastAndroid.showWithGravityAndOffset('アプリのデータを更新しています。',ToastAndroid.LONG,ToastAndroid.BOTTOM,25,50,);
export const UpdateAsync = () =>
Updates.checkForUpdateAsync()
.then((update) => {
if (!update.isAvailable) return;
ToastAndroid.showWithGravityAndOffset(
"アプリのデータを更新しています。",
ToastAndroid.LONG,
ToastAndroid.BOTTOM,
25,
50
);
Updates.fetchUpdateAsync().then(() => Updates.reloadAsync());
}
}).catch(e=>ToastAndroid.showWithGravityAndOffset(e.toString(),ToastAndroid.LONG,ToastAndroid.BOTTOM,25,50,))
}
})
.catch((e) =>
ToastAndroid.showWithGravityAndOffset(
e.toString(),
ToastAndroid.LONG,
ToastAndroid.BOTTOM,
25,
50
)
);

27
app.json
View File

@ -3,11 +3,8 @@
"name": "JR四国運行状況",
"slug": "jrshikoku",
"privacy": "public",
"platforms": [
"ios",
"android"
],
"version": "4.2",
"platforms": ["ios", "android"],
"version": "4.4",
"orientation": "portrait",
"icon": "./assets/icon.png",
"splash": {
@ -18,19 +15,25 @@
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"**/*"
],
"assetBundlePatterns": ["**/*"],
"ios": {
"buildNumber": "20",
"buildNumber": "22",
"supportsTablet": true,
"bundleIdentifier": "jrshikokuinfo.xprocess.hrkn"
"bundleIdentifier": "jrshikokuinfo.xprocess.hrkn",
"config": {
"googleMapsApiKey": "AIzaSyAVGDTjBkR_0wkQiNkoo5WDLhqXCjrjk8Y"
}
},
"android": {
"package": "jrshikokuinfo.xprocess.hrkn",
"versionCode": 14,
"versionCode": 16,
"permissions": ["ACCESS_FINE_LOCATION"],
"googleServicesFile": "./google-services.json"
"googleServicesFile": "./google-services.json",
"config": {
"googleMaps": {
"apiKey": "AIzaSyAmFb-Yj033bXZWlSzNrfq_0jc1PgRrWcE"
}
}
}
}
}

80
components/ActionSheetComponents/StationDeteilView.js Normal file
View File

@ -0,0 +1,80 @@
export const StationDeteilView = (props) => {
return (
<ActionSheet
ref={StationBoardAcSR}
gestureEnabled
CustomHeaderComponent={() => {}}
>
<View
style={{
backgroundColor: "white",
borderRadius: 5,
borderColor: "dark",
borderWidth: 1,
}}
>
<View style={{ height: 26, width: "100%" }}>
<View
style={{
height: 6,
width: 45,
borderRadius: 100,
backgroundColor: "#f0f0f0",
marginVertical: 10,
alignSelf: "center",
}}
/>
</View>
<ScrollView>
{currentStation && (
<Sign
currentStation={currentStation}
originalStationList={originalStationList}
oP={() => Linking.openURL(currentStation[0].StationTimeTable)}
/>
)}
{currentStation && (
<View style={{ flexDirection: "row" }}>
{!currentStation[0].JrHpUrl || (
<TicketBox
backgroundColor={"#AD7FA8"}
icon={<Foundation name="web" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].JrHpUrl)
}
>
web
</TicketBox>
)}
{!currentStation[0].StationTimeTable || (
<TicketBox
backgroundColor={"#8F5902"}
icon={<FontAwesome name="table" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].StationTimeTable)
}
>
時刻表
</TicketBox>
)}
{!currentStation[0].StationMap || (
<TicketBox
backgroundColor={"#888A85"}
icon={<Ionicons name="map" color="white" size={50} />}
flex={1}
onPressButton={() =>
Linking.openURL(currentStation[0].StationMap)
}
>
GoogleMap
</TicketBox>
)}
</View>
)}
</ScrollView>
</View>
</ActionSheet>
);
};

276
components/custom-train-data.js
View File

@ -20,13 +20,25 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "25M":
case "27M":
case "29M":
return {type:"LTDEXP",trainName:"しおかぜ",trainIcon:'http://www.trainfrontview.net/b/s8000nr.png',trainNumDistance:0,info:"いしづちと併結 / 8000系で運転"};
return {
type: "LTDEXP",
trainName: "しおかぜ",
trainIcon: "http://www.trainfrontview.net/b/s8000nr.png",
trainNumDistance: 0,
info: "いしづちと併結 / 8000系で運転",
};
//8000 アンパン
case "10M":
case "22M":
case "9M":
case "21M":
return {type:"LTDEXP",trainName:"しおかぜ",trainIcon:'http://www.trainfrontview.net/f/s8000ap.png',trainNumDistance:0,info:"いしづちと併結 / アンパンマン列車で運転"};
return {
type: "LTDEXP",
trainName: "しおかぜ",
trainIcon: "http://www.trainfrontview.net/f/s8000ap.png",
trainNumDistance: 0,
info: "いしづちと併結 / アンパンマン列車で運転",
};
//8600
case "8M":
case "12M":
@ -36,7 +48,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "11M":
case "19M":
case "23M":
return {type:"LTDEXP",trainName:"しおかぜ",trainIcon:'http://www.trainfrontview.net/b/s8600.png',trainNumDistance:0,info:"いしづちと併結 / 8600系で運転"};
return {
type: "LTDEXP",
trainName: "しおかぜ",
trainIcon: "http://www.trainfrontview.net/b/s8600.png",
trainNumDistance: 0,
info: "いしづちと併結 / 8600系で運転",
};
//いしづちメイン
//8000 ノーマル
@ -58,14 +76,26 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "1025M":
case "1027M":
case "1029M":
return {type:"LTDEXP",trainName:"いしづち",trainIcon:'http://www.trainfrontview.net/b/s8000no.png',trainNumDistance:1000,info:"しおかぜと併結 / 8000系で運転"};
return {
type: "LTDEXP",
trainName: "いしづち",
trainIcon: "http://www.trainfrontview.net/b/s8000no.png",
trainNumDistance: 1000,
info: "しおかぜと併結 / 8000系で運転",
};
//8000 アンパン
case "1010M":
case "1022M":
case "1009M":
case "1021M":
return {type:"LTDEXP",trainName:"いしづち",trainIcon:'http://www.trainfrontview.net/f/s8000ap.png',trainNumDistance:1000,info:"しおかぜと併結 / アンパンマン列車で運転"};
return {
type: "LTDEXP",
trainName: "いしづち",
trainIcon: "http://www.trainfrontview.net/f/s8000ap.png",
trainNumDistance: 1000,
info: "しおかぜと併結 / アンパンマン列車で運転",
};
//8600
case "1008M":
@ -76,25 +106,55 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "1011M":
case "1019M":
case "1023M":
return {type:"LTDEXP",trainName:"いしづち",trainIcon:'http://www.trainfrontview.net/b/s8600_isz.png',trainNumDistance:1000,info:"しおかぜと併結 / 8600系で運転"};
return {
type: "LTDEXP",
trainName: "いしづち",
trainIcon: "http://www.trainfrontview.net/b/s8600_isz.png",
trainNumDistance: 1000,
info: "しおかぜと併結 / 8600系で運転",
};
//MEXP
//8000
case "1092M":
return {type:"LTDEXP",trainName:"モーニングEXP高松",trainIcon:'http://www.trainfrontview.net/b/s8000no.png',trainNumDistance:null,info:"8000系で運転"};
return {
type: "LTDEXP",
trainName: "モーニングEXP高松",
trainIcon: "http://www.trainfrontview.net/b/s8000no.png",
trainNumDistance: null,
info: "8000系で運転",
};
//8600
case "1091M":
return {type:"LTDEXP",trainName:"モーニングEXP松山",trainIcon:'http://www.trainfrontview.net/b/s8600_isz.png',trainNumDistance:null,info:"8600系で運転"};
return {
type: "LTDEXP",
trainName: "モーニングEXP松山",
trainIcon: "http://www.trainfrontview.net/b/s8600_isz.png",
trainNumDistance: null,
info: "8600系で運転",
};
//三桁いしづち
//8000 アンパン
case "1041M":
case "1044M":
return {type:"LTDEXP",trainName:"いしづち",trainIcon:'http://www.trainfrontview.net/f/s8000ap.png',trainNumDistance:940,info:"アンパンマン列車で運転"};
return {
type: "LTDEXP",
trainName: "いしづち",
trainIcon: "http://www.trainfrontview.net/f/s8000ap.png",
trainNumDistance: 940,
info: "アンパンマン列車で運転",
};
//8600
case "1043M":
case "1042M":
case "1046M":
return {type:"LTDEXP",trainName:"いしづち",trainIcon:'http://www.trainfrontview.net/b/s8600_isz.png',trainNumDistance:940,info:"8600系で運転"};
return {
type: "LTDEXP",
trainName: "いしづち",
trainIcon: "http://www.trainfrontview.net/b/s8600_isz.png",
trainNumDistance: 940,
info: "8600系で運転",
};
//南風 2700ノーマル
case "34D":
@ -115,7 +175,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "51D":
case "53D":
case "55D":
return {type:"LTDEXP",trainName:"南風",trainIcon:'http://www.trainfrontview.net/b/s2700.png',trainNumDistance:30,info:"2700系で運転"};
return {
type: "LTDEXP",
trainName: "南風",
trainIcon: "http://www.trainfrontview.net/b/s2700.png",
trainNumDistance: 30,
info: "2700系で運転",
};
//2700アンパン
case "32D":
case "36D":
@ -127,18 +193,28 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "45D":
case "49D":
case "57D":
return {type:"LTDEXP",trainName:"南風",trainIcon:'http://www.trainfrontview.net/f/s2700apr.png',trainNumDistance:30,info:"アンパンマン列車で運転"};
return {
type: "LTDEXP",
trainName: "南風",
trainIcon: "http://www.trainfrontview.net/f/s2700apr.png",
trainNumDistance: 30,
info: "アンパンマン列車で運転",
};
break;
//うずしお
//2700
case "5006D":
case "5022D":
case "5013D":
case "5029D":
return {type:"LTDEXP",trainName:"うずしお",trainIcon:'http://www.trainfrontview.net/b/s2700_uzu.png',trainNumDistance:5000,info:"南風と宇多津で併結 / 高松-宇多津間進行方向逆転 / 2700系で運転"};
return {
type: "LTDEXP",
trainName: "うずしお",
trainIcon: "http://www.trainfrontview.net/b/s2700_uzu.png",
trainNumDistance: 5000,
info: "南風と宇多津で併結 / 高松-宇多津間進行方向逆転 / 2700系で運転",
};
case "3002D":
case "3004D":
case "3010D":
@ -158,7 +234,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "3027D":
case "3031D":
case "3033D":
return {type:"LTDEXP",trainName:"うずしお",trainIcon:'http://www.trainfrontview.net/b/s2700_uzu.png',trainNumDistance:3000,info:"2700系で運転"};
return {
type: "LTDEXP",
trainName: "うずしお",
trainIcon: "http://www.trainfrontview.net/b/s2700_uzu.png",
trainNumDistance: 3000,
info: "2700系で運転",
};
//2600
case "3008D":
@ -169,12 +251,24 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "3011D":
case "3017D":
case "3023D":
return {type:"LTDEXP",trainName:"うずしお",trainIcon:'http://www.trainfrontview.net/b/s2600.png',trainNumDistance:3000,info:"2600系で運転"};
return {
type: "LTDEXP",
trainName: "うずしお",
trainIcon: "http://www.trainfrontview.net/b/s2600.png",
trainNumDistance: 3000,
info: "2600系で運転",
};
//キハ185
case "3009D":
case "3032D":
return {type:"LTDEXP",trainName:"うずしお",trainIcon:'http://www.trainfrontview.net/b/s185tu_uzu.png',trainNumDistance:3000,info:"キハ185系で運転"};
return {
type: "LTDEXP",
trainName: "うずしお",
trainIcon: "http://www.trainfrontview.net/b/s185tu_uzu.png",
trainNumDistance: 3000,
info: "キハ185系で運転",
};
//マリンライナー
case "3104M":
@ -245,21 +339,45 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "3167M":
case "3169M":
case "3175M":
return {type:"Rapid",trainName:"マリンライナー",trainIcon:'http://www.trainfrontview.net/b/s5001.png',trainNumDistance:3100,info:""};
return {
type: "Rapid",
trainName: "マリンライナー",
trainIcon: "http://www.trainfrontview.net/b/s5001.png",
trainNumDistance: 3100,
info: "",
};
case "3102M":
case "3101M":
case "3103M":
case "3171M":
case "3173M":
return {type:"Rapid",trainName:"マリンライナー",trainIcon:'http://www.trainfrontview.net/b/s5001k.png',trainNumDistance:3100,info:""};
return {
type: "Rapid",
trainName: "マリンライナー",
trainIcon: "http://www.trainfrontview.net/b/s5001k.png",
trainNumDistance: 3100,
info: "",
};
//サンライズ瀬戸
case "5032M":
case "5031M":
return {type:"NightLTDEXP",trainName:"サンライズ瀬戸",trainIcon:'http://www.trainfrontview.net/b/w285.png',trainNumDistance:null,info:""};
return {
type: "NightLTDEXP",
trainName: "サンライズ瀬戸",
trainIcon: "http://www.trainfrontview.net/b/w285.png",
trainNumDistance: null,
info: "",
};
case "8041M": //琴平延長高松迄
case "8031M": //琴平延長高松以降
return {type:"NightLTDEXP",trainName:"サンライズ瀬戸",trainIcon:'http://www.trainfrontview.net/b/w285.png',trainNumDistance:null,info:"琴平延長運転日"};
return {
type: "NightLTDEXP",
trainName: "サンライズ瀬戸",
trainIcon: "http://www.trainfrontview.net/b/w285.png",
trainNumDistance: null,
info: "琴平延長運転日",
};
//宇和海
//2000 ノーマル
@ -283,7 +401,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "1077D":
case "1079D":
case "1053D":
return {type:"LTDEXP",trainName:"宇和海",trainIcon:'http://www.trainfrontview.net/b/s2000_uwa.png',trainNumDistance:1050,info:"2000系で運転"};
return {
type: "LTDEXP",
trainName: "宇和海",
trainIcon: "http://www.trainfrontview.net/b/s2000_uwa.png",
trainNumDistance: 1050,
info: "2000系で運転",
};
//2000 アンパン込み
case "1054D":
case "1060D":
@ -297,7 +421,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "1063D":
case "1067D":
case "1081D":
return {type:"LTDEXP",trainName:"宇和海",trainIcon:'http://www.trainfrontview.net/f/s2002a.png',trainNumDistance:1050,info:"アンパン列車で運転"};
return {
type: "LTDEXP",
trainName: "宇和海",
trainIcon: "http://www.trainfrontview.net/f/s2002a.png",
trainNumDistance: 1050,
info: "アンパン列車で運転",
};
//しまんと
case "2002D":
case "2004D":
@ -307,7 +437,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "2003D":
case "2005D":
case "2007D":
return {type:"LTDEXP",trainName:"しまんと",trainIcon:'http://www.trainfrontview.net/b/s2700_smn.png',trainNumDistance:2000,info:"2700系で運転"};
return {
type: "LTDEXP",
trainName: "しまんと",
trainIcon: "http://www.trainfrontview.net/b/s2700_smn.png",
trainNumDistance: 2000,
info: "2700系で運転",
};
//あしずり 2000
case "2074D":
@ -320,8 +456,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "2077D":
case "2081D":
case "2083D":
return {type:"LTDEXP",trainName:"あしずり",trainIcon:'http://www.trainfrontview.net/b/s2000_asi.png',trainNumDistance:2070,info:"2000系で運転"};
return {
type: "LTDEXP",
trainName: "あしずり",
trainIcon: "http://www.trainfrontview.net/b/s2000_asi.png",
trainNumDistance: 2070,
info: "2000系で運転",
};
//あしずり 2700
case "2078D":
@ -331,7 +472,13 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "2079D":
case "2085D":
case "2072D":
return {type:"LTDEXP",trainName:"あしずり",trainIcon:'http://www.trainfrontview.net/b/s2700_asi.png',trainNumDistance:2070,info:"2700系で運転"};
return {
type: "LTDEXP",
trainName: "あしずり",
trainIcon: "http://www.trainfrontview.net/b/s2700_asi.png",
trainNumDistance: 2070,
info: "2700系で運転",
};
//剣山
case "4002D":
@ -345,20 +492,35 @@ export const customTrainDataDetector = (TrainNumber) =>{
case "4007D":
case "4009D":
case "4011D":
return {type:"LTDEXP",trainName:"剣山",trainIcon:'http://www.trainfrontview.net/b/s185tu.png',trainNumDistance:4000,info:"キハ185系で運転"};
return {
type: "LTDEXP",
trainName: "剣山",
trainIcon: "http://www.trainfrontview.net/b/s185tu.png",
trainNumDistance: 4000,
info: "キハ185系で運転",
};
//むろと
case "5051D":
case "5052D":
return {type:"LTDEXP",trainName:"むろと",trainIcon:'http://www.trainfrontview.net/b/s185_mrt.png',trainNumDistance:5050,info:"キハ185系で運転"};
return {
type: "LTDEXP",
trainName: "むろと",
trainIcon: "http://www.trainfrontview.net/b/s185_mrt.png",
trainNumDistance: 5050,
info: "キハ185系で運転",
};
//よしのがわトロッコ
case "8452D":
case "8451D":
return {type:"LTDEXP",trainName:"よしのがわトロッコ",trainIcon:'http://www.trainfrontview.net/f/s185to_ai.png',trainNumDistance:null,info:""};
return {
type: "LTDEXP",
trainName: "よしのがわトロッコ",
trainIcon: "http://www.trainfrontview.net/f/s185to_ai.png",
trainNumDistance: null,
info: "",
};
//岡山高松アントロ
case "8176D":
@ -366,33 +528,59 @@ export const customTrainDataDetector = (TrainNumber) =>{
//岡山琴平アントロ
case "8277D":
case "8278D":
return {type:"LTDEXP",trainName:"アンパンマントロッコ",trainIcon:'http://www.trainfrontview.net/f/s32to4.png',trainNumDistance:null,info:""};
return {
type: "LTDEXP",
trainName: "アンパンマントロッコ",
trainIcon: "http://www.trainfrontview.net/f/s32to4.png",
trainNumDistance: null,
info: "",
};
//伊予灘ものがたり
case "8901D":
case "8903D":
case "8902D":
case "8904D":
return {type:"LTDEXP",trainName:"伊予灘ものがたり",trainIcon:'http://www.trainfrontview.net/b/s185iyoy.png',trainNumDistance:null,info:""};
return {
type: "LTDEXP",
trainName: "伊予灘ものがたり",
trainIcon: "http://www.trainfrontview.net/b/s185iyoy.png",
trainNumDistance: null,
info: "",
};
//千年ものがたり
case "8011D":
case "8012D":
return {type:"LTDEXP",trainName:"四国まんなか千年ものがたり",trainIcon:'http://www.trainfrontview.net/b/s185mm1.png',trainNumDistance:null,info:""};
return {
type: "LTDEXP",
trainName: "四国まんなか千年ものがたり",
trainIcon: "http://www.trainfrontview.net/b/s185mm1.png",
trainNumDistance: null,
info: "",
};
//夜明けものがたり
case "8053D":
case "8054D":
case "8062D":
case "8063D":
return {type:"LTDEXP",trainName:"時代の夜明けのものがたり",trainIcon:'http://www.trainfrontview.net/b/s185ym1.png',trainNumDistance:null,info:""};
return {
type: "LTDEXP",
trainName: "時代の夜明けのものがたり",
trainIcon: "http://www.trainfrontview.net/b/s185ym1.png",
trainNumDistance: null,
info: "",
};
default:
return {type:"Normal",trainName:"",trainIcon:null,trainNumDistance:null,info:null};
return {
type: "Normal",
trainName: "",
trainIcon: null,
trainNumDistance: null,
info: null,
};
break;
}
}
};

134
components/settings.js
View File

@ -1,52 +1,136 @@
import React, { useState, useEffect } from 'react';
import {View,Text,TouchableOpacity } from 'react-native';
import * as Updates from 'expo-updates';
import StatusbarDetect from '../StatusbarDetect';
import AsyncStorage from '@react-native-async-storage/async-storage';
import React, { useState, useEffect } from "react";
import { View, Text, TouchableOpacity } from "react-native";
import * as Updates from "expo-updates";
import StatusbarDetect from "../StatusbarDetect";
import AsyncStorage from "@react-native-async-storage/async-storage";
var Status = StatusbarDetect();
import { Switch } from 'react-native-elements';
import { Switch } from "react-native-elements";
export default function Setting(props) {
const { navigation: { navigate } } = props;
const [iconSetting, setIconSetting] = useState(undefined)
const {
navigation: { navigate },
} = props;
const [iconSetting, setIconSetting] = useState(undefined);
const [mapSwitch, setMapSwitch] = useState(undefined);
useEffect(() => {
AsyncStorage.getItem("iconSwitch").then( d =>{
setIconSetting(d)
})
},[])
AsyncStorage.getItem("iconSwitch").then((d) => {
setIconSetting(d);
});
AsyncStorage.getItem("mapSwitch").then((d) => {
setMapSwitch(d);
});
}, []);
console.log(iconSetting);
return (
<View style={{ height: "100%", backgroundColor: "#0099CC" }}>
<View style={{ flex: 1, backgroundColor: "white" }}>
<View style={{ backgroundColor: "#0099CC" }}>
<Text style={{fontSize:30,fontWeight:"bold",textAlign:"center",color:"white",padding:10}}>設定画面</Text>
<Text
style={{
fontSize: 30,
fontWeight: "bold",
textAlign: "center",
color: "white",
padding: 10,
}}
>
設定画面
</Text>
</View>
<View style={{ flex: 1 }}>
<View style={{ flexDirection: "row", padding: 10 }}>
<Text style={{fontSize:25,alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center"}}>列車アイコンを表示する</Text>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
列車アイコンを表示する
</Text>
<View style={{ flex: 1 }} />
<Switch value={iconSetting == "true" ? true : false} color={iconSetting == "true" ? "red": null} onValueChange={(value)=>setIconSetting(value.toString())}/>
<Switch
value={iconSetting == "true" ? true : false}
color={iconSetting == "true" ? "red" : null}
onValueChange={(value) => setIconSetting(value.toString())}
/>
</View>
<View style={{ flexDirection: "row", padding: 10 }}>
<Text style={{fontSize:25,alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center"}}>channel: {Updates.channel}</Text>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
マップを表示する(beta)
</Text>
<View style={{ flex: 1 }} />
<Switch
value={mapSwitch == "true" ? true : false}
color={mapSwitch == "true" ? "red" : null}
onValueChange={(value) => setMapSwitch(value.toString())}
/>
</View>
<View style={{ flexDirection: "row", padding: 10 }}>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
内部バージョン: 4.4
</Text>
<View style={{ flex: 1 }} />
</View>
<View style={{ flexDirection: "row", padding: 10 }}>
<Text style={{fontSize:25,alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center"}}>releaseChannel: {Updates.releaseChannel}</Text>
<Text
style={{
fontSize: 25,
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
}}
>
releaseChannel: {Updates.releaseChannel}
</Text>
<View style={{ flex: 1 }} />
</View>
</View>
</View>
<TouchableOpacity style={{padding:10,flexDirection:"row",borderColor:"white",borderWidth:1,margin:10,borderRadius:5,alignItems:"center"}} onPress={()=>{
AsyncStorage.setItem("iconSwitch",iconSetting.toString()).then(()=>{
Updates.reloadAsync()
})
}}>
<TouchableOpacity
style={{
padding: 10,
flexDirection: "row",
borderColor: "white",
borderWidth: 1,
margin: 10,
borderRadius: 5,
alignItems: "center",
}}
onPress={() => {
Promise.all([
AsyncStorage.setItem("iconSwitch", iconSetting.toString()),
AsyncStorage.setItem("mapSwitch", mapSwitch.toString()),
]).then(() => {
Updates.reloadAsync();
});
}}
>
<View style={{ flex: 1 }} />
<Text style={{fontSize:25,fontWeight:"bold",color:"white"}}>設定を保存して再読み込み</Text>
<Text style={{ fontSize: 25, fontWeight: "bold", color: "white" }}>
設定を保存して再読み込み
</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
</View>
)
);
}

145
components/trainMenu.js Normal file
View File

@ -0,0 +1,145 @@
import React, { useState, useEffect, useRef } from "react";
import { View, Text, TouchableOpacity, Linking } from "react-native";
import { WebView } from "react-native-webview";
import StatusbarDetect from "../StatusbarDetect";
import AsyncStorage from "@react-native-async-storage/async-storage";
import MapView, { Marker, Geojson, PROVIDER_GOOGLE } from "react-native-maps";
import {
FontAwesome,
Fontisto,
Foundation,
Ionicons,
MaterialCommunityIcons,
} from "@expo/vector-icons";
var Status = StatusbarDetect();
export default function trainMenu({
route: {
params: { webview, stationData },
},
navigation: { navigate },
}) {
const mapRef = useRef();
return (
<View style={{ height: "100%", backgroundColor: "#0099CC" }}>
<MapView
style={{ flex: 1, width: "100%", height: "100%" }}
showsUserLocation={true}
loadingEnabled={true}
showsMyLocationButton={false}
moveOnMarkerPress={false}
showsCompass={false}
ref={mapRef}
//provider={PROVIDER_GOOGLE}
initialRegion={{
latitude: 33.774519,
longitude: 133.533306,
latitudeDelta: 1.8, //小さくなるほどズーム
longitudeDelta: 1.8,
}}
>
{stationData &&
Object.keys(stationData).map((d) =>
stationData[d].map((D, index) => {
if (!D.StationMap) return null;
const latlng = D.StationMap.replace(
"https://www.google.co.jp/maps/place/",
""
).split(",");
if (latlng.length == 0) return null;
return (
<Marker
key={index}
coordinate={{
latitude: parseFloat(latlng[0]),
longitude: parseFloat(latlng[1]),
}}
onPress={() => {
webview.current?.injectJavaScript(
`MoveDisplayStation('${d}_${D.MyStation}_${D.Station_JP}')`
);
navigate("Apps");
}}
></Marker>
);
})
)}
</MapView>
<View style={{ flexDirection: "row" }}>
<UsefulBox
backgroundColor={"#F89038"}
icon="train-car"
flex={1}
onPressButton={() => navigate("howto")}
>
使い方
</UsefulBox>
<UsefulBox
backgroundColor={"#EA4752"}
icon="star"
flex={1}
onPressButton={() =>
/* Linking.openURL(
"https://www.jr-shikoku.co.jp/01_trainbus/jikoku/sp/#mainprice-box"
) */
alert("お気に入り駅登録機能は現在開発中です！レイアウト募集中！")
}
>
お気に入り
</UsefulBox>
<UsefulBox
backgroundColor={"#91C31F"}
icon="clipboard-list-outline"
flex={1}
onPressButton={() =>
Linking.openURL(
"https://nexcloud.haruk.in/apps/forms/ZRHjWFF7znr5Xjr2"
)
}
>
この機能のフィードバック
</UsefulBox>
</View>
<TouchableOpacity
style={{
padding: 10,
flexDirection: "row",
borderColor: "white",
borderWidth: 1,
margin: 10,
borderRadius: 5,
alignItems: "center",
}}
onPress={() => {
AsyncStorage.setItem("status", "2022/04/14");
navigate("Apps");
}}
>
<View style={{ flex: 1 }} />
<Text style={{ fontSize: 25, fontWeight: "bold", color: "white" }}>
閉じる
</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
</View>
);
}
const UsefulBox = (props) => {
const { icon, backgroundColor, flex, onPressButton, children } = props;
return (
<TouchableOpacity
style={{
flex: flex,
backgroundColor: backgroundColor,
padding: 10,
alignItems: "center",
margin: 2,
}}
onPress={onPressButton}
>
<MaterialCommunityIcons name={icon} color="white" size={50} />
<Text style={{ color: "white", fontWeight: "bold", fontSize: 18 }}>
{children}
</Text>
</TouchableOpacity>
);
};

355
components/発車時刻表/LED_vidion.js
View File

@ -1,8 +1,19 @@
import React, { Component, useRef, useState, useEffect } from 'react';
import {StatusBar,View,LayoutAnimation,ScrollView,Linking,Text,TouchableOpacity } from 'react-native';
import { Switch } from 'react-native-elements';
import {widthPercentageToDP as wp, heightPercentageToDP as hp} from 'react-native-responsive-screen';
import { customTrainDataDetector } from '../custom-train-data';
import React, { Component, useRef, useState, useEffect } from "react";
import {
StatusBar,
View,
LayoutAnimation,
ScrollView,
Linking,
Text,
TouchableOpacity,
} from "react-native";
import { Switch } from "react-native-elements";
import {
widthPercentageToDP as wp,
heightPercentageToDP as hp,
} from "react-native-responsive-screen";
import { customTrainDataDetector } from "../custom-train-data";
let diagramData = undefined;
@ -38,9 +49,9 @@ let diagramData = undefined;
export default function LED_vision(props) {
const HeaderConfig = {
headers: {
'referer': 'https://train.jr-shikoku.co.jp/sp.html'
}
}
referer: "https://train.jr-shikoku.co.jp/sp.html",
},
};
const [trainDiagram, setTrainDiagram] = useState(null);
const [stationDiagram, setStationDiagram] = useState(null);
const [currentTrain, setCurrentTrain] = useState(null);
@ -48,22 +59,26 @@ export default function LED_vision(props){
const [trainIDSwitch, setTrainIDSwitch] = useState(false);
const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false);
useEffect(() => {
fetch('https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia', HeaderConfig).then(response => response.text()).then(d=>{
const val = d.replace("[\r\n","").split(',\r\n');
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia",
HeaderConfig
)
.then((response) => response.text())
.then((d) => {
const val = d.replace("[\r\n", "").split(",\r\n");
let returnData = {};
val.forEach(element =>{
val.forEach((element) => {
try {
let data = JSON.parse(element);
Object.keys(data).forEach( key => returnData[key] = data[key] );
}catch(e){
}
Object.keys(data).forEach((key) => (returnData[key] = data[key]));
} catch (e) {}
});
return returnData;
})
return(returnData);
}).then((trainDiagram)=>{
.then((trainDiagram) => {
let returnData = {};
if (trainDiagram) {
Object.keys(trainDiagram).forEach( key => {
Object.keys(trainDiagram).forEach((key) => {
if (trainDiagram[key].match(props.station.Station_JP)) {
returnData[key] = trainDiagram[key];
}
@ -71,8 +86,7 @@ export default function LED_vision(props){
}
setTrainDiagram(trainDiagram);
setStationDiagram(returnData);
})
});
}, []);
const getTime = () => {
const returnData = [];
@ -87,100 +101,141 @@ export default function LED_vision(props){
if (data.match(props.station.Station_JP)) {
if (data.match(",発,")) {
returnData.time = data.split(",発,")[1];
}
else{
} else {
returnData.time = data.split(",着,")[1];
returnData.lastStation = "当駅止"
returnData.lastStation = "当駅止";
}
}
})
});
return returnData;
})();
returnData.push({ train: d, time: a.time, lastStation: a.lastStation });
})
});
return (returnData.sort((a,b)=> {
return returnData.sort((a, b) => {
if (parseInt(a.time.split(":")[0]) < parseInt(b.time.split(":")[0])) {
return -1;
}
else if(parseInt(a.time.split(":")[0]) > parseInt(b.time.split(":")[0])){
} else if (
parseInt(a.time.split(":")[0]) > parseInt(b.time.split(":")[0])
) {
return 1;
}
else if(parseInt(a.time.split(":")[1]) < parseInt(b.time.split(":")[1])){
} else if (
parseInt(a.time.split(":")[1]) < parseInt(b.time.split(":")[1])
) {
return -1;
}
else if(parseInt(a.time.split(":")[1]) > parseInt(b.time.split(":")[1])){
} else if (
parseInt(a.time.split(":")[1]) > parseInt(b.time.split(":")[1])
) {
return 1;
}
}))
});
};
const trainTimeAndNumber = stationDiagram != null ? getTime() : null;
useEffect(() => {
const getCurrentTrain = () =>fetch("https://train.jr-shikoku.co.jp/g?arg1=train&arg2=train", HeaderConfig).then(response => response.json()).then(d=>d.map(x=>({num:x.TrainNum,delay:x.delay}))).then(d=>setCurrentTrain(d));
const getCurrentTrain = () =>
fetch(
"https://train.jr-shikoku.co.jp/g?arg1=train&arg2=train",
HeaderConfig
)
.then((response) => response.json())
.then((d) => d.map((x) => ({ num: x.TrainNum, delay: x.delay })))
.then((d) => setCurrentTrain(d));
getCurrentTrain();
const currentTrainInterval = setInterval(()=>getCurrentTrain(),15000)
const currentTrainInterval = setInterval(() => getCurrentTrain(), 15000);
return () => clearInterval(currentTrainInterval);
}, []);
},[])
const filtering = d => currentTrain.map(m=>m.num).includes(d.train)
console.log(new Date())
const timeFiltering = d => {
const filtering = (d) => currentTrain.map((m) => m.num).includes(d.train);
console.log(new Date());
const timeFiltering = (d) => {
const date = new Date();
const newDate = new Date();
let data = d.time.split(":");
let delay = isNaN(currentTrain.filter(data =>data.num == d.train)[0].delay) ? 0 : currentTrain.filter(data =>data.num == d.train)[0].delay;
let delay = isNaN(
currentTrain.filter((data) => data.num == d.train)[0].delay
)
? 0
: currentTrain.filter((data) => data.num == d.train)[0].delay;
date.setHours(parseInt(data[0]));
date.setMinutes(parseInt(data[1]) + parseInt(delay));
console.log(date);
console.log(newDate)
console.log(newDate);
if (!(newDate > date)) {
return true;
}
return false;
}
const finalFiltering = d =>{
};
const finalFiltering = (d) => {
if (finalSwitch) {
return true;
}
else{
} else {
if (d.lastStation == "当駅止") {
return false;
}
return true;
}
}
};
return (
<View style={{ width: wp("98%"),/* height: wp("98%")/10*9, */backgroundColor:"#432",borderWidth:1,margin:10,marginHorizontal:wp("1%")}} >
<View style={{alignContent:"center",alignItems:"center",width:"100%",marginVertical:10,flexDirection:"row"}}>
<View style={{flex:1}}>
</View>
<View
style={{
width: wp("98%"),
/* height: wp("98%")/10*9, */ backgroundColor: "#432",
borderWidth: 1,
margin: 10,
marginHorizontal: wp("1%"),
}}
>
<View
style={{
alignContent: "center",
alignItems: "center",
width: "100%",
marginVertical: 10,
flexDirection: "row",
}}
>
<View style={{ flex: 1 }}></View>
<View style={{}}>
<Text style={{fontSize:25,color:"white",fontWeight:"bold"}}>次の列車</Text>
<Text style={{ fontSize: 25, color: "white", fontWeight: "bold" }}>
次の列車
</Text>
<Text style={{ fontSize: 15, color: "white" }}>Next Train</Text>
</View>
<View style={{flex:1}}>
<View style={{ flex: 1 }}></View>
</View>
</View>
{trainTimeAndNumber ? currentTrain && trainTimeAndNumber.filter(filtering).filter(timeFiltering).filter(finalFiltering).map((d,index)=>
[<View style={{alignContent:"center",alignItems:"center",width:"94%",marginVertical:5,marginHorizontal:"3%",backgroundColor:"#000",flexDirection:"row"}}>
{trainTimeAndNumber
? currentTrain &&
trainTimeAndNumber
.filter(filtering)
.filter(timeFiltering)
.filter(finalFiltering)
.map((d, index) => [
<View
style={{
alignContent: "center",
alignItems: "center",
width: "94%",
marginVertical: 5,
marginHorizontal: "3%",
backgroundColor: "#000",
flexDirection: "row",
}}
>
<View style={{ flex: 9 }}>
<Text style={{fontSize:(()=>{
if(customTrainDataDetector(d.train).trainName.length > 6){
<Text
style={{
fontSize: (() => {
if (
customTrainDataDetector(d.train).trainName.length > 6
) {
return 15;
} else {
return 20;
}
else{
return 20
}
})(),color:(()=>{
})(),
color: (() => {
switch (customTrainDataDetector(d.train).type) {
case "Rapid":
return "aqua";
@ -190,9 +245,14 @@ export default function LED_vision(props){
return "red";
case "Normal":
return "white";
}
})(),fontWeight:"bold"}}>{trainIDSwitch ? d.train : (()=>{
})(),
fontWeight: "bold",
}}
>
{trainIDSwitch
? d.train
: (() => {
switch (customTrainDataDetector(d.train).type) {
case "Rapid":
return "快速";
@ -203,54 +263,145 @@ export default function LED_vision(props){
case "Normal":
return "普通列車";
}
})()+" "+customTrainDataDetector(d.train).trainName+(()=>{
if(customTrainDataDetector(d.train).trainNumDistance != null){
return parseInt(d.train.replace("M","").replace("D","")) - customTrainDataDetector(d.train).trainNumDistance + "号";
}
else{
})() +
" " +
customTrainDataDetector(d.train).trainName +
(() => {
if (
customTrainDataDetector(d.train).trainNumDistance !=
null
) {
return (
parseInt(
d.train.replace("M", "").replace("D", "")
) -
customTrainDataDetector(d.train)
.trainNumDistance +
"号"
);
} else {
return "";
}
})()}</Text>
})()}
</Text>
</View>
<View style={{ flex: 4, flexDirection: "row" }}>
<Text style={{fontSize: d.lastStation.length > 4 ? 15 : 20,color:"white",fontWeight:"bold"}}>{d.lastStation}</Text>
<Text
style={{
fontSize: d.lastStation.length > 4 ? 15 : 20,
color: "white",
fontWeight: "bold",
}}
>
{d.lastStation}
</Text>
</View>
<View style={{ flex: 3 }}>
<Text style={{fontSize:20,color:"white",fontWeight:"bold"}}>{d.time}</Text>
<Text
style={{ fontSize: 20, color: "white", fontWeight: "bold" }}
>
{d.time}
</Text>
</View>
<View style={{ flex: 4 }}>
<Text style={{fontSize:20,color:"white",fontWeight:"bold"}}>{(()=>{
let data= currentTrain.filter(data=>data.num==d.train)[0].delay;
<Text
style={{ fontSize: 20, color: "white", fontWeight: "bold" }}
>
{(() => {
let data = currentTrain.filter(
(data) => data.num == d.train
)[0].delay;
if (isNaN(data)) {
return data;
} else if (data == 0) {
return "定刻通り";
} else {
return data + "分遅れ";
}
else if(data == 0){
return "定刻通り"
}
else{
return data+"分遅れ"
}
})()}</Text>
})()}
</Text>
</View>
</View>,Boolean(trainDescriptionSwitch) && Boolean(customTrainDataDetector(d.train).info) &&
<View style={{alignContent:"center",alignItems:"center",width:"94%",marginVertical:5,marginHorizontal:"3%",backgroundColor:"#000",flexDirection:"row"}}>
</View>,
Boolean(trainDescriptionSwitch) &&
Boolean(customTrainDataDetector(d.train).info) && (
<View
style={{
alignContent: "center",
alignItems: "center",
width: "94%",
marginVertical: 5,
marginHorizontal: "3%",
backgroundColor: "#000",
flexDirection: "row",
}}
>
<View style={{ flex: 4 }}>
<Text style={{fontSize:20,color:"green",fontWeight:"bold"}}> &gt; {customTrainDataDetector(d.train).info}</Text>
<Text
style={{
fontSize: 20,
color: "green",
fontWeight: "bold",
}}
>
{" "}
&gt; {customTrainDataDetector(d.train).info}
</Text>
</View>
</View>
]
)
),
])
: null}
<View style={{ flexDirection: "row", padding: 10 }}>
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>種別名 / 列番</Text>
<Switch value={trainIDSwitch} onValueChange={(value)=>setTrainIDSwitch(!trainIDSwitch)}/>
<Text
style={{
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
color: "white",
}}
>
種別名 / 列番
</Text>
<Switch
value={trainIDSwitch}
onValueChange={(value) => setTrainIDSwitch(!trainIDSwitch)}
/>
<View style={{ flex: 1 }} />
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>列車情報</Text>
<Switch value={trainDescriptionSwitch} onValueChange={(value)=>setTrainDescriptionSwitch(!trainDescriptionSwitch)}/>
<View style={{flex:1}} />
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>当駅止表示</Text>
<Switch value={finalSwitch} onValueChange={(value)=>setFinalSwitch(!finalSwitch)}/>
</View>
</View>
)
<Text
style={{
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
color: "white",
}}
>
列車情報
</Text>
<Switch
value={trainDescriptionSwitch}
onValueChange={(value) =>
setTrainDescriptionSwitch(!trainDescriptionSwitch)
}
/>
<View style={{ flex: 1 }} />
<Text
style={{
alignItems: "center",
alignContent: "center",
textAlign: "center",
textAlignVertical: "center",
color: "white",
}}
>
当駅止表示
</Text>
<Switch
value={finalSwitch}
onValueChange={(value) => setFinalSwitch(!finalSwitch)}
/>
</View>
</View>
);
}

317
components/駅名表/Sign.js
View File

@ -1,22 +1,45 @@
import React, { Component, useRef, useState, useEffect } from 'react';
import {StatusBar,View,LayoutAnimation,ScrollView,Linking,Text,TouchableOpacity } from 'react-native';
import {widthPercentageToDP as wp, heightPercentageToDP as hp} from 'react-native-responsive-screen';
import React, { Component, useRef, useState, useEffect } from "react";
import {
StatusBar,
View,
LayoutAnimation,
ScrollView,
Linking,
Text,
TouchableOpacity,
} from "react-native";
import {
widthPercentageToDP as wp,
heightPercentageToDP as hp,
} from "react-native-responsive-screen";
export default function Sign(props) {
const { currentStation, originalStationList, oP } = props;
const getPreNextStation = (now) => {
const lineList = ["予讃線", "松宇線", "伊予灘線", "土讃線", "窪川線", "高徳線", "徳島線", "鳴門線"];
const lineList = [
"予讃線",
"松宇線",
"伊予灘線",
"土讃線",
"窪川線",
"高徳線",
"徳島線",
"鳴門線",
];
let returnData;
lineList.forEach(d=>{
let cache = originalStationList[d].findIndex( data => data.StationNumber == now.StationNumber);
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]]
returnData = [
originalStationList[d][cache - 1],
originalStationList[d][cache + 1],
];
}
})
});
return returnData;
}
};
const [nexPrePosition, setNexPrePosition] = useState(0);
useEffect(() => {
if (currentStation) {
@ -24,83 +47,265 @@ export default function Sign(props){
let stationCount = setInterval(() => {
LayoutAnimation.easeInEaseOut();
if (nexPrePosition + 1 == currentStation.length) {
setNexPrePosition(0)
}
else{
setNexPrePosition(0);
} else {
setNexPrePosition(nexPrePosition + 1);
}
},1000)
}, 1000);
return () => clearInterval(stationCount);
}
}
},[currentStation])
}, [currentStation]);
return (
<TouchableOpacity style={{ width: wp("80%"), height: wp("80%")/20*9,borderColor:"#2E94BB",borderWidth:1,margin:10,marginHorizontal:wp("10%")}} /* onPress={()=> !stationName.今.JrHpUrl || Linking.openURL(stationName.今.JrHpUrl)} */onPress={oP}>
<View style={{position:"absolute",bottom:"0%",left:"0%",width:"100%",height:'30%',backgroundColor:"#2E94BB"}} />
<Text style={{position:"absolute",top:"2%",left:"2%",fontWeight:"bold",fontSize:parseInt("30%"),color:"#2E94BB"}}>JR</Text>
{currentStation.map((d,index,array)=>
<View style={{position:"absolute",alignContent:"center",alignItems:"center",top:(()=>{
<TouchableOpacity
style={{
width: wp("80%"),
height: (wp("80%") / 20) * 9,
borderColor: "#2E94BB",
borderWidth: 1,
margin: 10,
marginHorizontal: wp("10%"),
}}
/* onPress={()=> !stationName.今.JrHpUrl || Linking.openURL(stationName.今.JrHpUrl)} */ onPress={
oP
}
>
<View
style={{
position: "absolute",
bottom: "0%",
left: "0%",
width: "100%",
height: "30%",
backgroundColor: "#2E94BB",
}}
/>
<Text
style={{
position: "absolute",
top: "2%",
left: "2%",
fontWeight: "bold",
fontSize: parseInt("30%"),
color: "#2E94BB",
}}
>
JR
</Text>
{currentStation.map((d, index, array) => (
<View
style={{
position: "absolute",
alignContent: "center",
alignItems: "center",
top:
(() => {
if (array.length == 1) return 20;
else if (index == 0) return 5;
else if (index == 1) return 35;
else return 20;
})()+"%",right:'10%',width:wp("10%"),height:wp("10%"),borderColor:"#2E94BB",borderWidth:parseInt("2%"),borderRadius:parseInt("100%")}} >
})() + "%",
right: "10%",
width: wp("10%"),
height: wp("10%"),
borderColor: "#2E94BB",
borderWidth: parseInt("2%"),
borderRadius: parseInt("100%"),
}}
>
<View style={{ flex: 1 }} />
<Text style={{ fontSize: parseInt("20%") }}>{d.StationNumber}</Text>
<View style={{ flex: 1 }} />
</View>
)}
<View style={{position:"absolute",top:"10%",alignContent:"center",flexDirection:"row"}}>
))}
<View
style={{
position: "absolute",
top: "10%",
alignContent: "center",
flexDirection: "row",
}}
>
<View style={{ flex: 1 }} />
<View style={{ alignItems: "center" }}>
{/* <Text style={{fontWeight:"bold",fontSize:parseInt("15%"),color:"#005170"}}>{stationName.今.LineName}</Text> */}
<Text style={{fontWeight:"bold",fontSize:parseInt("40%"),color:"#005170"}}>{currentStation[0].Station_JP}</Text>
<Text style={{fontWeight:"bold",fontSize:parseInt("15%"),color:"#005170"}}>{currentStation[0].Station_EN}</Text>
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("40%"),
color: "#005170",
}}
>
{currentStation[0].Station_JP}
</Text>
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("15%"),
color: "#005170",
}}
>
{currentStation[0].Station_EN}
</Text>
</View>
<View style={{ flex: 1 }} />
</View>
<View style={{position:"absolute",bottom:"0%",height:"30%",width:"100%",alignItems:"center",flexDirection:"column"}}>
{(()=>{return currentStation.map(currentStation =>{
let [preStation, nexStation] = getPreNextStation(currentStation)
<View
style={{
position: "absolute",
bottom: "0%",
height: "30%",
width: "100%",
alignItems: "center",
flexDirection: "column",
}}
>
{(() => {
return currentStation.map((currentStation) => {
let [preStation, nexStation] = getPreNextStation(currentStation);
return (
<View style={{flex:1,flexDirection:"row",alignContent:"center"}}>
<View style={{flex:1,flexDirection:"row",alignContent:"center"}}>
{preStation &&
[<Text style={{fontWeight:"bold",fontSize:parseInt("20%"),color:"white",paddingHorizontal:10,textAlignVertical:"center"}}>◀</Text>,
<View style={{alignContent:"center",alignItems:"center",width:wp("8%"),height:wp("8%"),margin:wp("1%"),borderColor:"white",borderWidth:parseInt("2%"),borderRadius:parseInt("100%")}} >
<View
style={{
flex: 1,
flexDirection: "row",
alignContent: "center",
}}
>
<View
style={{
flex: 1,
flexDirection: "row",
alignContent: "center",
}}
>
{preStation && [
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("20%"),
color: "white",
paddingHorizontal: 10,
textAlignVertical: "center",
}}
>
◀
</Text>,
<View
style={{
alignContent: "center",
alignItems: "center",
width: wp("8%"),
height: wp("8%"),
margin: wp("1%"),
borderColor: "white",
borderWidth: parseInt("2%"),
borderRadius: parseInt("100%"),
}}
>
<View style={{ flex: 1 }} />
<Text style={{fontSize:parseInt("10%"),color:"white"}}>{preStation.StationNumber}</Text>
<Text
style={{ fontSize: parseInt("10%"), color: "white" }}
>
{preStation.StationNumber}
</Text>
<View style={{ flex: 1 }} />
</View>,
<View style={{ flex: 1, alignItems: "flex-start" }}>
<Text style={{fontWeight:"bold",fontSize:parseInt("15%"),color:"white",flex:1,textAlignVertical:"center"}}>{preStation.Station_JP}</Text>
<Text style={{fontWeight:"bold",fontSize:parseInt("15%"),color:"white",flex:1,textAlignVertical:"center"}}>{preStation.Station_EN}</Text>
</View>]}
</View>
<View style={{flex:1,flexDirection:"row",alignContent:"center"}}>
{nexStation &&
[<View style={{flex:1,alignItems:"flex-end"}}>
<Text style={{fontWeight:"bold",fontSize:parseInt("15%"),color:"white",flex:1,textAlignVertical:"center"}}>{nexStation.Station_JP}</Text>
<Text style={{fontWeight:"bold",fontSize:parseInt("15%"),color:"white",flex:1,textAlignVertical:"center"}}>{nexStation.Station_EN}</Text>
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("15%"),
color: "white",
flex: 1,
textAlignVertical: "center",
}}
>
{preStation.Station_JP}
</Text>
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("15%"),
color: "white",
flex: 1,
textAlignVertical: "center",
}}
>
{preStation.Station_EN}
</Text>
</View>,
<View style={{alignContent:"center",alignItems:"center",width:wp("8%"),height:wp("8%"),margin:wp("1%"),borderColor:"white",borderWidth:parseInt("2%"),borderRadius:parseInt("100%")}} >
]}
</View>
<View
style={{
flex: 1,
flexDirection: "row",
alignContent: "center",
}}
>
{nexStation && [
<View style={{ flex: 1, alignItems: "flex-end" }}>
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("15%"),
color: "white",
flex: 1,
textAlignVertical: "center",
}}
>
{nexStation.Station_JP}
</Text>
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("15%"),
color: "white",
flex: 1,
textAlignVertical: "center",
}}
>
{nexStation.Station_EN}
</Text>
</View>,
<View
style={{
alignContent: "center",
alignItems: "center",
width: wp("8%"),
height: wp("8%"),
margin: wp("1%"),
borderColor: "white",
borderWidth: parseInt("2%"),
borderRadius: parseInt("100%"),
}}
>
<View style={{ flex: 1 }} />
<Text style={{fontSize:parseInt("10%"),color:"white"}}>{nexStation.StationNumber}</Text>
<Text
style={{ fontSize: parseInt("10%"), color: "white" }}
>
{nexStation.StationNumber}
</Text>
<View style={{ flex: 1 }} />
</View>,
<Text style={{fontWeight:"bold",fontSize:parseInt("20%"),color:"white",paddingHorizontal:10,textAlignVertical:"center"}}>▶</Text>]}
<Text
style={{
fontWeight: "bold",
fontSize: parseInt("20%"),
color: "white",
paddingHorizontal: 10,
textAlignVertical: "center",
}}
>
▶
</Text>,
]}
</View>
</View>
)
})[nexPrePosition]
);
})[nexPrePosition];
})()}
</View>
</TouchableOpacity>
)
);
}

2
config/newsUpdate.js
View File

@ -1 +1 @@
export const news = "2022-6-11";
export const news = "2022-9-30";

2
eas.json
View File

@ -14,7 +14,7 @@
"releaseChannel": "mapsbuild"
},
"production": {
"releaseChannel": "release"
"releaseChannel": "aliexpress"
}
},
"submit": {

40
howto.js
View File

@ -1,16 +1,30 @@
const WEBVIEW = "WEBVIEW";
import React, { Component } from 'react';
import { StatusBar,View} from 'react-native';
import {WebView} from 'react-native-webview';
export default class howto extends Component {
render() {
return (
<View style={{height:"100%"}}>
<View style={{alignItems:"center"}}>
<View style={{ width:60,height:8,marginTop:15,marginBottom:10, backgroundColor: "gray", padding: 0, borderRadius: 20, borderWidth: 1, borderColor: "gray", overflow: "hidden"}}/>
</View>
<WebView useWebKit={true} source={{uri: 'https://train.jr-shikoku.co.jp/usage.htm'}}/>
import React, { Component } from "react";
import { StatusBar, View, TouchableOpacity, Text } from "react-native";
import { WebView } from "react-native-webview";
export default ({ navigation: { navigate } }) => (
<View style={{ height: "100%", backgroundColor: "#0099CC" }}>
<WebView
useWebKit={true}
source={{ uri: "https://train.jr-shikoku.co.jp/usage.htm" }}
/>
<TouchableOpacity
style={{
padding: 10,
flexDirection: "row",
borderColor: "white",
borderWidth: 1,
margin: 10,
borderRadius: 5,
alignItems: "center",
}}
onPress={() => navigate("Apps")}
>
<View style={{ flex: 1 }} />
<Text style={{ fontSize: 25, fontWeight: "bold", color: "white" }}>
閉じる
</Text>
<View style={{ flex: 1 }} />
</TouchableOpacity>
</View>
);
}
}

1050
menu.js
View File

File diff suppressed because it is too large Load Diff

28
ndView.js
View File

@ -1,18 +1,25 @@
import React, { Component } from 'react';
import { StatusBar,View,Linking,Platform,Text} from 'react-native';
import {WebView} from 'react-native-webview';
import Constants from 'expo-constants';
import { TouchableOpacity } from 'react-native-gesture-handler';
import React, { Component } from "react";
import { StatusBar, View, Linking, Platform, Text } from "react-native";
import { WebView } from "react-native-webview";
import Constants from "expo-constants";
import { TouchableOpacity } from "react-native-gesture-handler";
export default function tndView() {
return (
<View style={{backgroundColor: '#309AC3', height:"100%",paddingTop: Platform.OS == "ios" ? Constants.statusBarHeight: 0,}}>
<View
style={{
backgroundColor: "#309AC3",
height: "100%",
paddingTop: Platform.OS == "ios" ? Constants.statusBarHeight : 0,
}}
>
<WebView
useWebKit={true}
source={{uri: 'https://www.jr-shikoku.co.jp/info/'}}
originWhitelist={['https://www.jr-shikoku.co.jp']}
mixedContentMode={'compatibility'}
source={{ uri: "https://www.jr-shikoku.co.jp/info/" }}
originWhitelist={["https://www.jr-shikoku.co.jp"]}
mixedContentMode={"compatibility"}
javaScriptEnabled={true}
injectedJavaScript={jsa}/>
injectedJavaScript={jsa}
/>
</View>
);
}
@ -20,4 +27,3 @@ const jsa = `
document.querySelector('.sitettl').style.display = 'none';
document.querySelector('.attention').style.display = 'none';
`;

1
package.json
View File

@ -29,6 +29,7 @@
"react-native-auto-height-image": "^3.2.4",
"react-native-elements": "^3.4.2",
"react-native-gesture-handler": "~2.2.1",
"react-native-maps": "0.30.2",
"react-native-reanimated": "~2.8.0",
"react-native-remote-svg": "^2.0.6",
"react-native-responsive-screen": "^1.4.2",

36
trainbaseview.js
View File

@ -1,14 +1,34 @@
const WEBVIEW = "WEBVIEW";
import React, { Component } from 'react';
import { StatusBar,View} from 'react-native';
import {WebView} from 'react-native-webview';
export default function trainbase({route, navigation}) {
import React, { Component, useRef } from "react";
import { StatusBar, Platform, View } from "react-native";
import { WebView } from "react-native-webview";
export default function TrainBase({ route }) {
const { info } = route.params;
const webview = useRef();
const jss = `document.getElementById('Footer').style.display = 'none';
${
Platform.OS == "ios" &&
`document.getElementsByTagName("html")[0].style['font-size'] = '11px';`
}`;
//const jss = `alert("ほげ")`;
console.log(info);
return (
<View style={{ height: "100%" }}>
<WebView source={{uri: info}} useWebKit={true} originWhitelist={['https://train.jr-shikoku.co.jp']}injectedJavaScript={jss}/>
{Platform.OS == "ios" && <StatusBar barStyle="dark-content" />}
<WebView
//useWebKit={true}
ref={webview}
source={{ uri: "https://train.jr-shikoku.co.jp/" + info }}
originWhitelist={[
"https://train.jr-shikoku.co.jp",
"https://train.jr-shikoku.co.jp/sp.html",
]}
mixedContentMode={"compatibility"}
javaScriptEnabled={true}
injectedJavaScript={jss}
setSupportMultipleWindows={false}
onMessage={(event) => {}}
/>
</View>
);
}
const jss = `document.getElementById('Footer').style.display = 'none';`;

13
yarn.lock
View File

@ -2977,6 +2977,11 @@
resolved "https://registry.yarnpkg.com/@types/color-name/-/color-name-1.1.1.tgz#1c1261bbeaa10a8055bbc5d8ab84b7b2afc846a0"
integrity sha512-rr+OQyAjxze7GgWrSaJwydHStIhHq2lvY3BOC2Mj7KnzI7XK0Uw1TOOdI9lDoajEbSWLiYgoo4f1R51erQfhPQ==
"@types/geojson@^7946.0.7":
version "7946.0.8"
resolved "https://registry.yarnpkg.com/@types/geojson/-/geojson-7946.0.8.tgz#30744afdb385e2945e22f3b033f897f76b1f12ca"
integrity sha512-1rkryxURpr6aWP7R786/UQOkJ3PcpQiWkAXBmdWc7ryFWqN6a4xfK7BtjXvFBKO9LjQ+MWQSWxYeZX1OApnArA==
"@types/graceful-fs@^4.1.2":
version "4.1.5"
resolved "https://registry.yarnpkg.com/@types/graceful-fs/-/graceful-fs-4.1.5.tgz#21ffba0d98da4350db64891f92a9e5db3cdb4e15"
@ -8618,6 +8623,14 @@ react-native-iphone-x-helper@^1.3.0:
resolved "https://registry.yarnpkg.com/react-native-iphone-x-helper/-/react-native-iphone-x-helper-1.3.1.tgz#20c603e9a0e765fd6f97396638bdeb0e5a60b010"
integrity sha512-HOf0jzRnq2/aFUcdCJ9w9JGzN3gdEg0zFE4FyYlp4jtidqU03D5X7ZegGKfT1EWteR0gPBGp9ye5T5FvSWi9Yg==
react-native-maps@0.30.2:
version "0.30.2"
resolved "https://registry.yarnpkg.com/react-native-maps/-/react-native-maps-0.30.2.tgz#2f1cf4ab79892a43060774bda8786ce6ab8e3616"
integrity sha512-WVv5e7aWdnNJugqNSG/87U+12Pg4RFWU7x/UigTPG1FEUZx2TbYKChL6xZCMGPOv5m5b4Z7bMeKJnZosg+yPyQ==
dependencies:
"@types/geojson" "^7946.0.7"
deprecated-react-native-prop-types "^2.3.0"
react-native-ratings@8.0.4:
version "8.0.4"
resolved "https://registry.yarnpkg.com/react-native-ratings/-/react-native-ratings-8.0.4.tgz#efd5ebad8acc08bf98d34d39b18fb7a6813ef991"