列番-列車名切替スイッチと列車詳細スイッチを設置

This commit is contained in:
harukin-DeskMini 2022-04-26 11:01:38 +09:00
parent 081cbe0f50
commit 18180ff134

View File

@ -45,6 +45,8 @@ export default function LED_vision(props){
const [stationDiagram,setStationDiagram] = useState(null);
const [currentTrain, setCurrentTrain] = useState(null);
const [finalSwitch, setFinalSwitch] = useState(false);
const [trainIDSwitch, setTrainIDSwitch] = useState(false);
const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false);
useEffect(()=>{
fetch('https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia', HeaderConfig).then(response => response.text()).then(d=>{
const val = d.replace("[\r\n","").split(',\r\n');
@ -157,27 +159,23 @@ export default function LED_vision(props){
<View style={{ width: wp("98%"),/* height: wp("98%")/10*9, */backgroundColor:"#432",borderWidth:1,margin:10,marginHorizontal:wp("1%")}} >
<View style={{alignContent:"center",alignItems:"center",width:"100%",marginVertical:10,flexDirection:"row"}}>
<View style={{flex:1}}>
<Text>にゃー</Text>
</View>
<View style={{}}>
<Text style={{fontSize:parseInt("25%"),color:"white",fontWeight:"bold"}}>次の列車</Text>
<Text style={{fontSize:parseInt("15%"),color:"white"}}>Next Train</Text>
<Text style={{fontSize:25,color:"white",fontWeight:"bold"}}>次の列車</Text>
<Text style={{fontSize:15,color:"white"}}>Next Train</Text>
</View>
<View style={{flex:1}}>
<View style={{flexDirection:"row",padding:10}}>
<View style={{flex:1}} />
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>当駅止表示</Text>
<Switch value={finalSwitch} onValueChange={(value)=>setFinalSwitch(!finalSwitch)}/>
</View>
</View>
</View>
{trainTimeAndNumber ? currentTrain && trainTimeAndNumber.filter(filtering).filter(timeFiltering).filter(finalFiltering).map((d,index)=>
<View style={{alignContent:"center",alignItems:"center",width:"94%",marginVertical:5,marginHorizontal:"3%",backgroundColor:"#000",flexDirection:"row"}}>
[<View style={{alignContent:"center",alignItems:"center",width:"94%",marginVertical:5,marginHorizontal:"3%",backgroundColor:"#000",flexDirection:"row"}}>
<View style={{flex:9}}>
<Text style={{fontSize:(()=>{
if(customTrainDataDetector(d.train).trainName.length > 6){
return 17;
return 15;
}
else{
return 20
@ -194,7 +192,7 @@ export default function LED_vision(props){
return "white";
}
})(),fontWeight:"bold"}}>{(()=>{
})(),fontWeight:"bold"}}>{trainIDSwitch ? d.train : (()=>{
switch(customTrainDataDetector(d.train).type){
case "Rapid":
return "快速";
@ -215,20 +213,13 @@ export default function LED_vision(props){
})()}</Text>
</View>
<View style={{flex:4,flexDirection:"row"}}>
<Text style={{fontSize:(()=>{
if(d.lastStation.length > 4){
return 15;
}
else{
return 20
}
})(),color:"white",fontWeight:"bold"}}>{d.lastStation}</Text>
<Text style={{fontSize: d.lastStation.length > 4 ? 15 : 20,color:"white",fontWeight:"bold"}}>{d.lastStation}</Text>
</View>
<View style={{flex:3}}>
<Text style={{fontSize:parseInt("20%"),color:"white",fontWeight:"bold"}}>{d.time}</Text>
<Text style={{fontSize:20,color:"white",fontWeight:"bold"}}>{d.time}</Text>
</View>
<View style={{flex:4}}>
<Text style={{fontSize:parseInt("20%"),color:"white",fontWeight:"bold"}}>{(()=>{
<Text style={{fontSize:20,color:"white",fontWeight:"bold"}}>{(()=>{
let data= currentTrain.filter(data=>data.num==d.train)[0].delay;
if(isNaN(data)){
return data;
@ -241,10 +232,25 @@ export default function LED_vision(props){
}
})()}</Text>
</View>
</View>,Boolean(trainDescriptionSwitch) && Boolean(customTrainDataDetector(d.train).info) &&
<View style={{alignContent:"center",alignItems:"center",width:"94%",marginVertical:5,marginHorizontal:"3%",backgroundColor:"#000",flexDirection:"row"}}>
<View style={{flex:4}}>
<Text style={{fontSize:20,color:"green",fontWeight:"bold"}}> &gt; {customTrainDataDetector(d.train).info}</Text>
</View>
</View>
]
)
: null}
<View style={{flexDirection:"row",padding:10}}>
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>種別名 / 列番</Text>
<Switch value={trainIDSwitch} onValueChange={(value)=>setTrainIDSwitch(!trainIDSwitch)}/>
<View style={{flex:1}} />
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>列車情報</Text>
<Switch value={trainDescriptionSwitch} onValueChange={(value)=>setTrainDescriptionSwitch(!trainDescriptionSwitch)}/>
<View style={{flex:1}} />
<Text style={{alignItems:"center",alignContent:"center",textAlign:"center",textAlignVertical:"center",color:"white"}}>当駅止表示</Text>
<Switch value={finalSwitch} onValueChange={(value)=>setFinalSwitch(!finalSwitch)}/>
</View>
</View>
)
}