Skip to content
This repository has been archived by the owner on Dec 1, 2023. It is now read-only.

Commit

Permalink
Merge pull request #1 from SmashinFries/experimental
Browse files Browse the repository at this point in the history 
Experimental
  • Loading branch information
@SmashinFries
SmashinFries authored Oct 30, 2021
2 parents b392ee3 + bb3ee74 commit f1d678e
Show file tree
Hide file tree
Showing 30 changed files with 4,140 additions and 3,363 deletions.
64 changes: 45 additions & 19 deletions App.js
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,22 @@
import 'react-native-gesture-handler';
// React
import React, { useState, useEffect } from "react";
import { StatusBar } from "react-native";
// UI
import { Icon } from 'react-native-elements';
// Navigation
import { createMaterialBottomTabNavigator } from "@react-navigation/material-bottom-tabs";
import { NavigationContainer, useTheme } from '@react-navigation/native';
import { HomeStack } from "./Screens/hmtabs";
import AsyncStorage from '@react-native-async-storage/async-storage';
import { NavigationContainer, useTheme, useNavigation } from '@react-navigation/native';
// Components
import { SearchNav } from './Screens/search';
import { SettingsPage, ThemeContext } from './Screens/settings';
import { HomeStack } from "./Screens/hmtabs";
import { UserPage } from './Screens/userinfo';
import { ListPage } from './Screens/lists';
import { DimTheme, LightTheme } from './Themes/themes';
// Data
import BackgroundFetch from 'react-native-background-fetch';
import { getTheme, LightTheme } from './Utils/themes';



const BTab = createMaterialBottomTabNavigator();

