diff --git a/App.js b/App.js index 4fec0f5..2493539 100644 --- a/App.js +++ b/App.js @@ -32,7 +32,9 @@ if (Platform.OS === "android") { } export default function App() { - useEffect(() => UpdateAsync(), []); + useEffect(() => { + UpdateAsync(); + }, []); const ProviderTree = buildProvidersTree([ AllTrainDiagramProvider, diff --git a/assets/configuration/layout_tokyo.jpg b/assets/configuration/layout_tokyo.jpg index a0c06bb..128c582 100644 Binary files a/assets/configuration/layout_tokyo.jpg and b/assets/configuration/layout_tokyo.jpg differ diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 23a15cb..92a6521 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -44,7 +44,7 @@ export const EachTrainInfoCore = ({ }) => { const { currentTrain } = useCurrentTrain(); const { originalStationList, stationList } = useStationList(); - const { allTrainDiagram: trainList, allCustonTrainData } = + const { allTrainDiagram: trainList, allCustomTrainData } = useAllTrainDiagram(); const { setTrainInfo } = useTrainMenu(); const [currentTrainData, setCurrentTrainData] = useState(); @@ -323,7 +323,7 @@ export const EachTrainInfoCore = ({ }, []); const openTrainInfo = (d) => { - const train = customTrainDataDetector(d, allCustonTrainData); + const train = customTrainDataDetector(d, allCustomTrainData); let TrainNumber = ""; if (train.trainNumDistance != undefined) { const timeInfo = diff --git a/components/ActionSheetComponents/EachTrainInfoCore/HeaderText.tsx b/components/ActionSheetComponents/EachTrainInfoCore/HeaderText.tsx index 8203126..9caced5 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore/HeaderText.tsx +++ b/components/ActionSheetComponents/EachTrainInfoCore/HeaderText.tsx @@ -10,6 +10,8 @@ import { InfogramText } from "@/components/ActionSheetComponents/EachTrainInfoCo import { useTrainMenu } from "@/stateBox/useTrainMenu"; import { useAllTrainDiagram } from "@/stateBox/useAllTrainDiagram"; import { useNotification } from "@/stateBox/useNotifications"; +import { getStringConfig } from "@/lib/getStringConfig"; +import { FontAwesome } from "@expo/vector-icons"; type Props = { data: { trainNum: string; limited: string }; @@ -44,87 +46,46 @@ export const HeaderText: FC = ({ const { limited, trainNum } = data; const { updatePermission } = useTrainMenu(); - const { allCustonTrainData } = useAllTrainDiagram(); + const { allCustomTrainData } = useAllTrainDiagram(); const { expoPushToken } = useNotification(); // 列車名、種別、フォントの取得 - const [typeName, trainName, fontAvailable, isOneMan, infogram] = + const [typeName, trainName, fontAvailable, isOneMan, infogram, isEdit] = useMemo(() => { - const customTrainData = customTrainDataDetector( - trainNum, - allCustonTrainData + const { type, trainName, trainNumDistance, infogram, isEdit } = + customTrainDataDetector(trainNum, allCustomTrainData); + const [typeString, fontAvailable, isOneMan] = getStringConfig( + type, + trainNum ); - const [type, fontAvailable, isOneMan] = (() => { - switch (customTrainData.type) { - case "Normal": - return ["普通", true, false]; - case "OneMan": - return ["普通", true, true]; - case "Rapid": - return ["快速", true, false]; - case "OneManRapid": - return ["快速", true, true]; - case "LTDEXP": - return ["特急", true, false]; - case "NightLTDEXP": - return ["特急", true, false]; - case "SPCL": - return ["臨時", true, false]; - case "SPCL_Normal": - return ["臨時", true, false]; - case "SPCL_Rapid": - return ["臨時快速", true, false]; - case "SPCL_EXP": - return ["臨時特急", true, false]; - case "Freight": - return ["貨物", false, false]; - case "Forwarding": - return ["回送", false, false]; - case "FreightForwarding": - return ["単機回送", false, false]; - case "Other": - switch (true) { - case !!trainNum.includes("T"): - return ["単機回送", false, false]; - case !!trainNum.includes("R"): - case !!trainNum.includes("E"): - case !!trainNum.includes("L"): - case !!trainNum.includes("A"): - case !!trainNum.includes("B"): - return ["回送", false, false]; - case !!trainNum.includes("H"): - return ["試運転", false, false]; - } - return ["", false, false]; - } - })(); switch (true) { - case customTrainData.trainName !== "": + case trainName !== "": // 特急の場合は、列車名を取得 // 列番対称データがある場合はそれから列車番号を取得 - const distance = customTrainData.trainNumDistance; - const number = - distance !== null ? ` ${parseInt(trainNum) - distance}号` : ""; - const trainName = customTrainData.trainName + number; return [ - type, - trainName, + typeString, + trainName + + (trainNumDistance !== null + ? ` ${parseInt(trainNum) - trainNumDistance}号` + : ""), fontAvailable, isOneMan, - customTrainData.infogram, + infogram, + isEdit, ]; case trainData[trainData.length - 1] === undefined: - return [type, "", fontAvailable, isOneMan, customTrainData.infogram]; + return [typeString, "", fontAvailable, isOneMan, infogram, isEdit]; default: // 行先がある場合は、行先を取得 return [ - type, + typeString, migrateTrainName( trainData[trainData.length - 1].split(",")[0] + "行き" ), fontAvailable, isOneMan, - customTrainData.infogram, + infogram, + isEdit ]; } }, [trainData]); @@ -140,14 +101,8 @@ export const HeaderText: FC = ({ { - navigate("generalWebView", { - uri: - "https://jr-shikoku-data-post-system.pages.dev?trainNum=" + - trainNum + - "&token=" + - expoPushToken, - useExitButton: false, - }); + const uri = `https://jr-shikoku-data-post-system.pages.dev?trainNum=${trainNum}&token=${expoPushToken}`; + navigate("generalWebView", { uri, useExitButton: false }); SheetManager.hide("EachTrainInfo"); }} disabled={!updatePermission} @@ -166,6 +121,7 @@ export const HeaderText: FC = ({ {isOneMan && } {trainName} + {isEdit &&alert("このアイコン、列車データはコミュニティによってリアルタイム追加されています。")} />} diff --git a/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx b/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx index ed642e9..1f30eca 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx +++ b/components/ActionSheetComponents/EachTrainInfoCore/trainIconStatus.tsx @@ -23,12 +23,12 @@ export const TrainIconStatus: FC = ({ data, navigate, from }) => { const [trainIcon, setTrainIcon] = useState(null); const [anpanmanStatus, setAnpanmanStatus] = useState(); const [address, setAddress] = useState(""); - const { allCustonTrainData } = useAllTrainDiagram(); + const { allCustomTrainData } = useAllTrainDiagram(); useEffect(() => { if (!data.trainNum) return; const { img, infoUrl } = customTrainDataDetector( data.trainNum, - allCustonTrainData + allCustomTrainData ); if (img) setTrainIcon(img); if (infoUrl) setAddress(infoUrl); diff --git a/components/AllTrainDiagramView.js b/components/AllTrainDiagramView.js index 491f9cc..e2d2987 100644 --- a/components/AllTrainDiagramView.js +++ b/components/AllTrainDiagramView.js @@ -10,6 +10,7 @@ import { Keyboard, ScrollView, Linking, + Image, } from "react-native"; import { useAllTrainDiagram } from "../stateBox/useAllTrainDiagram"; @@ -19,9 +20,12 @@ import { SheetManager } from "react-native-actions-sheet"; import { useNavigation } from "@react-navigation/native"; import { BigButton } from "./atom/BigButton"; import { Switch } from "react-native-elements"; +import { migrateTrainName } from "@/lib/eachTrainInfoCoreLib/migrateTrainName"; +import { OneManText } from "./ActionSheetComponents/EachTrainInfoCore/HeaderTextParts/OneManText"; +import { getStringConfig } from "@/lib/getStringConfig"; export default function AllTrainDiagramView() { const { goBack, navigate } = useNavigation(); - const { keyList, allTrainDiagram, allCustonTrainData } = useAllTrainDiagram(); + const { keyList, allTrainDiagram, allCustomTrainData } = useAllTrainDiagram(); const [input, setInput] = useState(""); // 文字入力 const [keyBoardVisible, setKeyBoardVisible] = useState(false); const [useStationName, setUseStationName] = useState(false); @@ -53,7 +57,7 @@ export default function AllTrainDiagramView() { }, []); const openTrainInfo = (d) => { - const train = customTrainDataDetector(d, allCustonTrainData); + const train = customTrainDataDetector(d, allCustomTrainData); let TrainNumber = ""; if (train.trainNumDistance != undefined) { const timeInfo = @@ -71,6 +75,75 @@ export default function AllTrainDiagramView() { payload, }); }; + + const Item = ({ id, openTrainInfo }) => { + const { img, trainName, type, trainNumDistance, infogram } = + customTrainDataDetector(id, allCustomTrainData); + + const [typeString, fontAvailable, isOneMan] = getStringConfig(type, id); + const trainNameString = (() => { + switch (true) { + case trainName !== "": + // 特急の場合は、列車名を取得 + // 列番対称データがある場合はそれから列車番号を取得 + const distance = trainNumDistance; + const number = + distance !== null ? ` ${parseInt(id) - distance}号` : ""; + return trainName + number; + case allTrainDiagram[id] === undefined: + return ""; + default: + // 行先がある場合は、行先を取得 + const s = allTrainDiagram[id].split("#"); + const hoge = s[s.length - 2].split(",")[0]; + return migrateTrainName(hoge + "行き"); + } + })(); + return ( + openTrainInfo(id)} + > + {img && ( + + )} + {typeString && ( + + {typeString} + + )} + {isOneMan && } + {trainNameString && ( + + {trainNameString} + + )} + + + {id} + + + ); + }; return ( } - keyExtractor={(item) => item} //initialNumToRender={100} /> @@ -225,25 +297,3 @@ export default function AllTrainDiagramView() { ); } -const Item = ({ id, openTrainInfo }) => { - return ( - openTrainInfo(id)} - > - - - {id} - - - - ); -}; diff --git a/components/Menu/FixedContentBottom.js b/components/Menu/FixedContentBottom.js index de78d59..c900df6 100644 --- a/components/Menu/FixedContentBottom.js +++ b/components/Menu/FixedContentBottom.js @@ -52,22 +52,6 @@ export const FixedContentBottom = (props) => { 旅行ツアー - - Linking.openURL( - "https://xprocess.haruk.in/JR-shikoku-Apps-Common/2025-update-status" - ) - } - > - - 【ダイヤ改正に伴うデータ更新状況】 - - - ダイヤ改正に伴うデータの更新状況を随時更新します。 - - { - if (allCustonTrainData && allCustonTrainData.length > 0) { - const customTrain = allCustonTrainData.find( + if (allCustomTrainData && allCustomTrainData.length > 0) { + const customTrain = allCustomTrainData.find( (train) => train.TrainNumber === TrainNumber ); if (customTrain) { diff --git a/components/trainMenu.js b/components/trainMenu.js index cd416f1..28fd367 100644 --- a/components/trainMenu.js +++ b/components/trainMenu.js @@ -180,11 +180,11 @@ export default function TrainMenu({ style }) { flex={1} onPressButton={() => navigate("howto", { - info: "https://train.jr-shikoku.co.jp/usage.htm", + info: "https://xprocess.haruk.in/JR-shikoku-Apps-Common/info/train-position", }) } > - 使い方 + 走行位置の見方 = (props) => { } = props; const { currentTrain } = useCurrentTrain(); const { stationList } = useStationList(); - const { allCustonTrainData } = useAllTrainDiagram(); + const { allCustomTrainData } = useAllTrainDiagram(); const openTrainInfo = (d: { train: string; lastStation: string; @@ -78,7 +78,7 @@ export const EachData: FC = (props) => { const getTrainDataFromCurrentTrain = (trainNum: string) => { const customTrainData = customTrainDataDetector( d.train, - allCustonTrainData + allCustomTrainData ); switch (customTrainData.type) { case "Normal": diff --git a/components/発車時刻表/LED_inside_Component/AreaDescription.tsx b/components/発車時刻表/LED_inside_Component/AreaDescription.tsx new file mode 100644 index 0000000..f3dd3b3 --- /dev/null +++ b/components/発車時刻表/LED_inside_Component/AreaDescription.tsx @@ -0,0 +1,79 @@ +import React, { FC, useState, useEffect } from "react"; +import { Text, TextStyle, View, TouchableOpacity } from "react-native"; +import { useInterval } from "../../../lib/useInterval"; + +const descriptionStyle: TextStyle = { + fontSize: parseInt("16%"), + fontWeight: "bold", +}; + +type Props = { + areaInfo: string; + numberOfLines?: number; + onClick?: () => void; + onLongClick?: () => void; +}; +export const AreaDescription:FC = ({ areaInfo, numberOfLines = 0, onClick, onLongClick }) => { + const [areaString, setAreaString] = useState(""); + const [areaStringLength, setAreaStringLength] = useState(0); + const [move, setMove] = useState(0); + useInterval( + () => { + if (areaInfo != "") { + setMove(areaStringLength < move ? 0 : move + 1); + } + }, + 350, + true + ); + useEffect(() => { + if (!areaInfo) { + setAreaString(""); + return () => {}; + } + setAreaString( + areaInfo.substring(move, areaInfo.length) + areaInfo.substring(0, move) + ); + }, [move]); + + useEffect(() => { + if (!areaInfo) { + setAreaStringLength(0); + return () => {}; + } + setAreaStringLength(areaInfo.length); + }, [areaInfo]); + return( + + + {numberOfLines == 1 ? ( + + 運行情報 >{" "} + + ) : ( + > + )} + + + {areaString.replaceAll("\n", "").replaceAll("\r", "")} + + + + ); +}; diff --git a/components/発車時刻表/LED_vidion.js b/components/発車時刻表/LED_vidion.js index 96d297b..bee0532 100644 --- a/components/発車時刻表/LED_vidion.js +++ b/components/発車時刻表/LED_vidion.js @@ -12,6 +12,7 @@ import { Description } from "./LED_inside_Component/Description"; import { EachData } from "./EachData"; import { useAllTrainDiagram } from "@/stateBox/useAllTrainDiagram"; import { trainPosition } from "@/lib/trainPositionTextArray"; +import { AreaDescription } from "./LED_inside_Component/AreaDescription"; /** * @@ -180,36 +181,6 @@ export default function LED_vision(props) { return !date.isAfter(db); } }; - - const [areaString, setAreaString] = useState(""); - const [areaStringLength, setAreaStringLength] = useState(0); - const [move, setMove] = useState(0); - useInterval( - () => { - if (areaInfo != "") { - setMove(areaStringLength < move ? 0 : move + 1); - } - }, - 350, - true - ); - useEffect(() => { - if (!areaInfo) { - setAreaString(""); - return () => {}; - } - setAreaString( - areaInfo.substring(move, areaInfo.length) + areaInfo.substring(0, move) - ); - }, [move]); - - useEffect(() => { - if (!areaInfo) { - setAreaStringLength(0); - return () => {}; - } - setAreaStringLength(areaInfo.length); - }, [areaInfo]); const { width } = useWindowDimensions(); const adjustedWidth = width * 0.98; return ( @@ -236,10 +207,10 @@ export default function LED_vision(props) { key={d.train} /> ))} - {areaString != "" && isInfoArea && ( - alert(areaInfo)} /> )} diff --git a/lib/getStringConfig.ts b/lib/getStringConfig.ts new file mode 100644 index 0000000..5295f04 --- /dev/null +++ b/lib/getStringConfig.ts @@ -0,0 +1,60 @@ +type typeID = + | "Normal" + | "OneMan" + | "Rapid" + | "OneManRapid" + | "LTDEXP" + | "NightLTDEXP" + | "SPCL" + | "SPCL_Normal" + | "SPCL_Rapid" + | "SPCL_EXP" + | "Freight" + | "Forwarding" + | "FreightForwarding" + | "Other"; +type types = (types: typeID, id: string) => [string, boolean, boolean]; +export const getStringConfig: types = (type, id) => { + switch (type) { + case "Normal": + return ["普通", true, false]; + case "OneMan": + return ["普通", true, true]; + case "Rapid": + return ["快速", true, false]; + case "OneManRapid": + return ["快速", true, true]; + case "LTDEXP": + return ["特急", true, false]; + case "NightLTDEXP": + return ["特急", true, false]; + case "SPCL": + return ["臨時", true, false]; + case "SPCL_Normal": + return ["臨時", true, false]; + case "SPCL_Rapid": + return ["臨時快速", true, false]; + case "SPCL_EXP": + return ["臨時特急", true, false]; + case "Freight": + return ["貨物", false, false]; + case "Forwarding": + return ["回送", false, false]; + case "FreightForwarding": + return ["単機回送", false, false]; + case "Other": + switch (true) { + case !!id.includes("T"): + return ["単機回送", false, false]; + case !!id.includes("R"): + case !!id.includes("E"): + case !!id.includes("L"): + case !!id.includes("A"): + case !!id.includes("B"): + return ["回送", false, false]; + case !!id.includes("H"): + return ["試運転", false, false]; + } + return ["", false, false]; + } +}; diff --git a/lib/webViewInjectjavascript.ts b/lib/webViewInjectjavascript.ts index 55157d3..19ffd8e 100644 --- a/lib/webViewInjectjavascript.ts +++ b/lib/webViewInjectjavascript.ts @@ -17,6 +17,7 @@ export const injectJavascriptData: InjectJavascriptData = ( mapSwitch != "true" ? ` document.querySelector('#header a').style.display = 'none'; + document.querySelector('#main').style.left = '0px'; document.querySelector('#header').style.height = '50px'; document.querySelector('#main').style.paddingTop = '54px'; document.querySelector('#headerStr').style.display = 'none'; @@ -24,50 +25,98 @@ export const injectJavascriptData: InjectJavascriptData = ( : ` document.querySelector('.accordionClass').style.display = 'none'; document.querySelector('#header').style.display = 'none'; + document.querySelector('#main').style.left = '0px'; document.querySelector('#main').style.paddingTop = '0px'; document.querySelector('#headerStr').style.display = 'none'; `; // 上部ヘッダーの取り扱い、自動再読み込み、setStringsの実行 const bootData = ` + // 起動時にブラウザにlodashを読み込むscript追加処理 + const script = document.createElement('script'); + script.src = "https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"; + document.head.appendChild(script); + + const script2 = document.createElement('link'); + script2.rel = "stylesheet"; + script2.href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.0/css/all.min.css"; + document.head.appendChild(script2); + let stationList = {}; fetch("https://n8n.haruk.in/webhook/jr-shikoku-station-list").then((response) => response.json()).then((data) => { stationList = data; - }); - let trainDataList = []; - fetch("https://n8n.haruk.in/webhook/jr-shikoku-position-custom-datalist").then((response) => response.json()).then((data) => { - trainDataList = data[0].data; }).then(()=>setReload()); - let trainDiagramData2 = {}; - fetch("https://n8n.haruk.in/webhook/JR-shikoku-diagram-migrate-original") - .then((response) => response.json()) - .then((res)=>res.data) - .then((res) => { - const data = {}; - res.forEach((d) => { - const keys = Object.keys(d); - data[keys] = d[keys]; + + let trainDataList = []; + const DatalistUpdate = () =>{ + try{ + fetch("https://n8n.haruk.in/webhook/jr-shikoku-position-custom-datalist").then((response) => response.json()) + .then((data) => data[0].data) + .then((data) => { + if(!_.isEqual(data, trainDataList)) { + trainDataList = data; + setReload(); + } }); - return data; - }) - .then((data) => { - trainDiagramData2 = data; - }); + }catch(error){} + setTimeout(DatalistUpdate, 60000); + } + DatalistUpdate(); + + + let trainDiagramData2 = {}; + const TrainDiagramData2Update = () =>{ + try{ + fetch("https://n8n.haruk.in/webhook/JR-shikoku-diagram-migrate-original") + .then((response) => response.json()) + .then((res)=>res.data) + .then((res) => { + const data = {}; + res.forEach((d) => { + const keys = Object.keys(d); + data[keys] = d[keys]; + }); + return data; + }) + .then((data) => { + if(!_.isEqual(data, trainDiagramData2)) { + trainDiagramData2 = data; + setReload(); + } + }); + }catch(error){} + setTimeout(TrainDiagramData2Update, 60000); + } + TrainDiagramData2Update(); + let probremsData = []; - fetch("https://n8n.haruk.in/webhook/jrshikoku-position-problems").then((response) => response.json()).then((data) => { - probremsData = data.data; - }); + + const getProblemsData = () =>{ + try{ + fetch("https://n8n.haruk.in/webhook/jrshikoku-position-problems").then((response) => response.json()).then((data) => { + if(!_.isEqual(data, probremsData)) { + probremsData = data.data; + setReload(); + } + }); + }catch(error){} + setTimeout(getProblemsData, 30000); + } + getProblemsData(); + const setReload = () =>{ try{ document.getElementById('refreshIcon').click(); - fetch("https://n8n.haruk.in/webhook/jrshikoku-position-problems").then((response) => response.json()).then((data) => { - probremsData = data.data; - }); setStrings(); }catch(error){} - setTimeout(setReload, 10000); + }; + const useAutoReload = () =>{ + try{ + setReload(); + }catch(error){} + setTimeout(useAutoReload, 10000); } - setReload(); + useAutoReload(); `; // 左か右かを判定してアイコンを設置する const trainIcon = ` @@ -458,432 +507,6 @@ export const injectJavascriptData: InjectJavascriptData = ( case "8077": return "https://storage.haruk.in/ef210a.png"; - // // 普通列車系統、6000系運用 - // //61運用 - // case "1213M": - // case "1214M": - // case "143M": - // case "147M": - // //62運用 - // case "114M": - // //961運用 - // case "143M": - // case "147M": - // //962運用 - // case "114M": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s6000p.png',hasProblem); - // break; - - // // 土讃線普通列車系統(include ごな線) - // // ごな線 - // case "5851D": //219D併結 [ToDo: 219Dとの分割対策] - // case "5854D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640jgr.png',hasProblem); - // break; - - // //JR車両乗り入れ運用 - // case "5858D": - // case "5869D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem); - // break; - // //併結運用の併結される側 [ToDo: 分割対策] - // case "5845D": - // case "5851D": - // case "5818D": - // case "5820D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640.png',hasProblem); - // break; - // // 土讃線単体列車のキハ32運用 - // case "715D": - // case "718D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32ns.png',hasProblem); - // break; - - // // サンライズに伴う気動車代走 - // case "6219D": - // case "6222D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem); - // break; - // // それ以外の土讃線ごな線直通列車 - // case "5811D": - // case "5813D": - // case "5815D": - // case "5817D": - // case "5843D": - // case "5853D": - // case "5855D": - // case "5859D": - // case "5861D": - // case "5865D": - // case "5881D": - // case "5885D": - // case "5889D": - - // case "5812D": - // case "5814D": - // case "5816D": - // case "5852D": - // case "5856D": - // case "5860D": - // case "5862D": - // case "5872D": - // case "5874D": - // case "5876D": - // case "5880D": - // case "5882D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640.png',hasProblem); - // break; - // // それ以外の土讃線普通列車(1000) - // case "4210D": - // case "4212D": - // case "4214D": - // case "4218D": - // case "4220D": - // case "4222D": - // case "4224D": - // case "4226D": - // case "4228D": - // case "4230D": - // case "4232D": - // case "4234D": - // case "4236D": - // case "4238D": - // case "4240D": - // case "4242D": - // case "4244D": - // case "4250D": - // case "4252D": - // case "4254D": - // case "4256D": - - // case "4211D": - // case "4221D": - // case "4223D": - // case "4225D": - // case "4227D": - // case "4229D": - // case "4231D": - // case "4235D": - // case "4237D": - // case "4239D": - // case "4241D": - // case "4245D": - // case "4247D": - // case "4249D": - // case "4251D": - // case "4253D": - // case "4255D": - // case "4257D": - // case "4259D": - // case "4261D": - - // case "4710D": - // case "4726D": - // case "4730D": - // case "4732D": - // case "4734D": - // case "4738D": - // case "4740D": - // case "4742D": - // case "4744D": - // case "4746D": - // case "4752D": - // case "4756D": - // case "4762D": - // case "4764D": - // case "4766D": - - // case "4711D": - // case "4713D": - // case "4723D": - // case "4725D": - // case "4727D": - // case "4729D": - // case "4731D": - // case "4737D": - // case "4739D": - // case "4745D": - // case "4753D": - // case "4755D": - // case "4759D": - // case "4761D": - // case "4763D": - - // case "216D": - // case "238D": - // case "246D": - // case "248D": - - // case "213D": - // case "215D": - // case "217D": - // case "219D": - // case "233D": - // case "243D": - - // case "710D": - // case "712D": - // case "714D": - // case "716D": - // case "720D": - // case "722D": - // case "724D": - // case "728D": - // case "736D": - // case "748D": - // case "750D": - // case "754D": - // case "758D": - // case "760D": - // case "768D": - - // case "717D": - // case "719D": - // case "721D": - // case "733D": - // case "735D": - // case "737D": - // case "741D": - // case "743D": - // case "747D": - // case "749D": - // case "751D": - // case "755D": - // case "757D": - // case "761D": - - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem); - // break; - // // 予讃線/土讃線普通列車運用(7000,7200) - // // 下り列車(伊予西条-松山は全て7000系) - - // case "5519M": - // case "5525M": - // case "5215M": - // case "5103M": - // case "107M": - // case "1219M": - // case "5109M": - // case "6109M": - // case "5531M": - // case "1221M": - // case "5225M": - // case "5111M": - // case "1227M": - // case "115M": - // case "5229M": - // case "5117M": - // case "5119M": - // case "119M": - // case "5231M": - // case "4537M": - // case "5233M": - // case "123M": - // case "125M": - // case "5235M": - // case "5239M": - // case "5547M": - // case "129M": - // case "5241M": - // case "5133M": - // case "135M": - // case "1243M": - // case "137M": - // case "5139M": - // case "4559M": - // case "1245M": - // case "141M": - // case "1247M": - // case "5249M": - // case "145M": - // case "5253M": - // case "5149M": - // case "5255M": - // case "151M": - // case "5257M": - // case "153M": - // case "5259M": - // case "155M": - // case "1263M": - // case "157M": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem); - // break; - // // 下り7000系 - // case "101M": - // case "4601M": - // case "4113M": - // case "121M": - // case "127M": - // case "131M": - // case "555M": - // case "4565M": - // case "159M": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem); - // break; - // // 上り列車 7200系 - // case "5102M": - // case "104M": - // case "5210M": - // case "5108M": - // case "4108M": - // case "110M": - // case "112M": - // case "118M": - // case "5218M": - // case "5120M": - // case "5220M": - // case "5512M": - // case "1602M": - // case "1224M": - // case "5124M": - // case "5226M": - // case "5126M": - // case "5128M": - // case "1230M": - // case "4128M": - // case "130M": - // case "4522M": - // case "5232M": - // case "132M": - // case "5234M": - // case "136M": - // case "5236M": - // case "5140M": - // case "5238M": - // case "5240M": - // case "142M": - // case "4530M": - // case "144M": - // case "5242M": - // case "146M": - // case "5244M": - // case "4148M": - // case "1246M": - // case "150M": - // case "5538M": - // case "5152M": - // case "154M": - // case "156M": - // case "1252M": - // case "158M": - // case "4604M": - // case "548M": - // case "5254M": - // case "1606M": - // case "5160M": - // case "5256M": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem); - // break; - // // 上り7000系 - // case "114M": - // case "122M": - // case "134M": - // case "4138M": - // case "138M": - // case "4542M": - // case "162M": - // case "4166M": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem); - // break; - // // 松山界隈気動車運用 - // // 上り下りの概念アリ - // // キハ32 通常運用 - // case "4625D": - // case "4916D": - // case "925D": - // case "4618D": - // case "4913D": - // case "4918D": - // case "4643D": - // case "4654D": - // case "4657D": - // case "4928D": - // case "4667D": - // case "653D": - // case "3621D": - // case "4818D": - // case "4821D": - // case "4824D": - // case "4813D": - // case "4664D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32s.png',hasProblem); - // break; - // // 河童うようよ号偶数 - // case "4816D": - // case "4830D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32kpuy2.png',hasProblem); - // break; - // // 河童うようよ号奇数 - // case "4827D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32kpuy1.png',hasProblem); - // break; - // // 新幹線偶数 - // case "4810D": - // case "4822D": - // case "4826D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32tht.png',hasProblem); - // break; - // // 新幹線奇数 - // case "4817D": - // case "4823D": - // case "4829D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32thtk.png',hasProblem); - // break; - // // キハ54 通常運用 - // case "4632D": - // case "4634D": - // case "4921D": - // case "4926D": - // case "4927D": - // case "912D": - // case "4917D": - // case "4641D": - // case "4652D": - // case "4651D": - // case "4666D": - // case "4820D": - // case "4825D": - // case "4828D": - // case "4811D": - // case "4640D": - // case "622D": - // case "4633D": - // case "4920D": - // case "4637D": - // case "4648D": - // case "620D": - // case "4627D": - // case "4624D": - // case "4915D": - // case "4924D": - // case "4649D": - // case "4812D": - // case "4815D": - // case "4659D": - // case "4658D": - // case "4665D": - // case "4914D": - // case "4626D": - // case "4631D": - // case "4636D": - // case "4919D": - // case "4922D": - // case "4923D": - // case "4663D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s54s.png',hasProblem); - // break; - // // 54しまんとろっこ - // case "4623D": - // case "8814D": - // case "8819D": - // case "4662D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s54to0ys.png',hasProblem); - // break; - // // キハ185 通常運用 - // case "911D": - // case "628D": - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185cm.png',hasProblem); - // break; // 伊予灘ものがたり 赤 case "8091D": case "8093D": @@ -1005,15 +628,6 @@ export const injectJavascriptData: InjectJavascriptData = ( } else if (new RegExp(/^9(5|6|7|8)\\dD$/).test(列番データ)) { return "https://storage.haruk.in/s1500.png"; } - // 牟岐線普通列車系統 一旦閉鎖 - // else if(new RegExp(/^(4|5)5\\d\\dD$/).test(列番データ)){ - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem); - // break; - // } - // else if(new RegExp(/^5\\d\\dD$/).test(列番データ)){ - // setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem); - // break; - // } break; } } @@ -1061,6 +675,7 @@ export const injectJavascriptData: InjectJavascriptData = ( let viaData = ""; let ToData = ""; let TrainNumber = 列番データ; + let isEdit = false; try{ const diagram = trainDiagramData2[列番データ] || trainTimeInfo[列番データ]; @@ -1265,7 +880,7 @@ export const injectJavascriptData: InjectJavascriptData = ( getThrew(列番データ); if(trainDataList.find(e => e.id === 列番データ) !== undefined){ const data = trainDataList.find(e => e.id === 列番データ); - //{id,isWanman,trainName,viaData,ToData,TrainNumber,JRF,type,infoUrl,trainNumDistance,info,infogram} + //{id,isWanman,trainName,viaData,ToData,TrainNumber,JRF,type,infoUrl,trainNumDistance,info,infogram,isEdit} trainType = (()=>{ switch(data.type){ case "Normal": @@ -1288,7 +903,7 @@ export const injectJavascriptData: InjectJavascriptData = ( return "寝台特急"; case "SPCL": case "SPCL_Normal": - trainTypeColor = "#000000ff"; + trainTypeColor = "#008d07ff"; return "臨時"; case "SPCL_Rapid": trainTypeColor = "rgba(0, 81, 255, 1)"; @@ -1300,16 +915,17 @@ export const injectJavascriptData: InjectJavascriptData = ( trainTypeColor = "#00869ecc"; return "貨物"; case "Forwarding": - trainTypeColor = "black"; + trainTypeColor = "#727272cc"; return "回送"; case "FreightForwarding": - trainTypeColor = "black"; + trainTypeColor = "#727272cc"; return "単機回送"; default: return ""; } })(); isWanman = data.isWanman; + isEdit = data.isEdit; if(data.trainName != ""){ trainName = data.trainName; if(data.trainNumDistance != null){ @@ -1369,7 +985,7 @@ export const injectJavascriptData: InjectJavascriptData = ( const gradient = getColors.length > 1 ? "linear-gradient(130deg, " + getColors[0] + " 0%, "+ getColors[0]+"50%, "+ getColors[1]+"50%, " + getColors[1] + " 100%)" : getColors[0]; - 行き先情報.insertAdjacentHTML('beforebegin', "

" + TrainNumber + (JRF ? "":"レ") + "

" + (isWanman ? "ワンマン " : "") + "

" + viaData + "

" + trainName + "

" + (ToData ? ToData + "行" : ToData) + "

" + trainType + "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); + 行き先情報.insertAdjacentHTML('beforebegin', "
"+( isEdit ? "
" : "")+"

" + TrainNumber + (JRF ? "":"レ") + "

" + (isWanman ? "ワンマン " : "") + "

" + viaData + "

" + trainName + "

" + (ToData ? ToData + "行" : ToData) + "

" + trainType + "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); `: ` 行き先情報.insertAdjacentHTML('beforebegin', "

" + returnText1 + "

"); 行き先情報.insertAdjacentHTML('beforebegin', "

" + (ToData ? ToData + "行 " : ToData) + "

" + TrainNumber + (JRF ? "":"レ") + "

"); @@ -1408,7 +1024,7 @@ const setNewTrainItem = (element,hasProblem,type)=>{ break; case "SPCL": case "SPCL_Normal": - element.style.borderColor = "#000000ff"; + element.style.borderColor = "#008d07ff"; break; case "SPCL_Rapid": element.style.borderColor = "rgba(0, 81, 255, 1)"; @@ -1420,10 +1036,10 @@ const setNewTrainItem = (element,hasProblem,type)=>{ element.style.borderColor = "#00869ecc"; break; case "Forwarding": - element.style.borderColor = "black"; + element.style.borderColor = "#727272cc"; break; case "FreightForwarding": - element.style.borderColor = "black"; + element.style.borderColor = "#727272cc"; break; default: element.style.borderColor = 'black'; @@ -1518,10 +1134,13 @@ const setStrings = () =>{ i.style.position = "unset"; i.style.display = "flex"; i.style.flexDirection = "column"; + i.style.alignItems = "center"; + i.style.justifyContent = "center"; i.style.flex = "1"; i.style.backgroundColor = "#00000000"; i.querySelectorAll(":scope > *").forEach(j=>{ - j.style.width = "100%"; + j.style.display = "flex"; + j.style.flex = "1"; j.style.textAlign = "center"; j.style.margin = "5px"; j.style.padding = "5px"; diff --git a/stateBox/useAllTrainDiagram.js b/stateBox/useAllTrainDiagram.js index 2ed4173..06e3a92 100644 --- a/stateBox/useAllTrainDiagram.js +++ b/stateBox/useAllTrainDiagram.js @@ -1,10 +1,11 @@ import trainList from "@/assets/originData/trainList"; +import useInterval from "@/lib/useInterval"; import { AS } from "@/storageControl"; import React, { createContext, useContext, useEffect, useState } from "react"; const initialState = { allTrainDiagram: undefined, setAllTrainDiagram: () => {}, - allCustonTrainData: [], + allCustomTrainData: [], }; const AllTrainDiagramContext = createContext(initialState); @@ -13,13 +14,14 @@ export const useAllTrainDiagram = () => useContext(AllTrainDiagramContext); export const AllTrainDiagramProvider = ({ children }) => { const [allTrainDiagram, setAllTrainDiagram] = useState(trainList); - const [allCustonTrainData, setAllCustonTrainData] = useState([]); // カスタム列車データ + const [allCustomTrainData, setAllCustomTrainData] = useState([]); // カスタム列車データ const [keyList, setKeyList] = useState(); // 第二要素 - useEffect( - () => allTrainDiagram && setKeyList(Object.keys(allTrainDiagram)), - [allTrainDiagram] - ); useEffect(() => { + if (allTrainDiagram && Object.keys(allTrainDiagram).length > 0) + setKeyList(Object.keys(allTrainDiagram)); + else setKeyList([]); + }, [allTrainDiagram]); + const getTrainDiagram = () => fetch("https://n8n.haruk.in/webhook/JR-shikoku-diagram-migrate-original") .then((res) => res.json()) .then((res) => res.data) @@ -42,25 +44,35 @@ export const AllTrainDiagramProvider = ({ children }) => { alert("初回の路線情報の取得に失敗しました。"); }); }); - }, []); + useEffect(() => { - // カスタム列車データの取得 + getTrainDiagram(); + }, []); + useInterval(getTrainDiagram, 30000); //30秒毎に全在線列車取得 + + const getCustomTrainData = () => { fetch("https://n8n.haruk.in/webhook/jr-shikoku-position-custom-datalist") .then((res) => res.json()) .then((res) => { - setAllCustonTrainData(res[0].data); + setAllCustomTrainData(res[0].data); }) .catch(() => { alert("カスタム列車データの取得に失敗しました。"); }); + }; + + useEffect(() => { + // カスタム列車データの取得 + getCustomTrainData(); }, []); + useInterval(getCustomTrainData, 30000); // 30秒毎にカスタム列車データ取得 return ( diff --git a/stateBox/useAreaInfo.js b/stateBox/useAreaInfo.js index bdc9a0f..cc9df4d 100644 --- a/stateBox/useAreaInfo.js +++ b/stateBox/useAreaInfo.js @@ -378,7 +378,9 @@ export const AreaInfoProvider = ({ children }) => { ); }); }; - useEffect(getAreaData, []); + useEffect(() => { + getAreaData(); + }, []); useInterval(getAreaData, 60000); //60秒毎に全在線列車取得 return ( { webview.current?.injectJavaScript(i); }; - useEffect(getCurrentTrain, []); //初回だけ現在の全在線列車取得 + useEffect(() => { + getCurrentTrain(); + }, []); //初回だけ現在の全在線列車取得 useInterval(getCurrentTrain, 15000); //15秒毎に全在線列車取得 diff --git a/stateBox/useUserPosition.tsx b/stateBox/useUserPosition.tsx index 2b4cb83..724d5bf 100644 --- a/stateBox/useUserPosition.tsx +++ b/stateBox/useUserPosition.tsx @@ -58,7 +58,9 @@ export const UserPositionProvider: FC = ({ children }) => { if (Platform.OS == "web") return; getLocationPermission(); }, []); - useEffect(getCurrentPosition, [locationStatus]); + useEffect(() => { + getCurrentPosition(); + }, [locationStatus]); useInterval(getCurrentPosition, 5000); return (