Reza_ashrafi
/
RnDanovinExpo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

reza fixed all colors

Browse Source
master
Reza_ashrafi 3 years ago
parent 8d7e687d73
commit f2f88573b6
18 changed files with 258 additions and 244 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 49
      navigation/index.js
  2. 18
      src/components/BottomSheetComponents/ProductQuestion.js
  3. 16
      src/components/BottomSheetComponents/ProductReview.js
  4. 14
      src/components/BottomSheetComponents/ProductSpecifications.js
  5. 5
      src/components/BottomSheetComponents/Ticket.js
  6. 21
      src/components/Drawer.js
  7. 20
      src/components/Empty.js
  8. 9
      src/components/Navbar.js
  9. 32
      src/components/Progress.js
  10. 22
      src/components/Search.js
  11. 4
      src/screens/Products/components/Main.js
  12. 33
      src/screens/Video/components/Season.js
  13. 9
      src/screens/Video/index.js
  14. 41
      src/screens/VideoDisplay/components/Season/index.js
  15. 14
      src/screens/VideoDisplay/index.js
  16. 174
      src/screens/Videos/components/MostViewedVideo.js
  17. 15
      src/screens/Videos/components/NewestVideo.js
  18. 6
      src/screens/Videos/index.js

49
navigation/index.js
Unescape View File

