超リファクタリング

This commit is contained in:
harukin-DeskMini 2022-10-10 19:14:03 +09:00
parent 762195e8e8
commit 4d921854c9
2 changed files with 194 additions and 231 deletions

View File

@ -59,6 +59,7 @@ export default function LED_vision(props) {
const [trainIDSwitch, setTrainIDSwitch] = useState(false); const [trainIDSwitch, setTrainIDSwitch] = useState(false);
const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false); const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false);
useEffect(() => { useEffect(() => {
console.log("LED");
fetch( fetch(
"https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia", "https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia",
HeaderConfig HeaderConfig
@ -66,49 +67,47 @@ export default function LED_vision(props) {
.then((response) => response.text()) .then((response) => response.text())
.then((d) => { .then((d) => {
const val = d.replace("[\r\n", "").split(",\r\n"); const val = d.replace("[\r\n", "").split(",\r\n");
let returnData = {}; let trainDiagram = {};
val.forEach((element) => { val.forEach((element) => {
try { try {
let data = JSON.parse(element); let data = JSON.parse(element);
Object.keys(data).forEach((key) => (returnData[key] = data[key])); Object.keys(data).forEach((key) => (trainDiagram[key] = data[key]));
} catch (e) {} } catch (e) {}
}); });
return returnData; setTrainDiagram(trainDiagram);
return trainDiagram;
}) })
.then((trainDiagram) => { .then((trainDiagram) => {
let returnData = {}; let returnData = {};
if (trainDiagram) { if (!trainDiagram) {
Object.keys(trainDiagram).forEach((key) => { setStationDiagram(returnData);
if (trainDiagram[key].match(props.station.Station_JP)) { return;
returnData[key] = trainDiagram[key];
}
});
} }
setTrainDiagram(trainDiagram); Object.keys(trainDiagram).forEach((key) => {
if (trainDiagram[key].match(props.station.Station_JP)) {
returnData[key] = trainDiagram[key];
}
});
setStationDiagram(returnData); setStationDiagram(returnData);
}); });
}, []); }, []);
const getTime = () => { const getTime = () => {
const returnData = []; const returnData = [];
const date = new Date();
Object.keys(stationDiagram).forEach((d) => { Object.keys(stationDiagram).forEach((d) => {
let a = (() => { let a = {};
let returnData = {}; stationDiagram[d].split("#").forEach((data) => {
stationDiagram[d].split("#").forEach((data) => { if (data.match("着")) {
if (data.match("着")) { a.lastStation = data.split(",着,")[0];
returnData.lastStation = data.split(",着,")[0]; }
if (data.match(props.station.Station_JP)) {
if (data.match(",発,")) {
a.time = data.split(",発,")[1];
} else {
a.time = data.split(",着,")[1];
a.lastStation = "当駅止";
} }
if (data.match(props.station.Station_JP)) { }
if (data.match(",発,")) { });
returnData.time = data.split(",発,")[1];
} else {
returnData.time = data.split(",着,")[1];
returnData.lastStation = "当駅止";
}
}
});
return returnData;
})();
returnData.push({ train: d, time: a.time, lastStation: a.lastStation }); returnData.push({ train: d, time: a.time, lastStation: a.lastStation });
}); });
@ -141,42 +140,26 @@ export default function LED_vision(props) {
.then((d) => d.map((x) => ({ num: x.TrainNum, delay: x.delay }))) .then((d) => d.map((x) => ({ num: x.TrainNum, delay: x.delay })))
.then((d) => setCurrentTrain(d)); .then((d) => setCurrentTrain(d));
getCurrentTrain(); getCurrentTrain();
const currentTrainInterval = setInterval(() => getCurrentTrain(), 15000); const currentTrainInterval = setInterval(getCurrentTrain, 15000);
return () => clearInterval(currentTrainInterval); return () => clearInterval(currentTrainInterval);
}, []); }, []);
const filtering = (d) => currentTrain.map((m) => m.num).includes(d.train);
console.log(new Date());
const timeFiltering = (d) => { const timeFiltering = (d) => {
const date = new Date(); const date = new Date();
const newDate = new Date(); const newDate = new Date();
let data = d.time.split(":"); let data = d.time.split(":");
let delay = isNaN( let delay = isNaN(currentTrain.filter((t) => t.num == d.train)[0].delay)
currentTrain.filter((data) => data.num == d.train)[0].delay
)
? 0 ? 0
: currentTrain.filter((data) => data.num == d.train)[0].delay; : currentTrain.filter((t) => t.num == d.train)[0].delay;
date.setHours(parseInt(data[0])); date.setHours(parseInt(data[0]));
date.setMinutes(parseInt(data[1]) + parseInt(delay)); date.setMinutes(parseInt(data[1]) + parseInt(delay));
console.log(date);
console.log(newDate);
if (!(newDate > date)) { if (!(newDate > date)) {
return true; return true;
} }
return false; return false;
}; };
const finalFiltering = (d) => {
if (finalSwitch) {
return true;
} else {
if (d.lastStation == "当駅止") {
return false;
}
return true;
}
};
return ( return (
<View <View
style={{ style={{
@ -208,122 +191,114 @@ export default function LED_vision(props) {
{trainTimeAndNumber {trainTimeAndNumber
? currentTrain && ? currentTrain &&
trainTimeAndNumber trainTimeAndNumber
.filter(filtering) .filter((d) => currentTrain.map((m) => m.num).includes(d.train))
.filter(timeFiltering) .filter(timeFiltering)
.filter(finalFiltering) .filter((d) => !!finalSwitch || d.lastStation != "当駅止")
.map((d, index) => [ .map((d, index) => {
<View const train = customTrainDataDetector(d.train);
style={{ return [
alignContent: "center", <View
alignItems: "center", style={{
width: "94%", alignContent: "center",
marginVertical: 5, alignItems: "center",
marginHorizontal: "3%", width: "94%",
backgroundColor: "#000", marginVertical: 5,
flexDirection: "row", marginHorizontal: "3%",
}} backgroundColor: "#000",
> flexDirection: "row",
<View style={{ flex: 9 }}> }}
<Text >
style={{ <View style={{ flex: 9 }}>
fontSize: (() => { <Text
if ( style={{
customTrainDataDetector(d.train).trainName.length > 6 fontSize: train.trainName.length > 6 ? 15 : 20,
) { color: (() => {
return 15; switch (train.type) {
} else {
return 20;
}
})(),
color: (() => {
switch (customTrainDataDetector(d.train).type) {
case "Rapid":
return "aqua";
case "LTDEXP":
return "red";
case "NightLTDEXP":
return "red";
case "Normal":
return "white";
}
})(),
fontWeight: "bold",
}}
>
{trainIDSwitch
? d.train
: (() => {
switch (customTrainDataDetector(d.train).type) {
case "Rapid": case "Rapid":
return "快速"; return "aqua";
case "LTDEXP": case "LTDEXP":
return "特急"; return "red";
case "NightLTDEXP": case "NightLTDEXP":
return "寝台特急"; return "red";
case "Normal": case "Normal":
return "普通列車"; return "white";
} }
})() + })(),
" " + fontWeight: "bold",
customTrainDataDetector(d.train).trainName + }}
(() => { >
if ( {trainIDSwitch
customTrainDataDetector(d.train).trainNumDistance != ? d.train
null : (() => {
) { switch (train.type) {
return ( case "Rapid":
parseInt( return "快速";
case "LTDEXP":
return "特急";
case "NightLTDEXP":
return "寝台特急";
case "Normal":
return "普通列車";
}
})() +
" " +
train.trainName +
(!train.trainNumDistance
? ""
: parseInt(
d.train.replace("M", "").replace("D", "") d.train.replace("M", "").replace("D", "")
) - ) -
customTrainDataDetector(d.train) train.trainNumDistance +
.trainNumDistance + "号")}
"号" </Text>
); </View>
} else { <View style={{ flex: 4, flexDirection: "row" }}>
return ""; <Text
} style={{
})()} fontSize: d.lastStation.length > 4 ? 15 : 20,
</Text> color: "white",
</View> fontWeight: "bold",
<View style={{ flex: 4, flexDirection: "row" }}> }}
<Text >
style={{ {d.lastStation}
fontSize: d.lastStation.length > 4 ? 15 : 20, </Text>
color: "white", </View>
fontWeight: "bold", <View style={{ flex: 3 }}>
}} <Text
> style={{
{d.lastStation} fontSize: 20,
</Text> color: "white",
</View> fontWeight: "bold",
<View style={{ flex: 3 }}> }}
<Text >
style={{ fontSize: 20, color: "white", fontWeight: "bold" }} {d.time}
> </Text>
{d.time} </View>
</Text> <View style={{ flex: 4 }}>
</View> <Text
<View style={{ flex: 4 }}> style={{
<Text fontSize: 20,
style={{ fontSize: 20, color: "white", fontWeight: "bold" }} color: "white",
> fontWeight: "bold",
{(() => { }}
let data = currentTrain.filter( >
(data) => data.num == d.train {(() => {
)[0].delay; const delay = currentTrain.filter(
if (isNaN(data)) { (a) => a.num == d.train
return data; )[0].delay;
} else if (data == 0) { switch (true) {
return "定刻通り"; case isNaN(delay):
} else { return delay;
return data + "分遅れ"; case delay == 0:
} return "定刻通り";
})()} default:
</Text> return delay + "分遅れ";
</View> }
</View>, })()}
Boolean(trainDescriptionSwitch) && </Text>
Boolean(customTrainDataDetector(d.train).info) && ( </View>
</View>,
trainDescriptionSwitch && !!train.info && (
<View <View
style={{ style={{
alignContent: "center", alignContent: "center",
@ -344,12 +319,13 @@ export default function LED_vision(props) {
}} }}
> >
{" "} {" "}
&gt; {customTrainDataDetector(d.train).info} &gt; {train.info}
</Text> </Text>
</View> </View>
</View> </View>
), ),
]) ];
})
: null} : null}
<View style={{ flexDirection: "row", padding: 10 }}> <View style={{ flexDirection: "row", padding: 10 }}>
<Text <Text
@ -363,10 +339,7 @@ export default function LED_vision(props) {
> >
種別名 / 列番 種別名 / 列番
</Text> </Text>
<Switch <Switch value={trainIDSwitch} onValueChange={setTrainIDSwitch} />
value={trainIDSwitch}
onValueChange={(value) => setTrainIDSwitch(!trainIDSwitch)}
/>
<View style={{ flex: 1 }} /> <View style={{ flex: 1 }} />
<Text <Text
style={{ style={{
@ -381,9 +354,7 @@ export default function LED_vision(props) {
</Text> </Text>
<Switch <Switch
value={trainDescriptionSwitch} value={trainDescriptionSwitch}
onValueChange={(value) => onValueChange={setTrainDescriptionSwitch}
setTrainDescriptionSwitch(!trainDescriptionSwitch)
}
/> />
<View style={{ flex: 1 }} /> <View style={{ flex: 1 }} />
<Text <Text
@ -397,10 +368,7 @@ export default function LED_vision(props) {
> >
当駅止表示 当駅止表示
</Text> </Text>
<Switch <Switch value={finalSwitch} onValueChange={setFinalSwitch} />
value={finalSwitch}
onValueChange={(value) => setFinalSwitch(!finalSwitch)}
/>
</View> </View>
</View> </View>
); );

123
menu.js
View File

@ -15,7 +15,6 @@ import { List, ListItem } from "native-base";
import Icon from "react-native-vector-icons/Entypo"; import Icon from "react-native-vector-icons/Entypo";
import * as Location from "expo-location"; import * as Location from "expo-location";
import StatusbarDetect from "./StatusbarDetect"; import StatusbarDetect from "./StatusbarDetect";
var Status = StatusbarDetect();
import { useNavigation } from "@react-navigation/native"; import { useNavigation } from "@react-navigation/native";
import AutoHeightImage from "react-native-auto-height-image"; import AutoHeightImage from "react-native-auto-height-image";
import { import {
@ -173,7 +172,7 @@ export default function Menu(props) {
paddingTop: Platform.OS == "ios" ? Constants.statusBarHeight : 0, paddingTop: Platform.OS == "ios" ? Constants.statusBarHeight : 0,
}} }}
> >
{Status} <StatusbarDetect />
<View style={{ alignItems: "center" }}> <View style={{ alignItems: "center" }}>
<TouchableOpacity <TouchableOpacity
onPress={() => Linking.openURL("https://www.jr-shikoku.co.jp")} onPress={() => Linking.openURL("https://www.jr-shikoku.co.jp")}
@ -514,7 +513,7 @@ export default function Menu(props) {
size={30} size={30}
/> />
<Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}> <Text style={{ fontSize: 30, fontWeight: "bold", color: "white" }}>
公式Twitter一族 JR四国公式Twitter一族
</Text> </Text>
</View> </View>
<View <View
@ -525,65 +524,63 @@ export default function Menu(props) {
borderBottomRightRadius: 10, borderBottomRightRadius: 10,
}} }}
> >
<ListItem {((data) =>
onPress={() => data.map((d) => (
Linking.openURL("https://twitter.com/JRshikoku_tokyo") <ListItem onPress={() => Linking.openURL(d.url)}>
} <Text>{d.name}</Text>
> <View style={{ flex: 1 }} />
<Text>JR四国 東京営業情報公式</Text> <Icon name="chevron-right" size={20} />
<View style={{ flex: 1 }} /> </ListItem>
<Icon name="chevron-right" size={20} /> )))([
</ListItem> {
<ListItem url: "https://twitter.com/JRshikoku_eigyo",
onPress={() => name: "JR四国営業部【公式】",
Linking.openURL("https://twitter.com/JRshikoku_osaka") },
} {
> url: "https://twitter.com/JRshikoku_tokyo",
<Text>JR四国 大阪営業部公式</Text> name: "JR四国 東京営業情報【公式】",
<View style={{ flex: 1 }} /> },
<Icon name="chevron-right" size={20} /> {
</ListItem> url: "https://twitter.com/JRshikoku_osaka",
<ListItem name: "JR四国 大阪営業部【公式】",
onPress={() => Linking.openURL("https://twitter.com/shikoku_DC")} },
> {
<Text>JR四国営業部 四国DC情報公式</Text> url: "https://twitter.com/jr_shikoku_info",
<View style={{ flex: 1 }} /> name: "JR四国列車運行情報【公式】",
<Icon name="chevron-right" size={20} /> },
</ListItem> {
<ListItem url: "https://twitter.com/Smile_Eki_Chan",
onPress={() => name: "すまいるえきちゃん♡JR四国【公式】",
Linking.openURL("https://twitter.com/jr_shikoku_info") },
} {
> url: "https://twitter.com/jrs_matsuyama",
<Text>JR四国運行情報Twitter</Text> name: "JR四国 松山駅 【公式】",
<View style={{ flex: 1 }} /> },
<Icon name="chevron-right" size={20} /> {
</ListItem> url: "https://twitter.com/jrshikoku_kochi",
<ListItem name: "JR四国 高知駅【公式】",
onPress={() => },
Linking.openURL("https://twitter.com/Smile_Eki_Chan") {
} url: "https://twitter.com/jr_tokust",
> name: "JR四国 徳島駅【公式】",
<Text>JR四国いそうろう妖精 すまいるえきちゃん公式</Text> },
<View style={{ flex: 1 }} /> {
<Icon name="chevron-right" size={20} /> url: "https://twitter.com/jrshikoku_uwjm",
</ListItem> name: "JR四国 宇和島駅【公式】",
<ListItem },
onPress={() => {
Linking.openURL("https://twitter.com/JR_Shikoku_DPT") url: "https://twitter.com/JRshikoku_wkoch",
} name: "JR四国 ワープ高知支店【公式】",
> },
<Text>JR四国デザインPT</Text> {
<View style={{ flex: 1 }} /> url: "https://twitter.com/jrshikoku_nihaw",
<Icon name="chevron-right" size={20} /> name: "JR四国 ワープ新居浜営業所【公式】",
</ListItem> },
<ListItem {
onPress={() => Linking.openURL("https://twitter.com/PT2nd_Yuki")} url: "https://twitter.com/Yoakemonogatari",
> name: "志国土佐 時代の夜明けのものがたり【公式】",
<Text>JR四国デザインPT弐号</Text> },
<View style={{ flex: 1 }} /> ])}
<Icon name="chevron-right" size={20} />
</ListItem>
</View> </View>
</View> </View>
<Text style={{ fontWeight: "bold", fontSize: 20 }}> <Text style={{ fontWeight: "bold", fontSize: 20 }}>
@ -592,8 +589,6 @@ export default function Menu(props) {
<Text> <Text>
このアプリはXprocess(HARUKIN)が製作しているJR四国の完全非公式アシストアプリケーションですこのアプリに関することでのJR四国公式へ問合せすることはお控えください以下のTwitterよりお願いします このアプリはXprocess(HARUKIN)が製作しているJR四国の完全非公式アシストアプリケーションですこのアプリに関することでのJR四国公式へ問合せすることはお控えください以下のTwitterよりお願いします
</Text> </Text>
<Text>2022/4/14 4.1公開列車アイコン表示が開始しました</Text>
<Text>2021/6/23 4.0公開ホーム画面を大改造しました</Text>
<TextBox <TextBox
backgroundColor="#CC0000" backgroundColor="#CC0000"
flex={1} flex={1}