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

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 [stationDiagram,setStationDiagram] = useState(null);
const [currentTrain, setCurrentTrain] = useState(null); const [currentTrain, setCurrentTrain] = useState(null);
const [finalSwitch, setFinalSwitch] = useState(false); const [finalSwitch, setFinalSwitch] = useState(false);
const [trainIDSwitch, setTrainIDSwitch] = useState(false);
const [trainDescriptionSwitch, setTrainDescriptionSwitch] = useState(false);
useEffect(()=>{ useEffect(()=>{
fetch('https://train.jr-shikoku.co.jp/g?arg1=station&arg2=traintimeinfo&arg3=dia', HeaderConfig).then(response => response.text()).then(d=>{ 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'); 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={{ 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={{alignContent:"center",alignItems:"center",width:"100%",marginVertical:10,flexDirection:"row"}}>
<View style={{flex:1}}> <View style={{flex:1}}>
<Text>にゃー</Text>
</View> </View>
<View style={{}}> <View style={{}}>
<Text style={{fontSize:parseInt("25%"),color:"white",fontWeight:"bold"}}>次の列車</Text> <Text style={{fontSize:25,color:"white",fontWeight:"bold"}}>次の列車</Text>
<Text style={{fontSize:parseInt("15%"),color:"white"}}>Next Train</Text> <Text style={{fontSize:15,color:"white"}}>Next Train</Text>
</View> </View>
<View style={{flex:1}}> <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>
</View> </View>
{trainTimeAndNumber ? currentTrain && trainTimeAndNumber.filter(filtering).filter(timeFiltering).filter(finalFiltering).map((d,index)=> {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}}> <View style={{flex:9}}>
<Text style={{fontSize:(()=>{ <Text style={{fontSize:(()=>{
if(customTrainDataDetector(d.train).trainName.length > 6){ if(customTrainDataDetector(d.train).trainName.length > 6){
return 17; return 15;
} }
else{ else{
return 20 return 20
@ -194,7 +192,7 @@ export default function LED_vision(props){
return "white"; return "white";
} }
})(),fontWeight:"bold"}}>{(()=>{ })(),fontWeight:"bold"}}>{trainIDSwitch ? d.train : (()=>{
switch(customTrainDataDetector(d.train).type){ switch(customTrainDataDetector(d.train).type){
case "Rapid": case "Rapid":
return "快速"; return "快速";
@ -215,20 +213,13 @@ export default function LED_vision(props){
})()}</Text> })()}</Text>
</View> </View>
<View style={{flex:4,flexDirection:"row"}}> <View style={{flex:4,flexDirection:"row"}}>
<Text style={{fontSize:(()=>{ <Text style={{fontSize: d.lastStation.length > 4 ? 15 : 20,color:"white",fontWeight:"bold"}}>{d.lastStation}</Text>
if(d.lastStation.length > 4){
return 15;
}
else{
return 20
}
})(),color:"white",fontWeight:"bold"}}>{d.lastStation}</Text>
</View> </View>
<View style={{flex:3}}> <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>
<View style={{flex:4}}> <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; let data= currentTrain.filter(data=>data.num==d.train)[0].delay;
if(isNaN(data)){ if(isNaN(data)){
return data; return data;
@ -241,10 +232,25 @@ export default function LED_vision(props){
} }
})()}</Text> })()}</Text>
</View> </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> </View>
) ]
: null} )
: null}
</View> <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>
) )
} }