import
{ StatusBar } from 'expo-status-bar';
import React, {useState} from 'react';
import { StyleSheet, Text, View, Modal, TouchableOpacity, SafeAreaView,
ScrollView, Image } from 'react-native';
import {SModal} from './assets/components/SModal';
const App = () => {
const [isModalVisible, setisModalVisible] = useState(false);
const [chooseData, setChooseData] = useState();
const [description, setDescription] = useState();
const [title, setTitle] = useState();
const changeModalVisible = (bool) => {
setisModalVisible(bool);
}
const setData = (data) => {
setChooseData(data);
}
return (
<SafeAreaView style={[Link]}>
<ScrollView>
<View>
<Text style={[Link], {marginLeft: 42,fontSize: 25, marg
inTop: 300, fontWeight: 'bold', color: "#0f4759"}}>Philippine Art Histo
ry
</Text>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[Link]}
onPress={ () => {
changeModalVisible(true);
setDescription("Our World is now facing a Problem about C
ovid-19. Our group decided to create and develop an app that will turn
their mobile devices into Art Galleries. This App will provide all the
description needed about the Art. This App are for those who want to ex
plore the world of historical art without the risk of being in danger."
);
setTitle("Philippine Historical Art Gallery");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 70,colo
r:'lightblue'}]}>About</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
[Link]"
}}
style= {{height: 320, width: 320, marginTop: 230 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" A painting by Filipino painter Juan
Luna. Luna, working on canvas, spent eight months completing the painti
ng which depicts dying gladiators. The painting was submitted by Luna t
o the Exposición Nacional de Bellas Artes in 1884 in Madrid.");
setTitle("Spoliarium");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 54,colo
r:'lightblue'}]}>Spoliarium</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
65380d8/d28bded9cfa171c8-
5d/s400x600/[Link]"
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" Literally the woman from the Bu
lacan woman, also sometimes referred to as Una Bulaqueña, and painting
by Filipino painter and revolutionary activist Juan Novicio Luna.");
setTitle("La Bulaqueña");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 45,colo
r:'lightblue'}]}>La Bulaqueña</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
una_damas-[Link]"
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" Also known as The Roman Maidens, The
Roman Women, or The Roman Ladies, is an oil on canvas painting by Juan
Luna, one of the most important Filipino painters of the Spanish period
in the Philippines.");
setTitle("Las Damas Romanas");
}
}
>
<Text style={[[Link], {fontSize: 19,marginTop: 20,margin
Left: 20,color:'lightblue'}]}>Las Damas Romanas</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" The Andrés Bonifacio Monument, comm
only known simply as Bonifacio Monument or Monumento, is a memorial mon
ument in Caloocan, designed by the National Artist Guillermo Tolentino.
");
setTitle("Andrés Bonifacio Monument");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 55,colo
r:'lightblue'}]}>Monument</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
leopatra%2C_por_Juan_Luna_%28Museo_del_Prado%[Link]"
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" The Death of Cleopatra, also known s
imply as Cleopatra, is an 1881 painting made by the Filipino painter Ju
an Luna. The famous painting was a silver medalist or second prize winn
er during the 1881 National Exposition of Fine Arts in Madrid.");
setTitle("The Death of Cleopatra");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 25,colo
r:'lightblue'}]}>Death of Cleopatra</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
[Link]"
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" Meaning “Spain and the Philippines” i
n translation, is an 1886 oil on wood by Filipino painter, ilustrado, a
nd revolutionary activist, Juan Luna. It is an allegorical depiction of
two women together, one a representation of Spain and the other of the
Philippines.");
setTitle("España y Filipinas");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 30,colo
r:'lightblue'}]}>España y Filipinas</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
[Link]"
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription(" Amorsolo is one of the most importa
nt painters in Filipino Art History. His paintings were able to embody
the simplicity of Filipinos, in its daily lives and beauty. Just by loo
king at this painting, we can all say that the “Fruit Gatherer” is the
original dalagang filipina.");
setTitle("The Fruit Gatherer");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 25,color:
'lightblue'}]}>The Fruit Gatherer</Text>
</TouchableOpacity>
<View>
<Text style={[Link], {marginLeft: 65,fontSize: 25, marg
inTop: 200, fontWeight: 'bold', color: "#166b82"}}>List of Developers
</Text>
</View>
<View>
<Image
style= {{height: 320, width: 320, marginTop: 100 }}
source= {require ('./assets/[Link]')}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription("Bulanhagui, Miguel Andrade");
setTitle("Programming, App Design ");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 75,colo
r: "#e6092a"}]}>About</Text>
</TouchableOpacity>
<View>
<Image
style= {{height: 400, width: 320, marginTop: 200 }}
source= {require ('./assets/[Link]')}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription("Lopez, Luis Fernando Nunag");
setTitle("Programming");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 75,colo
r:"#e6092a"}]}>About</Text>
</TouchableOpacity>
<View>
<Image
source= {{
uri: "[Link]
Oai_sI/AAAAAAAAABc/ILAOXNmtEjYT-
_nPyqfoc9X6kwwaje6NQCEwYBhgLKtQDAL1OcqzFosBygFIDxLvEHCyms8JDUZF8AT9Sdzw
5fER2u-
Lbli8j1oR_HOiSnuEX_ehJdobdTcDAyIiXG6slWkai4VAG_Ic0LCPEFGRt5AQYIkwXHQmzJ
ZUnTLViD5sULPtbehPTt91NVhasFI1tKTjh2HwYsTQiHsmu8MCUFGvdglgafyc2y499M6Vp
IvR92kf_vDLc5YK2dUyQNqGoFO1y7Rg4ZEbM1VJFR-
qCNbp19NZRktK3aVNKMNxV3sGRXQ4h2iuMaf7ouPmQ3MA1FqfME0GhSqaS2RDDVA7iEv_EZ
pnIFmAT2YOlaLXazpMe1OCvKgLN22Qn-
g8QHvOZTY2Amfez6p9VSoNHsGCRv9ZrXxu6oIu63Kl6hnIXdApKQJ5XuHkTel5EgPtdnUwC
0bJ5UMIAtnVVfslMyk9vT4zyUfYAuqobjDVn6wQmuLYSVDsNo7VB_k4ib3jIACsOIvl6nVc
kMyzDuiNbDaRm3DF7JAtx1OdrWMg6_CV7TOJteifYbqPvzCQD1D6cQCdcwo3zR99_4UCRDp
60lrP9b1cJy8TjAfDDMvrlPmHM-
t3TU6nV4evNbbBmL6wN8BlrEVBxuQ0SguRPCzmHpcVOUXwPns8dMNrshIMG/w140-h140-
p/[Link]"
}}
style= {{height: 320, width: 320, marginTop: 200 }}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription("Baliwag, Josh Audrey Gonzales");
setTitle("Painting/Art provider, Art description");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 75,colo
r:"#e6092a"}]}>About</Text>
</TouchableOpacity>
<View>
<Image
style= {{height: 320, width: 320, marginTop: 200 }}
source= {require ('./assets/[Link]')}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription("Fetizanan, Kirk Angelo Sales");
setTitle("Painting/Art Provider ");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 75,colo
r:"#e6092a"}]}>About</Text>
</TouchableOpacity>
<View>
<Image
style= {{height: 320, width: 320, marginTop: 200 }}
source= {require ('./assets/[Link]')}/>
</View>
<Text style={[Link]}>
{chooseData}
</Text>
<TouchableOpacity style={[[Link]]}
onPress={ () => {
changeModalVisible(true);
setDescription("Garcia, Laurence Maridel Abante");
setTitle("Description");
}
}
>
<Text style={[[Link], {marginTop: 20,marginLeft: 75,colo
r:"#e6092a"}]}>About</Text>
</TouchableOpacity>
<Text> </Text>
<Text> </Text>
<Text> </Text>
<Modal
transparent={true}
animationType= 'fade'
visible={isModalVisible}
nRequestClose={()=> changeModalVisible (false)}
>
<SModal
changeModalVisible={changeModalVisible}
setData={setData}
description={description}
title={title}
/>
</Modal>
</ScrollView>
</SafeAreaView>
)
}
const styles = [Link]({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
backgroundColor: "#bbd99c"
},
touchableOpacity: {
backgroundColor: "#b89a7d",
paddingHorizontal: 60,
borderRadius: 60,
marginTop: 20,
fontFamily: "robotoslabSemiBold",
fontWeight: 'bold',
height: 65,
shadowColor: "#000",
shadowOffset: {
width: 0,
height: 7,
},
shadowOpacity: 0.43,
shadowRadius: 9.51,
elevation: 15,
justifyContent: 'center'
},
text: {
marginVertical: 20,
fontSize: 20
},
})
export default App;