Merge commit 'acd5d0bb882139379fe5e409f3b7f291a7a14dcf' into develop
This commit is contained in:
harukin-expo-dev-env
commit
d18e0f71e3
@ -50,26 +50,10 @@ export const SearchUnitBox = ({
|
||||
flexDirection: "column",
|
||||
display: "flex",
|
||||
flex: 1,
|
||||
alignContent: "center",
|
||||
justifyContent: "flex-end",
|
||||
}}
|
||||
>
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "white",
|
||||
borderRadius: 25,
|
||||
height: 30,
|
||||
paddingRight: 10,
|
||||
paddingLeft: 10,
|
||||
flex: 1,
|
||||
}}
|
||||
>
|
||||
<TextInput
|
||||
placeholder="駅名や駅ナンバリングを入力してフィルタリングします。"
|
||||
onEndEditing={() => {}}
|
||||
onChange={(ret) => setInput(ret.nativeEvent.text)}
|
||||
value={input}
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
</View>
|
||||
<View style={{ flexDirection: "row", alignItems: "center" }}>
|
||||
<TouchableOpacity
|
||||
onPress={() => {
|
||||
@ -87,43 +71,88 @@ export const SearchUnitBox = ({
|
||||
style={{ marginRight: 10 }}
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
{Object.keys(lineList_LineWebID).map((d) => (
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
flex: 1,
|
||||
backgroundColor:
|
||||
lineColorList[stationIDPair[lineList_LineWebID[d]]],
|
||||
padding: 5,
|
||||
marginHorizontal: 2,
|
||||
borderRadius: 10,
|
||||
borderColor: "white",
|
||||
borderWidth: 1,
|
||||
borderStyle: "solid",
|
||||
alignItems: "center",
|
||||
opacity:
|
||||
isSearchMode == stationIDPair[lineList_LineWebID[d]]
|
||||
? 1
|
||||
: !isSearchMode
|
||||
? 1
|
||||
: 0.5,
|
||||
zIndex: 10,
|
||||
}}
|
||||
onPress={() => {
|
||||
const id = stationIDPair[lineList_LineWebID[d]];
|
||||
const s = isSearchMode == id ? undefined : id;
|
||||
if (!s) return;
|
||||
setisSearchMode(s);
|
||||
}}
|
||||
key={stationIDPair[lineList_LineWebID[d]]}
|
||||
>
|
||||
<Text
|
||||
style={{ color: "white", fontWeight: "bold", fontSize: 20 }}
|
||||
<View
|
||||
style={{
|
||||
backgroundColor: "white",
|
||||
borderRadius: 25,
|
||||
height: 30,
|
||||
paddingRight: 10,
|
||||
paddingLeft: 10,
|
||||
flex: 1,
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
}}
|
||||
>
|
||||
<TextInput
|
||||
placeholder="駅名や駅ナンバリングを入力してフィルタリングします。"
|
||||
onEndEditing={() => {}}
|
||||
onChange={(ret) => setInput(ret.nativeEvent.text)}
|
||||
value={input}
|
||||
style={{ flex: 1 }}
|
||||
/>
|
||||
{input && (
|
||||
<TouchableOpacity
|
||||
onPress={() => setInput("") }
|
||||
style={{
|
||||
padding: 3,
|
||||
borderRadius: 15,
|
||||
backgroundColor: "lightgray",
|
||||
}}
|
||||
>
|
||||
{stationIDPair[lineList_LineWebID[d]]}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
<Ionicons
|
||||
name="close"
|
||||
size={20}
|
||||
color="white"
|
||||
/>
|
||||
</TouchableOpacity>
|
||||
)}
|
||||
</View>
|
||||
</View>
|
||||
{!input && (
|
||||
<View style={{ flexDirection: "row", alignItems: "center" }}>
|
||||
{Object.keys(lineList_LineWebID).map((d) => (
|
||||
<TouchableOpacity
|
||||
style={{
|
||||
flex: 1,
|
||||
backgroundColor:
|
||||
lineColorList[stationIDPair[lineList_LineWebID[d]]],
|
||||
padding: 5,
|
||||
marginHorizontal: 2,
|
||||
borderRadius: 10,
|
||||
borderColor: "white",
|
||||
borderWidth: 1,
|
||||
borderStyle: "solid",
|
||||
alignItems: "center",
|
||||
opacity:
|
||||
isSearchMode == stationIDPair[lineList_LineWebID[d]]
|
||||
? 1
|
||||
: !isSearchMode
|
||||
? 1
|
||||
: 0.5,
|
||||
zIndex: 10,
|
||||
}}
|
||||
onPress={() => {
|
||||
const id = stationIDPair[lineList_LineWebID[d]];
|
||||
const s = isSearchMode == id ? undefined : id;
|
||||
if (!s) return;
|
||||
setisSearchMode(s);
|
||||
}}
|
||||
key={stationIDPair[lineList_LineWebID[d]]}
|
||||
>
|
||||
<Text
|
||||
style={{
|
||||
color: "white",
|
||||
fontWeight: "bold",
|
||||
fontSize: 20,
|
||||
}}
|
||||
>
|
||||
{stationIDPair[lineList_LineWebID[d]]}
|
||||
</Text>
|
||||
</TouchableOpacity>
|
||||
))}
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
)}
|
||||
</TouchableOpacity>
|
||||
|
||||
@ -73,7 +73,8 @@ export const injectJavascriptData: InjectJavascriptData = (
|
||||
const trainIcon = `
|
||||
const setStationIcon = (setIconElem,img,hasProblem) =>{
|
||||
const position = setIconElem.getAttribute("style").includes("left");
|
||||
setIconElem.insertAdjacentHTML('beforebegin', "<img src="+img+" style='float:"+(position ? 'left' : 'right')+";height:22px;margin: 2px;'>");
|
||||
const marginData = ${uiSetting === "tokyo" ? `"5px"`: `"2px"`}
|
||||
setIconElem.insertAdjacentHTML('beforebegin', "<img src="+img+" style='float:"+(position ? 'left' : 'right')+";height:22px;margin: "+marginData+";'>");
|
||||
setIconElem.remove();
|
||||
}
|
||||
|
||||
@ -1052,7 +1053,7 @@ export const injectJavascriptData: InjectJavascriptData = (
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
const nameReplace = (列車名データ,列番データ,行き先情報,hasProblem) =>{
|
||||
const nameReplace = (列車名データ,列番データ,行き先情報,hasProblem,isLeft) =>{
|
||||
let isWanman = false;
|
||||
let trainName = "";
|
||||
let trainType = "";
|
||||
@ -1344,14 +1345,9 @@ export const injectJavascriptData: InjectJavascriptData = (
|
||||
}
|
||||
|
||||
const gradient = getColors.length > 1 ? "linear-gradient(130deg, " + getColors[0] + " 0%, "+ getColors[0]+"50%, "+ getColors[1]+"50%, " + getColors[1] + " 100%)" : getColors[0];
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:6px;padding:0;color:black;text-align:center;'>" + TrainNumber + (JRF ? "":"レ") + "</p>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:8px;font-weight:bold;padding:0;color: black;text-align:center;'>" + (isWanman ? "ワンマン " : "") + "</p>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:6px;font-weight:bold;padding:0;color: black;text-align:center;border-bottom-style:solid;border-bottom-width: "+(!!yosan2Color ? "2px" : "0px")+";border-color:" + yosan2Color + "'>" + viaData + "</p>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:8px;font-weight:bold;padding:0;color: black;text-align:center;'>" + trainName + "</p>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<div style='width:100%;background:" + gradient + ";'><p style='font-size:10px;font-weight:bold;padding:0;margin:0;color:white;align-items:center;align-content:center;text-align:center;text-shadow:1px 1px 0px #00000030, -1px -1px 0px #00000030,-1px 1px 0px #00000030, 1px -1px 0px #00000030,1px 0px 0px #00000030, -1px 0px 0px #00000030,0px 1px 0px #00000030, 0px -1px 0px #00000030;'>" + (ToData ? ToData + "行" : ToData) + "</p></div>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<div style='width:100%;background:" + trainTypeColor + ";'><p style='font-size:10px;font-weight:bold;font-style:italic;padding:0;color: white;text-align:center;'>" + trainType + "</p></div>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:8px;font-weight:bold;padding:0;text-align:center;color: "+(hasProblem ? "red":"black")+";'>" + (hasProblem ? "‼️停止中‼️" : "") + "</p>");
|
||||
`: `
|
||||
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<div style='width:100%;display:flex;flex:1;flex-direction:"+(isLeft ? "column-reverse" : "column") + ";'><p style='font-size:6px;padding:0;color:black;text-align:center;'>" + TrainNumber + (JRF ? "":"レ") + "</p><div style='flex:1;'></div><p style='font-size:8px;font-weight:bold;padding:0;color: black;text-align:center;'>" + (isWanman ? "ワンマン " : "") + "</p><p style='font-size:6px;font-weight:bold;padding:0;color: black;text-align:center;border-style:solid;border-width: "+(!!yosan2Color ? "2px" : "0px")+";border-color:" + yosan2Color + "'>" + viaData + "</p><p style='font-size:8px;font-weight:bold;padding:0;color: black;text-align:center;'>" + trainName + "</p><div style='width:100%;background:" + gradient + ";'><p style='font-size:10px;font-weight:bold;padding:0;margin:0;color:white;align-items:center;align-content:center;text-align:center;text-shadow:1px 1px 0px #00000030, -1px -1px 0px #00000030,-1px 1px 0px #00000030, 1px -1px 0px #00000030,1px 0px 0px #00000030, -1px 0px 0px #00000030,0px 1px 0px #00000030, 0px -1px 0px #00000030;'>" + (ToData ? ToData + "行" : ToData) + "</p></div><div style='width:100%;background:" + trainTypeColor + ";border-radius:"+(isLeft ? "4px 4px 0 0" : "0 0 4px 4px")+";'><p style='font-size:10px;font-weight:bold;font-style:italic;padding:0;color: white;text-align:center;'>" + trainType + "</p></div><p style='font-size:8px;font-weight:bold;padding:0;text-align:center;color: "+(hasProblem ? "red":"black")+";'>" + (hasProblem ? "‼️停止中‼️" : "") + "</p></div>");
|
||||
`: `
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;color: black;'>" + returnText1 + "</p>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<div style='display:inline-flex;flex-direction:row;'><p style='font-size:10px;font-weight: bold;padding:0;color:black;'>" + (ToData ? ToData + "行 " : ToData) + "</p><p style='font-size:10px;padding:0;color:black;'>" + TrainNumber + (JRF ? "":"レ") + "</p></div>");
|
||||
行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;color: "+(hasProblem ? "red":"black")+";'>" + (hasProblem ? "‼️停止中‼️" : "") + "</p>");
|
||||
@ -1373,7 +1369,7 @@ const setNewTrainItem = (element,hasProblem)=>{
|
||||
}else if(JRFTemp){
|
||||
element.style.borderColor = 'rgba(0, 134, 158, 0.8)';
|
||||
}else{
|
||||
element.style.borderColor = 'white';
|
||||
element.style.borderColor = 'black';
|
||||
}
|
||||
element.style.borderWidth = '2px';
|
||||
element.style.borderStyle = 'solid';
|
||||
@ -1410,12 +1406,12 @@ const setNewTrainItem = (element,hasProblem)=>{
|
||||
element.addEventListener('touchend', () => element.style.transform = 'scale(1)');
|
||||
if(element.getAttribute("style").includes("left")){
|
||||
// borderを使って五角形を生成 下り
|
||||
element.style.borderRadius = '10% 10% 40% 40%';
|
||||
element.style.borderRadius = '30px 30px 120px 120px';
|
||||
element.style.flexDirection = 'column-reverse';
|
||||
}
|
||||
else if(element.getAttribute("style").includes("right")){
|
||||
// borderを使って五角形を生成 上り
|
||||
element.style.borderRadius = '40% 40% 10% 10%';
|
||||
element.style.borderRadius = '120px 120px 30px 30px';
|
||||
element.style.flexDirection = 'column';
|
||||
}
|
||||
|
||||
@ -1425,57 +1421,70 @@ const setStrings = () =>{
|
||||
try {
|
||||
const elements = document.querySelectorAll('#disp > div > div > div[onclick]');
|
||||
const setNewTrainItemUI = ()=>{
|
||||
const elementBaseBase = document.querySelectorAll('[id^="stationBlock"]');
|
||||
elementBaseBase.forEach(e=>{ //それぞれの駅ブロック横一列
|
||||
const aaa = (x2,pos) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
if(pos == "right"){
|
||||
x2.style.alignItems = 'flex-start';
|
||||
x2.style.justifyContent = 'flex-start';
|
||||
}else if(pos == "left"){
|
||||
x2.style.alignItems = 'flex-end';
|
||||
x2.style.justifyContent = 'flex-end';
|
||||
}
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "100%";
|
||||
|
||||
}
|
||||
const aaa2 = (x2) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
x2.style.alignItems = 'center';
|
||||
x2.style.justifyContent = 'center';
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "unset";
|
||||
const x3 = x2.querySelectorAll(":scope > div");
|
||||
x3.forEach(i=>{
|
||||
i.style.position = "unset";
|
||||
i.style.display = "flex";
|
||||
i.style.flexDirection = "column";
|
||||
i.style.flex = "1";
|
||||
i.style.backgroundColor = "#00000000";
|
||||
i.querySelectorAll(":scope > *").forEach(j=>{
|
||||
j.style.width = "100%";
|
||||
j.style.textAlign = "center";
|
||||
j.style.margin = "5px";
|
||||
j.style.padding = "5px";
|
||||
});
|
||||
});
|
||||
}
|
||||
const layoutBase = (e)=>{
|
||||
e.style.display = 'flex';
|
||||
e.style.height = "unset";
|
||||
e.style.flexDirection = 'row';
|
||||
//e.style.alignItems = "left";
|
||||
e.style.justifyContent = 'center';
|
||||
const x = e.querySelectorAll(':scope > div');//配下のdiv要素を選択
|
||||
//x[0] 登りブロック x[2] 下りブロック x[1] 駅ブロック
|
||||
const aaa = (x2,pos) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
if(pos == "right"){
|
||||
x2.style.alignItems = 'flex-start';
|
||||
x2.style.justifyContent = 'flex-start';
|
||||
}else if(pos == "left"){
|
||||
x2.style.alignItems = 'flex-end';
|
||||
x2.style.justifyContent = 'flex-end';
|
||||
}
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "100%";
|
||||
|
||||
}
|
||||
const aaa2 = (x2) => {
|
||||
x2.style.display = 'flex';
|
||||
x2.style.flexDirection = 'row';
|
||||
x2.style.alignItems = 'center';
|
||||
x2.style.justifyContent = 'center';
|
||||
x2.style.flexWrap = 'wrap';
|
||||
x2.style.width = '100%';
|
||||
x2.style.height = "unset";
|
||||
const x3 = x2.querySelectorAll(":scope > div");
|
||||
x3.forEach(i=>{
|
||||
i.style.position = "unset";
|
||||
i.style.display = "flex";
|
||||
i.style.flexDirection = "column";
|
||||
i.style.flex = "1";
|
||||
i.style.backgroundColor = "#00000000";
|
||||
i.querySelectorAll(":scope > *").forEach(j=>{
|
||||
j.style.width = "100%";
|
||||
j.style.textAlign = "center";
|
||||
j.style.margin = "5px";
|
||||
j.style.padding = "5px";
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
const elementBaseBase = document.querySelectorAll('[id^="stationBlock"]');
|
||||
const elementNotBase = document.querySelectorAll('#disp > [id*="～"]');
|
||||
elementNotBase.forEach(e=>{
|
||||
layoutBase(e);
|
||||
const x = e.querySelectorAll(':scope > [id^="Up"], :scope > [id^="Id"], :scope > [id^="Down"]');//配下のdiv要素を選択
|
||||
aaa(x[0],"left");
|
||||
aaa2(x[1]);
|
||||
aaa(x[2],"right");
|
||||
const upTrainCrossBarElement = e.querySelector(':scope > [id="upTrainCrossBar"]');
|
||||
if (upTrainCrossBarElement) {
|
||||
upTrainCrossBarElement.style.left = '0px';
|
||||
}
|
||||
});
|
||||
elementBaseBase.forEach(e=>{ //それぞれの駅ブロック横一列
|
||||
layoutBase(e);
|
||||
const x = e.querySelectorAll(':scope > div');//配下のdiv要素を選択
|
||||
//x[0] 登りブロック x[2] 下りブロック x[1] 駅ブロック
|
||||
aaa(x[0],"left");
|
||||
aaa2(x[1]);
|
||||
aaa(x[2],"right");
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
@ -1486,6 +1495,9 @@ const setStrings = () =>{
|
||||
|
||||
var 行き先情報 = element.getElementsByTagName("p")[0];
|
||||
${uiSetting === "tokyo" ? `
|
||||
element.querySelector("img").insertAdjacentHTML('beforebegin',"<div style='flex:1;'></div>");
|
||||
element.querySelector("img").insertAdjacentHTML('afterend',"<div style='flex:1;'></div>");
|
||||
element.querySelector("img").style.padding = '5px';
|
||||
element.style.position = 'relative';
|
||||
if(element.getElementsByTagName("p")[1] != undefined){
|
||||
element.getElementsByTagName("p")[1].innerText = element.getElementsByTagName("p")[1].innerText.replace("(","").replace(")","");
|
||||
@ -1506,6 +1518,7 @@ const setStrings = () =>{
|
||||
element.getElementsByTagName("p")[1].style.top = '0px';
|
||||
}
|
||||
}`: ``}
|
||||
const isLeft = element.getAttribute("style").includes("left");
|
||||
var 列番データ = element.getAttribute('offclick').split('"')[1];
|
||||
var 列車名データ = element.getAttribute('offclick').split('"')[3];
|
||||
const trainData = trainPositionDatas.filter(e=>!(e.Pos && e.Pos.includes("予告窓"))).find(e => e.TrainNum == 列番データ);
|
||||
@ -1530,7 +1543,7 @@ const setStrings = () =>{
|
||||
}
|
||||
}
|
||||
` : ""}
|
||||
nameReplace(列車名データ,列番データ,行き先情報,hasProblem);
|
||||
nameReplace(列車名データ,列番データ,行き先情報,hasProblem,isLeft);
|
||||
${uiSetting === "tokyo" ? `setNewTrainItem(element,hasProblem);`: ``}
|
||||
}
|
||||
try{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user