Newer
Older
import { TouchableOpacity, Button, View, Text } from "react-native";
export const InfoWindow = (props) => {
const { place, navigation } = props;
const goTo = () => navigation.navigate("vuDetails");
const infoWindowStyle = {
position: 'relative',
bottom: 150,
width: 220,
backgroundColor: 'white',
boxShadow: '0 2px 7px 1px rgba(0, 0, 0, 0.3)',
padding: 10,
fontSize: 14,
zIndex: 100,
};
return (
<TouchableOpacity>
<View>
<Text style = {{fontSize: 16}}>
{place.name}
</Text>
<View style = {{fontSize: 14}}>
<Text style = {{ color: 'grey' }}>
{place.rating}
</Text>
<Text style = {{ color: 'orange' }}>
{String.fromCharCode(9733).repeat(Math.floor(place.rating))}
</Text>
<Text style = {{ color: 'lightgrey' }}>
{String.fromCharCode(9733).repeat(5 - Math.floor(place.rating))}
</Text>
</View>
</View>
</TouchableOpacity>
)
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
return (
<div ref={ref}>
{isComponentVisible &&(
<TouchableOpacity>
<div style={infoWindowStyle}>
<div style={{ fontSize: 16 }}>
{place.name}
</div>
<div style={{ fontSize: 14 }}>
<span style={{ color: 'grey' }}>
{place.rating}
{' '}
</span>
<span style={{ color: 'orange' }}>
{String.fromCharCode(9733).repeat(Math.floor(place.rating))}
</span>
<span style={{ color: 'lightgrey' }}>
{String.fromCharCode(9733).repeat(5 - Math.floor(place.rating))}
</span>
</div>
<div style={{ fontSize: 14, color: 'grey' }}>
{place.types[0]}
</div>
<div style={{ fontSize: 14, color: 'grey' }}>
{'$'.repeat(place.price_level)}
</div>
<div style={{ fontSize: 14, color: 'green' }}>
{place.loue.loue ? 'disponible' : 'occupé'}
</div>
<Button onPress={goTo} title={`voir`} />
</div>
</TouchableOpacity>
)}
</div>
);
};