david.d_almeida
/
MovieFinder
forked from lucas.delanier/MovieFinder
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

comprend rien du tout

Browse Source
lucas_api
Lucas Delanier 2 years ago
parent 8a5b796406
commit ebc12c478e
7 changed files with 276 additions and 128 deletions
Show Stats Download Patch File Download Diff File

70
api/tmdb.tsx
Unescape View File

@ -1,15 +1,75 @@
import axios from "axios";
import {Cast, People} from "../components/Movie";
import Movie from "../components/Movie";
import Config from "../constants/config";
interface idMovie {
id: string
}
class apiTMBD {
api_key: string = "a133422b5b1f22428e8074470d32186";
base_url: string = "https://api.themoviedb.org/3/";
apiTMDB() {
};
getPopularMovie() {
async getTrendingMovie() {
const movielist: string[] = [];
try {
axios.get(Config.base_url + "trending/all/day?api_key=" + Config.api_key).then(async (response) => {
await response.data.results.forEach(async function (id: idMovie) {
movielist.push(id.id);
console.log(id.id);
return movielist;
})
})
} catch (err) {
return movielist;
}
return [];
}
async getInfoMovie(id: string) {
try {
axios.get<Movie>(Config.base_url + "movie/" + id + "?api_key=" + Config.api_key).then(async (response) => {
let director = await this.getDirector(response.data.id);
console.log("----------");
console.log(director);
console.log("----------");
})
/*let newmovie = new Movie(movie.id, movie.original_title, movie.poster_path, movie.runtime, movie.vote_average, director)
console.log(newmovie);*/
return null;
} catch (err) {
return null;
}
}
async getDirector(id: string): Promise<string | undefined> {
try {
const {data: cast} = await axios.get(Config.base_url + "movie/" + id + "/credits?api_key=" + Config.api_key);
cast.crew.forEach((people: People) => {
if (people.job == "Director") {
console.log(people.name);
return people.name;
}
})
} catch (err) {
return undefined;
}
}
}
export default apiTMBD;

2
components/ListWidget.tsx
Unescape View File

@ -59,7 +59,7 @@ export function ListWidget(props: ListWidgetProps) {
fontWeight: "bold",
fontSize: 25,
paddingRight: 50
}}>{props.director}</Text>
}}>{props.name}</Text>
<Text style={{color: "grey", fontWeight: "bold", fontSize: 17}}>{formatTime(props.runtime)}</Text>
<View style={{marginVertical: 10}}>
<BadgeFilm name={"Science-Ficton"}/>

35
components/Movie.tsx
Unescape View File

@ -0,0 +1,35 @@
import apiTMBD from "../api/tmdb";
class Movie {
id: string
original_title: string
poster_path: string
runtime: number
vote_average: number
director: string | undefined
constructor(id: string, original_title: string, poster_path: string, runtime: number, vote_average: number, director: string | undefined) {
this.id = id;
this.original_title = original_title;
this.poster_path = poster_path;
this.runtime = runtime;
this.vote_average = vote_average;
this.director = director;
}
}
export interface Cast {
cast: string
}
export interface People {
name: string
job: string
}
export default Movie;

14
components/MovieList.tsx
Unescape View File