Expand All @@ -19,6 +25,7 @@ const config = {
Explore: 'explore/',
Find: 'search/',
Setting: 'settings/',
Lists: 'list/',
UserTab: {
screens: {
UserPage: {
Expand All @@ -39,9 +46,20 @@ const linking = {

const BottomNav = () => {
const { colors } = useTheme();
const navigation = useNavigation();
useEffect(() => {
if (global.NotifNav === true) {
navigation.navigate('UserTab', {
screen: 'UserPage',
params: {
screen: 'Notifications'
}
});
}
},[]);

return(
<BTab.Navigator initialRouteName='Explore' activeColor={colors.primary} inactiveColor={colors.inactive} shifting={true} barStyle={{height:50, backgroundColor:colors.background}} >
<BTab.Navigator initialRouteName='Explore' activeColor={colors.primary} inactiveColor={colors.inactive} labeled={false} shifting={true} barStyle={{height:50, backgroundColor:colors.background}} >
<BTab.Screen name='Explore' component={HomeStack}
options={{
tabBarIcon: ({color}) => <Icon name='explore' type='material' color={color} size={22} />
Expand Down Expand Up @@ -76,26 +94,34 @@ const BottomNav = () => {
}

const App = () => {
const [theme, setTheme] = useState();
const [theme, setTheme] = useState({theme:'Light', object:LightTheme});
const value = { theme, setTheme };

const getTheme = async () => {
try {
const themeSet = await AsyncStorage.getItem('@Theme');
setTheme((themeSet !== null) ? themeSet : 'Light');
} catch (e) {
console.error(e);
}
}

useEffect(() => {
getTheme();
getTheme().then(themes => {
setTheme({theme:themes.theme, object:themes.object});
});
BackgroundFetch.configure(
{
minimumFetchInterval: 60,
startOnBoot: true,
requiredNetworkType: BackgroundFetch.NETWORK_TYPE_ANY,
stopOnTerminate:false,
enableHeadless:true,
},
async (taskId) => {
BackgroundFetch.finish(taskId);
},
(error) => {
console.error('Background fetch failed:', error);
}
);
}, []);

return(
<ThemeContext.Provider value={value} >
<NavigationContainer linking={linking} theme={(theme === 'Light') ? LightTheme : DimTheme}>
<StatusBar translucent={true} backgroundColor='rgba(0,0,0,0)' barStyle={((theme === 'Light')) ? 'dark-content' : 'light-content'} />
<NavigationContainer linking={linking} theme={theme.object}>
<StatusBar translucent={true} backgroundColor='rgba(0,0,0,0)' barStyle={((theme.object.dark === false)) ? 'dark-content' : 'light-content'} />
<BottomNav />
</NavigationContainer>
</ThemeContext.Provider>
Expand Down
412 changes: 412 additions & 0 deletions Components/contentcomp.js
View file

Large diffs are not rendered by default.

127 changes: 86 additions & 41 deletions Components/customtile.js
View file
Original file line number Diff line number Diff line change
@@ -1,72 +1,106 @@
// React
import React, { useEffect, useState } from "react";
import { Dimensions, Pressable, View, ToastAndroid } from "react-native";
import { Tile, Badge, Text, BottomSheet, ListItem } from "react-native-elements";
// UI
import { Badge, Text, BottomSheet, ListItem, Image } from "react-native-elements";
// Navigation
import { useTheme, useNavigation } from "@react-navigation/native";
import { getLanguage } from "./storagehooks";
import { deleteEntry, updateStatus } from "../api/updatedata";
// Data
import { getLanguage } from "../Storages/storagehooks";
import { deleteEntry, updateStatus } from "../Data Handler/updatedata";

export const width = Dimensions.get('window').width;
export const height = Dimensions.get('window').height;

export const _ContentTile = ({ item, routeName, token, isSearch }) => {
export const _ContentTile = ({ item, routeName, token, isSearch, isNode=false, size=[width / 2, height / 2.9] }) => {
const entry = (isNode === true) ? item.node.mediaRecommendation : item;
const stat = (entry.mediaListEntry !== null) ?
(entry.mediaListEntry.status !== null) ? entry.mediaListEntry.status : null
: null;
const [lang, setLang] = useState('Romaji');
const [isVisible, setVisible] = useState(false);
const [status, setStatus] = useState((item.mediaListEntry !== null) ? item.mediaListEntry.status : null);
const [id, setId] = useState((item.mediaListEntry !== null) ? item.mediaListEntry.id : null);
const [status, setStatus] = useState(stat);
const [id, setId] = useState(entry.id);
const [deleted, setDeleted] = useState(false);
const { colors } = useTheme();
const navigation = useNavigation();
const score = (entry.meanScore !== null) ? entry.meanScore : null;

const fetchLang = async () => {
const language = await getLanguage();
setLang(language);
return language;
}

const updateItem = async(newStatus) => {
const newItem = await updateStatus(token, item.id, newStatus);
const newItem = await updateStatus(token, entry.id, newStatus);
setStatus(newItem.status);
setId(newItem.id);
setVisible(false);
ToastAndroid.show(`Updated!`, ToastAndroid.SHORT);
}

const deleteItem = async() => {
const isDeleted = deleteEntry(token, id);
setStatus((isDeleted) ? null : status);
setDeleted(true);
setVisible(false);
ToastAndroid.show(`Deleted!`, ToastAndroid.SHORT);
}

const Action = () => {
// Turn this into component - not sure how to handle 'setVisible'
const normalText = {color:'#FFF'};
const normalContainer = {justifyContent:'center', backgroundColor:'rgba(0,0,0,.8)'};
const list = [
{
title: (item.type === "ANIME") ? 'Plan to Watch' : 'Plan to Read',
onPress: () => {updateItem('PLANNING'); ToastAndroid.show(`Updated!`, ToastAndroid.SHORT); setVisible(false);},
onPress: () => {updateItem('PLANNING');},
containerStyle: normalContainer,
titleStyle: normalText,
},
{
title: (item.type === "ANIME") ? 'Watching' : 'Reading',
onPress: () => {updateItem('CURRENT'); ToastAndroid.show(`Updated!`, ToastAndroid.SHORT); setVisible(false);},
onPress: () => {updateItem('CURRENT');},
containerStyle: normalContainer,
titleStyle: normalText,
},
{
title: 'Completed',
onPress: () => {updateItem('COMPLETED'); ToastAndroid.show(`Updated!`, ToastAndroid.SHORT); setVisible(false);},
onPress: () => {updateItem('COMPLETED');},
containerStyle: normalContainer,
titleStyle: normalText,
},
{
title: 'Repeating',
onPress: () => {updateItem('REPEATING');},
containerStyle: normalContainer,
titleStyle: normalText,
},
{
title: 'Dropped',
onPress: () => {updateItem('DROPPED');},
containerStyle: normalContainer,
titleStyle: normalText,
},
(isSearch === true) ?
{
title: 'Delete',
onPress: () => {deleteItem(); ToastAndroid.show(`Updated!`, ToastAndroid.SHORT); setVisible(false);},
containerStyle:{backgroundColor:'red', justifyContent:'center'},
titleStyle:{color:'#FFF'},
onPress: () => {deleteItem();},
containerStyle: normalContainer,
titleStyle: {color:'red', fontWeight:'bold'},
} : undefined,
{
title: 'Go Back',
onPress: () => setVisible(false),
containerStyle:{backgroundColor:'blue', justifyContent:'center'},
titleStyle:{color:'#FFF'},
containerStyle: normalContainer,
titleStyle:{color:'#28c922', fontWeight:'bold'},
},
];
return (
<BottomSheet isVisible={isVisible} containerStyle={{backgroundColor:'rgba(0,0,0,0)'}} >
{list.map((l, i) => ( (l !== undefined) ?
<ListItem key={i} onPress={l.onPress} containerStyle={l.containerStyle}>
<ListItem.Content>
<ListItem.Content style={{alignItems:'center'}}>
<ListItem.Title style={l.titleStyle}>{l.title}</ListItem.Title>
</ListItem.Content>
</ListItem>
Expand All @@ -76,34 +110,45 @@ export const _ContentTile = ({ item, routeName, token, isSearch }) => {
}

useEffect(() => {
fetchLang();
let mounted = true;
fetchLang().then((lang) => {
if (mounted) {
setLang(lang);
}
});
return () => {mounted = false};
}, []);

return (
<View style={{paddingRight: 10, paddingLeft: 10}}>
<Tile
imageSrc={{uri: item.coverImage.extraLarge}}
imageProps={{style: {resizeMode:'cover', borderRadius: 8}}}
title={(lang !== 'Native') ? item.title.romaji : item.title.native}
titleNumberOfLines={2}
titleStyle={{ color:colors.text, fontSize: 15, position: 'absolute', top: 3, textAlign:'center', alignSelf:'center' }}
containerStyle={{borderRadius: 8, backgroundColor: 'rgba(0,0,0,0)'}}
activeOpacity={0.7}
width={width / 2.5}
height={height / 3}
key={item.id}
onPress={() => {navigation.push((routeName.name === 'SearchPage') ? 'InfoSearch' : 'InfoHome', {screen: 'Info', params: {id:item.id, title:{romaji: item.title.romaji, native: item.title.native, english:item.title.english}},});}}
<View style={{ flex: 1, backgroundColor: colors.background, paddingHorizontal: 10, maxHeight: size[1] + 50, maxWidth: size[0], borderRadius: 8 }}>
<Pressable style={{ height: size[1], width: size[0] - 20, borderRadius: 8 }}
onPress={() => {
(routeName.name !== 'Info') ?
navigation.push((routeName.name === 'SearchPage') ? 'InfoSearch' : 'InfoHome', { screen: 'Info', params: { id: entry.id, title: { romaji: entry.title.romaji, native: entry.title.native, english: entry.title.english } }, })
: navigation.push('Info', { id: entry.id, title: { romaji: entry.title.romaji, native: entry.title.native, english: entry.title.english } });
}}
onLongPress={() => (typeof token === 'string') ? setVisible(true) : null}
/>
{((item.mediaListEntry !== null || status !== null) && typeof token === 'string') ? <Pressable onLongPress={() => setVisible(true)} onPress={() => {navigation.push((routeName.name === 'SearchPage') ? 'InfoSearch' : 'InfoHome', {screen: 'Info', params: {id:item.id, title:{romaji: item.title.romaji, native: item.title.native, english:item.title.english}},});}} style={{position:'absolute', top:0, left:10, height:(height / 3)-20, width:width / 2.5, borderRadius:8, backgroundColor:(status !== null) ? 'rgba(0,0,0,.6)' : 'rgba(0,0,0,0)', justifyContent:'center'}}><Text style={{color:'#FFF', textAlign:'center', fontWeight:'bold', fontSize:16}}>{status}</Text></Pressable> : null}
{(typeof item.meanScore === 'number' ) ? <Badge value={`${item.meanScore}%`}
containerStyle={{ alignSelf: 'flex-end', position: 'absolute', elevation: 24, top:-5 }}
badgeStyle={{ borderColor: 'rgba(0,0,0,0)' }}
status={(item.meanScore >= 75) ? 'success'
: (item.meanScore < 75 && item.meanScore >= 65) ? 'warning'
: (item.meanScore < 65) ? 'error' : undefined
}
/> : null}
>
<Image source={{ uri: entry.coverImage.extraLarge }} resizeMode='cover' style={{ borderRadius: 8, height: size[1], width: size[0] - 20 }} blurRadius={(status !== null) ? 3 : 0} />
</Pressable>
<Text style={{ color: colors.text, fontSize: 16, textAlign: 'center' }} numberOfLines={2}>{(lang !== 'Native') ? entry.title.romaji : entry.title.native}</Text>
{((status !== null) && typeof token === 'string') ?
<Pressable
onLongPress={() => setVisible(true)}
onPress={() => { navigation.push((routeName.name === 'SearchPage') ? 'InfoSearch' : 'InfoHome', { screen: 'Info', params: { id: entry.id, title: { romaji: entry.title.romaji, native: entry.title.native, english: entry.title.english } }, }); }}
style={{ position: 'absolute', top: 0, left: 10, height: size[1], width: size[0] -20, borderRadius: 8, backgroundColor: (status !== null) ? 'rgba(0,0,0,.6)' : 'rgba(0,0,0,0)', justifyContent: 'center'}}
>
<Text style={{ color: '#FFF', textAlign: 'center', fontWeight: 'bold', fontSize: 16 }}>{status}</Text>
</Pressable>
: null}
{(typeof score === 'number') ? <Badge value={`${score}%`}
containerStyle={{ alignSelf: 'flex-end', position: 'absolute', elevation: 25, top: -5, right: 4 }}
badgeStyle={{ borderColor: 'rgba(0,0,0,0)', transform: [{ scale: 1.20 }] }}
status={(score >= 75) ? 'success'
: (score < 75 && score >= 65) ? 'warning'
: (score < 65) ? 'error' : undefined
}
/> : null}
<Action />
</View>
);
Expand Down
36 changes: 19 additions & 17 deletions Components/home.js
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
// React
import React, { useEffect, useState } from "react";
import { View, FlatList, Text, ActivityIndicator } from "react-native";
import { _ContentTile, height } from "./customtile";
// Navigation
import { useTheme, useRoute } from "@react-navigation/native";
import { getSeason, getNextSeason, getTrend, getPopular, getTop } from '../api/getdata';
import { getToken } from "../api/getstorage";
// Components
import { _ContentTile, height } from "./customtile";
// Data
import { getSeason, getNextSeason, getTrend, getPopular, getTop } from '../Data Handler/getdata';
import { getToken } from "../Storages/getstorage";

export const HomeDisplay = ({ data, page, type, section, isAdult, token }) => {
const [info, setInfo] = useState(data);
Expand All @@ -15,26 +19,24 @@ export const HomeDisplay = ({ data, page, type, section, isAdult, token }) => {
const token = await getToken();
if (section === 'This Season' && newpage < page.lastPage) {
const content = await getSeason(newpage + 1, isAdult, (typeof token === 'string') ? token : undefined, false);
await setInfo(content);
await setPage(newpage + 1);
setInfo(content);
setPage(newpage + 1);
} else if (section === 'Next Season' && newpage < page.lastPage) {
const content = await getNextSeason(newpage + 1, isAdult, (typeof token === 'string') ? token : undefined, false);
await setInfo(content);
await setPage(newpage + 1);
setInfo(content);
setPage(newpage + 1);
} else if (section === 'Trending' && newpage < page.lastPage) {
const content = await getTrend((type === 'NOVEL') ? 'MANGA' : type, newpage + 1, (type === 'NOVEL') ? 'NOVEL' : (type === 'MANGA') ? 'MANGA': undefined, isAdult, (typeof token === 'string') ? token : undefined, false);
await setInfo(content);
await setPage(newpage + 1);
setInfo(content);
setPage(newpage + 1);
} else if (section === 'Popular' && newpage < page.lastPage) {
const content = await getPopular((type === 'NOVEL') ? 'MANGA' : type, newpage + 1, (type === 'NOVEL') ? 'NOVEL' : (type === 'MANGA') ? 'MANGA': undefined, isAdult, (typeof token === 'string') ? token : undefined, false);
await setInfo(content);
await setPage(newpage + 1);
setInfo(content);
setPage(newpage + 1);
} else if (section === 'Top Rated' && newpage < page.lastPage) {
const content = await getTop((type === 'NOVEL') ? 'MANGA' : type, newpage + 1, (type === 'NOVEL') ? 'NOVEL' : (type === 'MANGA') ? 'MANGA': undefined, isAdult, (typeof token === 'string') ? token : undefined, false);
await setInfo(content);
await setPage(newpage + 1);
} else {
console.error('Rip');
setInfo(content);
setPage(newpage + 1);
}
}

Expand All @@ -46,15 +48,15 @@ export const HomeDisplay = ({ data, page, type, section, isAdult, token }) => {
return(
<View>
<View>
<Text style={{ fontWeight: 'bold', fontSize: 30, paddingBottom: 10, paddingLeft: 10, color: colors.text }}>{section}</Text>
<Text style={{ fontWeight: 'bold', fontSize: 30, paddingLeft: 10, color: colors.text }}>{section}</Text>
{(info.length > 0) ? <FlatList
data={info}
renderItem={({ item }) => <_ContentTile item={item} routeName={routeName} token={token} isSearch={false} />}
style={{ flex: 1, flexGrow: 0, minHeight: height / 2.6 }}
keyExtractor={(item, index) => index.toString()}
horizontal={true}
contentContainerStyle={{ paddingTop: 10, paddingBottom: 5 }}
onEndReachedThreshold={.2}
onEndReachedThreshold={.4}
onEndReached={fetchMore}
showsHorizontalScrollIndicator={false}
/> : <View style={{ flex: 1, height: height / 2.6, justifyContent: 'center' }}><ActivityIndicator size='large' color={colors.primary} /></View>}
Expand Down
Loading

0 comments on commit f1d678e

Please sign in to comment.