From 4784899a07e87434a0a2d27b671114fc1a63b9a6 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Tue, 6 Feb 2024 15:19:07 +0900 Subject: [PATCH 01/27] =?UTF-8?q?=E7=94=BB=E5=83=8F=E5=85=B1=E6=9C=89?= =?UTF-8?q?=E6=A9=9F=E8=83=BD=E3=82=92=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/JRSTraInfo.js | 210 +++++++++++------- package.json | 2 + yarn.lock | 46 ++++ 3 files changed, 180 insertions(+), 78 deletions(-) diff --git a/components/ActionSheetComponents/JRSTraInfo.js b/components/ActionSheetComponents/JRSTraInfo.js index 05c2123..03bb430 100644 --- a/components/ActionSheetComponents/JRSTraInfo.js +++ b/components/ActionSheetComponents/JRSTraInfo.js @@ -12,6 +12,8 @@ import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; import ActionSheet, { useScrollHandlers } from "react-native-actions-sheet"; import LottieView from "lottie-react-native"; import { useSafeAreaInsets } from "react-native-safe-area-context"; +import ViewShot from "react-native-view-shot"; +import * as Sharing from "expo-sharing"; import { useTrainDelayData } from "../../stateBox/useTrainDelayData"; export const JRSTraInfo = () => { const { getTime, delayData, loadingDelayData, setLoadingDelayData } = @@ -19,6 +21,20 @@ export const JRSTraInfo = () => { const actionSheetRef = useRef(null); const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); const insets = useSafeAreaInsets(); + const viewShot = useRef(null); + + const onCapture = async () => { + const url = await viewShot.current.capture(); + + const ok = await Sharing.isAvailableAsync(); + if (ok) { + await Sharing.shareAsync( + "file://" + url, + (options = { mimeType: "image/jpeg", dialogTitle: "Share this image" }) + ); + } + }; + return ( { borderWidth: 1, }} > - + - - - - 列車遅延速報EX - - - {/* {doFetch()}}> - 最新の情報へ更新 - */} - - {getTime - ? getTime.toLocaleTimeString("ja-JP").split(":")[0] + - ":" + - getTime.toLocaleTimeString("ja-JP").split(":")[1] - : NaN}{" "} - - { - LayoutAnimation.easeInEaseOut(), setLoadingDelayData(true); - }} - /> - - + style={{ height: 26, width: "100%", backgroundColor: "#0099CC" }} + > + + - {loadingDelayData ? ( - - - - ) : delayData ? ( - delayData.map((d) => { - let data = d.split(" "); - return ( - - - {data[0].replace("\n", "")} - - {data[1]} - {data[3]} - - ); - }) - ) : ( - 現在、5分以上の遅れはありません。 - )} + + 列車遅延速報EX + + + {/* {doFetch()}}> + 最新の情報へ更新 + */} + + {getTime + ? getTime.toLocaleTimeString("ja-JP").split(":")[0] + + ":" + + getTime.toLocaleTimeString("ja-JP").split(":")[1] + : NaN}{" "} + + { + LayoutAnimation.easeInEaseOut(), setLoadingDelayData(true); + }} + /> + + + {loadingDelayData ? ( + + + + ) : delayData ? ( + delayData.map((d) => { + let data = d.split(" "); + return ( + + + {data[0].replace("\n", "")} + + {data[1]} + {data[3]} + + ); + }) + ) : ( + 現在、5分以上の遅れはありません。 + )} + - - - 列車遅延情報EXについて - - - 列車遅延情報をJR四国公式列車運行情報より5分毎に取得します。Twitterにて投稿している内容と同一のものとなります。 - - + + + 列車遅延情報EXについて + + + 列車遅延情報をJR四国公式列車運行情報より5分毎に取得します。Twitterにて投稿している内容と同一のものとなります。 + + + + + { margin: 10, borderRadius: 5, alignItems: "center", + backgroundColor: "#0099CC", + flex: 1, }} onPress={() => Linking.openURL("https://mstdn.y-zu.org/@JRSTraInfoEX") @@ -140,14 +178,30 @@ export const JRSTraInfo = () => { - MastodonBOTはこちら! + MastodonBOT - - → - - + + + + ); diff --git a/package.json b/package.json index 483733c..bb9b5d2 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "expo-font": "~11.4.0", "expo-location": "~16.1.0", "expo-notifications": "~0.20.1", + "expo-sharing": "~11.5.0", "expo-updates": "~0.18.17", "expo-web-browser": "~12.3.2", "firebase": "8.2.3", @@ -45,6 +46,7 @@ "react-native-svg": "13.9.0", "react-native-svg-uri": "^1.2.3", "react-native-vector-icons": "^8.1.0", + "react-native-view-shot": "3.7.0", "react-native-webview": "^13.6.3" }, "devDependencies": { diff --git a/yarn.lock b/yarn.lock index 25ac5f9..f14e0f2 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3439,6 +3439,11 @@ balanced-match@^1.0.0: resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" integrity sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw== +base64-arraybuffer@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz#1c37589a7c4b0746e34bd1feb951da2df01c1bdc" + integrity sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ== + base64-js@^1.1.2, base64-js@^1.2.3, base64-js@^1.3.1, base64-js@^1.5.1: version "1.5.1" resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.5.1.tgz#1b1b440160a5bf7ad40b650f095963481903930a" @@ -4202,6 +4207,13 @@ crypto-random-string@^2.0.0: resolved "https://registry.yarnpkg.com/crypto-random-string/-/crypto-random-string-2.0.0.tgz#ef2a7a966ec11083388369baa02ebead229b30d5" integrity sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA== +css-line-break@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/css-line-break/-/css-line-break-2.1.0.tgz#bfef660dfa6f5397ea54116bb3cb4873edbc4fa0" + integrity sha512-FHcKFCZcAha3LwfVBhCQbW2nCNbkZXn7KVUJcsT5/P8YmfsVja0FMPJr0B903j/E69HUphKiV9iQArX8SDYA4w== + dependencies: + utrie "^1.0.2" + css-select@^5.1.0: version "5.1.0" resolved "https://registry.yarnpkg.com/css-select/-/css-select-5.1.0.tgz#b8ebd6554c3637ccc76688804ad3f6a6fdaea8a6" @@ -4881,6 +4893,11 @@ expo-notifications@~0.20.1: fs-extra "^9.1.0" uuid "^3.4.0" +expo-sharing@~11.5.0: + version "11.5.0" + resolved "https://registry.yarnpkg.com/expo-sharing/-/expo-sharing-11.5.0.tgz#a8cad65874d882b7f75b12856b4ef55ea9b60a2d" + integrity sha512-uerM5YH1FKDZXfkP9ORebvlMVOPP/AfoYgYBez6a8G9fztNYHnRCA6mgK+3aQmpnb3ltmjnAZC39kH18bTNcVw== + expo-structured-headers@~3.3.0: version "3.3.0" resolved "https://registry.yarnpkg.com/expo-structured-headers/-/expo-structured-headers-3.3.0.tgz#9f0b041a1d243a22a4a23d9eb19f02ace3c5258c" @@ -5653,6 +5670,14 @@ hosted-git-info@^4.0.1, hosted-git-info@^4.0.2: dependencies: lru-cache "^6.0.0" +html2canvas@^1.4.1: + version "1.4.1" + resolved "https://registry.yarnpkg.com/html2canvas/-/html2canvas-1.4.1.tgz#7cef1888311b5011d507794a066041b14669a543" + integrity sha512-fPU6BHNpsyIhr8yyMpTLLxAbkaK8ArIBcmZIRiBLiDhjeqvXolaEmDGmELFuX9I4xDcaKKcJl+TKZLqruBbmWA== + dependencies: + css-line-break "^2.1.0" + text-segmentation "^1.0.3" + http-cache-semantics@^4.1.0: version "4.1.1" resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.1.tgz#abe02fcb2985460bf0323be664436ec3476a6d5a" @@ -8858,6 +8883,13 @@ react-native-vector-icons@^8.1.0: prop-types "^15.7.2" yargs "^16.1.1" +react-native-view-shot@3.7.0: + version "3.7.0" + resolved "https://registry.yarnpkg.com/react-native-view-shot/-/react-native-view-shot-3.7.0.tgz#0c773500e7aac5d115a9dee3b83fa5156c950ed0" + integrity sha512-tQruLNjs7Ee/p6xUgJqF6glnatHaq/UqaIQ6KdYIFG0+XpUZdhqmEM4WMLsYfayfFEhdlF86G1S3eXMOfDNzFg== + dependencies: + html2canvas "^1.4.1" + react-native-webview@^13.6.3: version "13.6.3" resolved "https://registry.yarnpkg.com/react-native-webview/-/react-native-webview-13.6.3.tgz#f3d26e942ef5cc5a07547f2e47903aa81a68e25e" @@ -9913,6 +9945,13 @@ terser@^5.15.0: commander "^2.20.0" source-map-support "~0.5.20" +text-segmentation@^1.0.3: + version "1.0.3" + resolved "https://registry.yarnpkg.com/text-segmentation/-/text-segmentation-1.0.3.tgz#52a388159efffe746b24a63ba311b6ac9f2d7943" + integrity sha512-iOiPUo/BGnZ6+54OsWxZidGCsdU8YbE4PSpdPinp7DeMtUJNJBoJ/ouUSTJjHkh1KntHaltHl/gDs2FC4i5+Nw== + dependencies: + utrie "^1.0.2" + text-table@^0.2.0, text-table@~0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4" @@ -10267,6 +10306,13 @@ utils-merge@1.0.1: resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713" integrity sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA== +utrie@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/utrie/-/utrie-1.0.2.tgz#d42fe44de9bc0119c25de7f564a6ed1b2c87a645" + integrity sha512-1MLa5ouZiOmQzUbjbu9VmjLzn1QLXBhwpUa7kdLUQK+KQ5KA9I1vk5U4YHe/X2Ch7PYnJfWuWT+VbuxbGwljhw== + dependencies: + base64-arraybuffer "^1.0.2" + uuid@9.0.0: version "9.0.0" resolved "https://registry.yarnpkg.com/uuid/-/uuid-9.0.0.tgz#592f550650024a38ceb0c562f2f6aa435761efb5" From b551c7506125fdea407dda4e5fbbf9cc3492aebd Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Tue, 6 Feb 2024 16:02:23 +0900 Subject: [PATCH 02/27] =?UTF-8?q?=E5=81=9C=E8=BB=8A=E9=A7=85=E6=83=85?= =?UTF-8?q?=E5=A0=B1=E7=AD=89=E3=82=92sticky-header=E3=81=AB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 107 +++++++++--------- 1 file changed, 53 insertions(+), 54 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index e88a619..0c961c5 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -67,9 +67,6 @@ export const EachTrainInfo = (props) => { showNearTrain.forEach((d) => { const [station, se, time] = d.split(","); - console.log(trainData); //trainDataは現在の列車の停車駅リスト - console.log(station); //showNearTrainは裏列車の停車駅リスト - console.log(trainData[0]); if (station == trainData[0].split(",")[0]) setHeadStation(trainData[0].split(",")[0]); if (station == trainData[trainData.length - 1].split(",")[0]) @@ -556,57 +553,6 @@ export const EachTrainInfo = (props) => { */} )} - - - 停車駅 - - - {!isNaN(currentTrainData?.delay) && - currentTrainData?.delay != 0 && ( - - (定刻) - - )} - - 見込 - - - - - { ), backgroundColor: "white", }} + stickyHeaderIndices={[0]} > + + + 停車駅 + + + {!isNaN(currentTrainData?.delay) && + currentTrainData?.delay != 0 && ( + + (定刻) + + )} + + 見込 + + + + + {headStation && !isConcatNear && ( openBackTrainInfo(headStation)} From 32e61a824bfe061a402b2a2f9f142574c08f92cc Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Tue, 6 Feb 2024 16:19:30 +0900 Subject: [PATCH 03/27] =?UTF-8?q?EachTrainInfo=E3=82=92=E3=82=B3=E3=83=B3?= =?UTF-8?q?=E3=83=9D=E3=83=BC=E3=83=8D=E3=83=B3=E3=83=88=E3=83=95=E3=82=A1?= =?UTF-8?q?=E3=82=A4=E3=83=AB=E5=88=86=E5=89=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 269 +----------------- .../EachTrainInfo/DataFromButton.js | 36 +++ .../EachTrainInfo/EachStopList.js | 137 +++++++++ .../EachTrainInfo/StateBox.js | 32 +++ .../EachTrainInfo/TrainDataView.js | 74 +++++ 5 files changed, 283 insertions(+), 265 deletions(-) create mode 100644 components/ActionSheetComponents/EachTrainInfo/DataFromButton.js create mode 100644 components/ActionSheetComponents/EachTrainInfo/EachStopList.js create mode 100644 components/ActionSheetComponents/EachTrainInfo/StateBox.js create mode 100644 components/ActionSheetComponents/EachTrainInfo/TrainDataView.js diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 0c961c5..829d91a 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -21,13 +21,15 @@ import { heightPercentageToDP, widthPercentageToDP, } from "react-native-responsive-screen"; -import lineColorList from "../../assets/originData/lineColorList"; import { useCurrentTrain } from "../../stateBox/useCurrentTrain"; import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData"; import dayjs from "dayjs"; import { getTrainType } from "../../lib/getTrainType"; import { customTrainDataDetector } from "../custom-train-data"; import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; +import { EachStopList } from "./EachTrainInfo/EachStopList"; +import { DataFromButton } from "./EachTrainInfo/DataFromButton"; +import { TrainDataView } from "./EachTrainInfo/TrainDataView"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; @@ -647,7 +649,7 @@ export const EachTrainInfo = (props) => { i.split(",")[1] == "提" ? ( ) : ( - { ); }; - -const DataFromButton = ({ i }) => { - const [station, se, time] = i.split(","); - return ( - Linking.openURL(time)} - key={station} - > - - - {station} - - - 提供元 - - - - - - ); -}; - -const StationButton = ({ - i, - index, - stationList, - points, - currentTrainData, - openStationACFromEachTrainInfo, -}) => { - const [station, se, time] = i.split(","); // 阿波池田,発,6:21 - const Stations = stationList - .map((a) => a.filter((d) => d.StationName == station)) - .reduce((newArray, e) => newArray.concat(e), []); - /*Array [ - Object { - "StationName": "佐古", - "StationNumber": "T01", - }, - Object { - "StationName": "佐古", - "StationNumber": "B01", - }, - ] */ - const StationNumbers = - Stations && - Stations.filter((d) => d.StationNumber).map((d) => d.StationNumber); - // Array [ "T01", "B01",] - const lineIDs = []; - const EachIDs = []; - StationNumbers.forEach((d) => { - const textArray = d.split(""); - lineIDs.push(textArray.filter((s) => "A" < s && s < "Z").join("")); - EachIDs.push(textArray.filter((s) => "0" <= s && s <= "9").join("")); - }); - // Array [ "T", "B",] - // Array [ "01", "01",] - - const dates = dayjs() - .set("hour", parseInt(time.split(":")[0])) - .set("minute", parseInt(time.split(":")[1])) - .add(isNaN(currentTrainData?.delay) ? 0 : currentTrainData.delay, "minute"); - const timeString = dates.format("HH:mm").split(":"); - - return ( - openStationACFromEachTrainInfo(station)} - key={station} - > - - - {lineIDs.map((lineID, index) => ( - - - - {lineIDs[index]} - {"\n"} - {EachIDs[index]} - - - - ))} - - - {station} - - {points && points.findIndex((d) => d == index) >= 0 ? ( - 🚊 - ) : null} - {!isNaN(currentTrainData?.delay) && currentTrainData?.delay != 0 && ( - - {time} - - )} - - {timeString[0]}:{timeString[1]} - - - {se?.replace("発", "出発").replace("着", "到着")} - - - - - ); -}; - -const TrainDataView = ({ - currentTrainData, - currentPosition, - nearTrainIDList, - openTrainInfo, -}) => { - return ( - - - - - - - { - if (nearTrainIDList.length == 0) return; - openTrainInfo(nearTrainIDList[0]); - }} - > - {nearTrainIDList.length == 0 ? ( - - ) : ( - - )} - - - - ); -}; - -const StateBox = ({ text, title, style }) => ( - - {title} - - - {text?.match("~") ? ( - <> - {text.split("~")[0]} - - {text.split("~")[1]} - - ) : ( - {text} - )} - - -); -const boxStyle = { - flex: 1, - backgroundColor: "white", - borderRadius: 10, - padding: 10, - margin: 10, -}; -const boxTextStyle = { - fontSize: 25, - color: "#0099CC", - textAlign: "right", -}; diff --git a/components/ActionSheetComponents/EachTrainInfo/DataFromButton.js b/components/ActionSheetComponents/EachTrainInfo/DataFromButton.js new file mode 100644 index 0000000..664a8bf --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/DataFromButton.js @@ -0,0 +1,36 @@ +import React from "react"; +import { View, Text, TouchableWithoutFeedback } from "react-native"; +import { MaterialCommunityIcons } from "@expo/vector-icons"; +import { Linking } from "react-native"; +export const DataFromButton = ({ i }) => { + const [station, se, time] = i.split(","); + return ( + Linking.openURL(time)} + key={station} + > + + + {station} + + + 提供元 + + + + + + ); +}; diff --git a/components/ActionSheetComponents/EachTrainInfo/EachStopList.js b/components/ActionSheetComponents/EachTrainInfo/EachStopList.js new file mode 100644 index 0000000..218a025 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/EachStopList.js @@ -0,0 +1,137 @@ +import React from "react"; +import { View, Text, TouchableWithoutFeedback } from "react-native"; +import dayjs from "dayjs"; +import lineColorList from "../../../assets/originData/lineColorList"; + +export const EachStopList = ({ + i, + index, + stationList, + points, + currentTrainData, + openStationACFromEachTrainInfo, +}) => { + const [station, se, time] = i.split(","); // 阿波池田,発,6:21 + const Stations = stationList + .map((a) => a.filter((d) => d.StationName == station)) + .reduce((newArray, e) => newArray.concat(e), []); + /*Array [ + Object { + "StationName": "佐古", + "StationNumber": "T01", + }, + Object { + "StationName": "佐古", + "StationNumber": "B01", + }, + ] */ + const StationNumbers = + Stations && + Stations.filter((d) => d.StationNumber).map((d) => d.StationNumber); + // Array [ "T01", "B01",] + const lineIDs = []; + const EachIDs = []; + StationNumbers.forEach((d) => { + const textArray = d.split(""); + lineIDs.push(textArray.filter((s) => "A" < s && s < "Z").join("")); + EachIDs.push(textArray.filter((s) => "0" <= s && s <= "9").join("")); + }); + // Array [ "T", "B",] + // Array [ "01", "01",] + + const dates = dayjs() + .set("hour", parseInt(time.split(":")[0])) + .set("minute", parseInt(time.split(":")[1])) + .add(isNaN(currentTrainData?.delay) ? 0 : currentTrainData.delay, "minute"); + const timeString = dates.format("HH:mm").split(":"); + + return ( + openStationACFromEachTrainInfo(station)} + key={station} + > + + + {lineIDs.map((lineID, index) => ( + + + + {lineIDs[index]} + {"\n"} + {EachIDs[index]} + + + + ))} + + + {station} + + {points && points.findIndex((d) => d == index) >= 0 ? ( + 🚊 + ) : null} + {!isNaN(currentTrainData?.delay) && currentTrainData?.delay != 0 && ( + + {time} + + )} + + {timeString[0]}:{timeString[1]} + + + {se?.replace("発", "出発").replace("着", "到着")} + + + + + ); +}; diff --git a/components/ActionSheetComponents/EachTrainInfo/StateBox.js b/components/ActionSheetComponents/EachTrainInfo/StateBox.js new file mode 100644 index 0000000..933b930 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/StateBox.js @@ -0,0 +1,32 @@ +import React from "react"; +import { View, Text } from "react-native"; + +export const StateBox = ({ text, title, style }) => ( + + {title} + + + {text?.match("~") ? ( + <> + {text.split("~")[0]} + + {text.split("~")[1]} + + ) : ( + {text} + )} + + +); +const boxStyle = { + flex: 1, + backgroundColor: "white", + borderRadius: 10, + padding: 10, + margin: 10, +}; +const boxTextStyle = { + fontSize: 25, + color: "#0099CC", + textAlign: "right", +}; diff --git a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js new file mode 100644 index 0000000..a98ca15 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js @@ -0,0 +1,74 @@ +import React from "react"; +import { View, Text, TouchableOpacity } from "react-native"; +import { StateBox } from "./StateBox"; +import { + heightPercentageToDP, + widthPercentageToDP, +} from "react-native-responsive-screen"; + +export const TrainDataView = ({ + currentTrainData, + currentPosition, + nearTrainIDList, + openTrainInfo, +}) => { + return ( + + + + + + + { + if (nearTrainIDList.length == 0) return; + openTrainInfo(nearTrainIDList[0]); + }} + > + {nearTrainIDList.length == 0 ? ( + + ) : ( + + )} + + + + ); +}; From 576d9ae222fef343fff3110fdaf1eeae40f9449d Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Tue, 6 Feb 2024 16:19:54 +0900 Subject: [PATCH 04/27] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=AB=E3=81=AA?= =?UTF-8?q?=E3=81=A3=E3=81=9Fimports=E9=A7=86=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/ActionSheetComponents/EachTrainInfo.js | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 829d91a..233478f 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -3,13 +3,11 @@ import { View, LayoutAnimation, ScrollView, - Linking, Text, TouchableOpacity, - TouchableWithoutFeedback, Platform, } from "react-native"; -import { Ionicons, MaterialCommunityIcons } from "@expo/vector-icons"; +import { Ionicons } from "@expo/vector-icons"; import ActionSheet, { SheetManager, useScrollHandlers, @@ -17,13 +15,9 @@ import ActionSheet, { import { AS } from "../../storageControl"; import trainList from "../../assets/originData/trainList"; import { lineList } from "../../lib/getStationList"; -import { - heightPercentageToDP, - widthPercentageToDP, -} from "react-native-responsive-screen"; +import { heightPercentageToDP } from "react-native-responsive-screen"; import { useCurrentTrain } from "../../stateBox/useCurrentTrain"; import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData"; -import dayjs from "dayjs"; import { getTrainType } from "../../lib/getTrainType"; import { customTrainDataDetector } from "../custom-train-data"; import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; From 49e9ed14bca4fb21a9765ddc8cca1e9226766636 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 7 Feb 2024 00:12:27 +0900 Subject: [PATCH 05/27] =?UTF-8?q?EachTrainInfo=E3=81=AE=E5=8F=AF=E5=A4=89?= =?UTF-8?q?=E3=82=92=E5=AE=9F=E8=A3=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 347 +++++++----------- .../EachTrainInfo/DynamicHeader.js | 274 ++++++++++++++ .../EachTrainInfo/StateBox.js | 35 +- .../EachTrainInfo/TrainDataView.js | 13 +- 4 files changed, 444 insertions(+), 225 deletions(-) create mode 100644 components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 233478f..97b436b 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -6,6 +6,7 @@ import { Text, TouchableOpacity, Platform, + Animated, } from "react-native"; import { Ionicons } from "@expo/vector-icons"; import ActionSheet, { @@ -24,6 +25,7 @@ import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; import { EachStopList } from "./EachTrainInfo/EachStopList"; import { DataFromButton } from "./EachTrainInfo/DataFromButton"; import { TrainDataView } from "./EachTrainInfo/TrainDataView"; +import { DynamicHeader } from "./EachTrainInfo/DynamicHeader"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; @@ -377,6 +379,8 @@ export const EachTrainInfo = (props) => { }; const actionSheetRef = useRef(null); const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); + + const scrollOffsetY = useRef(new Animated.Value(0)).current; return ( { /> )} - {from == "AllTrainDiagramView" || ( - setActionSheetHorizonalScroll(true)} - //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} - //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} - style={{ - flexDirection: "row", - //width: widthPercentageToDP("200%"), - minHeight: 200, - height: heightPercentageToDP("20%"), - }} - horizontal - pagingEnabled - > - + {from == "AllTrainDiagramView" || ( + - {/* - - - 行先 - - - 岡山 - - + )} - - - 車両案内 - - - - 宇多津でうずしお号と連結 - - - - - - - 編成(使用車両:2700系) - - - - {"[<自][自>][アン自|指>][アン指|G>]"} - - - - */} - - )} - - - 停車駅 - - - {!isNaN(currentTrainData?.delay) && - currentTrainData?.delay != 0 && ( - - (定刻) - - )} - - 見込 - - + + 停車駅 + + + {!isNaN(currentTrainData?.delay) && + currentTrainData?.delay != 0 && ( + + (定刻) + + )} + + 見込 + + + - - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} > - 「本当の始発駅」を表示 - - - )} - {/* + 「本当の始発駅」を表示 + + + )} + {/* { /> ほげほげふがふが */} - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} > - 「本当の終着駅」を表示 - - - )} + + 「本当の終着駅」を表示 + + + )} - - - - + + + + + - - + + ); diff --git a/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js b/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js new file mode 100644 index 0000000..fc2170f --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js @@ -0,0 +1,274 @@ +import * as React from "react"; +import { Text, View, StyleSheet, Animated, ScrollView } from "react-native"; +import { TrainDataView } from "./TrainDataView"; + +const Max_Header_Height = 200; +const Min_Header_Height = 80; +const Scroll_Distance = Max_Header_Height - Min_Header_Height; +export const DynamicHeader = ({ + animHeaderValue, + currentTrainData, + currentPosition, + nearTrainIDList, + openTrainInfo, +}) => { + const animatedHeaderHeight = animHeaderValue.interpolate({ + inputRange: [0, Scroll_Distance], + outputRange: [Max_Header_Height, 0], + extrapolate: "clamp", + }); + const animatedHeaderHeight2 = animHeaderValue.interpolate({ + inputRange: [0, Scroll_Distance], + outputRange: [0, Min_Header_Height], + extrapolate: "clamp", + }); + const animateHeaderBackgroundColor = animHeaderValue.interpolate({ + inputRange: [0, Max_Header_Height - Min_Header_Height], + outputRange: ["blue", "red"], + extrapolate: "clamp", + }); + return ( + <> + + setActionSheetHorizonalScroll(true)} + //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} + //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} + style={{ + flexDirection: "row", + //width: widthPercentageToDP("200%"), + // minHeight: 200, + //height: heightPercentageToDP("20%"), + }} + horizontal + pagingEnabled + > + + {/* + + + 行先 + + + 岡山 + + + + + + 車両案内 + + + + 宇多津でうずしお号と連結 + + + + + + + 編成(使用車両:2700系) + + + + {"[<自][自>][アン自|指>][アン指|G>]"} + + + + */} + + + + setActionSheetHorizonalScroll(true)} + //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} + //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} + style={{ + flexDirection: "row", + flex: 1, + //width: widthPercentageToDP("200%"), + // minHeight: 200, + //height: heightPercentageToDP("20%"), + }} + horizontal + pagingEnabled + > + + {/* + + + 行先 + + + 岡山 + + + + + + 車両案内 + + + + 宇多津でうずしお号と連結 + + + + + + + 編成(使用車両:2700系) + + + + {"[<自][自>][アン自|指>][アン指|G>]"} + + + + */} + + + + ); +}; +const styles = StyleSheet.create({ + header: { + justifyContent: "center", + alignItems: "center", + left: 0, + right: 0, + //paddingTop: 10, + }, + headerText: { + color: "#fff", + fontSize: 25, + fontWeight: "bold", + textAlign: "center", + }, +}); diff --git a/components/ActionSheetComponents/EachTrainInfo/StateBox.js b/components/ActionSheetComponents/EachTrainInfo/StateBox.js index 933b930..c26f41b 100644 --- a/components/ActionSheetComponents/EachTrainInfo/StateBox.js +++ b/components/ActionSheetComponents/EachTrainInfo/StateBox.js @@ -1,19 +1,29 @@ import React from "react"; import { View, Text } from "react-native"; -export const StateBox = ({ text, title, style }) => ( - +export const StateBox = ({ text, title, style, mode }) => ( + {title} - + {text?.match("~") ? ( <> - {text.split("~")[0]} + + {text.split("~")[0]} + - {text.split("~")[1]} + + {text.split("~")[1]} + ) : ( - {text} + {text} )} @@ -25,6 +35,19 @@ const boxStyle = { padding: 10, margin: 10, }; +const boxStyle2 = { + flex: 1, + backgroundColor: "white", + borderRadius: 10, + padding: 5, + margin: 5, +}; +const boxTextStyle2 = { + fontSize: 18, + color: "#0099CC", + textAlign: "right", +}; + const boxTextStyle = { fontSize: 25, color: "#0099CC", diff --git a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js index a98ca15..cf73398 100644 --- a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js +++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js @@ -11,17 +11,20 @@ export const TrainDataView = ({ currentPosition, nearTrainIDList, openTrainInfo, + mode = 0, }) => { return ( - + {nearTrainIDList.length == 0 ? ( - + ) : ( Date: Thu, 8 Feb 2024 19:18:28 +0900 Subject: [PATCH 06/27] =?UTF-8?q?=E6=8C=99=E5=8B=95=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 99 +++++++++++-------- .../EachTrainInfo/DynamicHeader.js | 37 +++++-- 2 files changed, 84 insertions(+), 52 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 97b436b..0151b6f 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -460,13 +460,12 @@ export const EachTrainInfo = (props) => { openTrainInfo={openTrainInfo} /> )} - { > + + - 停車駅 - - - {!isNaN(currentTrainData?.delay) && - currentTrainData?.delay != 0 && ( - - (定刻) - - )} - - 見込 - - + + 停車駅 + + + {!isNaN(currentTrainData?.delay) && + currentTrainData?.delay != 0 && ( + + (定刻) + + )} + + 見込 + + + + {headStation && !isConcatNear && ( openBackTrainInfo(headStation)} diff --git a/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js b/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js index fc2170f..d02dc7b 100644 --- a/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js +++ b/components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js @@ -1,6 +1,10 @@ import * as React from "react"; import { Text, View, StyleSheet, Animated, ScrollView } from "react-native"; import { TrainDataView } from "./TrainDataView"; +import { + heightPercentageToDP, + widthPercentageToDP, +} from "react-native-responsive-screen"; const Max_Header_Height = 200; const Min_Header_Height = 80; @@ -13,28 +17,36 @@ export const DynamicHeader = ({ openTrainInfo, }) => { const animatedHeaderHeight = animHeaderValue.interpolate({ - inputRange: [0, Scroll_Distance], + inputRange: [Min_Header_Height, Scroll_Distance], outputRange: [Max_Header_Height, 0], extrapolate: "clamp", }); const animatedHeaderHeight2 = animHeaderValue.interpolate({ inputRange: [0, Scroll_Distance], - outputRange: [0, Min_Header_Height], + outputRange: [Max_Header_Height, Min_Header_Height], extrapolate: "clamp", }); - const animateHeaderBackgroundColor = animHeaderValue.interpolate({ - inputRange: [0, Max_Header_Height - Min_Header_Height], - outputRange: ["blue", "red"], + const animatedHeaderVisible = animHeaderValue.interpolate({ + inputRange: [Min_Header_Height, Scroll_Distance], + outputRange: [1, 0], + extrapolate: "clamp", + }); + const animatedHeaderVisible2 = animHeaderValue.interpolate({ + inputRange: [Min_Header_Height, Scroll_Distance], + outputRange: [0, 1], extrapolate: "clamp", }); return ( - <> + @@ -145,8 +157,10 @@ export const DynamicHeader = ({ styles.header, { height: animatedHeaderHeight2, - //backgroundColor: animateHeaderBackgroundColor, + backgroundColor: "#0099CC", margin: 0, + top: 0, + opacity: animatedHeaderVisible2, }, ]} > @@ -254,7 +268,7 @@ export const DynamicHeader = ({ */} - + ); }; const styles = StyleSheet.create({ @@ -264,6 +278,9 @@ const styles = StyleSheet.create({ left: 0, right: 0, //paddingTop: 10, + position: "absolute", + zIndex: 1, + backgroundColor: "f0f0f0", }, headerText: { color: "#fff", From 84c050e928b4f738cb048a20a555ebb524b59c2c Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Sun, 11 Feb 2024 20:22:32 +0900 Subject: [PATCH 07/27] =?UTF-8?q?DynamicHeader=E3=82=92=E5=88=86=E5=89=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 345 ++++++++++-------- components/DynamicHeaderScrollView.js | 105 ++++++ 2 files changed, 302 insertions(+), 148 deletions(-) create mode 100644 components/DynamicHeaderScrollView.js diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 0151b6f..8adaca1 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -7,6 +7,7 @@ import { TouchableOpacity, Platform, Animated, + StyleSheet, } from "react-native"; import { Ionicons } from "@expo/vector-icons"; import ActionSheet, { @@ -26,6 +27,7 @@ import { EachStopList } from "./EachTrainInfo/EachStopList"; import { DataFromButton } from "./EachTrainInfo/DataFromButton"; import { TrainDataView } from "./EachTrainInfo/TrainDataView"; import { DynamicHeader } from "./EachTrainInfo/DynamicHeader"; +import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; @@ -450,8 +452,66 @@ export const EachTrainInfo = (props) => { /> )} - - {from == "AllTrainDiagramView" || ( + + ) : ( + setActionSheetHorizonalScroll(true)} + //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} + //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} + style={{ + flexDirection: "row", + flex: 1, + //width: widthPercentageToDP("200%"), + // minHeight: 200, + //height: heightPercentageToDP("20%"), + }} + horizontal + pagingEnabled + > + + + ) + } + longHeader={ + from == "AllTrainDiagramView" ? ( + <> + ) : ( + setActionSheetHorizonalScroll(true)} + //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} + //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} + style={{ + flexDirection: "row", + //width: widthPercentageToDP("200%"), + // minHeight: 200, + //height: heightPercentageToDP("20%"), + }} + horizontal + pagingEnabled + > + + + ) + } + header={ { nearTrainIDList={nearTrainIDList} openTrainInfo={openTrainInfo} /> - )} - + } + topStickyContent={ - - - - - 停車駅 - - - {!isNaN(currentTrainData?.delay) && - currentTrainData?.delay != 0 && ( - - (定刻) - - )} - - 見込 - - - - - - - - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* - ほげほげふがふが */} - - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} - - { flex: 1, }} > - + 停車駅 + + {!isNaN(currentTrainData?.delay) && + currentTrainData?.delay != 0 && ( + + (定刻) + + )} + + 見込 + + + - - + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* + ほげほげふがふが */} + + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} + + + + + + + + ); }; +const styles = StyleSheet.create({ + header: { + justifyContent: "center", + alignItems: "center", + left: 0, + right: 0, + //paddingTop: 10, + position: "absolute", + zIndex: 1, + backgroundColor: "f0f0f0", + }, + headerText: { + color: "#fff", + fontSize: 25, + fontWeight: "bold", + textAlign: "center", + }, +}); diff --git a/components/DynamicHeaderScrollView.js b/components/DynamicHeaderScrollView.js new file mode 100644 index 0000000..e804856 --- /dev/null +++ b/components/DynamicHeaderScrollView.js @@ -0,0 +1,105 @@ +import { ScrollView, View, Animated } from "react-native"; +import React, { useRef } from "react"; + +export const DynamicHeaderScrollView = (props) => { + const { + Max_Header_Height = 200, + Min_Header_Height = 80, + children, + scrollViewProps = {}, + containerProps = {}, + shortHeader = <>, + longHeader = <>, + topStickyContent, + styles, + } = props; + const scrollOffsetY = useRef(new Animated.Value(0)).current; + + const Scroll_Distance = Max_Header_Height - Min_Header_Height; + + const animatedHeaderHeight = scrollOffsetY.interpolate({ + inputRange: [Min_Header_Height, Scroll_Distance], + outputRange: [Max_Header_Height, 0], + extrapolate: "clamp", + }); + const animatedHeaderHeight2 = scrollOffsetY.interpolate({ + inputRange: [0, Scroll_Distance], + outputRange: [Max_Header_Height, Min_Header_Height], + extrapolate: "clamp", + }); + const animatedHeaderVisible = scrollOffsetY.interpolate({ + inputRange: [Min_Header_Height, Scroll_Distance], + outputRange: [1, 0], + extrapolate: "clamp", + }); + const animatedHeaderVisible2 = scrollOffsetY.interpolate({ + inputRange: [Min_Header_Height, Scroll_Distance], + outputRange: [0, 1], + extrapolate: "clamp", + }); + return ( + + + + {longHeader} + + + {shortHeader} + + + + + {topStickyContent && ( + + {topStickyContent} + + )} + {children} + + + ); +}; From 62d7936425cabce86686dbd9cd1d323dadc8d1f5 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Sun, 11 Feb 2024 20:24:06 +0900 Subject: [PATCH 08/27] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=AA=E8=A6=81?= =?UTF-8?q?=E7=B4=A0=E6=95=B4=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 10 - .../EachTrainInfo/DynamicHeader.js | 291 ------------------ 2 files changed, 301 deletions(-) delete mode 100644 components/ActionSheetComponents/EachTrainInfo/DynamicHeader.js diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 8adaca1..8e4aea4 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -26,7 +26,6 @@ import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; import { EachStopList } from "./EachTrainInfo/EachStopList"; import { DataFromButton } from "./EachTrainInfo/DataFromButton"; import { TrainDataView } from "./EachTrainInfo/TrainDataView"; -import { DynamicHeader } from "./EachTrainInfo/DynamicHeader"; import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView"; export const EachTrainInfo = (props) => { @@ -511,15 +510,6 @@ export const EachTrainInfo = (props) => { ) } - header={ - - } topStickyContent={ { - const animatedHeaderHeight = animHeaderValue.interpolate({ - inputRange: [Min_Header_Height, Scroll_Distance], - outputRange: [Max_Header_Height, 0], - extrapolate: "clamp", - }); - const animatedHeaderHeight2 = animHeaderValue.interpolate({ - inputRange: [0, Scroll_Distance], - outputRange: [Max_Header_Height, Min_Header_Height], - extrapolate: "clamp", - }); - const animatedHeaderVisible = animHeaderValue.interpolate({ - inputRange: [Min_Header_Height, Scroll_Distance], - outputRange: [1, 0], - extrapolate: "clamp", - }); - const animatedHeaderVisible2 = animHeaderValue.interpolate({ - inputRange: [Min_Header_Height, Scroll_Distance], - outputRange: [0, 1], - extrapolate: "clamp", - }); - return ( - - - setActionSheetHorizonalScroll(true)} - //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} - //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} - style={{ - flexDirection: "row", - //width: widthPercentageToDP("200%"), - // minHeight: 200, - //height: heightPercentageToDP("20%"), - }} - horizontal - pagingEnabled - > - - {/* - - - 行先 - - - 岡山 - - - - - - 車両案内 - - - - 宇多津でうずしお号と連結 - - - - - - - 編成(使用車両:2700系) - - - - {"[<自][自>][アン自|指>][アン指|G>]"} - - - - */} - - - - setActionSheetHorizonalScroll(true)} - //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} - //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} - style={{ - flexDirection: "row", - flex: 1, - //width: widthPercentageToDP("200%"), - // minHeight: 200, - //height: heightPercentageToDP("20%"), - }} - horizontal - pagingEnabled - > - - {/* - - - 行先 - - - 岡山 - - - - - - 車両案内 - - - - 宇多津でうずしお号と連結 - - - - - - - 編成(使用車両:2700系) - - - - {"[<自][自>][アン自|指>][アン指|G>]"} - - - - */} - - - - ); -}; -const styles = StyleSheet.create({ - header: { - justifyContent: "center", - alignItems: "center", - left: 0, - right: 0, - //paddingTop: 10, - position: "absolute", - zIndex: 1, - backgroundColor: "f0f0f0", - }, - headerText: { - color: "#fff", - fontSize: 25, - fontWeight: "bold", - textAlign: "center", - }, -}); From 1fb471205c30dc71e59506f01afc002ee81bcef4 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Sun, 11 Feb 2024 20:38:28 +0900 Subject: [PATCH 09/27] =?UTF-8?q?=E3=82=B3=E3=83=B3=E3=83=86=E3=83=B3?= =?UTF-8?q?=E3=83=84=E5=88=86=E5=89=B2=E3=80=81=E6=95=B4=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 120 +++--------------- .../EachTrainInfo/LongHeader.js | 33 +++++ .../EachTrainInfo/ScrollStickyContent.js | 57 +++++++++ .../EachTrainInfo/ShortHeader.js | 35 +++++ components/DynamicHeaderScrollView.js | 30 ++--- 5 files changed, 157 insertions(+), 118 deletions(-) create mode 100644 components/ActionSheetComponents/EachTrainInfo/LongHeader.js create mode 100644 components/ActionSheetComponents/EachTrainInfo/ScrollStickyContent.js create mode 100644 components/ActionSheetComponents/EachTrainInfo/ShortHeader.js diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 8e4aea4..c508f9c 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -2,18 +2,13 @@ import React, { useEffect, useState, useRef } from "react"; import { View, LayoutAnimation, - ScrollView, Text, TouchableOpacity, Platform, - Animated, StyleSheet, } from "react-native"; import { Ionicons } from "@expo/vector-icons"; -import ActionSheet, { - SheetManager, - useScrollHandlers, -} from "react-native-actions-sheet"; +import ActionSheet, { SheetManager } from "react-native-actions-sheet"; import { AS } from "../../storageControl"; import trainList from "../../assets/originData/trainList"; import { lineList } from "../../lib/getStationList"; @@ -25,8 +20,10 @@ import { customTrainDataDetector } from "../custom-train-data"; import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; import { EachStopList } from "./EachTrainInfo/EachStopList"; import { DataFromButton } from "./EachTrainInfo/DataFromButton"; -import { TrainDataView } from "./EachTrainInfo/TrainDataView"; import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView"; +import { LongHeader } from "./EachTrainInfo/LongHeader"; +import { ShortHeader } from "./EachTrainInfo/ShortHeader"; +import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; @@ -379,9 +376,6 @@ export const EachTrainInfo = (props) => { .replace("ライナーライナー", "ライナー"); }; const actionSheetRef = useRef(null); - const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); - - const scrollOffsetY = useRef(new Animated.Value(0)).current; return ( { from == "AllTrainDiagramView" ? ( <> ) : ( - setActionSheetHorizonalScroll(true)} - //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} - //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} - style={{ - flexDirection: "row", - flex: 1, - //width: widthPercentageToDP("200%"), - // minHeight: 200, - //height: heightPercentageToDP("20%"), - }} - horizontal - pagingEnabled - > - - + ) } longHeader={ from == "AllTrainDiagramView" ? ( <> ) : ( - setActionSheetHorizonalScroll(true)} - //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} - //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} - style={{ - flexDirection: "row", - //width: widthPercentageToDP("200%"), - // minHeight: 200, - //height: heightPercentageToDP("20%"), - }} - horizontal - pagingEnabled - > - - + ) } topStickyContent={ - - - 停車駅 - - - {!isNaN(currentTrainData?.delay) && - currentTrainData?.delay != 0 && ( - - (定刻) - - )} - - 見込 - - - - - + } > {headStation && !isConcatNear && ( diff --git a/components/ActionSheetComponents/EachTrainInfo/LongHeader.js b/components/ActionSheetComponents/EachTrainInfo/LongHeader.js new file mode 100644 index 0000000..95f23f9 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/LongHeader.js @@ -0,0 +1,33 @@ +import React from "react"; +import { ScrollView } from "react-native"; +import { TrainDataView } from "./TrainDataView"; + +export const LongHeader = ({ + currentTrainData, + currentPosition, + nearTrainIDList, + openTrainInfo, +}) => { + return ( + setActionSheetHorizonalScroll(true)} + //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} + //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} + style={{ + flexDirection: "row", + //width: widthPercentageToDP("200%"), + // minHeight: 200, + //height: heightPercentageToDP("20%"), + }} + horizontal + pagingEnabled + > + + + ); +}; diff --git a/components/ActionSheetComponents/EachTrainInfo/ScrollStickyContent.js b/components/ActionSheetComponents/EachTrainInfo/ScrollStickyContent.js new file mode 100644 index 0000000..3881b36 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/ScrollStickyContent.js @@ -0,0 +1,57 @@ +import React from "react"; +import { View, Text } from "react-native"; + +export const ScrollStickyContent = ({ currentTrainData }) => { + return ( + + + 停車駅 + + + {!isNaN(currentTrainData?.delay) && currentTrainData?.delay != 0 && ( + + (定刻) + + )} + + 見込 + + + + + + ); +}; diff --git a/components/ActionSheetComponents/EachTrainInfo/ShortHeader.js b/components/ActionSheetComponents/EachTrainInfo/ShortHeader.js new file mode 100644 index 0000000..a289e24 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/ShortHeader.js @@ -0,0 +1,35 @@ +import React from "react"; +import { ScrollView } from "react-native"; +import { TrainDataView } from "./TrainDataView"; + +export const ShortHeader = ({ + currentTrainData, + currentPosition, + nearTrainIDList, + openTrainInfo, +}) => { + return ( + setActionSheetHorizonalScroll(true)} + //onScrollEndDrag={() => setActionSheetHorizonalScroll(false)} + //onScrollBeginDrag={() => console.log("onScrollBeginDrag")} + style={{ + flexDirection: "row", + flex: 1, + //width: widthPercentageToDP("200%"), + // minHeight: 200, + //height: heightPercentageToDP("20%"), + }} + horizontal + pagingEnabled + > + + + ); +}; diff --git a/components/DynamicHeaderScrollView.js b/components/DynamicHeaderScrollView.js index e804856..8254937 100644 --- a/components/DynamicHeaderScrollView.js +++ b/components/DynamicHeaderScrollView.js @@ -18,7 +18,7 @@ export const DynamicHeaderScrollView = (props) => { const Scroll_Distance = Max_Header_Height - Min_Header_Height; const animatedHeaderHeight = scrollOffsetY.interpolate({ - inputRange: [Min_Header_Height, Scroll_Distance], + inputRange: [Scroll_Distance, Scroll_Distance + 10], outputRange: [Max_Header_Height, 0], extrapolate: "clamp", }); @@ -40,20 +40,6 @@ export const DynamicHeaderScrollView = (props) => { return ( - - {longHeader} - { > {shortHeader} + + {longHeader} + Date: Sun, 11 Feb 2024 21:27:28 +0900 Subject: [PATCH 10/27] =?UTF-8?q?Apps=E3=82=92=E6=A8=AA=E5=90=91=E3=81=8D?= =?UTF-8?q?=E5=AF=BE=E5=BF=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 62 +++++++++++++++++++--- app.json | 2 +- components/trainMenu.js | 115 +++++++++++++++++++++------------------- 3 files changed, 116 insertions(+), 63 deletions(-) diff --git a/Apps.js b/Apps.js index 84c25ff..0325832 100644 --- a/Apps.js +++ b/Apps.js @@ -1,8 +1,25 @@ -import React, { useEffect, useRef, useState } from "react"; -import { View, Platform, Text, TouchableOpacity } from "react-native"; +import React, { + useEffect, + useLayoutEffect, + useRef, + useState, + useCallback, +} from "react"; +import { + View, + Platform, + Text, + TouchableOpacity, + useWindowDimensions, +} from "react-native"; import { WebView } from "react-native-webview"; import Constants from "expo-constants"; import { Ionicons } from "@expo/vector-icons"; + +import { + widthPercentageToDP as wp, + heightPercentageToDP as hp, +} from "react-native-responsive-screen"; import { AS } from "./storageControl"; import { news } from "./config/newsUpdate"; import { getStationList, lineList } from "./lib/getStationList"; @@ -11,15 +28,30 @@ import { checkDuplicateTrainData } from "./lib/checkDuplicateTrainData"; import { useFavoriteStation } from "./stateBox/useFavoriteStation"; import { useCurrentTrain } from "./stateBox/useCurrentTrain"; import { SheetManager } from "react-native-actions-sheet"; +import TrainMenu from "./components/trainMenu"; /* import StatusbarDetect from './StatusbarDetect'; var Status = StatusbarDetect(); */ export default function Apps({ navigation, webview, stationData }) { const { currentTrain } = useCurrentTrain(); + const { height, width } = useWindowDimensions(); const { navigate } = navigation; var urlcache = ""; const { favoriteStation } = useFavoriteStation(); + const [isLandscape, setIsLandscape] = useState(false); //画面が横向きかどうか + const handleLayout = () => {}; + useEffect(() => { + console.log("レイアウト変更"); + console.log(height, width); + console.log(height / width); + if (height / width > 1.5) { + setIsLandscape(false); + } + if (height / width < 1.5) { + setIsLandscape(true); + } + }, [height, width]); //画面表示関連 const [iconSetting, setIconSetting] = useState(undefined); @@ -271,8 +303,22 @@ export default function Apps({ navigation, webview, stationData }) { style={{ height: "100%", paddingTop: Platform.OS == "ios" ? Constants.statusBarHeight : 0, + flexDirection: isLandscape ? "row" : "column", }} + onLayout={handleLayout} > + {isLandscape ? ( + + ) : null} {/* {Status} */} - navigate("trainMenu", { webview })} - top={Platform.OS == "ios" ? Constants.statusBarHeight : 0} - mapSwitch={mapSwitch == "true" ? "flex" : "none"} - /> + {isLandscape || ( + navigate("trainMenu", { webview })} + top={Platform.OS == "ios" ? Constants.statusBarHeight : 0} + mapSwitch={mapSwitch == "true" ? "flex" : "none"} + /> + )} webview.current.reload()} top={Platform.OS == "ios" ? Constants.statusBarHeight : 0} diff --git a/app.json b/app.json index 1686ab8..19aa076 100644 --- a/app.json +++ b/app.json @@ -8,7 +8,7 @@ "android" ], "version": "4.6", - "orientation": "portrait", + "orientation": "default", "icon": "./assets/icon.png", "splash": { "image": "./assets/splash.png", diff --git a/components/trainMenu.js b/components/trainMenu.js index 3069e1d..3702c6f 100644 --- a/components/trainMenu.js +++ b/components/trainMenu.js @@ -6,10 +6,11 @@ export default function TrainMenu({ navigation: { navigate }, webview, stationData, + style, }) { const mapRef = useRef(); return ( - + ); }) )} - - - navigate("howto", { - info: "https://train.jr-shikoku.co.jp/usage.htm", - }) - } + {navigate && ( + + + navigate("howto", { + info: "https://train.jr-shikoku.co.jp/usage.htm", + }) + } + > + 使い方 + + navigate("favoriteList")} + > + お気に入り + + + Linking.openURL( + "https://nexcloud.haruk.in/apps/forms/ZRHjWFF7znr5Xjr2" + ) + } + > + フィードバック + + + )} + {navigate && ( + navigate("Apps")} > - 使い方 - - navigate("favoriteList")} - > - お気に入り - - - Linking.openURL( - "https://nexcloud.haruk.in/apps/forms/ZRHjWFF7znr5Xjr2" - ) - } - > - この機能のフィードバック - - - navigate("Apps")} - > - - - 閉じる - - - + + + 閉じる + + + + )} ); } @@ -115,14 +120,14 @@ const UsefulBox = (props) => { style={{ flex: flex, backgroundColor: backgroundColor, - padding: 10, + padding: 5, alignItems: "center", margin: 2, }} onPress={onPressButton} > - + {children} From 38052abd30f33766905834cc9fe3b34439a8148f Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Sun, 11 Feb 2024 21:32:06 +0900 Subject: [PATCH 11/27] =?UTF-8?q?=E6=A8=AA=E5=B9=85=E3=82=92=E3=81=A8?= =?UTF-8?q?=E3=82=8C=E3=81=A6=E3=81=84=E3=81=AA=E3=81=84=E3=83=90=E3=82=B0?= =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Apps.js b/Apps.js index 0325832..b30d5f6 100644 --- a/Apps.js +++ b/Apps.js @@ -313,7 +313,7 @@ export default function Apps({ navigation, webview, stationData }) { stationData={stationData} navigation={{ navigate: null }} style={{ - width: wp("40%"), + width: (width / 100) * 40, height: "100%", flexDirection: "column-reverse", }} From 93529f4f7deb24152ad1f7ccc5802f0d5373ce72 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Sun, 11 Feb 2024 23:54:55 +0900 Subject: [PATCH 12/27] =?UTF-8?q?=E5=B9=85=E6=8C=87=E5=AE=9A=E3=82=92useWi?= =?UTF-8?q?ndowDimensions=E3=81=AB=E5=A4=89=E6=9B=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 12 +----------- .../EachTrainInfo/TrainDataView.js | 10 ++++++++-- 2 files changed, 9 insertions(+), 13 deletions(-) diff --git a/Apps.js b/Apps.js index b30d5f6..1df2b4a 100644 --- a/Apps.js +++ b/Apps.js @@ -1,10 +1,4 @@ -import React, { - useEffect, - useLayoutEffect, - useRef, - useState, - useCallback, -} from "react"; +import React, { useEffect, useState } from "react"; import { View, Platform, @@ -16,10 +10,6 @@ import { WebView } from "react-native-webview"; import Constants from "expo-constants"; import { Ionicons } from "@expo/vector-icons"; -import { - widthPercentageToDP as wp, - heightPercentageToDP as hp, -} from "react-native-responsive-screen"; import { AS } from "./storageControl"; import { news } from "./config/newsUpdate"; import { getStationList, lineList } from "./lib/getStationList"; diff --git a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js index cf73398..449786c 100644 --- a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js +++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js @@ -1,5 +1,10 @@ import React from "react"; -import { View, Text, TouchableOpacity } from "react-native"; +import { + View, + Text, + TouchableOpacity, + useWindowDimensions, +} from "react-native"; import { StateBox } from "./StateBox"; import { heightPercentageToDP, @@ -13,13 +18,14 @@ export const TrainDataView = ({ openTrainInfo, mode = 0, }) => { + const { width, height } = useWindowDimensions(); return ( From 72412e87e887a1cbcf3987927c16fc9cb9e36949 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 00:51:47 +0900 Subject: [PATCH 13/27] =?UTF-8?q?=E3=81=A8=E3=82=8A=E3=81=82=E3=81=88?= =?UTF-8?q?=E3=81=9A=E3=81=93=E3=82=8C=E3=81=A7=E3=83=93=E3=83=AB=E3=83=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 3 - .../ActionSheetComponents/EachTrainInfo.js | 324 ++++++++++++------ .../EachTrainInfo/LandscapeTrainInfo.js | 47 +++ .../EachTrainInfo/TrainDataView.js | 14 +- 4 files changed, 282 insertions(+), 106 deletions(-) create mode 100644 components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js diff --git a/Apps.js b/Apps.js index 1df2b4a..2e3e09d 100644 --- a/Apps.js +++ b/Apps.js @@ -32,9 +32,6 @@ export default function Apps({ navigation, webview, stationData }) { const [isLandscape, setIsLandscape] = useState(false); //画面が横向きかどうか const handleLayout = () => {}; useEffect(() => { - console.log("レイアウト変更"); - console.log(height, width); - console.log(height / width); if (height / width > 1.5) { setIsLandscape(false); } diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index c508f9c..d3f5368 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -6,9 +6,13 @@ import { TouchableOpacity, Platform, StyleSheet, + useWindowDimensions, } from "react-native"; import { Ionicons } from "@expo/vector-icons"; -import ActionSheet, { SheetManager } from "react-native-actions-sheet"; +import ActionSheet, { + SheetManager, + useScrollHandlers, +} from "react-native-actions-sheet"; import { AS } from "../../storageControl"; import trainList from "../../assets/originData/trainList"; import { lineList } from "../../lib/getStationList"; @@ -24,6 +28,7 @@ import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView"; import { LongHeader } from "./EachTrainInfo/LongHeader"; import { ShortHeader } from "./EachTrainInfo/ShortHeader"; import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; +import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; @@ -47,6 +52,16 @@ export const EachTrainInfo = (props) => { const [isConcatNear, setIsConcatNear] = useState(false); const [tailStation, setTailStation] = useState(); const [headStation, setHeadStation] = useState(); + const { height, width } = useWindowDimensions(); + const [isLandscape, setIsLandscape] = useState(false); + useEffect(() => { + if (height / width > 1.5) { + setIsLandscape(false); + } + if (height / width < 1.5) { + setIsLandscape(true); + } + }, [width, height]); // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); //裏列車探索 @@ -376,6 +391,7 @@ export const EachTrainInfo = (props) => { .replace("ライナーライナー", "ライナー"); }; const actionSheetRef = useRef(null); + const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); return ( { ref={actionSheetRef} drawUnderStatusBar={false} isModal={Platform.OS == "ios"} + //useBottomSafeAreaPadding={Platform.OS == "android"} > { /> )} - - ) : ( - - ) - } - longHeader={ - from == "AllTrainDiagramView" ? ( - <> - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} > - 「本当の始発駅」を表示 - - - )} - {/* + 「本当の始発駅」を表示 + + + )} + {/* { /> ほげほげふがふが */} - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} > - 「本当の終着駅」を表示 - - - )} + + 「本当の終着駅」を表示 + + + )} - - - - + + + + + - - + + ) : ( + + ) : ( + + ) + } + longHeader={ + from == "AllTrainDiagramView" ? ( + <> + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* + ほげほげふがふが */} + + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} + + + + + + + + + )} ); diff --git a/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js new file mode 100644 index 0000000..8538b65 --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfo/LandscapeTrainInfo.js @@ -0,0 +1,47 @@ +import React from "react"; +import { View, Text, ScrollView, useWindowDimensions } from "react-native"; + +export const LandscapeTrainInfo = (props) => { + const { leftContent, topStickyContent, children, scrollHandlers } = props; + const { height, width } = useWindowDimensions(); + return ( + + + {width / 2} + {leftContent} + + { + console.log(d.nativeEvent.contentOffset.y); + }} + > + + + {topStickyContent} + + {children} + + + ); +}; diff --git a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js index 449786c..6ac2eb7 100644 --- a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js +++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect, useState } from "react"; import { View, Text, @@ -18,14 +18,24 @@ export const TrainDataView = ({ openTrainInfo, mode = 0, }) => { + const [isLandscape, setIsLandscape] = useState(false); const { width, height } = useWindowDimensions(); + useEffect(() => { + if (height / width > 1.5) { + setIsLandscape(false); + } + if (height / width < 1.5) { + setIsLandscape(true); + } + }, [width, height]); + return ( From 319e4b7b684ab4dc14bb3ceebd1edf1deaf87592 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 13:53:31 +0900 Subject: [PATCH 14/27] =?UTF-8?q?5.0=E3=81=AE=E7=92=B0=E5=A2=83=E6=BA=96?= =?UTF-8?q?=E5=82=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- eas.json | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/eas.json b/eas.json index 2c0a80c..fe14a1e 100644 --- a/eas.json +++ b/eas.json @@ -29,6 +29,12 @@ }, "production4.6": { "channel": "costoco" + }, + "beta5.0": { + "channel": "dshopping" + }, + "production5.0": { + "channel": "dmm" } }, "submit": { From 5ce9ba9bea246435c3b7dada458c9bc3526783a4 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 16:10:54 +0900 Subject: [PATCH 15/27] =?UTF-8?q?=E9=80=94=E4=B8=AD=E3=81=BE=E3=81=A7?= =?UTF-8?q?=E5=88=86=E5=89=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 924 ++++++++++-------- 1 file changed, 491 insertions(+), 433 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index d3f5368..9fdceaf 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -52,16 +52,6 @@ export const EachTrainInfo = (props) => { const [isConcatNear, setIsConcatNear] = useState(false); const [tailStation, setTailStation] = useState(); const [headStation, setHeadStation] = useState(); - const { height, width } = useWindowDimensions(); - const [isLandscape, setIsLandscape] = useState(false); - useEffect(() => { - if (height / width > 1.5) { - setIsLandscape(false); - } - if (height / width < 1.5) { - setIsLandscape(true); - } - }, [width, height]); // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); //裏列車探索 @@ -85,102 +75,6 @@ export const EachTrainInfo = (props) => { }); }, [trainData, showNearTrain]); - const openBackTrainInfo = (stationInfo, currentTrainIndex) => { - const migrationArray = (stationInfo) => { - const mainTrainStationPosition = trainData.findIndex( - (d) => d.split(",")[0] == stationInfo - ); - - const relationMain = (() => { - if (mainTrainStationPosition == 0) return "head"; - if (mainTrainStationPosition == trainData.length - 1) return "tail"; - return "middle"; - })(); - - const subTrainStationPosition = showNearTrain.findIndex( - (d) => d.split(",")[0] == stationInfo - ); - const relationSub = (() => { - if (subTrainStationPosition == 0) return "head"; - if (subTrainStationPosition == showNearTrain.length - 1) return "tail"; - return "middle"; - })(); - - switch (relationMain) { - case "head": - if (relationSub == "head") { - return; - } else if (relationSub == "tail") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData, - ]; - } else if (relationSub == "middle") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData, - ]; - } else return; - case "tail": - if (relationSub == "head") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain, - ]; - } else if (relationSub == "tail") { - return; - } else if (relationSub == "middle") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain.slice(subTrainStationPosition), - ]; - } else return; - case "middle": - if (relationSub == "head") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain, - ]; - } else if (relationSub == "tail") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData.slice(mainTrainStationPosition), - ]; - } else return; - } - }; - const array = migrationArray(stationInfo); - if (!array) return; - setTrainData(array); - setIsConcatNear(true); - }; - - const openTrainInfo = (d) => { - const train = customTrainDataDetector(d); - let TrainNumber = ""; - if (train.trainNumDistance != undefined) { - const timeInfo = - parseInt(d.replace("M", "").replace("D", "")) - train.trainNumDistance; - TrainNumber = timeInfo + "号"; - } - const payload = { - data: { - trainNum: d, - limited: `${getTrainType(train.type).data}:${ - train.trainName - }${TrainNumber}`, - }, - navigate, - originalStationList, - from: "AllTrainDiagramView", - }; - SheetManager.hide("EachTrainInfo").then(() => { - //0.1秒待機してから開く - setTimeout(() => { - SheetManager.show("EachTrainInfo", { payload }); - }, 1); - }); - }; useEffect(() => { setCurrentTrainData( checkDuplicateTrainData( @@ -189,17 +83,6 @@ export const EachTrainInfo = (props) => { ); }, [currentTrain]); - useEffect(() => { - //列車現在地アイコン表示スイッチ - AS.getItem("trainPositionSwitch") - .then((d) => { - if (d) { - setTrainPositionSwitch(d); - } else { - } - }) - .catch((d) => AS.setItem("trainPositionSwitch", "false")); - }, []); //bconst insets = useSafeAreaInsets(); const getStationData = (stationName) => { const Stations = stationList.map((a) => @@ -213,18 +96,6 @@ export const EachTrainInfo = (props) => { if (!Station[0]) return []; return Station.map((d) => d.StationNumber)[0]; }; - useEffect(() => { - //currentTrainData.Pos = "鴨川~端岡"; //test - if (!currentTrainData?.Pos) return; - if (currentTrainData?.Pos.match("~")) { - const pos = currentTrainData?.Pos.replace("(下り)", "") - .replace("(上り)", "") - .split("~"); - setCurrentPosition([getStationData(pos[0]), getStationData(pos[1])]); - } else { - setCurrentPosition([getStationData(currentTrainData?.Pos)]); - } - }, [currentTrainData]); const stationList = originalStationList && @@ -361,37 +232,8 @@ export const EachTrainInfo = (props) => { console.log(e); } } - // 使用例 - const points = - trainPositionSwitch == "true" ? findReversalPoints(currentPosition) : []; - useEffect(() => { - if (!data.trainNum) return; - const TD = trainList[data.trainNum]; - if (!TD) { - setTrainData([]); - return; - } - setTrainData(TD.split("#").filter((d) => d != "")); - }, [data]); - const getType = (string) => { - switch (string) { - case "express": - return "特急"; - case "rapid": - return "快速"; - default: - return ""; - } - }; - - const migrateTrainName = (string) => { - return string - .replace("マリン", "マリンライナー") - .replace("ライナーライナー", "ライナー"); - }; const actionSheetRef = useRef(null); - const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); return ( { //useBottomSafeAreaPadding={Platform.OS == "android"} > - - - - - - - {data.limited - ? getType(data.limited.split(":")[0]) + - migrateTrainName( - data.limited.split(":")[1] || - (trainData.length > 0 - ? trainData[trainData.length - 1].split(",")[0] + "行き" - : " ") - ) - : ""} - - - - {data.trainNum} - {isConcatNear ? ` + ${nearTrainIDList}` : ""} - - - {data.limited != undefined && - getType(data.limited.split(":")[0]) && - !data.limited.split(":")[1].match("サンポート") && ( - { - LayoutAnimation.easeInEaseOut(); //setLoadingDelayData(true); - navigate("trainbase", { - info: "train.html?tn=" + data.trainNum, - from, - }); - SheetManager.hide("EachTrainInfo"); - }} - /> - )} - - {isLandscape ? ( - - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* - ほげほげふがふが */} - - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} - - - - - - - - - ) : ( - - ) : ( - - ) - } - longHeader={ - from == "AllTrainDiagramView" ? ( - <> - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* - ほげほげふがふが */} - - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} - - - - - - - - - )} - + /> ); }; @@ -700,3 +297,464 @@ const styles = StyleSheet.create({ textAlign: "center", }, }); +const Hoge = ({ + actionSheetRef, + data, + trainData, + isConcatNear, + nearTrainIDList, + navigate, + from, + currentTrainData, + currentPosition, + headStation, + tailStation, + stationList, + openStationACFromEachTrainInfo, + trainPositionSwitch, + findReversalPoints, + setTrainData, + trainList, + showNearTrain, + setIsConcatNear, + customTrainDataDetector, + getTrainType, + originalStationList, + SheetManager, + AS, + setTrainPositionSwitch, + getStationData, + setCurrentPosition, +}) => { + const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); + const migrateTrainName = (string) => { + return string + .replace("マリン", "マリンライナー") + .replace("ライナーライナー", "ライナー"); + }; + const getType = (string) => { + switch (string) { + case "express": + return "特急"; + case "rapid": + return "快速"; + default: + return ""; + } + }; + + // 使用例 + const points = + trainPositionSwitch == "true" ? findReversalPoints(currentPosition) : []; + const { height, width } = useWindowDimensions(); + const [isLandscape, setIsLandscape] = useState(false); + useEffect(() => { + //currentTrainData.Pos = "鴨川~端岡"; //test + if (!currentTrainData?.Pos) return; + if (currentTrainData?.Pos.match("~")) { + const pos = currentTrainData?.Pos.replace("(下り)", "") + .replace("(上り)", "") + .split("~"); + setCurrentPosition([getStationData(pos[0]), getStationData(pos[1])]); + } else { + setCurrentPosition([getStationData(currentTrainData?.Pos)]); + } + }, [currentTrainData]); + useEffect(() => { + if (height / width > 1.5) { + setIsLandscape(false); + } + if (height / width < 1.5) { + setIsLandscape(true); + } + }, [width, height]); + useEffect(() => { + if (!data.trainNum) return; + const TD = trainList[data.trainNum]; + if (!TD) { + setTrainData([]); + return; + } + setTrainData(TD.split("#").filter((d) => d != "")); + }, [data]); + useEffect(() => { + //列車現在地アイコン表示スイッチ + AS.getItem("trainPositionSwitch") + .then((d) => { + if (d) { + setTrainPositionSwitch(d); + } else { + } + }) + .catch((d) => AS.setItem("trainPositionSwitch", "false")); + }, []); + + const openBackTrainInfo = (stationInfo, currentTrainIndex) => { + const migrationArray = (stationInfo) => { + const mainTrainStationPosition = trainData.findIndex( + (d) => d.split(",")[0] == stationInfo + ); + + const relationMain = (() => { + if (mainTrainStationPosition == 0) return "head"; + if (mainTrainStationPosition == trainData.length - 1) return "tail"; + return "middle"; + })(); + + const subTrainStationPosition = showNearTrain.findIndex( + (d) => d.split(",")[0] == stationInfo + ); + const relationSub = (() => { + if (subTrainStationPosition == 0) return "head"; + if (subTrainStationPosition == showNearTrain.length - 1) return "tail"; + return "middle"; + })(); + + switch (relationMain) { + case "head": + if (relationSub == "head") { + return; + } else if (relationSub == "tail") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData, + ]; + } else if (relationSub == "middle") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData, + ]; + } else return; + case "tail": + if (relationSub == "head") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain, + ]; + } else if (relationSub == "tail") { + return; + } else if (relationSub == "middle") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain.slice(subTrainStationPosition), + ]; + } else return; + case "middle": + if (relationSub == "head") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain, + ]; + } else if (relationSub == "tail") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData.slice(mainTrainStationPosition), + ]; + } else return; + } + }; + const array = migrationArray(stationInfo); + if (!array) return; + setTrainData(array); + setIsConcatNear(true); + }; + + const openTrainInfo = (d) => { + const train = customTrainDataDetector(d); + let TrainNumber = ""; + if (train.trainNumDistance != undefined) { + const timeInfo = + parseInt(d.replace("M", "").replace("D", "")) - train.trainNumDistance; + TrainNumber = timeInfo + "号"; + } + const payload = { + data: { + trainNum: d, + limited: `${getTrainType(train.type).data}:${ + train.trainName + }${TrainNumber}`, + }, + navigate, + originalStationList, + from: "AllTrainDiagramView", + }; + SheetManager.hide("EachTrainInfo").then(() => { + //0.1秒待機してから開く + setTimeout(() => { + SheetManager.show("EachTrainInfo", { payload }); + }, 1); + }); + }; + return ( + + + + + + + {data.limited + ? getType(data.limited.split(":")[0]) + + migrateTrainName( + data.limited.split(":")[1] || + (trainData.length > 0 + ? trainData[trainData.length - 1].split(",")[0] + "行き" + : " ") + ) + : ""} + + + + {data.trainNum} + {isConcatNear ? ` + ${nearTrainIDList}` : ""} + + + {data.limited != undefined && + getType(data.limited.split(":")[0]) && + !data.limited.split(":")[1].match("サンポート") && ( + { + LayoutAnimation.easeInEaseOut(); //setLoadingDelayData(true); + navigate("trainbase", { + info: "train.html?tn=" + data.trainNum, + from, + }); + SheetManager.hide("EachTrainInfo"); + }} + /> + )} + + {isLandscape ? ( + + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* + ほげほげふがふが */} + + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} + + + + + + + + + ) : ( + + ) : ( + + ) + } + longHeader={ + from == "AllTrainDiagramView" ? ( + <> + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* + ほげほげふがふが */} + + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} + + + + + + + + + )} + + ); +}; From 627102601d234fcb1e2c8471ebece1b84e8bf6d7 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 17:07:10 +0900 Subject: [PATCH 16/27] =?UTF-8?q?=E3=81=BB=E3=81=BC=E4=BF=AE=E6=AD=A3?= =?UTF-8?q?=E5=AE=8C=E4=BA=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 224 +++++++----------- 1 file changed, 91 insertions(+), 133 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 9fdceaf..7fff340 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -39,42 +39,12 @@ export const EachTrainInfo = (props) => { openStationACFromEachTrainInfo = () => {}, from, } = props.payload; - const [trainData, setTrainData] = useState([]); - const [currentPosition, setCurrentPosition] = useState([]); - const [trainPositionSwitch, setTrainPositionSwitch] = useState("false"); const { currentTrain } = useCurrentTrain(); - const { getInfluencedTrainData } = useBusAndTrainData(); - const [currentTrainData, setCurrentTrainData] = useState([]); - const [nearTrainIDList, setNearTrainIDList] = useState([]); - const [showNearTrain, setShowNearTrain] = useState([]); - const [isConcatNear, setIsConcatNear] = useState(false); - const [tailStation, setTailStation] = useState(); - const [headStation, setHeadStation] = useState(); + // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); - //裏列車探索 - useEffect(() => { - if (!data.trainNum) return; - const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum); - setNearTrainIDList(returnArray); - setShowNearTrain(TDArray); - }, [data]); - - useEffect(() => { - if (trainData.length == 0) return; - if (showNearTrain.length == 0) return; - showNearTrain.forEach((d) => { - const [station, se, time] = d.split(","); - - if (station == trainData[0].split(",")[0]) - setHeadStation(trainData[0].split(",")[0]); - if (station == trainData[trainData.length - 1].split(",")[0]) - setTailStation(trainData[trainData.length - 1].split(",")[0]); - }); - }, [trainData, showNearTrain]); - useEffect(() => { setCurrentTrainData( checkDuplicateTrainData( @@ -84,6 +54,78 @@ export const EachTrainInfo = (props) => { }, [currentTrain]); //bconst insets = useSafeAreaInsets(); + + const actionSheetRef = useRef(null); + return ( + } + ref={actionSheetRef} + drawUnderStatusBar={false} + isModal={Platform.OS == "ios"} + + //useBottomSafeAreaPadding={Platform.OS == "android"} + > + + + ); +}; +const styles = StyleSheet.create({ + header: { + justifyContent: "center", + alignItems: "center", + left: 0, + right: 0, + //paddingTop: 10, + position: "absolute", + zIndex: 1, + backgroundColor: "f0f0f0", + }, + headerText: { + color: "#fff", + fontSize: 25, + fontWeight: "bold", + textAlign: "center", + }, +}); +const Hoge = ({ + actionSheetRef, + data, + navigate, + originalStationList, + openStationACFromEachTrainInfo, + from, + currentTrainData, +}) => { + const [headStation, setHeadStation] = useState(); + const [tailStation, setTailStation] = useState(); + const [isConcatNear, setIsConcatNear] = useState(false); + const [showNearTrain, setShowNearTrain] = useState([]); + const [nearTrainIDList, setNearTrainIDList] = useState([]); + const { getInfluencedTrainData } = useBusAndTrainData(); + const [trainPositionSwitch, setTrainPositionSwitch] = useState("false"); + const [currentPosition, setCurrentPosition] = useState([]); + const [trainData, setTrainData] = useState([]); + const stationList = + originalStationList && + lineList.map((d) => + originalStationList[d].map((a) => ({ + StationNumber: a.StationNumber, + StationName: a.Station_JP, + })) + ); + const getStationData = (stationName) => { const Stations = stationList.map((a) => a.filter((d) => d.StationName == stationName) @@ -96,15 +138,6 @@ export const EachTrainInfo = (props) => { if (!Station[0]) return []; return Station.map((d) => d.StationNumber)[0]; }; - - const stationList = - originalStationList && - lineList.map((d) => - originalStationList[d].map((a) => ({ - StationNumber: a.StationNumber, - StationName: a.Station_JP, - })) - ); const stopStationIDList = trainData.map((i, index) => { const [station, se, time] = i.split(","); const Stations = stationList.map((a) => @@ -232,100 +265,25 @@ export const EachTrainInfo = (props) => { console.log(e); } } + useEffect(() => { + if (trainData.length == 0) return; + if (showNearTrain.length == 0) return; + showNearTrain.forEach((d) => { + const [station, se, time] = d.split(","); - const actionSheetRef = useRef(null); - return ( - } - ref={actionSheetRef} - drawUnderStatusBar={false} - isModal={Platform.OS == "ios"} - - //useBottomSafeAreaPadding={Platform.OS == "android"} - > - - - ); -}; -const styles = StyleSheet.create({ - header: { - justifyContent: "center", - alignItems: "center", - left: 0, - right: 0, - //paddingTop: 10, - position: "absolute", - zIndex: 1, - backgroundColor: "f0f0f0", - }, - headerText: { - color: "#fff", - fontSize: 25, - fontWeight: "bold", - textAlign: "center", - }, -}); -const Hoge = ({ - actionSheetRef, - data, - trainData, - isConcatNear, - nearTrainIDList, - navigate, - from, - currentTrainData, - currentPosition, - headStation, - tailStation, - stationList, - openStationACFromEachTrainInfo, - trainPositionSwitch, - findReversalPoints, - setTrainData, - trainList, - showNearTrain, - setIsConcatNear, - customTrainDataDetector, - getTrainType, - originalStationList, - SheetManager, - AS, - setTrainPositionSwitch, - getStationData, - setCurrentPosition, -}) => { + if (station == trainData[0].split(",")[0]) + setHeadStation(trainData[0].split(",")[0]); + if (station == trainData[trainData.length - 1].split(",")[0]) + setTailStation(trainData[trainData.length - 1].split(",")[0]); + }); + }, [trainData, showNearTrain]); + //裏列車探索 + useEffect(() => { + if (!data.trainNum) return; + const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum); + setNearTrainIDList(returnArray); + setShowNearTrain(TDArray); + }, [data]); const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); const migrateTrainName = (string) => { return string From 12cd53640deeb162468904c51fadd3192f69b73d Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 17:36:16 +0900 Subject: [PATCH 17/27] =?UTF-8?q?=E4=BE=9D=E5=AD=98=E9=96=A2=E4=BF=82?= =?UTF-8?q?=E4=BF=AE=E6=AD=A3=E5=AE=8C=E4=BA=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 57 +++++++------------ 1 file changed, 22 insertions(+), 35 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 7fff340..f369f3d 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -32,28 +32,6 @@ import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; - const { - data, - navigate, - originalStationList, - openStationACFromEachTrainInfo = () => {}, - from, - } = props.payload; - - const { currentTrain } = useCurrentTrain(); - const [currentTrainData, setCurrentTrainData] = useState([]); - - // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); - - useEffect(() => { - setCurrentTrainData( - checkDuplicateTrainData( - currentTrain.filter((d) => d.num == data.trainNum) - ) - ); - }, [currentTrain]); - - //bconst insets = useSafeAreaInsets(); const actionSheetRef = useRef(null); return ( @@ -67,17 +45,7 @@ export const EachTrainInfo = (props) => { //useBottomSafeAreaPadding={Platform.OS == "android"} > - + ); }; @@ -99,15 +67,33 @@ const styles = StyleSheet.create({ textAlign: "center", }, }); -const Hoge = ({ +const EachTrainInfoCore = ({ actionSheetRef, data, navigate, originalStationList, openStationACFromEachTrainInfo, from, - currentTrainData, }) => { + // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); + + const { currentTrain } = useCurrentTrain(); + const [currentTrainData, setCurrentTrainData] = useState(); + + // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); + + useEffect(() => { + console.log(currentTrain.length); + if (!currentTrain.length) return; + setCurrentTrainData( + checkDuplicateTrainData( + currentTrain.filter((d) => d.num == data.trainNum) + ) + ); + }, [currentTrain]); + + //bconst insets = useSafeAreaInsets(); + const [headStation, setHeadStation] = useState(); const [tailStation, setTailStation] = useState(); const [isConcatNear, setIsConcatNear] = useState(false); @@ -308,6 +294,7 @@ const Hoge = ({ const [isLandscape, setIsLandscape] = useState(false); useEffect(() => { //currentTrainData.Pos = "鴨川~端岡"; //test + if (!currentTrainData) return; if (!currentTrainData?.Pos) return; if (currentTrainData?.Pos.match("~")) { const pos = currentTrainData?.Pos.replace("(下り)", "") From f8bd37c4527cdf1134f21de1a0a1dd700c3c3c92 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 17:45:24 +0900 Subject: [PATCH 18/27] =?UTF-8?q?=E3=83=95=E3=82=A1=E3=82=A4=E3=83=AB?= =?UTF-8?q?=E5=88=86=E5=89=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 656 +---------------- .../EachTrainInfoCore.js | 686 ++++++++++++++++++ 2 files changed, 687 insertions(+), 655 deletions(-) create mode 100644 components/ActionSheetComponents/EachTrainInfoCore.js diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index f369f3d..1d4701b 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -29,7 +29,7 @@ import { LongHeader } from "./EachTrainInfo/LongHeader"; import { ShortHeader } from "./EachTrainInfo/ShortHeader"; import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo"; - +import { EachTrainInfoCore } from "./EachTrainInfoCore"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; @@ -49,657 +49,3 @@ export const EachTrainInfo = (props) => { ); }; -const styles = StyleSheet.create({ - header: { - justifyContent: "center", - alignItems: "center", - left: 0, - right: 0, - //paddingTop: 10, - position: "absolute", - zIndex: 1, - backgroundColor: "f0f0f0", - }, - headerText: { - color: "#fff", - fontSize: 25, - fontWeight: "bold", - textAlign: "center", - }, -}); -const EachTrainInfoCore = ({ - actionSheetRef, - data, - navigate, - originalStationList, - openStationACFromEachTrainInfo, - from, -}) => { - // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); - - const { currentTrain } = useCurrentTrain(); - const [currentTrainData, setCurrentTrainData] = useState(); - - // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); - - useEffect(() => { - console.log(currentTrain.length); - if (!currentTrain.length) return; - setCurrentTrainData( - checkDuplicateTrainData( - currentTrain.filter((d) => d.num == data.trainNum) - ) - ); - }, [currentTrain]); - - //bconst insets = useSafeAreaInsets(); - - const [headStation, setHeadStation] = useState(); - const [tailStation, setTailStation] = useState(); - const [isConcatNear, setIsConcatNear] = useState(false); - const [showNearTrain, setShowNearTrain] = useState([]); - const [nearTrainIDList, setNearTrainIDList] = useState([]); - const { getInfluencedTrainData } = useBusAndTrainData(); - const [trainPositionSwitch, setTrainPositionSwitch] = useState("false"); - const [currentPosition, setCurrentPosition] = useState([]); - const [trainData, setTrainData] = useState([]); - const stationList = - originalStationList && - lineList.map((d) => - originalStationList[d].map((a) => ({ - StationNumber: a.StationNumber, - StationName: a.Station_JP, - })) - ); - - const getStationData = (stationName) => { - const Stations = stationList.map((a) => - a.filter((d) => d.StationName == stationName) - ); - const Station = - Stations && - Stations.reduce((newArray, e) => { - return newArray.concat(e); - }, []); - if (!Station[0]) return []; - return Station.map((d) => d.StationNumber)[0]; - }; - const stopStationIDList = trainData.map((i, index) => { - const [station, se, time] = i.split(","); - const Stations = stationList.map((a) => - a.filter((d) => d.StationName == station) - ); - const StationNumbers = - Stations && - Stations.reduce((newArray, e) => { - return newArray.concat(e); - }, []) - .filter((d) => d.StationNumber) - .map((d) => d.StationNumber); - return StationNumbers[0]; - }); - function findReversalPoints(array) { - try { - // arrayは現在位置の駅ID(駅在宅の場合は1つの配列、駅間の場合は2つの配列) - // stopStationIDListは停車駅の駅IDの配列 - if (!stopStationIDList.length) return []; - // arrayが二次元配列だったら早期リターン - if (!array instanceof Array) return []; - if (!array.length) return []; - if (array[0] instanceof Array) return []; - const arrayNumber = array.map((d) => ({ - line: d - .split("") - .filter((s) => "A" < s && s < "Z") - .join(""), - ID: d - .split("") - .filter((s) => "0" <= s && s <= "9") - .join(""), - })); - const stopStationIDListNumber = stopStationIDList.map((d) => { - if (!d) return { line: [], ID: [] }; - return { - line: d - .split("") - .filter((s) => "A" < s && s < "Z") - .join(""), - ID: d - .split("") - .filter((s) => "0" <= s && s <= "9") - .join(""), - }; - }); - // 完全一致 - if (array.length == 1) { - const index = stopStationIDList.indexOf(array[0]); - if (index != -1) return [index]; - // 通過駅の場合 - for (let i = 0; i < stopStationIDListNumber.length - 1; i++) { - if (stopStationIDListNumber[i].ID < arrayNumber[0].ID) { - if (stopStationIDListNumber[i + 1].ID > arrayNumber[0].ID) { - return [i + 1]; - } - } - if (stopStationIDListNumber[i].ID > arrayNumber[0].ID) { - if (stopStationIDListNumber[i + 1].ID < arrayNumber[0].ID) { - return [i + 1]; - } - } - } - } - // 駅間の場合 - if (array.length == 2) { - const index1 = stopStationIDList.indexOf(array[0]); - const index2 = stopStationIDList.indexOf(array[1]); - if (index1 != -1 && index2 != -1) { - // 駅間で通過駅も無い場合 - if (index1 < index2) { - if (index1 + 1 == index2) { - return [index2]; - } else { - const returnArray = []; - for (let i = index1 + 1; i <= index2; i++) { - returnArray.push(i); - } - return returnArray; - } - } - if (index1 > index2) { - if (index2 + 1 == index1) return [index1]; - else { - const returnArray = []; - for (let i = index2 + 1; i <= index1; i++) { - returnArray.push(i); - } - return returnArray; - } - } - } else { - const getNearStationID = (stationID) => { - for (let i = 0; i <= stopStationIDListNumber.length; i++) { - if (stopStationIDListNumber[i].ID < stationID) { - if (stopStationIDListNumber[i + 1].ID > stationID) { - return i + 1; - } - } - if (stopStationIDListNumber[i].ID > stationID) { - if (stopStationIDListNumber[i + 1].ID < stationID) { - return i + 1; - } - } - } - }; - let newIndex1 = index1; - let newIndex2 = index2; - if (index1 == -1) { - newIndex1 = getNearStationID(arrayNumber[0].ID); - } - if (index2 == -1) { - newIndex2 = getNearStationID(arrayNumber[1].ID); - } - if (newIndex1 && newIndex2) { - return [newIndex1, newIndex2]; - } - - // 通過駅の場合 - } - - return []; - } - } catch (e) { - console.log(e); - } - } - useEffect(() => { - if (trainData.length == 0) return; - if (showNearTrain.length == 0) return; - showNearTrain.forEach((d) => { - const [station, se, time] = d.split(","); - - if (station == trainData[0].split(",")[0]) - setHeadStation(trainData[0].split(",")[0]); - if (station == trainData[trainData.length - 1].split(",")[0]) - setTailStation(trainData[trainData.length - 1].split(",")[0]); - }); - }, [trainData, showNearTrain]); - //裏列車探索 - useEffect(() => { - if (!data.trainNum) return; - const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum); - setNearTrainIDList(returnArray); - setShowNearTrain(TDArray); - }, [data]); - const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); - const migrateTrainName = (string) => { - return string - .replace("マリン", "マリンライナー") - .replace("ライナーライナー", "ライナー"); - }; - const getType = (string) => { - switch (string) { - case "express": - return "特急"; - case "rapid": - return "快速"; - default: - return ""; - } - }; - - // 使用例 - const points = - trainPositionSwitch == "true" ? findReversalPoints(currentPosition) : []; - const { height, width } = useWindowDimensions(); - const [isLandscape, setIsLandscape] = useState(false); - useEffect(() => { - //currentTrainData.Pos = "鴨川~端岡"; //test - if (!currentTrainData) return; - if (!currentTrainData?.Pos) return; - if (currentTrainData?.Pos.match("~")) { - const pos = currentTrainData?.Pos.replace("(下り)", "") - .replace("(上り)", "") - .split("~"); - setCurrentPosition([getStationData(pos[0]), getStationData(pos[1])]); - } else { - setCurrentPosition([getStationData(currentTrainData?.Pos)]); - } - }, [currentTrainData]); - useEffect(() => { - if (height / width > 1.5) { - setIsLandscape(false); - } - if (height / width < 1.5) { - setIsLandscape(true); - } - }, [width, height]); - useEffect(() => { - if (!data.trainNum) return; - const TD = trainList[data.trainNum]; - if (!TD) { - setTrainData([]); - return; - } - setTrainData(TD.split("#").filter((d) => d != "")); - }, [data]); - useEffect(() => { - //列車現在地アイコン表示スイッチ - AS.getItem("trainPositionSwitch") - .then((d) => { - if (d) { - setTrainPositionSwitch(d); - } else { - } - }) - .catch((d) => AS.setItem("trainPositionSwitch", "false")); - }, []); - - const openBackTrainInfo = (stationInfo, currentTrainIndex) => { - const migrationArray = (stationInfo) => { - const mainTrainStationPosition = trainData.findIndex( - (d) => d.split(",")[0] == stationInfo - ); - - const relationMain = (() => { - if (mainTrainStationPosition == 0) return "head"; - if (mainTrainStationPosition == trainData.length - 1) return "tail"; - return "middle"; - })(); - - const subTrainStationPosition = showNearTrain.findIndex( - (d) => d.split(",")[0] == stationInfo - ); - const relationSub = (() => { - if (subTrainStationPosition == 0) return "head"; - if (subTrainStationPosition == showNearTrain.length - 1) return "tail"; - return "middle"; - })(); - - switch (relationMain) { - case "head": - if (relationSub == "head") { - return; - } else if (relationSub == "tail") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData, - ]; - } else if (relationSub == "middle") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData, - ]; - } else return; - case "tail": - if (relationSub == "head") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain, - ]; - } else if (relationSub == "tail") { - return; - } else if (relationSub == "middle") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain.slice(subTrainStationPosition), - ]; - } else return; - case "middle": - if (relationSub == "head") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain, - ]; - } else if (relationSub == "tail") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData.slice(mainTrainStationPosition), - ]; - } else return; - } - }; - const array = migrationArray(stationInfo); - if (!array) return; - setTrainData(array); - setIsConcatNear(true); - }; - - const openTrainInfo = (d) => { - const train = customTrainDataDetector(d); - let TrainNumber = ""; - if (train.trainNumDistance != undefined) { - const timeInfo = - parseInt(d.replace("M", "").replace("D", "")) - train.trainNumDistance; - TrainNumber = timeInfo + "号"; - } - const payload = { - data: { - trainNum: d, - limited: `${getTrainType(train.type).data}:${ - train.trainName - }${TrainNumber}`, - }, - navigate, - originalStationList, - from: "AllTrainDiagramView", - }; - SheetManager.hide("EachTrainInfo").then(() => { - //0.1秒待機してから開く - setTimeout(() => { - SheetManager.show("EachTrainInfo", { payload }); - }, 1); - }); - }; - return ( - - - - - - - {data.limited - ? getType(data.limited.split(":")[0]) + - migrateTrainName( - data.limited.split(":")[1] || - (trainData.length > 0 - ? trainData[trainData.length - 1].split(",")[0] + "行き" - : " ") - ) - : ""} - - - - {data.trainNum} - {isConcatNear ? ` + ${nearTrainIDList}` : ""} - - - {data.limited != undefined && - getType(data.limited.split(":")[0]) && - !data.limited.split(":")[1].match("サンポート") && ( - { - LayoutAnimation.easeInEaseOut(); //setLoadingDelayData(true); - navigate("trainbase", { - info: "train.html?tn=" + data.trainNum, - from, - }); - SheetManager.hide("EachTrainInfo"); - }} - /> - )} - - {isLandscape ? ( - - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* - ほげほげふがふが */} - - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} - - - - - - - - - ) : ( - - ) : ( - - ) - } - longHeader={ - from == "AllTrainDiagramView" ? ( - <> - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* - ほげほげふがふが */} - - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} - - - - - - - - - )} - - ); -}; diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js new file mode 100644 index 0000000..4e6dd2b --- /dev/null +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -0,0 +1,686 @@ +import React, { useEffect, useState, useRef } from "react"; +import { + View, + LayoutAnimation, + Text, + TouchableOpacity, + Platform, + StyleSheet, + useWindowDimensions, +} from "react-native"; +import { Ionicons } from "@expo/vector-icons"; +import ActionSheet, { + SheetManager, + useScrollHandlers, +} from "react-native-actions-sheet"; +import { AS } from "../../storageControl"; +import trainList from "../../assets/originData/trainList"; +import { lineList } from "../../lib/getStationList"; +import { heightPercentageToDP } from "react-native-responsive-screen"; +import { useCurrentTrain } from "../../stateBox/useCurrentTrain"; +import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData"; +import { getTrainType } from "../../lib/getTrainType"; +import { customTrainDataDetector } from "../custom-train-data"; +import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; +import { EachStopList } from "./EachTrainInfo/EachStopList"; +import { DataFromButton } from "./EachTrainInfo/DataFromButton"; +import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView"; +import { LongHeader } from "./EachTrainInfo/LongHeader"; +import { ShortHeader } from "./EachTrainInfo/ShortHeader"; +import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; +import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo"; +export const EachTrainInfoCore = ({ + actionSheetRef, + data, + navigate, + originalStationList, + openStationACFromEachTrainInfo, + from, +}) => { + // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); + + const { currentTrain } = useCurrentTrain(); + const [currentTrainData, setCurrentTrainData] = useState(); + + // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); + + useEffect(() => { + console.log(currentTrain.length); + if (!currentTrain.length) return; + setCurrentTrainData( + checkDuplicateTrainData( + currentTrain.filter((d) => d.num == data.trainNum) + ) + ); + }, [currentTrain]); + + //bconst insets = useSafeAreaInsets(); + + const [headStation, setHeadStation] = useState(); + const [tailStation, setTailStation] = useState(); + const [isConcatNear, setIsConcatNear] = useState(false); + const [showNearTrain, setShowNearTrain] = useState([]); + const [nearTrainIDList, setNearTrainIDList] = useState([]); + const { getInfluencedTrainData } = useBusAndTrainData(); + const [trainPositionSwitch, setTrainPositionSwitch] = useState("false"); + const [currentPosition, setCurrentPosition] = useState([]); + const [trainData, setTrainData] = useState([]); + const stationList = + originalStationList && + lineList.map((d) => + originalStationList[d].map((a) => ({ + StationNumber: a.StationNumber, + StationName: a.Station_JP, + })) + ); + + const getStationData = (stationName) => { + const Stations = stationList.map((a) => + a.filter((d) => d.StationName == stationName) + ); + const Station = + Stations && + Stations.reduce((newArray, e) => { + return newArray.concat(e); + }, []); + if (!Station[0]) return []; + return Station.map((d) => d.StationNumber)[0]; + }; + const stopStationIDList = trainData.map((i, index) => { + const [station, se, time] = i.split(","); + const Stations = stationList.map((a) => + a.filter((d) => d.StationName == station) + ); + const StationNumbers = + Stations && + Stations.reduce((newArray, e) => { + return newArray.concat(e); + }, []) + .filter((d) => d.StationNumber) + .map((d) => d.StationNumber); + return StationNumbers[0]; + }); + function findReversalPoints(array) { + try { + // arrayは現在位置の駅ID(駅在宅の場合は1つの配列、駅間の場合は2つの配列) + // stopStationIDListは停車駅の駅IDの配列 + if (!stopStationIDList.length) return []; + // arrayが二次元配列だったら早期リターン + if (!array instanceof Array) return []; + if (!array.length) return []; + if (array[0] instanceof Array) return []; + const arrayNumber = array.map((d) => ({ + line: d + .split("") + .filter((s) => "A" < s && s < "Z") + .join(""), + ID: d + .split("") + .filter((s) => "0" <= s && s <= "9") + .join(""), + })); + const stopStationIDListNumber = stopStationIDList.map((d) => { + if (!d) return { line: [], ID: [] }; + return { + line: d + .split("") + .filter((s) => "A" < s && s < "Z") + .join(""), + ID: d + .split("") + .filter((s) => "0" <= s && s <= "9") + .join(""), + }; + }); + // 完全一致 + if (array.length == 1) { + const index = stopStationIDList.indexOf(array[0]); + if (index != -1) return [index]; + // 通過駅の場合 + for (let i = 0; i < stopStationIDListNumber.length - 1; i++) { + if (stopStationIDListNumber[i].ID < arrayNumber[0].ID) { + if (stopStationIDListNumber[i + 1].ID > arrayNumber[0].ID) { + return [i + 1]; + } + } + if (stopStationIDListNumber[i].ID > arrayNumber[0].ID) { + if (stopStationIDListNumber[i + 1].ID < arrayNumber[0].ID) { + return [i + 1]; + } + } + } + } + // 駅間の場合 + if (array.length == 2) { + const index1 = stopStationIDList.indexOf(array[0]); + const index2 = stopStationIDList.indexOf(array[1]); + if (index1 != -1 && index2 != -1) { + // 駅間で通過駅も無い場合 + if (index1 < index2) { + if (index1 + 1 == index2) { + return [index2]; + } else { + const returnArray = []; + for (let i = index1 + 1; i <= index2; i++) { + returnArray.push(i); + } + return returnArray; + } + } + if (index1 > index2) { + if (index2 + 1 == index1) return [index1]; + else { + const returnArray = []; + for (let i = index2 + 1; i <= index1; i++) { + returnArray.push(i); + } + return returnArray; + } + } + } else { + const getNearStationID = (stationID) => { + for (let i = 0; i <= stopStationIDListNumber.length; i++) { + if (stopStationIDListNumber[i].ID < stationID) { + if (stopStationIDListNumber[i + 1].ID > stationID) { + return i + 1; + } + } + if (stopStationIDListNumber[i].ID > stationID) { + if (stopStationIDListNumber[i + 1].ID < stationID) { + return i + 1; + } + } + } + }; + let newIndex1 = index1; + let newIndex2 = index2; + if (index1 == -1) { + newIndex1 = getNearStationID(arrayNumber[0].ID); + } + if (index2 == -1) { + newIndex2 = getNearStationID(arrayNumber[1].ID); + } + if (newIndex1 && newIndex2) { + return [newIndex1, newIndex2]; + } + + // 通過駅の場合 + } + + return []; + } + } catch (e) { + console.log(e); + } + } + useEffect(() => { + if (trainData.length == 0) return; + if (showNearTrain.length == 0) return; + showNearTrain.forEach((d) => { + const [station, se, time] = d.split(","); + + if (station == trainData[0].split(",")[0]) + setHeadStation(trainData[0].split(",")[0]); + if (station == trainData[trainData.length - 1].split(",")[0]) + setTailStation(trainData[trainData.length - 1].split(",")[0]); + }); + }, [trainData, showNearTrain]); + //裏列車探索 + useEffect(() => { + if (!data.trainNum) return; + const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum); + setNearTrainIDList(returnArray); + setShowNearTrain(TDArray); + }, [data]); + const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); + const migrateTrainName = (string) => { + return string + .replace("マリン", "マリンライナー") + .replace("ライナーライナー", "ライナー"); + }; + const getType = (string) => { + switch (string) { + case "express": + return "特急"; + case "rapid": + return "快速"; + default: + return ""; + } + }; + + // 使用例 + const points = + trainPositionSwitch == "true" ? findReversalPoints(currentPosition) : []; + const { height, width } = useWindowDimensions(); + const [isLandscape, setIsLandscape] = useState(false); + useEffect(() => { + //currentTrainData.Pos = "鴨川~端岡"; //test + if (!currentTrainData) return; + if (!currentTrainData?.Pos) return; + if (currentTrainData?.Pos.match("~")) { + const pos = currentTrainData?.Pos.replace("(下り)", "") + .replace("(上り)", "") + .split("~"); + setCurrentPosition([getStationData(pos[0]), getStationData(pos[1])]); + } else { + setCurrentPosition([getStationData(currentTrainData?.Pos)]); + } + }, [currentTrainData]); + useEffect(() => { + if (height / width > 1.5) { + setIsLandscape(false); + } + if (height / width < 1.5) { + setIsLandscape(true); + } + }, [width, height]); + useEffect(() => { + if (!data.trainNum) return; + const TD = trainList[data.trainNum]; + if (!TD) { + setTrainData([]); + return; + } + setTrainData(TD.split("#").filter((d) => d != "")); + }, [data]); + useEffect(() => { + //列車現在地アイコン表示スイッチ + AS.getItem("trainPositionSwitch") + .then((d) => { + if (d) { + setTrainPositionSwitch(d); + } else { + } + }) + .catch((d) => AS.setItem("trainPositionSwitch", "false")); + }, []); + + const openBackTrainInfo = (stationInfo, currentTrainIndex) => { + const migrationArray = (stationInfo) => { + const mainTrainStationPosition = trainData.findIndex( + (d) => d.split(",")[0] == stationInfo + ); + + const relationMain = (() => { + if (mainTrainStationPosition == 0) return "head"; + if (mainTrainStationPosition == trainData.length - 1) return "tail"; + return "middle"; + })(); + + const subTrainStationPosition = showNearTrain.findIndex( + (d) => d.split(",")[0] == stationInfo + ); + const relationSub = (() => { + if (subTrainStationPosition == 0) return "head"; + if (subTrainStationPosition == showNearTrain.length - 1) return "tail"; + return "middle"; + })(); + + switch (relationMain) { + case "head": + if (relationSub == "head") { + return; + } else if (relationSub == "tail") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData, + ]; + } else if (relationSub == "middle") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData, + ]; + } else return; + case "tail": + if (relationSub == "head") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain, + ]; + } else if (relationSub == "tail") { + return; + } else if (relationSub == "middle") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain.slice(subTrainStationPosition), + ]; + } else return; + case "middle": + if (relationSub == "head") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain, + ]; + } else if (relationSub == "tail") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData.slice(mainTrainStationPosition), + ]; + } else return; + } + }; + const array = migrationArray(stationInfo); + if (!array) return; + setTrainData(array); + setIsConcatNear(true); + }; + + const openTrainInfo = (d) => { + const train = customTrainDataDetector(d); + let TrainNumber = ""; + if (train.trainNumDistance != undefined) { + const timeInfo = + parseInt(d.replace("M", "").replace("D", "")) - train.trainNumDistance; + TrainNumber = timeInfo + "号"; + } + const payload = { + data: { + trainNum: d, + limited: `${getTrainType(train.type).data}:${ + train.trainName + }${TrainNumber}`, + }, + navigate, + originalStationList, + from: "AllTrainDiagramView", + }; + SheetManager.hide("EachTrainInfo").then(() => { + //0.1秒待機してから開く + setTimeout(() => { + SheetManager.show("EachTrainInfo", { payload }); + }, 1); + }); + }; + return ( + + + + + + + {data.limited + ? getType(data.limited.split(":")[0]) + + migrateTrainName( + data.limited.split(":")[1] || + (trainData.length > 0 + ? trainData[trainData.length - 1].split(",")[0] + "行き" + : " ") + ) + : ""} + + + + {data.trainNum} + {isConcatNear ? ` + ${nearTrainIDList}` : ""} + + + {data.limited != undefined && + getType(data.limited.split(":")[0]) && + !data.limited.split(":")[1].match("サンポート") && ( + { + LayoutAnimation.easeInEaseOut(); //setLoadingDelayData(true); + navigate("trainbase", { + info: "train.html?tn=" + data.trainNum, + from, + }); + SheetManager.hide("EachTrainInfo"); + }} + /> + )} + + {isLandscape ? ( + + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* + ほげほげふがふが */} + + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} + + + + + + + + + ) : ( + + ) : ( + + ) + } + longHeader={ + from == "AllTrainDiagramView" ? ( + <> + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* + ほげほげふがふが */} + + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} + + + + + + + + + )} + + ); +}; + +const styles = StyleSheet.create({ + header: { + justifyContent: "center", + alignItems: "center", + left: 0, + right: 0, + //paddingTop: 10, + position: "absolute", + zIndex: 1, + backgroundColor: "f0f0f0", + }, + headerText: { + color: "#fff", + fontSize: 25, + fontWeight: "bold", + textAlign: "center", + }, +}); From bf2b4d356cacecfc0c5300304da2473d4a2dcaae Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Mon, 12 Feb 2024 17:58:25 +0900 Subject: [PATCH 19/27] =?UTF-8?q?=E3=82=B9=E3=82=AF=E3=83=AD=E3=83=BC?= =?UTF-8?q?=E3=83=AB=E3=81=AE=E6=8C=99=E5=8B=95=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfo.js | 34 ++----------------- .../EachTrainInfoCore.js | 1 + 2 files changed, 4 insertions(+), 31 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfo.js b/components/ActionSheetComponents/EachTrainInfo.js index 1d4701b..6331cca 100644 --- a/components/ActionSheetComponents/EachTrainInfo.js +++ b/components/ActionSheetComponents/EachTrainInfo.js @@ -1,34 +1,6 @@ -import React, { useEffect, useState, useRef } from "react"; -import { - View, - LayoutAnimation, - Text, - TouchableOpacity, - Platform, - StyleSheet, - useWindowDimensions, -} from "react-native"; -import { Ionicons } from "@expo/vector-icons"; -import ActionSheet, { - SheetManager, - useScrollHandlers, -} from "react-native-actions-sheet"; -import { AS } from "../../storageControl"; -import trainList from "../../assets/originData/trainList"; -import { lineList } from "../../lib/getStationList"; -import { heightPercentageToDP } from "react-native-responsive-screen"; -import { useCurrentTrain } from "../../stateBox/useCurrentTrain"; -import { checkDuplicateTrainData } from "../../lib/checkDuplicateTrainData"; -import { getTrainType } from "../../lib/getTrainType"; -import { customTrainDataDetector } from "../custom-train-data"; -import { useBusAndTrainData } from "../../stateBox/useBusAndTrainData"; -import { EachStopList } from "./EachTrainInfo/EachStopList"; -import { DataFromButton } from "./EachTrainInfo/DataFromButton"; -import { DynamicHeaderScrollView } from "../DynamicHeaderScrollView"; -import { LongHeader } from "./EachTrainInfo/LongHeader"; -import { ShortHeader } from "./EachTrainInfo/ShortHeader"; -import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; -import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo"; +import React, { useRef } from "react"; +import { Platform } from "react-native"; +import ActionSheet from "react-native-actions-sheet"; import { EachTrainInfoCore } from "./EachTrainInfoCore"; export const EachTrainInfo = (props) => { if (!props.payload) return <>; diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 4e6dd2b..f20b8b6 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -550,6 +550,7 @@ export const EachTrainInfoCore = ({ ) : ( Date: Mon, 12 Feb 2024 21:51:35 +0900 Subject: [PATCH 20/27] =?UTF-8?q?=E6=A8=AA=E6=96=B9=E5=90=91=E3=81=AE?= =?UTF-8?q?=E3=82=A2=E3=83=8B=E3=83=A1=E3=83=BC=E3=82=B7=E3=83=A7=E3=83=B3?= =?UTF-8?q?=E3=82=84=E8=A6=81=E7=B4=A0=E3=81=AE=E8=A2=AB=E3=82=8A=E3=82=92?= =?UTF-8?q?=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 85 ++++++++++++++++++- .../EachTrainInfo/TrainDataView.js | 2 +- .../EachTrainInfoCore.js | 41 +++++---- 3 files changed, 108 insertions(+), 20 deletions(-) diff --git a/Apps.js b/Apps.js index 2e3e09d..a405cb9 100644 --- a/Apps.js +++ b/Apps.js @@ -5,6 +5,7 @@ import { Text, TouchableOpacity, useWindowDimensions, + LayoutAnimation, } from "react-native"; import { WebView } from "react-native-webview"; import Constants from "expo-constants"; @@ -19,6 +20,7 @@ import { useFavoriteStation } from "./stateBox/useFavoriteStation"; import { useCurrentTrain } from "./stateBox/useCurrentTrain"; import { SheetManager } from "react-native-actions-sheet"; import TrainMenu from "./components/trainMenu"; +import { EachTrainInfoCore } from "./components/ActionSheetComponents/EachTrainInfoCore"; /* import StatusbarDetect from './StatusbarDetect'; var Status = StatusbarDetect(); */ @@ -186,6 +188,7 @@ export default function Apps({ navigation, webview, stationData }) { case "ShowTrainTimeInfo": { const { trainNum, limited } = dataSet; //alert(trainNum, limited); + LayoutAnimation.easeInEaseOut(); setTrainInfo({ trainNum, limited, @@ -193,6 +196,7 @@ export default function Apps({ navigation, webview, stationData }) { currentTrain.filter((a) => a.num == trainNum) ), }); //遅延情報は未実装 + if (isLandscape) return; const payload = { data: { trainNum, @@ -294,7 +298,7 @@ export default function Apps({ navigation, webview, stationData }) { }} onLayout={handleLayout} > - {isLandscape ? ( + {!trainInfo.trainData && isLandscape ? ( + {isLandscape && trainInfo.trainData && ( + + + + )} {isLandscape || ( navigate("trainMenu", { webview })} @@ -350,9 +373,23 @@ export default function Apps({ navigation, webview, stationData }) { mapSwitch={mapSwitch == "true" ? "flex" : "none"} /> )} + {isLandscape && trainInfo.trainData && ( + { + LayoutAnimation.easeInEaseOut(); + setTrainInfo({ + trainNum: undefined, + limited: undefined, + trainData: undefined, + }); + }} + top={Platform.OS == "ios" ? Constants.statusBarHeight : 0} + /> + )} webview.current.reload()} top={Platform.OS == "ios" ? Constants.statusBarHeight : 0} + right={isLandscape && trainInfo.trainData ? (width / 100) * 40 : 0} LoadError={LoadError} /> @@ -395,12 +432,54 @@ const MapsButton = ({ onPress, top, mapSwitch }) => { ); }; -const ReloadButton = ({ onPress, top, mapSwitch, LoadError = false }) => { +const LandscapeBackButton = ({ onPress, top }) => { const styles = { touch: { position: "absolute", top, - right: 10, + left: 10, + width: 50, + height: 50, + backgroundColor: "#0099CC", + borderColor: "white", + borderStyle: "solid", + borderWidth: 1, + borderRadius: 50, + alignContent: "center", + alignSelf: "center", + alignItems: "center", + display: "flex", + }, + text: { + textAlign: "center", + width: "auto", + height: "auto", + textAlignVertical: "center", + fontWeight: "bold", + color: "white", + }, + }; + return ( + + + + + + ); +}; + +const ReloadButton = ({ + onPress, + top, + mapSwitch, + LoadError = false, + right, +}) => { + const styles = { + touch: { + position: "absolute", + top, + right: 10 + right, width: 50, height: 50, backgroundColor: LoadError ? "red" : "#0099CC", diff --git a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js index 6ac2eb7..e8a229e 100644 --- a/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js +++ b/components/ActionSheetComponents/EachTrainInfo/TrainDataView.js @@ -35,7 +35,7 @@ export const TrainDataView = ({ flexDirection: "row", //minHeight: 200, //height: heightPercentageToDP("20%"), - width: isLandscape ? width / 2 : width, + width: isLandscape ? (width / 100) * 40 : width, flex: 1, }} > diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index f20b8b6..029a48a 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -52,7 +52,7 @@ export const EachTrainInfoCore = ({ currentTrain.filter((d) => d.num == data.trainNum) ) ); - }, [currentTrain]); + }, [currentTrain, data.trainNum]); //bconst insets = useSafeAreaInsets(); @@ -232,7 +232,9 @@ export const EachTrainInfoCore = ({ setNearTrainIDList(returnArray); setShowNearTrain(TDArray); }, [data]); - const scrollHandlers = useScrollHandlers("scrollview-1", actionSheetRef); + const scrollHandlers = actionSheetRef + ? useScrollHandlers("scrollview-1", actionSheetRef) + : null; const migrateTrainName = (string) => { return string .replace("マリン", "マリンライナー") @@ -401,18 +403,20 @@ export const EachTrainInfoCore = ({ borderWidth: 1, }} > - - - + {isLandscape || ( + + + + )} {data.limited @@ -450,7 +454,8 @@ export const EachTrainInfoCore = ({ /> )} - {isLandscape ? ( + {/* {isLandscape */} + {false ? ( Date: Mon, 12 Feb 2024 21:52:50 +0900 Subject: [PATCH 21/27] =?UTF-8?q?=E4=B8=8D=E8=A6=81=E3=81=A3=E3=81=BD?= =?UTF-8?q?=E3=81=84=E3=81=AE=E3=81=A7=E5=89=8A=E9=99=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../EachTrainInfoCore.js | 312 ++++++------------ 1 file changed, 103 insertions(+), 209 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 029a48a..06d9fd9 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -454,47 +454,63 @@ export const EachTrainInfoCore = ({ /> )} - {/* {isLandscape */} - {false ? ( - - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* + ) : ( + + ) + } + longHeader={ + from == "AllTrainDiagramView" ? ( + <> + ) : ( + + ) + } + topStickyContent={ + + } + > + {headStation && !isConcatNear && ( + openBackTrainInfo(headStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の始発駅」を表示 + + + )} + {/* ほげほげふがふが */} - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} + {trainData.map((i, index) => + i.split(",")[1] == "提" ? ( + + ) : ( + + ) + )} + {tailStation && !isConcatNear && ( + openBackTrainInfo(tailStation)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 「本当の終着駅」を表示 + + + )} - - - - - + + + + - - ) : ( - - ) : ( - - ) - } - longHeader={ - from == "AllTrainDiagramView" ? ( - <> - ) : ( - - ) - } - topStickyContent={ - - } - > - {headStation && !isConcatNear && ( - openBackTrainInfo(headStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の始発駅」を表示 - - - )} - {/* - ほげほげふがふが */} - - {trainData.map((i, index) => - i.split(",")[1] == "提" ? ( - - ) : ( - - ) - )} - {tailStation && !isConcatNear && ( - openBackTrainInfo(tailStation)} - style={{ - padding: 10, - flexDirection: "row", - borderColor: "blue", - borderWidth: 1, - margin: 10, - borderRadius: 5, - alignItems: "center", - }} - > - - 「本当の終着駅」を表示 - - - )} - - - - - - - - - )} + + ); }; From 91c8bec6b00b220c7807a0f927351c9d215bc278 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 14 Feb 2024 00:14:10 +0900 Subject: [PATCH 22/27] =?UTF-8?q?S=E5=88=97=E8=BB=8A=E5=88=A4=E5=AE=9A?= =?UTF-8?q?=E3=83=9C=E3=82=BF=E3=83=B3=E8=BF=BD=E5=8A=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../EachTrainInfoCore.js | 42 ++++++++++++++++++- 1 file changed, 41 insertions(+), 1 deletion(-) diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 06d9fd9..6971081 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -277,15 +277,38 @@ export const EachTrainInfoCore = ({ setIsLandscape(true); } }, [width, height]); + const [trueTrainID, setTrueTrainID] = useState(); useEffect(() => { if (!data.trainNum) return; const TD = trainList[data.trainNum]; if (!TD) { + searchSpecialTrain(data.trainNum); setTrainData([]); return; } setTrainData(TD.split("#").filter((d) => d != "")); }, [data]); + const searchSpecialTrain = (trainNum) => { + const searchBase = trainNum.replace("S", "").replace("X", ""); + const search = (text) => { + const TD = trainList[searchBase + text]; + if (TD) { + return true; + } + return false; + }; + if (search("D")) setTrueTrainID(searchBase + "D"); + if (search("M")) setTrueTrainID(searchBase + "M"); + }; + const replaceSpecialTrainDetail = (trainNum) => { + let TD = trainList[trainNum]; + + if (TD) { + setTrainData(TD.split("#").filter((d) => d != "")); + return; + } + }; + useEffect(() => { //列車現在地アイコン表示スイッチ AS.getItem("trainPositionSwitch") @@ -517,7 +540,24 @@ export const EachTrainInfoCore = ({ source={require("../../assets/51690-loading-diamonds.json")} /> ほげほげふがふが */} - + {trainData.length == 0 && trueTrainID && ( + replaceSpecialTrainDetail(trueTrainID)} + style={{ + padding: 10, + flexDirection: "row", + borderColor: "blue", + borderWidth: 1, + margin: 10, + borderRadius: 5, + alignItems: "center", + }} + > + + 本来の列車情報を表示 + + + )} {trainData.map((i, index) => i.split(",")[1] == "提" ? ( From 039dff5d8f78cc46d00cc99d569e7e124001240a Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 14 Feb 2024 00:48:34 +0900 Subject: [PATCH 23/27] =?UTF-8?q?=E4=B8=80=E9=83=A8function=E3=81=AE?= =?UTF-8?q?=E5=88=86=E5=B2=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../EachTrainInfoCore.js | 266 +++--------------- .../findReversalPoints.js | 113 ++++++++ lib/eachTrainInfoCoreLib/getStationData.js | 15 + lib/eachTrainInfoCoreLib/getType.js | 11 + lib/eachTrainInfoCoreLib/migrateTrainName.js | 7 + lib/eachTrainInfoCoreLib/openBackTrainInfo.js | 68 +++++ .../searchSpecialTrain.js | 13 + 7 files changed, 265 insertions(+), 228 deletions(-) create mode 100644 lib/eachTrainInfoCoreLib/findReversalPoints.js create mode 100644 lib/eachTrainInfoCoreLib/getStationData.js create mode 100644 lib/eachTrainInfoCoreLib/getType.js create mode 100644 lib/eachTrainInfoCoreLib/migrateTrainName.js create mode 100644 lib/eachTrainInfoCoreLib/openBackTrainInfo.js create mode 100644 lib/eachTrainInfoCoreLib/searchSpecialTrain.js diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 6971081..13ae3b2 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -29,6 +29,13 @@ import { LongHeader } from "./EachTrainInfo/LongHeader"; import { ShortHeader } from "./EachTrainInfo/ShortHeader"; import { ScrollStickyContent } from "./EachTrainInfo/ScrollStickyContent"; import { LandscapeTrainInfo } from "./EachTrainInfo/LandscapeTrainInfo"; +import { getStationData } from "../../lib/eachTrainInfoCoreLib/getStationData"; +import { findReversalPoints } from "../../lib/eachTrainInfoCoreLib/findReversalPoints"; +import { migrateTrainName } from "../../lib/eachTrainInfoCoreLib/migrateTrainName"; +import { getType } from "../../lib/eachTrainInfoCoreLib/getType"; +import { searchSpecialTrain } from "../../lib/eachTrainInfoCoreLib/searchSpecialTrain"; +import { openBackTrainInfo } from "../../lib/eachTrainInfoCoreLib/openBackTrainInfo"; + export const EachTrainInfoCore = ({ actionSheetRef, data, @@ -74,18 +81,6 @@ export const EachTrainInfoCore = ({ })) ); - const getStationData = (stationName) => { - const Stations = stationList.map((a) => - a.filter((d) => d.StationName == stationName) - ); - const Station = - Stations && - Stations.reduce((newArray, e) => { - return newArray.concat(e); - }, []); - if (!Station[0]) return []; - return Station.map((d) => d.StationNumber)[0]; - }; const stopStationIDList = trainData.map((i, index) => { const [station, se, time] = i.split(","); const Stations = stationList.map((a) => @@ -100,119 +95,6 @@ export const EachTrainInfoCore = ({ .map((d) => d.StationNumber); return StationNumbers[0]; }); - function findReversalPoints(array) { - try { - // arrayは現在位置の駅ID(駅在宅の場合は1つの配列、駅間の場合は2つの配列) - // stopStationIDListは停車駅の駅IDの配列 - if (!stopStationIDList.length) return []; - // arrayが二次元配列だったら早期リターン - if (!array instanceof Array) return []; - if (!array.length) return []; - if (array[0] instanceof Array) return []; - const arrayNumber = array.map((d) => ({ - line: d - .split("") - .filter((s) => "A" < s && s < "Z") - .join(""), - ID: d - .split("") - .filter((s) => "0" <= s && s <= "9") - .join(""), - })); - const stopStationIDListNumber = stopStationIDList.map((d) => { - if (!d) return { line: [], ID: [] }; - return { - line: d - .split("") - .filter((s) => "A" < s && s < "Z") - .join(""), - ID: d - .split("") - .filter((s) => "0" <= s && s <= "9") - .join(""), - }; - }); - // 完全一致 - if (array.length == 1) { - const index = stopStationIDList.indexOf(array[0]); - if (index != -1) return [index]; - // 通過駅の場合 - for (let i = 0; i < stopStationIDListNumber.length - 1; i++) { - if (stopStationIDListNumber[i].ID < arrayNumber[0].ID) { - if (stopStationIDListNumber[i + 1].ID > arrayNumber[0].ID) { - return [i + 1]; - } - } - if (stopStationIDListNumber[i].ID > arrayNumber[0].ID) { - if (stopStationIDListNumber[i + 1].ID < arrayNumber[0].ID) { - return [i + 1]; - } - } - } - } - // 駅間の場合 - if (array.length == 2) { - const index1 = stopStationIDList.indexOf(array[0]); - const index2 = stopStationIDList.indexOf(array[1]); - if (index1 != -1 && index2 != -1) { - // 駅間で通過駅も無い場合 - if (index1 < index2) { - if (index1 + 1 == index2) { - return [index2]; - } else { - const returnArray = []; - for (let i = index1 + 1; i <= index2; i++) { - returnArray.push(i); - } - return returnArray; - } - } - if (index1 > index2) { - if (index2 + 1 == index1) return [index1]; - else { - const returnArray = []; - for (let i = index2 + 1; i <= index1; i++) { - returnArray.push(i); - } - return returnArray; - } - } - } else { - const getNearStationID = (stationID) => { - for (let i = 0; i <= stopStationIDListNumber.length; i++) { - if (stopStationIDListNumber[i].ID < stationID) { - if (stopStationIDListNumber[i + 1].ID > stationID) { - return i + 1; - } - } - if (stopStationIDListNumber[i].ID > stationID) { - if (stopStationIDListNumber[i + 1].ID < stationID) { - return i + 1; - } - } - } - }; - let newIndex1 = index1; - let newIndex2 = index2; - if (index1 == -1) { - newIndex1 = getNearStationID(arrayNumber[0].ID); - } - if (index2 == -1) { - newIndex2 = getNearStationID(arrayNumber[1].ID); - } - if (newIndex1 && newIndex2) { - return [newIndex1, newIndex2]; - } - - // 通過駅の場合 - } - - return []; - } - } catch (e) { - console.log(e); - } - } useEffect(() => { if (trainData.length == 0) return; if (showNearTrain.length == 0) return; @@ -235,25 +117,12 @@ export const EachTrainInfoCore = ({ const scrollHandlers = actionSheetRef ? useScrollHandlers("scrollview-1", actionSheetRef) : null; - const migrateTrainName = (string) => { - return string - .replace("マリン", "マリンライナー") - .replace("ライナーライナー", "ライナー"); - }; - const getType = (string) => { - switch (string) { - case "express": - return "特急"; - case "rapid": - return "快速"; - default: - return ""; - } - }; // 使用例 const points = - trainPositionSwitch == "true" ? findReversalPoints(currentPosition) : []; + trainPositionSwitch == "true" + ? findReversalPoints(currentPosition, stopStationIDList) + : []; const { height, width } = useWindowDimensions(); const [isLandscape, setIsLandscape] = useState(false); useEffect(() => { @@ -264,9 +133,12 @@ export const EachTrainInfoCore = ({ const pos = currentTrainData?.Pos.replace("(下り)", "") .replace("(上り)", "") .split("~"); - setCurrentPosition([getStationData(pos[0]), getStationData(pos[1])]); + setCurrentPosition([ + getStationData(pos[0], stationList), + getStationData(pos[1], stationList), + ]); } else { - setCurrentPosition([getStationData(currentTrainData?.Pos)]); + setCurrentPosition([getStationData(currentTrainData?.Pos, stationList)]); } }, [currentTrainData]); useEffect(() => { @@ -282,24 +154,13 @@ export const EachTrainInfoCore = ({ if (!data.trainNum) return; const TD = trainList[data.trainNum]; if (!TD) { - searchSpecialTrain(data.trainNum); + const specialTrainActualID = searchSpecialTrain(data.trainNum, trainList); + if (specialTrainActualID) setTrueTrainID(specialTrainActualID); setTrainData([]); return; } setTrainData(TD.split("#").filter((d) => d != "")); }, [data]); - const searchSpecialTrain = (trainNum) => { - const searchBase = trainNum.replace("S", "").replace("X", ""); - const search = (text) => { - const TD = trainList[searchBase + text]; - if (TD) { - return true; - } - return false; - }; - if (search("D")) setTrueTrainID(searchBase + "D"); - if (search("M")) setTrueTrainID(searchBase + "M"); - }; const replaceSpecialTrainDetail = (trainNum) => { let TD = trainList[trainNum]; @@ -321,76 +182,6 @@ export const EachTrainInfoCore = ({ .catch((d) => AS.setItem("trainPositionSwitch", "false")); }, []); - const openBackTrainInfo = (stationInfo, currentTrainIndex) => { - const migrationArray = (stationInfo) => { - const mainTrainStationPosition = trainData.findIndex( - (d) => d.split(",")[0] == stationInfo - ); - - const relationMain = (() => { - if (mainTrainStationPosition == 0) return "head"; - if (mainTrainStationPosition == trainData.length - 1) return "tail"; - return "middle"; - })(); - - const subTrainStationPosition = showNearTrain.findIndex( - (d) => d.split(",")[0] == stationInfo - ); - const relationSub = (() => { - if (subTrainStationPosition == 0) return "head"; - if (subTrainStationPosition == showNearTrain.length - 1) return "tail"; - return "middle"; - })(); - - switch (relationMain) { - case "head": - if (relationSub == "head") { - return; - } else if (relationSub == "tail") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData, - ]; - } else if (relationSub == "middle") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData, - ]; - } else return; - case "tail": - if (relationSub == "head") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain, - ]; - } else if (relationSub == "tail") { - return; - } else if (relationSub == "middle") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain.slice(subTrainStationPosition), - ]; - } else return; - case "middle": - if (relationSub == "head") { - return [ - ...trainData.slice(0, mainTrainStationPosition), - ...showNearTrain, - ]; - } else if (relationSub == "tail") { - return [ - ...showNearTrain.slice(0, subTrainStationPosition), - ...trainData.slice(mainTrainStationPosition), - ]; - } else return; - } - }; - const array = migrationArray(stationInfo); - if (!array) return; - setTrainData(array); - setIsConcatNear(true); - }; - const openTrainInfo = (d) => { const train = customTrainDataDetector(d); let TrainNumber = ""; @@ -517,7 +308,16 @@ export const EachTrainInfoCore = ({ > {headStation && !isConcatNear && ( openBackTrainInfo(headStation)} + onPress={() => { + const array = openBackTrainInfo( + headStation, + trainData, + showNearTrain + ); + if (!array) return; + setTrainData(array); + setIsConcatNear(true); + }} style={{ padding: 10, flexDirection: "row", @@ -574,7 +374,17 @@ export const EachTrainInfoCore = ({ )} {tailStation && !isConcatNear && ( openBackTrainInfo(tailStation)} + onPress={() => { + const array = openBackTrainInfo( + tailStation, + trainData, + showNearTrain + ); + + if (!array) return; + setTrainData(array); + setIsConcatNear(true); + }} style={{ padding: 10, flexDirection: "row", diff --git a/lib/eachTrainInfoCoreLib/findReversalPoints.js b/lib/eachTrainInfoCoreLib/findReversalPoints.js new file mode 100644 index 0000000..7a84fd6 --- /dev/null +++ b/lib/eachTrainInfoCoreLib/findReversalPoints.js @@ -0,0 +1,113 @@ +// arrayは現在位置の駅ID(駅在宅の場合は1つの配列、駅間の場合は2つの配列) +// stopStationIDListは停車駅の駅IDの配列 [Y01,Y02,Y05,...] +export const findReversalPoints = (array, stopStationIDList) => { + try { + if (!stopStationIDList.length) return []; + // arrayが二次元配列だったら早期リターン + if (!array instanceof Array) return []; + if (!array.length) return []; + if (array[0] instanceof Array) return []; + const arrayNumber = array.map((d) => ({ + line: d + .split("") + .filter((s) => "A" < s && s < "Z") + .join(""), + ID: d + .split("") + .filter((s) => "0" <= s && s <= "9") + .join(""), + })); + const stopStationIDListNumber = stopStationIDList.map((d) => { + if (!d) return { line: [], ID: [] }; + return { + line: d + .split("") + .filter((s) => "A" < s && s < "Z") + .join(""), + ID: d + .split("") + .filter((s) => "0" <= s && s <= "9") + .join(""), + }; + }); + // 完全一致 + if (array.length == 1) { + const index = stopStationIDList.indexOf(array[0]); + if (index != -1) return [index]; + // 通過駅の場合 + for (let i = 0; i < stopStationIDListNumber.length - 1; i++) { + if (stopStationIDListNumber[i].ID < arrayNumber[0].ID) { + if (stopStationIDListNumber[i + 1].ID > arrayNumber[0].ID) { + return [i + 1]; + } + } + if (stopStationIDListNumber[i].ID > arrayNumber[0].ID) { + if (stopStationIDListNumber[i + 1].ID < arrayNumber[0].ID) { + return [i + 1]; + } + } + } + } + // 駅間の場合 + if (array.length == 2) { + const index1 = stopStationIDList.indexOf(array[0]); + const index2 = stopStationIDList.indexOf(array[1]); + if (index1 != -1 && index2 != -1) { + // 駅間で通過駅も無い場合 + if (index1 < index2) { + if (index1 + 1 == index2) { + return [index2]; + } else { + const returnArray = []; + for (let i = index1 + 1; i <= index2; i++) { + returnArray.push(i); + } + return returnArray; + } + } + if (index1 > index2) { + if (index2 + 1 == index1) return [index1]; + else { + const returnArray = []; + for (let i = index2 + 1; i <= index1; i++) { + returnArray.push(i); + } + return returnArray; + } + } + } else { + const getNearStationID = (stationID) => { + for (let i = 0; i <= stopStationIDListNumber.length; i++) { + if (stopStationIDListNumber[i].ID < stationID) { + if (stopStationIDListNumber[i + 1].ID > stationID) { + return i + 1; + } + } + if (stopStationIDListNumber[i].ID > stationID) { + if (stopStationIDListNumber[i + 1].ID < stationID) { + return i + 1; + } + } + } + }; + let newIndex1 = index1; + let newIndex2 = index2; + if (index1 == -1) { + newIndex1 = getNearStationID(arrayNumber[0].ID); + } + if (index2 == -1) { + newIndex2 = getNearStationID(arrayNumber[1].ID); + } + if (newIndex1 && newIndex2) { + return [newIndex1, newIndex2]; + } + + // 通過駅の場合 + } + + return []; + } + } catch (e) { + console.log(e); + } +}; diff --git a/lib/eachTrainInfoCoreLib/getStationData.js b/lib/eachTrainInfoCoreLib/getStationData.js new file mode 100644 index 0000000..20b386a --- /dev/null +++ b/lib/eachTrainInfoCoreLib/getStationData.js @@ -0,0 +1,15 @@ +// 駅名から駅情報を取得する +//stationName: 駅名 +//stationList: 駅情報リスト +export const getStationData = (stationName, stationList) => { + const Stations = stationList.map((a) => + a.filter((d) => d.StationName == stationName) + ); + const Station = + Stations && + Stations.reduce((newArray, e) => { + return newArray.concat(e); + }, []); + if (!Station[0]) return []; + return Station.map((d) => d.StationNumber)[0]; +}; diff --git a/lib/eachTrainInfoCoreLib/getType.js b/lib/eachTrainInfoCoreLib/getType.js new file mode 100644 index 0000000..d989461 --- /dev/null +++ b/lib/eachTrainInfoCoreLib/getType.js @@ -0,0 +1,11 @@ +// 種別判定 +export const getType = (string) => { + switch (string) { + case "express": + return "特急"; + case "rapid": + return "快速"; + default: + return ""; + } +}; diff --git a/lib/eachTrainInfoCoreLib/migrateTrainName.js b/lib/eachTrainInfoCoreLib/migrateTrainName.js new file mode 100644 index 0000000..88e0a26 --- /dev/null +++ b/lib/eachTrainInfoCoreLib/migrateTrainName.js @@ -0,0 +1,7 @@ +// Description: 電車名の変換を行う。 +// マリンライナーやマリン表記をマリンライナーに変換する。 +export const migrateTrainName = (string) => { + return string + .replace("マリン", "マリンライナー") + .replace("ライナーライナー", "ライナー"); +}; diff --git a/lib/eachTrainInfoCoreLib/openBackTrainInfo.js b/lib/eachTrainInfoCoreLib/openBackTrainInfo.js new file mode 100644 index 0000000..8b5944b --- /dev/null +++ b/lib/eachTrainInfoCoreLib/openBackTrainInfo.js @@ -0,0 +1,68 @@ +export const openBackTrainInfo = (stationInfo, trainData, showNearTrain) => { + const migrationArray = (stationInfo) => { + const mainTrainStationPosition = trainData.findIndex( + (d) => d.split(",")[0] == stationInfo + ); + + const relationMain = (() => { + if (mainTrainStationPosition == 0) return "head"; + if (mainTrainStationPosition == trainData.length - 1) return "tail"; + return "middle"; + })(); + + const subTrainStationPosition = showNearTrain.findIndex( + (d) => d.split(",")[0] == stationInfo + ); + const relationSub = (() => { + if (subTrainStationPosition == 0) return "head"; + if (subTrainStationPosition == showNearTrain.length - 1) return "tail"; + return "middle"; + })(); + + switch (relationMain) { + case "head": + if (relationSub == "head") { + return; + } else if (relationSub == "tail") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData, + ]; + } else if (relationSub == "middle") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData, + ]; + } else return; + case "tail": + if (relationSub == "head") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain, + ]; + } else if (relationSub == "tail") { + return; + } else if (relationSub == "middle") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain.slice(subTrainStationPosition), + ]; + } else return; + case "middle": + if (relationSub == "head") { + return [ + ...trainData.slice(0, mainTrainStationPosition), + ...showNearTrain, + ]; + } else if (relationSub == "tail") { + return [ + ...showNearTrain.slice(0, subTrainStationPosition), + ...trainData.slice(mainTrainStationPosition), + ]; + } else return; + } + }; + const array = migrationArray(stationInfo); + if (!array) return null; + return array; +}; diff --git a/lib/eachTrainInfoCoreLib/searchSpecialTrain.js b/lib/eachTrainInfoCoreLib/searchSpecialTrain.js new file mode 100644 index 0000000..ec0e53d --- /dev/null +++ b/lib/eachTrainInfoCoreLib/searchSpecialTrain.js @@ -0,0 +1,13 @@ +// S列番の列車からDやMの列車を検索する +export const searchSpecialTrain = (trainNum, trainList) => { + const searchBase = trainNum.replace("S", "").replace("X", ""); + const search = (text) => { + const TD = trainList[searchBase + text]; + if (TD) { + return true; + } + return false; + }; + if (search("D")) return searchBase + "D"; + if (search("M")) return searchBase + "M"; +}; From 6b12dcbcf6af97a12c9143a82c5b89c8241ff436 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 14 Feb 2024 01:09:28 +0900 Subject: [PATCH 24/27] =?UTF-8?q?=E9=83=A8=E5=88=86=E6=95=B4=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../EachTrainInfoCore.js | 79 +++++++++---------- 1 file changed, 38 insertions(+), 41 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index 13ae3b2..e30f5a3 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -72,6 +72,10 @@ export const EachTrainInfoCore = ({ const [trainPositionSwitch, setTrainPositionSwitch] = useState("false"); const [currentPosition, setCurrentPosition] = useState([]); const [trainData, setTrainData] = useState([]); + const scrollHandlers = actionSheetRef + ? useScrollHandlers("scrollview-1", actionSheetRef) + : null; + const stationList = originalStationList && lineList.map((d) => @@ -81,6 +85,11 @@ export const EachTrainInfoCore = ({ })) ); + // 使用例 + const points = + trainPositionSwitch == "true" + ? findReversalPoints(currentPosition, stopStationIDList) + : []; const stopStationIDList = trainData.map((i, index) => { const [station, se, time] = i.split(","); const Stations = stationList.map((a) => @@ -95,10 +104,31 @@ export const EachTrainInfoCore = ({ .map((d) => d.StationNumber); return StationNumbers[0]; }); + + const { height, width } = useWindowDimensions(); + const [isLandscape, setIsLandscape] = useState(false); + + const [trueTrainID, setTrueTrainID] = useState(); useEffect(() => { + if (!data.trainNum) return; + const TD = trainList[data.trainNum]; + if (!TD) { + const specialTrainActualID = searchSpecialTrain(data.trainNum, trainList); + setTrueTrainID(specialTrainActualID || undefined); + setTrainData([]); + return; + } + setTrainData(TD.split("#").filter((d) => d != "")); + }, [data]); + //裏列車探索 + useEffect(() => { + if (!data.trainNum) return; + const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum); + setNearTrainIDList(returnArray); + setShowNearTrain(TDArray); if (trainData.length == 0) return; - if (showNearTrain.length == 0) return; - showNearTrain.forEach((d) => { + if (TDArray.length == 0) return; + TDArray.forEach((d) => { const [station, se, time] = d.split(","); if (station == trainData[0].split(",")[0]) @@ -106,25 +136,8 @@ export const EachTrainInfoCore = ({ if (station == trainData[trainData.length - 1].split(",")[0]) setTailStation(trainData[trainData.length - 1].split(",")[0]); }); - }, [trainData, showNearTrain]); - //裏列車探索 - useEffect(() => { - if (!data.trainNum) return; - const [returnArray, TDArray] = getInfluencedTrainData(data.trainNum); - setNearTrainIDList(returnArray); - setShowNearTrain(TDArray); - }, [data]); - const scrollHandlers = actionSheetRef - ? useScrollHandlers("scrollview-1", actionSheetRef) - : null; + }, [trainData, data]); - // 使用例 - const points = - trainPositionSwitch == "true" - ? findReversalPoints(currentPosition, stopStationIDList) - : []; - const { height, width } = useWindowDimensions(); - const [isLandscape, setIsLandscape] = useState(false); useEffect(() => { //currentTrainData.Pos = "鴨川~端岡"; //test if (!currentTrainData) return; @@ -141,6 +154,7 @@ export const EachTrainInfoCore = ({ setCurrentPosition([getStationData(currentTrainData?.Pos, stationList)]); } }, [currentTrainData]); + useEffect(() => { if (height / width > 1.5) { setIsLandscape(false); @@ -149,35 +163,18 @@ export const EachTrainInfoCore = ({ setIsLandscape(true); } }, [width, height]); - const [trueTrainID, setTrueTrainID] = useState(); - useEffect(() => { - if (!data.trainNum) return; - const TD = trainList[data.trainNum]; - if (!TD) { - const specialTrainActualID = searchSpecialTrain(data.trainNum, trainList); - if (specialTrainActualID) setTrueTrainID(specialTrainActualID); - setTrainData([]); - return; - } - setTrainData(TD.split("#").filter((d) => d != "")); - }, [data]); + const replaceSpecialTrainDetail = (trainNum) => { let TD = trainList[trainNum]; - - if (TD) { - setTrainData(TD.split("#").filter((d) => d != "")); - return; - } + if (!TD) return; + setTrainData(TD.split("#").filter((d) => d != "")); }; useEffect(() => { //列車現在地アイコン表示スイッチ AS.getItem("trainPositionSwitch") .then((d) => { - if (d) { - setTrainPositionSwitch(d); - } else { - } + if (d) setTrainPositionSwitch(d); }) .catch((d) => AS.setItem("trainPositionSwitch", "false")); }, []); From fe8df6af2e4c871811953c42e75c8dede4c9de89 Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 14 Feb 2024 01:28:24 +0900 Subject: [PATCH 25/27] =?UTF-8?q?=E6=81=90=E3=82=89=E3=81=8F=E9=96=A2?= =?UTF-8?q?=E9=80=A3=E5=88=97=E8=BB=8A=E3=83=9C=E3=82=BF=E3=83=B3=E3=81=8C?= =?UTF-8?q?=E5=8B=95=E4=BD=9C=E3=81=97=E3=81=AA=E3=81=84=E3=83=90=E3=82=B0?= =?UTF-8?q?=E3=82=92=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 1 + .../ActionSheetComponents/EachTrainInfoCore.js | 17 +++++++++++------ lib/eachTrainInfoCoreLib/findReversalPoints.js | 4 ++-- 3 files changed, 14 insertions(+), 8 deletions(-) diff --git a/Apps.js b/Apps.js index a405cb9..5afa461 100644 --- a/Apps.js +++ b/Apps.js @@ -362,6 +362,7 @@ export default function Apps({ navigation, webview, stationData }) { originalStationList, openStationACFromEachTrainInfo, from: "Train", + setTrainInfo, }} /> diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index e30f5a3..d761b43 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -43,6 +43,7 @@ export const EachTrainInfoCore = ({ originalStationList, openStationACFromEachTrainInfo, from, + setTrainInfo, }) => { // const [actionSheetHorizonalScroll, setActionSheetHorizonalScroll] = useState(false); @@ -198,12 +199,16 @@ export const EachTrainInfoCore = ({ originalStationList, from: "AllTrainDiagramView", }; - SheetManager.hide("EachTrainInfo").then(() => { - //0.1秒待機してから開く - setTimeout(() => { - SheetManager.show("EachTrainInfo", { payload }); - }, 1); - }); + if (setTrainInfo) { + setTrainInfo(payload.data); + } else { + SheetManager.hide("EachTrainInfo").then(() => { + //0.1秒待機してから開く + setTimeout(() => { + SheetManager.show("EachTrainInfo", { payload }); + }, 1); + }); + } }; return ( { try { - if (!stopStationIDList.length) return []; + if (!stopStationIDList) return []; // arrayが二次元配列だったら早期リターン if (!array instanceof Array) return []; - if (!array.length) return []; + if (!array) return []; if (array[0] instanceof Array) return []; const arrayNumber = array.map((d) => ({ line: d From a713ae576d57052402f6b6db4ddafbed10f48dda Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 14 Feb 2024 02:18:32 +0900 Subject: [PATCH 26/27] =?UTF-8?q?ios=E3=81=A7=E8=A1=A8=E7=A4=BA=E3=81=95?= =?UTF-8?q?=E3=82=8C=E3=81=AA=E3=81=84=E3=83=90=E3=82=B0=E3=82=92=E4=BF=AE?= =?UTF-8?q?=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ActionSheetComponents/EachTrainInfoCore.js | 2 +- components/DynamicHeaderScrollView.js | 13 +++++++------ 2 files changed, 8 insertions(+), 7 deletions(-) diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index d761b43..a7eb209 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -275,7 +275,7 @@ export const EachTrainInfoCore = ({ scrollViewProps={scrollHandlers} containerProps={{ style: { - maxHeight: isLandscape ? height - 94 : heightPercentageToDP("70%"), + maxHeight: isLandscape ? height - 94 : (height / 100) * 70, }, }} Max_Header_Height={from == "AllTrainDiagramView" ? 0 : 200} diff --git a/components/DynamicHeaderScrollView.js b/components/DynamicHeaderScrollView.js index 8254937..106e95a 100644 --- a/components/DynamicHeaderScrollView.js +++ b/components/DynamicHeaderScrollView.js @@ -1,4 +1,4 @@ -import { ScrollView, View, Animated } from "react-native"; +import { ScrollView, View, Animated, Platform } from "react-native"; import React, { useRef } from "react"; export const DynamicHeaderScrollView = (props) => { @@ -18,28 +18,28 @@ export const DynamicHeaderScrollView = (props) => { const Scroll_Distance = Max_Header_Height - Min_Header_Height; const animatedHeaderHeight = scrollOffsetY.interpolate({ - inputRange: [Scroll_Distance, Scroll_Distance + 10], + inputRange: [Scroll_Distance, Scroll_Distance + 30], outputRange: [Max_Header_Height, 0], extrapolate: "clamp", }); const animatedHeaderHeight2 = scrollOffsetY.interpolate({ - inputRange: [0, Scroll_Distance], + inputRange: [Scroll_Distance, Scroll_Distance + 30], outputRange: [Max_Header_Height, Min_Header_Height], extrapolate: "clamp", }); const animatedHeaderVisible = scrollOffsetY.interpolate({ - inputRange: [Min_Header_Height, Scroll_Distance], + inputRange: [Scroll_Distance - 30, Scroll_Distance], outputRange: [1, 0], extrapolate: "clamp", }); const animatedHeaderVisible2 = scrollOffsetY.interpolate({ - inputRange: [Min_Header_Height, Scroll_Distance], + inputRange: [Scroll_Distance - 30, Scroll_Distance + 30], outputRange: [0, 1], extrapolate: "clamp", }); return ( - + { {...scrollViewProps} style={{ backgroundColor: "white", + zIndex: 0, }} stickyHeaderIndices={[1]} scrollEventThrottle={16} From f3f9ee60c2d89616cdb1c555eb415779fdd3295e Mon Sep 17 00:00:00 2001 From: harukin-OneMix4 Date: Wed, 21 Feb 2024 05:51:14 +0900 Subject: [PATCH 27/27] =?UTF-8?q?=E6=A8=AA=E7=94=BB=E9=9D=A2=E3=81=A7?= =?UTF-8?q?=E7=94=BB=E9=9D=A2=E6=9B=B4=E6=96=B0=E3=81=8C=E4=B8=8D=E5=AE=8C?= =?UTF-8?q?=E5=85=A8=E3=81=AB=E3=81=AA=E3=82=8B=E3=83=90=E3=82=B0=E3=82=92?= =?UTF-8?q?=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Apps.js | 10 +++++----- .../EachTrainInfoCore.js | 19 +++++++++++++++---- 2 files changed, 20 insertions(+), 9 deletions(-) diff --git a/Apps.js b/Apps.js index 5afa461..0e9679b 100644 --- a/Apps.js +++ b/Apps.js @@ -298,7 +298,7 @@ export default function Apps({ navigation, webview, stationData }) { }} onLayout={handleLayout} > - {!trainInfo.trainData && isLandscape ? ( + {!trainInfo.trainNum && isLandscape ? ( - {isLandscape && trainInfo.trainData && ( + {isLandscape && trainInfo.trainNum && ( )} - {isLandscape && trainInfo.trainData && ( + {isLandscape && trainInfo.trainNum && ( { LayoutAnimation.easeInEaseOut(); @@ -390,7 +390,7 @@ export default function Apps({ navigation, webview, stationData }) { webview.current.reload()} top={Platform.OS == "ios" ? Constants.statusBarHeight : 0} - right={isLandscape && trainInfo.trainData ? (width / 100) * 40 : 0} + right={isLandscape && trainInfo.trainNum ? (width / 100) * 40 : 0} LoadError={LoadError} /> diff --git a/components/ActionSheetComponents/EachTrainInfoCore.js b/components/ActionSheetComponents/EachTrainInfoCore.js index a7eb209..756c047 100644 --- a/components/ActionSheetComponents/EachTrainInfoCore.js +++ b/components/ActionSheetComponents/EachTrainInfoCore.js @@ -113,6 +113,9 @@ export const EachTrainInfoCore = ({ useEffect(() => { if (!data.trainNum) return; const TD = trainList[data.trainNum]; + setIsConcatNear(false); + setHeadStation(); + setTailStation(); if (!TD) { const specialTrainActualID = searchSpecialTrain(data.trainNum, trainList); setTrueTrainID(specialTrainActualID || undefined); @@ -129,14 +132,22 @@ export const EachTrainInfoCore = ({ setShowNearTrain(TDArray); if (trainData.length == 0) return; if (TDArray.length == 0) return; + let head; + let tail; TDArray.forEach((d) => { const [station, se, time] = d.split(","); - if (station == trainData[0].split(",")[0]) - setHeadStation(trainData[0].split(",")[0]); - if (station == trainData[trainData.length - 1].split(",")[0]) - setTailStation(trainData[trainData.length - 1].split(",")[0]); + if (station == trainData[0].split(",")[0]) { + head = trainData[0].split(",")[0]; + } + if (station == trainData[trainData.length - 1].split(",")[0]) { + tail = trainData[trainData.length - 1].split(",")[0]; + } }); + if (head) setHeadStation(head); + else setHeadStation(); + if (tail) setTailStation(tail); + else setTailStation(); }, [trainData, data]); useEffect(() => {