@ -1,8 +1,9 @@
import {useEffect, useState} from "react";
import {FlatList, View} from "react-native";
import {ListWidget} from "./ListWidget";
import tmdb from "../api/tmdb"
import axios from "axios";
import apiTMBD from "../api/tmdb";
interface idMovie {
id: string
@ -10,17 +11,6 @@ interface idMovie {
}
interface Cast {
cast: string
}
interface People {
name: string
job: string
}
interface Movie {
id: string
original_title: string

4
constants/config.ts
Unescape View File

@ -0,0 +1,4 @@
export default {
api_key: "a133422b5b1f22428e8074470d321865",
base_url: "https://api.themoviedb.org/3/"
}

42
navigation/index.tsx
Unescape View File

@ -3,15 +3,15 @@
* https://reactnavigation.org/docs/getting-started
*
*/
import { FontAwesome } from '@expo/vector-icons';
import { FontAwesomeIcon} from "@fortawesome/react-native-fontawesome";
import { faClock, faFilm, faHeart} from "@fortawesome/free-solid-svg-icons";
import {FontAwesome} from '@expo/vector-icons';
import {FontAwesomeIcon} from "@fortawesome/react-native-fontawesome";
import {faClock, faFilm, faHeart} from "@fortawesome/free-solid-svg-icons";
import Ionicons from '@expo/vector-icons/Ionicons';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import { NavigationContainer, DefaultTheme, DarkTheme } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
import {NavigationContainer, DefaultTheme, DarkTheme} from '@react-navigation/native';
import {createNativeStackNavigator} from '@react-navigation/native-stack';
import * as React from 'react';
import { ColorSchemeName, Pressable } from 'react-native';
import {ColorSchemeName, Pressable} from 'react-native';
import Colors from '../constants/Colors';
import useColorScheme from '../hooks/useColorScheme';
@ -19,15 +19,15 @@ import NotFoundScreen from '../screens/NotFoundScreen';
import WatchLaterScreen from '../screens/WatchLaterScreen';
import FavoriteScreen from '../screens/FavoriteScreen';
import HomeScreen from '../screens/HomeScreen';
import { RootStackParamList, RootTabParamList, RootTabScreenProps } from '../types';
import {RootStackParamList, RootTabParamList, RootTabScreenProps} from '../types';
import LinkingConfiguration from './LinkingConfiguration';
export default function Navigation({ colorScheme }: { colorScheme: ColorSchemeName }) {
export default function Navigation({colorScheme}: { colorScheme: ColorSchemeName }) {
return (
<NavigationContainer
linking={LinkingConfiguration}
theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
<RootNavigator />
<RootNavigator/>
</NavigationContainer>
);
}
@ -41,11 +41,11 @@ const Stack = createNativeStackNavigator<RootStackParamList>();
function RootNavigator() {
return (
<Stack.Navigator>
<Stack.Screen name="Root" component={BottomTabNavigator} options={{ headerShown: false }} />
<Stack.Screen name="Home" component={HomeScreen} options={{ headerShown: false }} />
<Stack.Screen name="NotFound" component={NotFoundScreen} options={{ title: 'Oops!' }} />
<Stack.Screen name="Favorite" component={FavoriteScreen} options={{ headerShown: false }} />
<Stack.Screen name="WatchLater" component={WatchLaterScreen} options={{ headerShown: false }} />
<Stack.Screen name="Root" component={BottomTabNavigator} options={{headerShown: false}}/>
<Stack.Screen name="Home" component={HomeScreen} options={{headerShown: false}}/>
<Stack.Screen name="NotFound" component={NotFoundScreen} options={{title: 'Oops!'}}/>
<Stack.Screen name="Favorite" component={FavoriteScreen} options={{headerShown: false}}/>
<Stack.Screen name="WatchLater" component={WatchLaterScreen} options={{headerShown: false}}/>
</Stack.Navigator>
);
}
@ -61,7 +61,7 @@ function BottomTabNavigator() {
return (
<BottomTab.Navigator
initialRouteName="Favorite"
initialRouteName="Home"
screenOptions={{
tabBarActiveTintColor: "purple",
@ -70,8 +70,8 @@ function BottomTabNavigator() {
name="WatchLater"
component={WatchLaterScreen}
options={({ navigation }: RootTabScreenProps<'WatchLater'>) => ({
tabBarIcon: ({ color, size}) => <TabBarIcon name={faClock} color={color} size={20}/>,
options={({navigation}: RootTabScreenProps<'WatchLater'>) => ({
tabBarIcon: ({color, size}) => <TabBarIcon name={faClock} color={color} size={20}/>,
headerShown: false,
})}
@ -82,7 +82,7 @@ function BottomTabNavigator() {
options={{
headerShown: false,
tabBarIcon: ({ color, size }) => <TabBarIcon name={faFilm} color={color} size={20}/>,
tabBarIcon: ({color, size}) => <TabBarIcon name={faFilm} color={color} size={20}/>,
}}
/>
<BottomTab.Screen
@ -91,7 +91,7 @@ function BottomTabNavigator() {
options={{
headerShown: false,
tabBarIcon: ({ color, size }) => <TabBarIcon name={faHeart} color={color} size={20} />,
tabBarIcon: ({color, size}) => <TabBarIcon name={faHeart} color={color} size={20}/>,
}}
/>
</BottomTab.Navigator>
@ -106,5 +106,5 @@ function TabBarIcon(props: {
color: string;
size: number;
}) {
return <FontAwesomeIcon icon={props.name} style={{marginBottom: -5}} size={props.size} color={props.color} />;
return <FontAwesomeIcon icon={props.name} style={{marginBottom: -5}} size={props.size} color={props.color}/>;
}

113
screens/HomeScreen.tsx
Unescape View File

@ -1,15 +1,29 @@
import * as React from 'react';
import {Button,TouchableOpacity,ScrollView,View, Text, StyleSheet, Image, ImageBackground, SafeAreaView} from 'react-native';
import {
Button,
TouchableOpacity,
ScrollView,
View,
Text,
StyleSheet,
Image,
ImageBackground,
SafeAreaView
} from 'react-native';
import {RootStackScreenProps} from "../types.js";
import Rive from 'rive-react-native';
import {useEffect, useRef, useState} from "react";
import {RiveViewManager} from "rive-react-native/lib/typescript/Rive.js";
import {useSafeAreaInsets} from "react-native-safe-area-context";
import {Movie} from "../interfaces";
import apiTMBD from '../api/tmdb';
export default function App({ navigation }: RootStackScreenProps<'Home'>) {
export default function App({navigation}: RootStackScreenProps<'Home'>) {
const insets = useSafeAreaInsets();
let [movies, setMovies] = useState<Movie[]>([]);
var api = new apiTMBD();
let moviess: string[] = api.getTrendingMovie();
api.getInfoMovie("505642");
const styles = StyleSheet.create({
background: {
@ -18,15 +32,15 @@ export default function App({ navigation }: RootStackScreenProps<'Home'>) {
paddingTop: insets.top,
},
container:{
container: {
flex: 1,
},
filmCard: {
width: '80%',
height: '60%',
justifyContent:'center',
marginLeft:'auto',
marginRight:'auto',
justifyContent: 'center',
marginLeft: 'auto',
marginRight: 'auto',
borderRadius: 15,
@ -79,7 +93,7 @@ export default function App({ navigation }: RootStackScreenProps<'Home'>) {
}}
/>
</View>
<View style={{height:35, marginTop: 10, marginBottom: 15}}>
<View style={{height: 35, marginTop: 10, marginBottom: 15}}>
<ScrollView
horizontal={true}
showsHorizontalScrollIndicator={false}>
@ -94,37 +108,58 @@ export default function App({ navigation }: RootStackScreenProps<'Home'>) {
<BadgeGenre name={"cc"} isSelected={false}></BadgeGenre>
</ScrollView>
</View>
<View style={{ flexDirection: 'column', alignSelf: 'flex-start', alignItems: 'flex-start', paddingHorizontal: 30, flex: 1 }}>
<View style={{ flexDirection: 'row', alignSelf: 'flex-start', justifyContent: 'flex-start', width: "100%"}}>
<View style={{
flexDirection: 'column',
alignSelf: 'flex-start',
alignItems: 'flex-start',
paddingHorizontal: 30,
flex: 1
}}>
<View style={{
flexDirection: 'row',
alignSelf: 'flex-start',
justifyContent: 'flex-start',
width: "100%"
}}>
<BadgeFilm name={"Science-fiction"}></BadgeFilm>
<BadgeFilm name={"Science-fiction"}></BadgeFilm>
<BadgeFilm name={"9:11"}></BadgeFilm>
</View>
<View>
<Text numberOfLines={1} style={{color: "white", fontSize: 28, fontWeight: "bold", paddingTop: 5}}>SPIDER-MAN No Way Home</Text>
<Text numberOfLines={1} style={{color: "white", fontSize: 28, fontWeight: "bold", paddingTop: 5}}>SPIDER-MAN
No Way Home</Text>
</View>
<Text style={{color: "grey", fontSize: 20, fontWeight: "bold"}}>Jean-Marc généreux</Text>
</View>
<View style={{ flexDirection: 'row' ,alignItems: 'center', justifyContent: "space-evenly", paddingHorizontal: 30, height: '15%', width:'100%'}}>
<View style={{
flexDirection: 'row',
alignItems: 'center',
justifyContent: "space-evenly",
paddingHorizontal: 30,
height: '15%',
width: '100%'
}}>
<TouchableOpacity>
<Image
source={require('../assets/images/WatchLater.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}}
source={require('../assets/images/WatchLater.png')}
style={{resizeMode: "stretch", height: '65%', aspectRatio: 1,}}
/>
</TouchableOpacity>
<TouchableOpacity>
<Image
source={require('../assets/images/Generate.png')} style={{resizeMode:"stretch", height:'85%',aspectRatio: 1,}}
source={require('../assets/images/Generate.png')}
style={{resizeMode: "stretch", height: '85%', aspectRatio: 1,}}
/>
</TouchableOpacity>
<TouchableOpacity>
<Image
source={require('../assets/images/Favorite.png')} style={{ resizeMode:"stretch", height:'65%', aspectRatio: 1,}}
source={require('../assets/images/Favorite.png')}
style={{resizeMode: "stretch", height: '65%', aspectRatio: 1,}}
/>
</TouchableOpacity>
@ -134,23 +169,38 @@ export default function App({ navigation }: RootStackScreenProps<'Home'>) {
}
type BadgeGenreProps = {
name : String
name: String
isSelected: Boolean
}
export function BadgeGenre(props: BadgeGenreProps) {
if(props.isSelected==false){
if (props.isSelected == false) {
return (
<View style={{paddingHorizontal: 20, marginHorizontal: 5,height: 35, backgroundColor: '#2E2E2E', borderRadius: 20, justifyContent: "center"}} >
<View style={{
paddingHorizontal: 20,
marginHorizontal: 5,
height: 35,
backgroundColor: '#2E2E2E',
borderRadius: 20,
justifyContent: "center"
}}>
<Text style={{color: "white"}}>{props.name}</Text>
</View>
);
}
else{
} else {
return (
<View style={{paddingHorizontal: 20, marginHorizontal: 5,height: 35, backgroundColor: '#5C5C5C', borderRadius: 20, borderWidth: 1, borderColor: "white" ,justifyContent: "center"}} >
<View style={{
paddingHorizontal: 20,
marginHorizontal: 5,
height: 35,
backgroundColor: '#5C5C5C',
borderRadius: 20,
borderWidth: 1,
borderColor: "white",
justifyContent: "center"
}}>
<Text style={{color: "white"}}>{props.name}</Text>
</View>
@ -161,14 +211,23 @@ export function BadgeGenre(props: BadgeGenreProps) {
}
type BadgeFilmProps = {
name : String
name: String
}
export function BadgeFilm(props: BadgeFilmProps) {
return (
<View style={{paddingHorizontal: 15, marginHorizontal: 5,height: 30, backgroundColor: '#8906B8', borderRadius: 15, justifyContent: "center", alignSelf: "flex-start"}} >
<Text style={{color: "white", fontSize: 12, fontWeight:"bold"}}>{props.name}</Text>
<View style={{
paddingHorizontal: 15,
marginHorizontal: 5,
height: 30,
backgroundColor: '#8906B8',
borderRadius: 15,
justifyContent: "center",
alignSelf: "flex-start"
}}>
<Text style={{color: "white", fontSize: 12, fontWeight: "bold"}}>{props.name}</Text>
</View>
);

Write Preview
Loading…
Cancel
Save