corentin.richard
/
TP_ReactNative
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

💥 finissions du redux, lien avec l'api officielle, les items de la list sont cliquable et renvoie pour l'instant a listFav 👽

Browse Source
pull/4/head
Pierre Ferreira 2 years ago
parent feb86d0dbd
commit aa5cb23f4e
4 changed files with 155 additions and 126 deletions
Show Stats Download Patch File Download Diff File

216
models/Card.tsx
Unescape View File

@ -5,23 +5,23 @@ import {Classe} from "./Classe";
export class Card {
constructor(id: number,name :string,set : CardSet,type : Type,clas : Classe,rarity : string,cost : number,attack : number, health : number, desc : string,flavor : string,artist : string,collectible : boolean,elite : boolean,race : string, img : string, imgGold : string, cropImg :string) {
constructor(id: number,name :string, img : string, imgGold : string){//,set : CardSet,type : Type,clas : Classe,rarity : string,cost : number,attack : number, health : number, desc : string,flavor : string,artist : string,collectible : boolean,elite : boolean,race : string, cropImg :string) {
this._id=id
this._name=name
this._set=set
this._type=type
this._class=clas
this._rarity=rarity
this._cost=cost
this._attack = attack
this._health = health
this._desc = desc
this._flavor = flavor
this._artist = artist
this._collectible = collectible
//this._set=set
// this._type=type
// this._class=clas
// this._rarity=rarity
// this._cost=cost
// this._attack = attack
// this._health = health
// this._desc = desc
// this._flavor = flavor
// this._artist = artist
// this._collectible = collectible
this._img = img
this._imgGold = imgGold
this._cropImg = cropImg
// this._cropImg = cropImg
}
@ -42,94 +42,94 @@ export class Card {
}
private _set : CardSet;
get set(): CardSet{
return this._set
}
set set(value : CardSet){
this._set = value
}
private _type : Type;
get type():Type{
return this._type
}
set type(value : Type){
this._type=value
}
private _class : Classe;
get class():Classe{
return this._class
}
set class(value : Classe){
this._class=value
}
private _rarity : string
get rarity(): string {
return this._rarity;
}
set rarity(value: string) {
this._rarity = value ;
}
private _cost : number
get cost(): number {
return this._cost;
}
set cost(value: number) {
this._cost = value ;
}
private _attack : number
get attack(): number {
return this._attack;
}
set attack(value: number) {
this._attack = value ;
}
private _health : number
get health(): number {
return this._health;
}
set health(value: number) {
this._health = value ;
}
private _desc : string
get desc(): string {
return this._desc;
}
set desc(value: string) {
this._desc = value ;
}
private _flavor : string
get flavor(): string {
return this._flavor;
}
set flavor(value: string) {
this._flavor = value ;
}
private _artist : string
get artist(): string {
return this._artist;
}
set artist(value: string) {
this._artist = value ;
}
private _collectible : boolean
get collectible(): boolean {
return this._collectible;
}
set collectible(value: boolean ){
this._collectible = value;
}
// private _set : CardSet;
// get set(): CardSet{
// return this._set
// }
// set set(value : CardSet){
// this._set = value
// }
// private _type : Type;
// get type():Type{
// return this._type
// }
// set type(value : Type){
// this._type=value
// }
// private _class : Classe;
// get class():Classe{
// return this._class
// }
// set class(value : Classe){
// this._class=value
// }
// private _rarity : string
// get rarity(): string {
// return this._rarity;
// }
// set rarity(value: string) {
// this._rarity = value ;
// }
// private _cost : number
// get cost(): number {
// return this._cost;
// }
// set cost(value: number) {
// this._cost = value ;
// }
// private _attack : number
// get attack(): number {
// return this._attack;
// }
// set attack(value: number) {
// this._attack = value ;
// }
// private _health : number
// get health(): number {
// return this._health;
// }
// set health(value: number) {
// this._health = value ;
// }
// private _desc : string
// get desc(): string {
// return this._desc;
// }
// set desc(value: string) {
// this._desc = value ;
// }
// private _flavor : string
// get flavor(): string {
// return this._flavor;
// }
// set flavor(value: string) {
// this._flavor = value ;
// }
// private _artist : string
// get artist(): string {
// return this._artist;
// }
// set artist(value: string) {
// this._artist = value ;
// }
// private _collectible : boolean
// get collectible(): boolean {
// return this._collectible;
// }
// set collectible(value: boolean ){
// this._collectible = value;
// }
private _img : string
@ -147,12 +147,12 @@ export class Card {
set imgGold(value: string) {
this._imgGold = value ;
}
private _cropImg : string
// private _cropImg : string
get cropImg(): string {
return this._cropImg;
}
set cropImg(value: string) {
this._cropImg = value;
}
// get cropImg(): string {
// return this._cropImg;
// }
// set cropImg(value: string) {
// this._cropImg = value;
// }
}

28
redux/actions/actionSelection.tsx
Unescape View File

@ -47,22 +47,32 @@ export const getAllCards = () => {
const options = {
method: 'GET',
headers: {
'X-RapidAPI-Key': '7f2463868fmsh25504614975f2f4p1328d1jsne514834ad08c',
'X-RapidAPI-Host': 'omgvamp-hearthstone-v1.p.rapidapi.com'
'content-length':'9505',
'content-type':'application/json; charset=utf-8',
'etag':'W/"74bb-QMT8DIj6saBS1wT4u5WWcEmZAdw"'
}
};
const CardsPromise = await fetch('https://omgvamp-hearthstone-v1.p.rapidapi.com/cards', options);
console.log("FETCH")
console.log(CardsPromise)
const CardsPromise = await fetch('https://us.api.blizzard.com/hearthstone/cards?locale=en_US&access_token=EURTWhjBC2SRb4Ez42BT1kx8R2NcJc07kL', options);
//console.log("FETCH")
//console.log(CardsPromise)
//Then use the json method to get json data from api/
const CardsListJson = await CardsPromise.json();
console.log(CardsListJson)
//console.log(CardsListJson['cards'])
//@ts-ignore
const CardsList: Card[] = CardsListJson.map(elt => new Card(elt["cardId"], elt["name"], elt["cardSet"], elt["type"], elt["faction"], elt["rarity"], elt["cost"], elt["attack"], elt["health"],elt["text"], elt["flavor"], elt["artist"], elt["collectible"], elt["elite"], elt["race"], elt["img"], elt["imgGold"]));
console.log("TOTO")
console.log(CardsList)
const CardsList: Card[] = CardsListJson['cards'].map(elt => new Card(elt["id"] ? elt["id"] : 1,
elt["name"] ? elt["name"] : "",
elt["image"] ? elt["image"] : "",
elt["imageGold"] ? elt["imageGold"] : "",
)); //, elt["cardSet"], elt["type"], elt["faction"], elt["rarity"], elt["cost"], elt["attack"], elt["health"],elt["text"], elt["flavor"], elt["artist"], elt["collectible"], elt["elite"], elt["race"], elt["img"], elt["imgGold"]
//elt["cardId"] == null ? elt["cardId"] : ""
//console.log("TOTO")
//console.log(CardsList)
//call the action
dispatch(setCardsList(CardsList));

3
redux/store.tsx
Unescape View File

@ -10,6 +10,9 @@ const reducer = {
const store = configureStore({
// @ts-ignore
reducer,
// @ts-ignore
middleware: (getDefaultMiddleware) => getDefaultMiddleware({serializableCheck : false}), //desactive le check de la serialization (primitif)
},);
export default store;

34
screens/ListScreen.tsx
Unescape View File

@ -17,9 +17,15 @@ import { Image } from 'react-native';
import { ImageURISource } from 'react-native';
//@ts-ignore
const Item = ({title}) => (
<View style={styles.item}>
<Text style={styles.title}>{title}</Text>
const Item = ({url}) => (
// <View style={styles.item}>
// <Text style={styles.title}>{title}</Text>
// </View>
<View>
<Image
source={{uri:url}}
style={{flex:1, minHeight:250, minWidth:180}}/>
</View>
);
@ -63,14 +69,24 @@ export default function ListScreen({navigation}){
renderItem={({item}) => <Item title={item.name} />}
keyExtractor={item => item.id}/> */}
<FlatList data={nList} renderItem={({item}) =>
<FlatList
numColumns={2}
data={nList}
renderItem={({item}) =>
//<TouchableHighlight onPress={() => navigation.navigate("CardsDetails", {"card": item})}> //* mettre la page de detail ici, renvoi a home pour l'instant
// <TouchableHighlight onPress={() => navigation.navigate("HomeScreen")}>
// <Item title={item.name}/>
// </TouchableHighlight>
<Text>{item.name}</Text>
} keyExtractor={(item: Card) => item.name}/>
<TouchableHighlight onPress={() => navigation.navigate("ListFav")}>
<Item url={item.img}/>
</TouchableHighlight>
// //<Text>{item.name}</Text>
// // <View>
// // <Image
// // source={{uri:item.img}}
// // style={{flex:1, minHeight:250, minWidth:180}}/>
// // </View>
} keyExtractor={(item: Card) => item.id.toString()}/>
</View>

Write Preview
Loading…
Cancel
Save