@ -39,12 +39,8 @@ import Blog from "../src/screens/Blog";
import Sample from "../src/screens/Product/components/Sample";
//style
import fontSize from "../src/constants/fontSize";
import Colors from "../src/constants/Colors";
const ios = Platform.OS === "ios";
const colorScheme = Appearance.getColorScheme();
const Tab = createBottomTabNavigator();
const BottomTabNavigator = ({}) => {
const [headerShown, setHeaderShown] = React.useState(true);
@ -64,10 +60,10 @@ const BottomTabNavigator = ({}) => {
},
tabBarIconStyle: {},
tabBarLabelPosition: "below-icon",
tabBarActiveTintColor: Colors.theme1[colorScheme].green79,
tabBarActiveTintColor: Colors.theme1['light'].green79,
tabBarInactiveTintColor: "grey",
tabBarStyle: {
backgroundColor: Colors.theme1[colorScheme].white,
backgroundColor: Colors.theme1['light'].white,
},
tabBarLabelStyle: {
// fontSize: fontSize.sm,
@ -88,7 +84,7 @@ const BottomTabNavigator = ({}) => {
width={31.192}
height={31.192}
>
<G fill={Colors.theme1[colorScheme].green79}>
<G fill={Colors.theme1['light'].green79}>
<Path d="M15.803 14.127a2.363 2.363 0 0 0-.429 0 5.777 5.777 0 1 1 .429 0Z" />
<Path
data-name="Vector"
@ -104,7 +100,7 @@ const BottomTabNavigator = ({}) => {
>
<G
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -129,7 +125,7 @@ const BottomTabNavigator = ({}) => {
// tabBarBadge: count,
// tabBarBadgeStyle: {
// color: "white",
// backgroundColor: Colors.theme1[colorScheme].green79,
// backgroundColor: Colors.theme1['light'].green79,
// fontSize: fontSize.sm,
// },
title: "سبد خرید",
@ -141,7 +137,7 @@ const BottomTabNavigator = ({}) => {
height={31.017}
>
<G
fill={Colors.theme1[colorScheme].green79}
fill={Colors.theme1['light'].green79}
stroke={"white"}
strokeLinecap="round"
strokeLinejoin="round"
@ -163,7 +159,7 @@ const BottomTabNavigator = ({}) => {
>
<G
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -192,8 +188,8 @@ const BottomTabNavigator = ({}) => {
<G data-name="Group 2000">
<Path
d="M25.421 29.241H8.974C4.04 29.241.75 26.392.75 19.744V10.25c0-6.651 3.29-9.5 8.224-9.5h16.447c4.935 0 8.229 2.849 8.229 9.5v9.5c0 6.642-3.294 9.491-8.229 9.491Z"
fill={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1[colorScheme].green79}
fill={Colors.theme1['light'].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -216,7 +212,7 @@ const BottomTabNavigator = ({}) => {
<Path
d="M25.421 29.241H8.974C4.04 29.241.75 26.392.75 19.744V10.25c0-6.651 3.29-9.5 8.224-9.5h16.447c4.935 0 8.229 2.849 8.229 9.5v9.5c0 6.642-3.294 9.491-8.229 9.491Z"
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -226,7 +222,7 @@ const BottomTabNavigator = ({}) => {
data-name="Vector"
d="M12.427 14.995v-2.083c0-2.673 1.892-3.766 4.2-2.43l1.805 1.042 1.806 1.041c2.308 1.336 2.308 3.523 0 4.86l-1.806 1.041-1.805 1.046c-2.308 1.332-4.2.239-4.2-2.434v-2.083Z"
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -250,7 +246,7 @@ const BottomTabNavigator = ({}) => {
>
<Path
d="M32.207 24.227V6.798a2.869 2.869 0 0 0-3.179-2.875h-.088a27.857 27.857 0 0 0-10.35 3.422l-.249.159a1.641 1.641 0 0 1-1.552 0l-.361-.216A27.72 27.72 0 0 0 6.09 3.909a2.864 2.864 0 0 0-3.162 2.874v17.444a2.981 2.981 0 0 0 2.547 2.859l.425.058a37.976 37.976 0 0 1 10.892 3.524l.059.029a1.6 1.6 0 0 0 1.405 0 37.631 37.631 0 0 1 10.921-3.552l.483-.058a2.981 2.981 0 0 0 2.547-2.86Z"
fill={Colors.theme1[colorScheme].green79}
fill={Colors.theme1['light'].green79}
/>
<Path
data-name="Vector"
@ -270,7 +266,7 @@ const BottomTabNavigator = ({}) => {
>
<G
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -299,7 +295,7 @@ const BottomTabNavigator = ({}) => {
>
<Path
d="M12.62 3.974 5.079 9.85a6.658 6.658 0 0 0-2.281 4.645v10.368a5.912 5.912 0 0 0 5.89 5.9h16.2a5.909 5.909 0 0 0 5.89-5.89V14.691a6.609 6.609 0 0 0-2.518-4.827l-8.644-6.058a6.278 6.278 0 0 0-6.996.168Z"
fill={Colors.theme1[colorScheme].green79}
fill={Colors.theme1['light'].green79}
/>
<Path
data-name="Vector"
@ -320,7 +316,7 @@ const BottomTabNavigator = ({}) => {
<Path
d="M12.62 3.974 5.079 9.85a6.658 6.658 0 0 0-2.281 4.645v10.368a5.912 5.912 0 0 0 5.89 5.9h16.2a5.909 5.909 0 0 0 5.89-5.89V14.691a6.609 6.609 0 0 0-2.518-4.827l-8.644-6.058a6.278 6.278 0 0 0-6.996.168Z"
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -329,7 +325,7 @@ const BottomTabNavigator = ({}) => {
data-name="Vector"
d="M16.79 25.471v-6.693"
fill="none"
stroke={Colors.theme1[colorScheme].green79}
stroke={Colors.theme1['light'].green79}
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={1.5}
@ -348,7 +344,7 @@ const HomeStackScreen = () => {
<HomeStack.Navigator
screenOptions={{
headerShown: false,
contentStyle: { backgroundColor: Colors.theme1[colorScheme].white },
contentStyle: { backgroundColor: Colors.theme1['light'].white },
}}
initialRouteName="Home"
>
@ -371,7 +367,7 @@ const ProductsStackScreen = () => {
<ProductsStack.Navigator
screenOptions={{
headerShown: false,
contentStyle: { backgroundColor: Colors.theme1[colorScheme].white },
contentStyle: { backgroundColor: Colors.theme1['light'].white },
}}
initialRouteName="Products"
>
@ -388,7 +384,7 @@ const VODStackScreen = () => {
<VODStack.Navigator
screenOptions={{
headerShown: false,
contentStyle: { backgroundColor: Colors.theme1[colorScheme].white },
contentStyle: { backgroundColor: Colors.theme1['light'].white },
}}
>
<VODStack.Screen name="VOD" component={Videos} />
@ -404,7 +400,7 @@ const CARTStackScreen = () => {
<CARTStack.Navigator
screenOptions={{
headerShown: false,
contentStyle: { backgroundColor: Colors.theme1[colorScheme].white },
contentStyle: { backgroundColor: Colors.theme1['light'].white },
}}
>
<CARTStack.Screen name="ShoppingCart" component={ShoppingCart} />
@ -419,7 +415,7 @@ const PROFILEStackScreen = () => {
<PROFILEStack.Navigator
screenOptions={{
headerShown: false,
contentStyle: { backgroundColor: Colors.theme1[colorScheme].white },
contentStyle: { backgroundColor: Colors.theme1['light'].white },
}}
>
<PROFILEStack.Screen name="Profile" component={Profile} />
@ -444,7 +440,7 @@ const Navigation = ({ getStatus, isLogin, userProducts }) => {
// initialRouteName="Root"
screenOptions={{
headerShown: false,
contentStyle: { backgroundColor: Colors.theme1[colorScheme].white },
contentStyle: { backgroundColor: Colors.theme1['light'].white },
}}
>
<Stack.Screen name="Splash" component={Splash} />
@ -479,6 +475,7 @@ const Navigation = ({ getStatus, isLogin, userProducts }) => {
const mapStateToProps = (state) => ({
isLogin: state.user.status,
userProducts: state.userProduct.list,
theme : state.publicApi.theme
});
const mapDispatchToProps = {
getStatus: user.getStatus,

18
src/components/BottomSheetComponents/ProductQuestion.js
Unescape View File

@ -2,7 +2,6 @@ import {
View,
Text,
ScrollView,
Dimensions,
Appearance,
Platform,
} from "react-native";
@ -17,8 +16,7 @@ import Colors from "../../constants/Colors";
const ios = Platform.OS === "ios";
const ProductQuestion = ({ list, mobile }) => {
const colorScheme = Appearance.getColorScheme();
const ProductQuestion = ({ list, mobile, theme }) => {
return (
<View style={{ flex: 1, paddingHorizontal: 16 }}>
<View
@ -30,7 +28,7 @@ const ProductQuestion = ({ list, mobile }) => {
} mb-4`
),
{
backgroundColor: Colors.theme1[colorScheme].greenFF1,
backgroundColor: Colors.theme1[theme].greenFF1,
},
]}
>
@ -38,7 +36,7 @@ const ProductQuestion = ({ list, mobile }) => {
style={[
{
fontSize: mobile ? fontSize.sm : fontSize.xl3,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontFamily: "demi",
},
]}
@ -55,14 +53,13 @@ const ProductQuestion = ({ list, mobile }) => {
);
};
const Question = ({ question, mobile }) => {
const colorScheme = Appearance.getColorScheme();
const Question = ({ question, mobile, theme }) => {
return (
<View style={[tw("flex mb-3")]}>
<Text
style={{
fontFamily: "bold",
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: mobile ? fontSize.tiny : fontSize.xl3,
textAlign: ios ? "right" : "auto",
}}
@ -84,7 +81,7 @@ const Question = ({ question, mobile }) => {
<Text
style={{
fontFamily: "bold",
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: fontSize.tiny,
marginTop: 10,
textAlign: ios ? "right" : "auto",
@ -95,7 +92,7 @@ const Question = ({ question, mobile }) => {
<Text
style={{
fontFamily: "bold",
color: Colors.theme1[colorScheme].gray2077,
color: Colors.theme1[theme].gray2077,
fontSize: mobile ? fontSize.sm : fontSize.base,
textAlign: ios ? "right" : "auto",
marginTop: mobile ? "" : 10,
@ -113,6 +110,7 @@ const Question = ({ question, mobile }) => {
const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
export default connect(mapStateToProps)(ProductQuestion);

16
src/components/BottomSheetComponents/ProductReview.js
Unescape View File

@ -10,8 +10,8 @@ import tw from "tailwind-rn";
const { width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
const ProductReviews = ({ list, mobile }) => {
const colorScheme = Appearance.getColorScheme();
const ProductReviews = ({ list, mobile, theme }) => {
const Property = ({ question }) => {
return (
<View style={[tw("flex mb-3")]}>
@ -22,7 +22,7 @@ const ProductReviews = ({ list, mobile }) => {
`flex flex-row-reverse justify-between items-center mt-3 rounded-md px-2 ${mobile ? "py-3" : "py-4"} mb-4`
),
{
backgroundColor: Colors.theme1[colorScheme].greenFF1 + '66',
backgroundColor: Colors.theme1[theme].greenFF1 + '66',
},
]}
>
@ -30,7 +30,7 @@ const ProductReviews = ({ list, mobile }) => {
style={[
{
fontSize: mobile ? fontSize.tiny : fontSize.lg,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontFamily: "bold",
},
]}
@ -69,6 +69,7 @@ const ProductReviews = ({ list, mobile }) => {
</View>
);
};
return (
<View style={{ flex: 1, paddingHorizontal: 16 }}>
<View
@ -78,7 +79,7 @@ const ProductReviews = ({ list, mobile }) => {
"flex flex-row-reverse justify-between items-center mt-3 rounded-md px-2 py-3 mb-2"
),
{
backgroundColor: Colors.theme1[colorScheme].greenFF1 ,
backgroundColor: Colors.theme1[theme].greenFF1 ,
},
]}
>
@ -86,7 +87,7 @@ const ProductReviews = ({ list, mobile }) => {
style={[
{
fontSize: fontSize.sm,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontFamily: "demi",
},
]}
@ -104,7 +105,8 @@ const ProductReviews = ({ list, mobile }) => {
};
const mapStateToProps = (state) => ({
mobile : state.publicApi.mobile
mobile : state.publicApi.mobile,
theme : state.publicApi.theme
})
export default connect(mapStateToProps)(ProductReviews);

14
src/components/BottomSheetComponents/ProductSpecifications.js
Unescape View File

@ -1,4 +1,4 @@
import { View, Text, ScrollView, Dimensions, Appearance, Platform } from "react-native";
import { View, Text, ScrollView, Dimensions, Platform } from "react-native";
import React from "react";
import {connect} from 'react-redux';
@ -10,8 +10,8 @@ import tw from "tailwind-rn";
const { width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
const ProductSpecifications = ({ list, mobile }) => {
const colorScheme = Appearance.getColorScheme();
const ProductSpecifications = ({ list, mobile, theme }) => {
const Property = ({ prop }) => {
return (
<View style={[tw("flex flex-row-reverse mb-3")]}>
@ -57,6 +57,7 @@ const ProductSpecifications = ({ list, mobile }) => {
</View>
);
};
return (
<View style={{ flex: 1, paddingHorizontal: 16 }}>
<View
@ -66,7 +67,7 @@ const ProductSpecifications = ({ list, mobile }) => {
"flex flex-row-reverse justify-between items-center mt-3 rounded-md px-3 py-3 mb-4"
),
{
backgroundColor: Colors.theme1[colorScheme].greenFF1 ,
backgroundColor: Colors.theme1[theme].greenFF1 ,
},
]}
>
@ -74,7 +75,7 @@ const ProductSpecifications = ({ list, mobile }) => {
style={[
{
fontSize: fontSize.sm,
color: Colors.theme1[colorScheme].green79 ,
color: Colors.theme1[theme].green79 ,
fontFamily: "demi",
},
]}
@ -92,7 +93,8 @@ const ProductSpecifications = ({ list, mobile }) => {
};
const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile
mobile: state.publicApi.mobile,
theme : state.publicApi.theme
});
export default connect(mapStateToProps)(ProductSpecifications);

5
src/components/BottomSheetComponents/Ticket.js
Unescape View File

@ -23,8 +23,8 @@ export const Ticket = ({
upload,
setTicket,
grades,
theme
}) => {
const colorScheme = Appearance.getColorScheme();
let opt = useMemo(
() => ["واحد مورد نظر", "واحد فروش", "واحد فنی", "واحد محتوایی"],
[status]
@ -132,7 +132,7 @@ export const Ticket = ({
</ScrollView>
<CustomPressable
title={"ارسال پیام"}
backgroundColor={Colors.theme1[colorScheme].greenCF}
backgroundColor={Colors.theme1[theme].greenCF}
color={"white"}
border={{ color: "#196EC0", width: 0 }}
width={"100%"}
@ -148,6 +148,7 @@ const mapStateToProps = (state) => ({
status: state.user.status,
ticket: state.form.ticket,
grades: state.publicApi.grades,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

21
src/components/Drawer.js
Unescape View File

@ -8,11 +8,9 @@ import {
Text,
TouchableOpacity,
Image,
Appearance,
LayoutAnimation,
} from "react-native";
import { useNavigation } from "@react-navigation/native";
import { Ionicons, AntDesign } from "@expo/vector-icons";
import { connect } from "react-redux";
import { user } from "../redux/actions";
import Svg, { Path, G } from "react-native-svg";
@ -21,7 +19,6 @@ import Svg, { Path, G } from "react-native-svg";
import tw from "tailwind-rn";
import fontSize from "../constants/fontSize";
import Colors from "../constants/Colors";
import { drop } from "lodash";
const ios = Platform.OS === "ios";
@ -32,13 +29,14 @@ if (
UIManager.setLayoutAnimationEnabledExperimental(true);
}
const Drawer = ({ position, setBoxPosition, user, mobile }) => {
const Drawer = ({ position, setBoxPosition, user, mobile, theme }) => {
const [height, setHeight] = useState(Dimensions.get("window").height);
const [width, setWidth] = useState(Dimensions.get("window").width);
const [dropdown, setDropdown] = useState(false);
const [dropdownHeight, setDropdownHeight] = useState(0);
const navigation = useNavigation();
const colorScheme = Appearance.getColorScheme();
const routes = [
{
name: "صفحه اصلی",
@ -205,8 +203,8 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
message: "",
},
];
const [addUserDropdown, setAddUserDropdown] = useState(false);
const navigation = useNavigation();
const Route = ({ route }) => {
return (
<TouchableOpacity
@ -272,7 +270,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
<View
style={[
tw("flex items-end pt-12 px-4"),
{ backgroundColor: Colors.theme1[colorScheme].greenCF },
{ backgroundColor: Colors.theme1[theme].greenCF },
]}
>
{user?.picFileIds ? (
@ -353,7 +351,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3,
borderColor: Colors.theme1[theme].grayE3,
height: dropdownHeight,
},
]}
@ -362,7 +360,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
style={{
fontSize: mobile ? fontSize.base : fontSize.xl,
fontFamily: "regular",
color: Colors.theme1[colorScheme].gray20,
color: Colors.theme1[theme].gray20,
}}
>
افزودن حساب کاربری جدید
@ -373,7 +371,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
marginTop: 3,
fontSize: fontSize.xl4,
fontFamily: "bold",
color: Colors.theme1[colorScheme].gray20 + "77",
color: Colors.theme1[theme].gray20 + "77",
}}
>
+
@ -393,6 +391,7 @@ const Drawer = ({ position, setBoxPosition, user, mobile }) => {
const mapStateToProps = (state) => ({
user: state.user.status,
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

20
src/components/Empty.js
Unescape View File

@ -1,13 +1,13 @@
import { View, Text, Pressable, Appearance } from "react-native";
import { View, Text, Pressable } from "react-native";
import React from "react";
import { connect } from "react-redux";
//style
import Colors from "../constants/Colors";
import tw from "tailwind-rn";
import fontSize from "../constants/fontSize";
const Empty = ({ text, buttonText, buttonAction }) => {
const colorScheme = Appearance.getColorScheme();
const Empty = ({ text, buttonText, buttonAction, theme }) => {
return (
<View style={tw("flex-1 flex justify-center items-center")}>
<Text
@ -23,7 +23,13 @@ const Empty = ({ text, buttonText, buttonAction }) => {
{text + " " + ":("}
</Text>
{buttonText && (
<Pressable style={[tw('py-2 px-5 rounded-sm'),{ backgroundColor: Colors.theme1[colorScheme].greenCF }]} onPress={() => buttonAction()}>
<Pressable
style={[
tw("py-2 px-5 rounded-sm"),
{ backgroundColor: Colors.theme1[theme].greenCF },
]}
onPress={() => buttonAction()}
>
<Text
style={[
tw("text-white"),
@ -41,4 +47,8 @@ const Empty = ({ text, buttonText, buttonAction }) => {
);
};
export default Empty;
const mapStateToProps = (state) => ({
theme: state.publicApi.theme,
});
export default connect(mapStateToProps)(Empty);

9
src/components/Navbar.js
Unescape View File

@ -34,9 +34,9 @@ const Navbar = ({
addToBookmark,
deleteBookmark,
userFavoriteList,
theme
}) => {
const navigation = useNavigation();
const colorScheme = Appearance.getColorScheme();
const isActiveBookmark = React.useMemo(() => {
return userFavoriteList.filter((object) =>
@ -52,8 +52,8 @@ const Navbar = ({
style={[
tw("rounded-md p-1"),
{
backgroundColor: Color.theme1[colorScheme].greenCF + "05",
borderColor: Color.theme1[colorScheme].green79,
backgroundColor: Color.theme1[theme].greenCF + "05",
borderColor: Color.theme1[theme].green79,
borderWidth: 1,
marginLeft: route === "AR" ? 10 : 0,
},
@ -92,7 +92,7 @@ const Navbar = ({
style={{
fontFamily: "bold",
fontSize: fontSize.lg,
color: Color.theme1[colorScheme].green79,
color: Color.theme1[theme].green79,
paddingRight: 16,
}}
>
@ -305,6 +305,7 @@ const Navbar = ({
const mapStateToProps = (state) => ({
userFavoriteList: state.userFavorite.list,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

32
src/components/Progress.js
Unescape View File

@ -1,36 +1,26 @@
import React, { useState, useEffect } from "react";
import { View, Appearance } from "react-native";
import tw from "tailwind-rn";
import React from "react";
import { View } from "react-native";
import {connect} from "react-redux";
//assets
import tw from "tailwind-rn";
import Colors from "../constants/Colors";
//Color
import Color from "../constants/Colors";
function Progress({ percent, alignItems }) {
const colorScheme = Appearance.getColorScheme();
const [delayPercent, setDelayPercent] = useState(60);
// useEffect(() => {
// if (percent) {
// setTimeout(() => {
// setDelayPercent(() => percent);
// }, 1000);
// }
// }, [percent]);
function Progress({ percent, alignItems, theme }) {
return (
<View
style={[
tw(
`w-full h-1.5 rounded-full overflow-hidden my-3 flex ${alignItems}`
),
{ backgroundColor: Colors.theme1[colorScheme].green79 + "22" },
{ backgroundColor: Colors.theme1[theme].green79 + "22" },
]}
>
<View
style={[
tw("h-full rounded-full"),
{
backgroundColor: Color.theme1[colorScheme].greenCF,
backgroundColor: Colors.theme1[theme].greenCF,
width: percent + "%",
// backgroundColor: Color.theme1.light.blue4,
},
@ -40,4 +30,8 @@ function Progress({ percent, alignItems }) {
);
}
export default Progress;
const mapStateToProps = (state) => ({
theme: state.publicApi.theme,
})
export default connect(mapStateToProps)(Progress);

22
src/components/Search.js
Unescape View File

@ -2,11 +2,10 @@ import React, { useState } from "react";
import {
TextInput,
View,
Dimensions,
StyleSheet,
Pressable,
Appearance,
} from "react-native";
import {connect} from "react-redux";
import tw from "tailwind-rn";
import { AntDesign } from "@expo/vector-icons";
@ -14,21 +13,18 @@ import { AntDesign } from "@expo/vector-icons";
import Colors from "../constants/Colors";
import fontSize from "../constants/fontSize";
const width = Dimensions.get("window").width;
const Search = ({ placeholder, textAlign, direction, onChange, value }) => {
const colorScheme = Appearance.getColorScheme();
const Search = ({ placeholder, textAlign, direction, onChange, value, theme }) => {
const styles = StyleSheet.create({
inputStyle: {
fontSize: fontSize.tiny,
color: Colors.theme1[colorScheme].gray2077,
color: Colors.theme1[theme].gray2077,
borderWidth: 0.5,
borderColor: Colors.theme1[colorScheme].gray20 + '88',
borderColor: Colors.theme1[theme].gray20 + '88',
paddingVertical: 10,
paddingHorizontal: 10,
direction: direction,
textAlign: textAlign,
backgroundColor: Colors.theme1[colorScheme].white,
backgroundColor: Colors.theme1[theme].white,
fontFamily: "regular",
},
});
@ -38,7 +34,7 @@ const Search = ({ placeholder, textAlign, direction, onChange, value }) => {
style={[styles.inputStyle, tw("rounded-sm")]}
onChangeText={(text) => onChange(text)}
placeholder={placeholder}
placeholderTextColor={Colors.theme1[colorScheme].gray20 + '88'}
placeholderTextColor={Colors.theme1[theme].gray20 + '88'}
value={value}
/>
<Pressable style={tw("absolute left-3 top-3")}>
@ -48,7 +44,11 @@ const Search = ({ placeholder, textAlign, direction, onChange, value }) => {
);
};
export default Search;
const mapStateToProps = (state) => ({
theme : state.publicApi.theme,
})
export default connect(mapStateToProps)(Search);
Search.defaultProps = {
direction: "rtl",

4
src/screens/Products/components/Main.js
Unescape View File

@ -132,7 +132,7 @@ const Main = ({ books, filterOptions, grades, mobile, theme }) => {
</Pressable>
))
: bySearchFilter?.map((product, index) => (
<>
<React.Fragment key={index}>
{(productType
? productType === ("کتاب دیجیتال" || "همه محصولات")
: true) && (
@ -315,7 +315,7 @@ const Main = ({ books, filterOptions, grades, mobile, theme }) => {
</View>
</Pressable>
)}
</>
</React.Fragment>
));
};

33
src/screens/Video/components/Season.js
Unescape View File

@ -3,10 +3,12 @@ import { View, Text, Pressable, Appearance } from "react-native";
import { SimpleLineIcons } from "@expo/vector-icons";
import { connect } from "react-redux";
import { publicApi } from "../../../redux/actions";
import { useNavigation } from "@react-navigation/native";
//assets
import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
import { useNavigation } from "@react-navigation/native";
const duration = (value) => {
const minute = value % 60;
@ -26,10 +28,10 @@ const Season = ({
activeSeason,
realSeasons,
seasonName,
mobile
mobile,
theme
}) => {
// const [selectedSeason, setSelectedSeason] = useState(null);
const colorScheme = Appearance.getColorScheme();
const navigation = useNavigation();
const Unit = ({ unit, index }) => {
return (
@ -38,7 +40,7 @@ const Season = ({
tw("w-full flex overflow-hidden mb-3"),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].grayE3,
borderColor: Colors.theme1[theme].grayE3,
},
]}
>
@ -54,7 +56,7 @@ const Season = ({
{
fontFamily: "bold",
fontSize: mobile ? fontSize.base : fontSize.lg,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
},
]}
>
@ -66,7 +68,7 @@ const Season = ({
{
fontFamily: "regular",
fontSize: mobile ? fontSize.base : fontSize.lg,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
},
]}
>
@ -79,8 +81,8 @@ const Season = ({
borderWidth: 1,
borderColor:
Number(index) === 0
? Colors.theme1[colorScheme].greenCF
: Colors.theme1[colorScheme].gray2077,
? Colors.theme1[theme].greenCF
: Colors.theme1[theme].gray2077,
},
]}
onPress={() =>
@ -101,8 +103,8 @@ const Season = ({
fontSize: mobile ? fontSize.tiny : fontSize.lg,
color:
Number(index) === 0
? Colors.theme1[colorScheme].greenCF
: Colors.theme1[colorScheme].gray2077,
? Colors.theme1[theme].greenCF
: Colors.theme1[theme].gray2077,
}}
>
نمایش
@ -119,9 +121,9 @@ const Season = ({
style={[
tw("flex rounded-sm py-3 px-3"),
{
backgroundColor: Colors.theme1[colorScheme].greenCF + "05",
backgroundColor: Colors.theme1[theme].greenCF + "05",
borderWidth: 1,
borderColor: Colors.theme1[colorScheme].greenC8,
borderColor: Colors.theme1[theme].greenC8,
},
]}
onPress={() => toggle(season[0].categoryId)}
@ -132,7 +134,7 @@ const Season = ({
{
fontFamily: "bold",
fontSize: mobile ? fontSize.base : fontSize.xl,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
},
]}
>
@ -146,7 +148,7 @@ const Season = ({
season[0].categoryId === activeSeason ? "arrow-up" : "arrow-down"
}
size={14}
color={Colors.theme1[colorScheme].green79}
color={Colors.theme1[theme].green79}
/>
</View>
{season[0]?.categoryId === activeSeason &&
@ -162,7 +164,8 @@ const mapStateToProps = (state) => ({
activeSeason: state.publicApi.activeCategory,
realSeasons: state.publicApi.bookInfo?.categories,
vodDuration: state.publicApi.bookInfo?.vodDuration,
mobile: state.publicApi.mobile
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

9
src/screens/Video/index.js
Unescape View File

@ -40,8 +40,8 @@ function Product({
pushToCart,
loading,
mobile,
theme
}) {
const colorScheme = Appearance.getColorScheme();
const [position, setPosition] = useState("100%");
useEffect(() => {
@ -97,7 +97,7 @@ function Product({
<Text
style={{
marginTop: 5,
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: mobile ? fontSize.base : fontSize.xl3,
marginBottom: 0,
fontFamily: "demi",
@ -107,7 +107,7 @@ function Product({
</Text>
<Text
style={{
color: Colors.theme1[colorScheme].green79,
color: Colors.theme1[theme].green79,
fontSize: mobile ? fontSize.tiny : fontSize.xl,
marginTop: 10,
fontFamily: "regular",
@ -129,7 +129,7 @@ function Product({
</View>
<CustomPressable
title={`خرید با قیمت ${separate(book?.product[2]?.price)} تومان`}
backgroundColor={Colors.theme1[colorScheme].greenCF}
backgroundColor={Colors.theme1[theme].greenCF}
color={"white"}
border={{ color: "#196EC0", width: 0 }}
width={"100%"}
@ -176,6 +176,7 @@ const mapStateToProps = (state) => ({
userId: state.user.status?.id,
loading: state.userProduct.loading,
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

41
src/screens/VideoDisplay/components/Season/index.js
Unescape View File

@ -11,20 +11,20 @@ import Colors from "../../../../constants/Colors";
const { width } = Dimensions.get("window");
const Season = ({ season, activeUnit, name, setVideoActive, mobile }) => {
const colorScheme = Appearance.getColorScheme();
const duration = (value) => {
const minute = value % 60;
const hour = Math.round(value / 60);
return (
(hour > 0
? (hour.toString().length === 1 ? "0" + hour.toString() : hour) + ""
: "") +
":" +
(minute.toString().length === 1 ? "0" + minute.toString() : minute)
);
};
const Season = ({ season, activeUnit, name, setVideoActive, mobile, theme }) => {
const navigation = useNavigation();
const duration = (value) => {
const minute = value % 60;
const hour = Math.round(value / 60);
return (
(hour > 0
? (hour.toString().length === 1 ? "0" + hour.toString() : hour) + ""
: "") +
":" +
(minute.toString().length === 1 ? "0" + minute.toString() : minute)
);
};
const Unit = ({ unit }) => {
const selectVideo = () => {
@ -41,10 +41,10 @@ const Season = ({ season, activeUnit, name, setVideoActive, mobile }) => {
tw(`w-full flex rounded-md overflow-hidden ${mobile ? "mb-3" : "mb-5"}`),
{
borderWidth: 1,
borderColor: Colors.theme1[colorScheme].greenD9,
borderColor: Colors.theme1[theme].greenD9,
backgroundColor:
activeUnit === unit
? Colors.theme1[colorScheme].greenCF
? Colors.theme1[theme].greenCF
: "transparent",
},
]}
@ -56,7 +56,7 @@ const Season = ({ season, activeUnit, name, setVideoActive, mobile }) => {
),
{
borderBottomWidth: 1,
borderColor: Colors.theme1[colorScheme].greenD9,
borderColor: Colors.theme1[theme].greenD9,
},
]}
>
@ -68,7 +68,7 @@ const Season = ({ season, activeUnit, name, setVideoActive, mobile }) => {
color:
activeUnit === unit
? "white"
: Colors.theme1[colorScheme].green79,
: Colors.theme1[theme].green79,
},
]}
>
@ -82,12 +82,12 @@ const Season = ({ season, activeUnit, name, setVideoActive, mobile }) => {
color:
activeUnit === unit
? "white"
: Colors.theme1[colorScheme].green79,
: Colors.theme1[theme].green79,
borderRightWidth: 1,
borderColor:
activeUnit === unit
? "white"
: Colors.theme1[colorScheme].green79,
: Colors.theme1[theme].green79,
paddingRight: 8,
},
]}
@ -109,7 +109,7 @@ const Season = ({ season, activeUnit, name, setVideoActive, mobile }) => {
color:
activeUnit === unit
? "white"
: Colors.theme1[colorScheme].green79,
: Colors.theme1[theme].green79,
}}
>
نمایش
@ -134,6 +134,7 @@ const mapStateToProps = (state) => ({
vods: state.publicApi.bookSection?.vods,
userid: state.user.status?.id,
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
const mapDispatchToProps = {

14
src/screens/VideoDisplay/index.js
Unescape View File

@ -7,29 +7,28 @@ import {
SafeAreaView,
StatusBar,
LayoutAnimation,
Appearance,
Text,
Platform,
} from "react-native";
import { connect } from "react-redux";
import { publicApi } from "../../redux/actions";
import { Video } from "expo-av";
import * as ScreenOrientation from "expo-screen-orientation";
//components
import Navbar from "../../components/Navbar";
import Drawer from "../../components/Drawer";
import { Video } from "expo-av";
import * as ScreenOrientation from "expo-screen-orientation";
import Season from "./components/Season";
import Divider from "../../components/Divider";
//assets
import tw from "tailwind-rn";
import fontSize from "../../constants/fontSize";
import Colors from "../../constants/Colors";
const ios = Platform.OS === "ios";
function VideoDisplay({ route, mobile }) {
const colorScheme = Appearance.getColorScheme();
function VideoDisplay({ route, mobile, theme }) {
const video = React.useRef(null);
const [width, setWidth] = useState(Dimensions.get("window").width);
const [status, setStatus] = React.useState({});
@ -40,7 +39,7 @@ function VideoDisplay({ route, mobile }) {
setPosition(position === "100%" ? "0%" : "100%");
};
function setOrientation() {
const setOrientation = () => {
if (Dimensions.get("window").height > Dimensions.get("window").width) {
//Device is in portrait mode, rotate to landscape mode.
ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE);
@ -95,7 +94,7 @@ function VideoDisplay({ route, mobile }) {
fontSize: fontSize.xl,
fontFamily: "bold",
marginTop: mobile ? 8 : 12,
color: Colors.theme1[colorScheme].gray20,
color: Colors.theme1[theme].gray20,
textAlign: ios ? "right" : "auto",
}}
>
@ -137,6 +136,7 @@ const styles = StyleSheet.create({
const mapStateToProps = (state) => ({
grades: state.publicApi.grades,
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
export default connect(mapStateToProps)(VideoDisplay);

174
src/screens/Videos/components/MostViewedVideo.js
Unescape View File

@ -16,111 +16,114 @@ import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
const { width } = Dimensions.get("window");
//components
import Header from "../../Home/components/Header";
function MostViewedVideo({ videos, grades, mobile }) {
const { width } = Dimensions.get("window");
function MostViewedVideo({ videos, grades, mobile, theme }) {
const navigation = useNavigation();
const colorScheme = Appearance.getColorScheme();
const Video = ({ video }) => {
return (
<Pressable
style={[
{
width: mobile ? width / 1.5 : width / 2.2,
},
tw("flex items-end rounded-md ml-6"),
]}
onPress={() => navigation.navigate("Video", { id: video.id })}
>
<View
const Video = React.useCallback(
({ video }) => {
return (
<Pressable
style={[
tw(
"w-full flex flex-row flex-1 justify-between items-center relative overflow-hidden"
),
{ height: ((mobile ? width / 1.5 : width / 2.2) * 9) / 16 },
{
width: mobile ? width / 1.5 : width / 2.2,
},
tw("flex items-end rounded-md ml-6"),
]}
onPress={() => navigation.navigate("Video", { id: video.id })}
>
<Image
source={{ uri: `https://dnvn.ir/api/v1/file/${video.fileIds}` }}
style={tw("w-full h-full absolute left-0 top-0 rounded-sm")}
/>
<Image
source={{ uri: `https://dnvn.ir/api/v1/file/${video.fileIds}` }}
resizeMode="contain"
<View
style={[
tw(
`rounded-sm h-full absolute left-2 ${
mobile ? "" : "top-1/5"
}`
"w-full flex flex-row flex-1 justify-between items-center relative overflow-hidden"
),
{
width: mobile ? 70 : 105,
height: mobile ? 110 : 150,
borderWidth: 2,
borderColor: "white",
},
{ height: ((mobile ? width / 1.5 : width / 2.2) * 9) / 16 },
]}
/>
</View>
<Text
style={{
fontSize: mobile ? fontSize.base : fontSize.xl,
marginTop: 5,
paddingRight: 4,
color: Colors.theme1[colorScheme].gray20,
fontFamily: "regular",
}}
>
{"دوره ویدئویی" + " " + video?.name}
</Text>
<View
style={tw(
"w-full flex flex-row justify-between items-center px-1 mt-0"
)}
>
<View style={tw("flex flex-row items-center")}>
<Text
style={[
{
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: mobile ? fontSize.sm : fontSize.tiny,
marginRight: 3,
},
]}
>
تومان
</Text>
<Text
>
<Image
source={{ uri: `https://dnvn.ir/api/v1/file/${video.fileIds}` }}
style={tw("w-full h-full absolute left-0 top-0 rounded-sm")}
/>
<Image
source={{ uri: `https://dnvn.ir/api/v1/file/${video.fileIds}` }}
resizeMode="contain"
style={[
tw(
`rounded-sm h-full absolute left-2 ${mobile ? "" : "top-1/5"}`
),
{
color: Colors.theme1[colorScheme].gray20,
fontFamily: "bold",
fontSize: mobile ? fontSize.xl : fontSize.xl3,
width: mobile ? 70 : 105,
height: mobile ? 110 : 150,
borderWidth: 2,
borderColor: "white",
},
]}
>
{separate(video?.product[2]?.price)}
</Text>
/>
</View>
<Text
style={{
color: Colors.theme1[colorScheme].gray20,
fontFamily: "light",
fontSize: mobile ? fontSize.tiny : fontSize.lg,
marginTop: 0
fontSize: mobile ? fontSize.base : fontSize.xl,
marginTop: 5,
paddingRight: 4,
color: Colors.theme1[theme].gray20,
fontFamily: "regular",
}}
>
{"پایه" + " " + grades[video?.gradeId]}
{"دوره ویدئویی" + " " + video?.name}
</Text>
</View>
</Pressable>
);
};
<View
style={tw(
"w-full flex flex-row justify-between items-center px-1 mt-0"
)}
>
<View style={tw("flex flex-row items-center")}>
<Text
style={[
{
color: Colors.theme1[theme].gray20,
fontFamily: "bold",
fontSize: mobile ? fontSize.sm : fontSize.tiny,
marginRight: 3,
},
]}
>
تومان
</Text>
<Text
style={[
{
color: Colors.theme1[theme].gray20,
fontFamily: "bold",
fontSize: mobile ? fontSize.xl : fontSize.xl3,
},
]}
>
{separate(video?.product[2]?.price)}
</Text>
</View>
<Text
style={{
color: Colors.theme1[theme].gray20,
fontFamily: "light",
fontSize: mobile ? fontSize.tiny : fontSize.lg,
marginTop: 0,
}}
>
{"پایه" + " " + grades[video?.gradeId]}
</Text>
</View>
</Pressable>
);
},
[videos, theme, mobile]
);
return (
<View style={tw("w-full flex w-full mt-3")}>
<Header title="پربازدیدترین" />
@ -139,6 +142,7 @@ function MostViewedVideo({ videos, grades, mobile }) {
const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile,
theme: state.publicApi.theme,
});
export default connect(mapStateToProps)(MostViewedVideo);

15
src/screens/Videos/components/NewestVideo.js
Unescape View File

@ -5,26 +5,26 @@ import {
Image,
Dimensions,
Text,
Appearance,
Platform,
} from "react-native";
import { useNavigation } from "@react-navigation/native";
import { connect } from "react-redux";
import separate from "../../../utils/separate";
//style
import tw from "tailwind-rn";
import fontSize from "../../../constants/fontSize";
import Colors from "../../../constants/Colors";
//components
import Header from "../../Home/components/Header";
const { width } = Dimensions.get("window");
const ios = Platform.OS === "ios";
import Header from "../../Home/components/Header";
const NewestVideo = ({ videos, grades, mobile }) => {
const colorScheme = Appearance.getColorScheme();
const NewestVideo = ({ videos, grades, mobile, theme }) => {
const navigation = useNavigation();
const Video = ({ video }) => {
return (
<Pressable
@ -50,7 +50,7 @@ const NewestVideo = ({ videos, grades, mobile }) => {
style={{
fontSize: mobile ? fontSize.base : fontSize.xl,
marginTop: 5,
color: Colors.theme1[colorScheme].gray20,
color: Colors.theme1[theme].gray20,
fontFamily: "bold",
}}
>
@ -58,7 +58,7 @@ const NewestVideo = ({ videos, grades, mobile }) => {
</Text>
<Text
style={{
color: Colors.theme1[colorScheme].gray20,
color: Colors.theme1[theme].gray20,
fontFamily: "light",
fontSize: mobile ? fontSize.tiny : fontSize.lg,
marginTop: 5,
@ -89,6 +89,7 @@ const NewestVideo = ({ videos, grades, mobile }) => {
const mapStateToProps = (state) => ({
mobile: state.publicApi.mobile,
theme: state.publicApi.theme
});
export default connect(mapStateToProps)(NewestVideo);

6
src/screens/Videos/index.js
Unescape View File

@ -11,19 +11,19 @@ import {
} from "react-native";
import { connect } from "react-redux";
import { book } from "../../redux/actions";
//components
import Navbar from "../../components/Navbar";
import Drawer from "../../components/Drawer";
import Search from "../../components/Search";
import VerticalGradeFilter from "./components/VerticalGradeFilter";
import Divider from "../../components/Divider";
import MostViewedVideo from "./components/MostViewedVideo";
import NewestVideo from "./components/NewestVideo";
//assets
import tw from 'tailwind-rn';
const width = Dimensions.get("window").width;
function Videos({ grades, videos, getVideos, mobile }) {
const [search, setSearch] = useState("");
const [position, setPosition] = useState("100%");

Write Preview
Loading…
Cancel
Save