diff --git a/components/発車時刻表/LED_vidion.js b/components/発車時刻表/LED_vidion.js index 8f8f8f4..723252a 100644 --- a/components/発車時刻表/LED_vidion.js +++ b/components/発車時刻表/LED_vidion.js @@ -64,7 +64,7 @@ export default function LED_vision(props) { }; useEffect(() => { - //全列車リストを生成する副作用 + //全列車リストを生成する副作用[無条件初回実行] fetch( "https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia", HeaderConfig @@ -81,7 +81,7 @@ export default function LED_vision(props) { }, []); useEffect(() => { - //駅の情報を作成する副作用 + // 現在の駅に停車するダイヤを作成する副作用[列車ダイヤと現在駅情報] if (!trainDiagram) { setStationDiagram({}); return; @@ -110,12 +110,11 @@ export default function LED_vision(props) { console.log(e); }); - useEffect(getCurrentTrain, []); + useEffect(getCurrentTrain, []); //初回だけ現在の全在線列車取得 - useInterval(getCurrentTrain, 15000); + useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得 const getTime = (stationDiagram, station) => { - console.log(stationDiagram); const returnData = Object.keys(stationDiagram).map((d) => { let a = {}; stationDiagram[d].split("#").forEach((data) => { @@ -149,7 +148,9 @@ export default function LED_vision(props) { }; const [trainTimeAndNumber, setTrainTimeAndNumber] = useState(null); + useEffect(() => { + //現在の駅に停車する列車から時刻を切り出してLEDベースにフォーマット if (objectIsEmpty(stationDiagram)) return () => {}; console.log(stationDiagram); const getTimeData = getTime(stationDiagram, props.station); @@ -184,6 +185,16 @@ export default function LED_vision(props) { return { color: "white", name: "普通列車" }; } }; + const [selectedTrain, setSelectedTrain] = useState([]); + useEffect(() => { + if (!trainTimeAndNumber) return () => {}; + if (!currentTrain) return () => {}; + const data = trainTimeAndNumber + .filter((d) => currentTrain.map((m) => m.num).includes(d.train)) + .filter(timeFiltering) + .filter((d) => !!finalSwitch || d.lastStation != "当駅止"); + setSelectedTrain(data); + }, [trainTimeAndNumber, currentTrain]); return (
- {trainTimeAndNumber - ? currentTrain && - trainTimeAndNumber - .filter((d) => currentTrain.map((m) => m.num).includes(d.train)) - .filter(timeFiltering) - .filter((d) => !!finalSwitch || d.lastStation != "当駅止") - .map((d, index) => { - const train = customTrainDataDetector(d.train); - return ( - <> - - - - - - - {trainDescriptionSwitch && !!train.info && ( - - )} - - ); - }) - : null} + {selectedTrain.map((d, index) => ( + + ))}