@chainplatform/sdk 0.3.5 → 0.3.7

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@chainplatform/sdk",
-  "version": "0.3.5",
+  "version": "0.3.7",
   "description": "@chainplatform/sdk is a React Native library implement for react-native and react-native-web. Require crypto-js and react-native-mmkv packages.",
   "main": "index.js",
   "devDependencies": {
     "react": "*",
     "react-native": "*",
-    "react-native-web": "*"
+    "react-native-web": "*",
+    "react-native-mmkv": "*"
   },
   "author": "Chain Platform <santran686@gmail.com> (https://chainplatform.net/)",
   "license": "MIT",
@@ -17,8 +18,7 @@
     "@chainplatform/sdk",
     "crypto-js",
     "dayjs",
-    "react-native-mmkv",
-    "react-device-detect"
+    "react-native-mmkv"
   ],
   "homepage": "https://github.com/ChainPlatform/ChainSDK",
   "bugs": "https://github.com/ChainPlatform/ChainSDK/issues",
@@ -32,7 +32,6 @@
     "react-native": "*",
     "react-native-web": "*",
     "react-native-mmkv": "*",
-    "react-device-detect": "*",
     "crypto-js": "*"
   }
 }

package/Layout.js

@@ -1,291 +0,0 @@
-export function getScreenSize(layoutWidth, isDesktop, side_bar_width, styles) {
-    const viewPadding = styles.fs15;
-    let menuViewWidth = styles.s0;
-    let bannerViewWidth = styles.s0;
-    let splitPadding = styles.s0;
-    let sideBarWidth = styles.s0;
-    let courseViewWidth = styles.s0;
-    let newsViewWidth = styles.s0;
-    let bannerOnScreen = 1;
-    //Menu
-    let imageMenuSize = styles.s45;
-    let fontMenuSize = styles.fs9_5;
-    let menuTotalItem = 5;
-    let menuSpace = 4 * styles.s5;
-    // Course
-    let courseTotalItem = 2;
-    let newsTotalItem = 2;
-    let courseSpace = 0;
-    let newsSpace = 0;
-    // News
-    let newsItem = 1;
-    let newsPadding = 0;
-    // New Course
-    let courseItem = 1;
-    let coursePadding = 0;
-    if (isDesktop) {
-        courseSpace = styles.s30 + styles.fs15;
-        newsSpace = styles.s30 + styles.fs15;
-    } else {
-        courseSpace = styles.fs15;
-        newsSpace = styles.fs15;
-    }
-    if (isDesktop && layoutWidth > styles.base_desktop) {
-        sideBarWidth = side_bar_width;
-        // Menu
-        imageMenuSize = styles.s55;
-        fontMenuSize = styles.fs12;
-        // Course
-        courseTotalItem = 3;
-        newsTotalItem = 3;
-        courseSpace = styles.s45 + styles.fs15;
-        newsSpace = styles.s45 + styles.fs15;
-        // News
-        newsItem = 2;
-        newsPadding = styles.fs15;
-        // New Course
-        courseItem = 3;
-        coursePadding = styles.s30;
-    }
-    let viewWidth = styles.s345;
-    let viewHeight = styles.s195;
-    if (isDesktop) {
-        if (layoutWidth >= styles.split_desktop) {
-            bannerOnScreen = 2;
-            splitPadding = styles.fs15;
-            // Menu
-            menuTotalItem = 10;
-            menuSpace = 9 * styles.s5;
-            fontMenuSize = styles.fs13;
-            // Course
-            courseTotalItem = 4;
-            newsTotalItem = 4;
-            courseSpace = styles.s75;
-            newsSpace = styles.s75;
-            // News
-            newsItem = 3;
-            newsPadding = styles.s30;
-            // New Course
-            courseItem = 4;
-            coursePadding = styles.s45;
-        }
-        if (layoutWidth >= styles.wide_split_desktop) {
-            // Course
-            courseTotalItem = 5;
-            courseSpace = styles.s75 + styles.fs15;
-            //
-            courseItem = 5;
-            coursePadding = styles.s60;
-        }
-        bannerViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - splitPadding;
-        viewWidth = bannerViewWidth / bannerOnScreen;
-        viewHeight = styles.s195 * (viewWidth / styles.s345);
-    }
-    // Menu
-    menuViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - menuSpace;
-    const menuWidth = menuViewWidth / menuTotalItem;
-    // Course
-    courseViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - courseSpace;
-    const courseWidth = courseViewWidth / courseTotalItem;
-    // News
-    newsViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - newsSpace;
-    const newsWidth = newsViewWidth / newsTotalItem;
-    //
-    let numberChart = 1;
-    let padding = styles.s30;
-    if (layoutWidth > 460 && layoutWidth < styles.base_desktop) {
-        numberChart = 2;
-        padding = styles.s45;
-    }
-    if (layoutWidth >= styles.base_desktop && layoutWidth < styles.split_desktop) {
-        numberChart = 3;
-        padding = styles.s60;
-    }
-    if (layoutWidth >= styles.split_desktop) {
-        numberChart = 5;
-        padding = styles.s90;
-    }
-    let packageWidth = (layoutWidth - padding - sideBarWidth) / numberChart;
-    if (packageWidth < styles.s232) {
-        packageWidth = styles.s232;
-    }
-    if (packageWidth > styles.s280) {
-        packageWidth = styles.s280;
-    }
-
-    let numberwebinarChart = 1;
-    let webinarPadding = styles.s0;
-    if (layoutWidth - sideBarWidth - 2 * viewPadding >= 500) {
-        numberwebinarChart = 2;
-        webinarPadding = styles.fs15;
-    }
-    if (layoutWidth >= styles.split_desktop && side_bar_width == 0) {
-        numberwebinarChart = 3;
-        webinarPadding = styles.fs15;
-    }
-
-    let newsItemViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - newsPadding;
-    const newsItemWidth = newsItemViewWidth / newsItem;
-
-    let courseItemViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - coursePadding;
-    const courseItemWidth = courseItemViewWidth / courseItem;
-
-    let webinarViewWidth = layoutWidth - sideBarWidth - 2 * viewPadding - (numberwebinarChart - 1) * webinarPadding;
-    const webinarWidth = webinarViewWidth / numberwebinarChart;
-
-    const layout = layoutWidth - sideBarWidth - (sideBarWidth > 0 ? 2 : 2) * viewPadding;
-
-    let view = {};
-    view.courseItemWidth = courseItemWidth;
-    view.courseItem = courseItem;
-    view.coursePadding = coursePadding;
-    view.newsItemWidth = newsItemWidth;
-    view.newsItem = newsItem;
-    view.newsPadding = newsPadding;
-    view.webinarWidth = webinarWidth;
-    view.webinarPadding = webinarPadding;
-    view.numberWebinar = numberwebinarChart;
-    view.viewPadding = viewPadding;
-    view.sideBarWidth = sideBarWidth;
-    view.layout = layout;
-    view.bannerOnScreen = bannerOnScreen;
-    view.imageMenuSize = imageMenuSize;
-    view.fontMenuSize = fontMenuSize;
-    view.viewWidth = viewWidth;
-    view.viewHeight = viewHeight;
-    view.menuWidth = menuWidth;
-    view.courseWidth = courseWidth;
-    view.newsWidth = newsWidth;
-    view.splitPadding = splitPadding;
-    view.packageWidth = packageWidth;
-    return view;
-}
-
-export function getCartLayout(layoutWidth, isDesktop, side_bar_width, styles) {
-    let viewPadding = styles.s0;
-    let viewSplit = styles.w100pc;
-    let borderRadius = styles.s0;
-    let marginBottom = styles.s1;
-    let sideBarWidth = styles.s0;
-    if (isDesktop && layoutWidth > styles.base_desktop) {
-        sideBarWidth = side_bar_width;
-        borderRadius = styles.s4;
-        marginBottom = styles.fs10;
-    }
-    if (layoutWidth >= styles.wide_split_desktop) {
-        viewSplit = styles.w50pc;
-    }
-    if (layoutWidth >= 767) {
-        viewPadding = styles.fs15;
-    }
-    let view = {};
-    view.viewPadding = viewPadding;
-    view.viewSplit = viewSplit;
-    view.sideBarWidth = sideBarWidth;
-    view.itemBorderRadius = borderRadius;
-    view.itemMarginBottom = marginBottom;
-    return view;
-}
-
-export function getTransactionLayout(layoutWidth, isDesktop, styles) {
-    let viewSplit = styles.w100pc;
-    if (isDesktop && layoutWidth >= 767) {
-        viewSplit = styles.w50pc;
-    }
-    let view = {};
-    view.viewSplit = viewSplit;
-    return view;
-}
-
-export function getCourseLayout(layoutWidth, isDesktop, styles) {
-    let viewSplit = styles.w100pc;
-    let viewPadding = styles.s0;
-    let color = 0;
-    let showButton = 1;
-    let childViewPadding = styles.fs15;
-    if (isDesktop && layoutWidth >= 767) {
-        viewSplit = styles.w50pc;
-        viewPadding = styles.fs15;
-        childViewPadding = styles.s0;
-        color = 1;
-        showButton = 0;
-    }
-    if (isDesktop && layoutWidth > 767 && layoutWidth < 991) {
-        showButton = 1;
-    }
-    let view = {};
-    view.color = color;
-    view.viewSplit = viewSplit;
-    view.viewPadding = viewPadding;
-    view.childViewPadding = childViewPadding;
-    view.showButton = showButton;
-    return view;
-}
-
-export function getUserCourseLayout(layoutWidth, isDesktop, styles) {
-    let viewPadding = styles.fs7_5;
-    let numberCol = 2;
-    if (isDesktop && layoutWidth >= 500) {
-        numberCol = 3;
-    }
-    if (isDesktop && layoutWidth > 767 && layoutWidth < 991) {
-        numberCol = 4;
-    }
-    if (isDesktop && layoutWidth >= 991) {
-        numberCol = 5;
-    }
-    const areaSpace = numberCol * styles.fs15;
-    const courseWidth = (layoutWidth - areaSpace - 2 * viewPadding) / numberCol;
-    let view = {};
-    view.viewPadding = viewPadding;
-    view.numberCol = numberCol;
-    view.courseWidth = courseWidth;
-    return view;
-}
-
-export function getUserOrderLayout(layoutWidth, isDesktop, styles) {
-    let viewPadding = styles.fs7_5;
-    let numberCol = 1;
-    let space = styles.fs15;
-    if (isDesktop && layoutWidth >= 600) {
-        numberCol = 2;
-        space = styles.s30;
-    }
-    if (isDesktop && layoutWidth >= 991) {
-        numberCol = 3;
-        space = styles.s45;
-    }
-    const itemWidth = (layoutWidth - space - 2 * viewPadding) / numberCol;
-    let view = {};
-    view.viewPadding = viewPadding;
-    view.numberCol = numberCol;
-    view.itemWidth = itemWidth;
-    return view;
-}
-
-export function getCourseLearingLayout(layoutWidth, isDesktop, styles) {
-    let sidebarWidth = styles.s0;
-    let viewPadding = styles.s0;
-    if (layoutWidth >= 992) {
-        sidebarWidth = styles.s345;
-    }
-    let view = {};
-    view.sidebarWidth = sidebarWidth;
-    view.viewPadding = viewPadding;
-    return view;
-}
-
-export function getScreenWebinarSize(layoutWidth, styles) {
-    let numberChart = 1;
-    let padding = styles.s30;
-    if (layoutWidth >= 500) {
-        numberChart = 2;
-        padding = styles.s45;
-    }
-    let tmpViewWidth = layoutWidth - padding;
-    let viewWidth = tmpViewWidth / numberChart;
-    let view = {};
-    view.viewWidth = viewWidth;
-    view.viewPadding = styles.fs15;
-    return view;
-}

package/LayoutAdmin.js

@@ -1,49 +0,0 @@
-export function getLayoutAdmin(layoutWidth, isDesktop, side_bar_width, styles) {
-    let numberChart = 1;
-    let padding = styles.s30;
-    let sideBarWidth = side_bar_width;
-    let sideBarOpen = false;
-    let sideBarMiniWidth = styles.s70;
-    let sideBarSecondWidth = side_bar_width - styles.s70;
-    if (isDesktop && layoutWidth > styles.base_desktop) {
-        sideBarWidth = side_bar_width;
-    }
-    if (layoutWidth > 600 && layoutWidth < styles.base_desktop) {
-        numberChart = 2;
-        padding = styles.s45;
-    }
-    if (layoutWidth >= styles.base_desktop && layoutWidth < styles.split_desktop) {
-        numberChart = 3;
-        padding = styles.s60;
-    }
-    if (layoutWidth >= styles.split_desktop) {
-        numberChart = 4;
-        padding = styles.s75;
-    }
-    const chartWidth = (layoutWidth - sideBarMiniWidth - padding) / numberChart;
-    const chartWidthPC = 100 / numberChart;
-    let view = {};
-    view.sideBarWidth = sideBarWidth;
-    view.sideBarMiniWidth = sideBarMiniWidth;
-    view.sideBarSecondWidth = sideBarSecondWidth;
-    view.sideBarOpen = sideBarOpen;
-    view.chartWidth = chartWidth;
-    view.chartWidthPC = chartWidthPC + "%";
-    return view;
-}
-
-export function getScreenSizeAdmin(layoutWidth, styles) {
-    let numberChart = 1;
-    let padding = styles.s0;
-    if (layoutWidth > 767) {
-        numberChart = 2;
-        padding = styles.s2;
-    }
-    const chartWidth = (layoutWidth - padding) / numberChart;
-    const chartWidthPC = 100 / numberChart;
-    let view = {};
-    view.padding = padding;
-    view.width = chartWidth;
-    view.widthPC = chartWidthPC + "%";
-    return view;
-}

package/SDK/colors.js

@@ -1,26 +0,0 @@
-export default {
-    transparent: '#33333300',
-    cl333: "#333333",
-    cl33333390: "#33333390",
-    grey: '#C8C8D5',
-    red_product: '#FF424E',
-    primary: '#4056A1',
-    border_color: '#DADADA80',
-    background: '#FFFFFF',
-    green2: "#11b719",
-    white: '#ffffff',
-    border: '#DDDDDD',
-    black: '#24272B',
-    green: '#09C04C',
-    tabDefault: '#95989A',
-    backgroundColor: "#6bb1f1",
-    cardColor: "#2f73d7",
-    headColor: "#163b8e",
-    yellowColor: "#f2d021",
-    greyColor: "#dddddd",
-    greenColor: "#5FB35E",
-    blueColor: "#19B3EF",
-    redColor: "#f05151",
-    redRGBAColor: "rgba(240, 81, 81, 0.65)",
-    headRGBAColor: "rgba(22, 58, 142, 0.5)"
-};

package/SDK/styles.js

@@ -1,137 +0,0 @@
-import { Dimensions } from 'react-native';
-import mobileCheck from '../helpers/DeviceDetect';
-
-const DESKTOP = mobileCheck.isMobile ? false : true;
-const entireScreenWidth = Dimensions.get('window').width;
-const SCREEN_WIDTH = DESKTOP && entireScreenWidth >= 1440 ? 1440 : entireScreenWidth;
-const screenWidth = DESKTOP ? Dimensions.get('window').width : 375;
-const REM = entireScreenWidth / screenWidth;
-const barHeight = DESKTOP ? (57 * REM) : (50 * REM);
-
-export default {
-    HEIGHT: Dimensions.get('window').height,
-    WIDTH: Dimensions.get('window').width,
-    SCREEN_WIDTH: SCREEN_WIDTH,
-    DESKTOP: DESKTOP,
-    REM: REM,
-    barHeight: barHeight,
-    headerHeight: mobileCheck.os == "mini_app" ? { height: 39 * REM } : { height: barHeight },
-    headerRightContainerStyle: mobileCheck.os == "mini_app" ? { paddingRight: 80 * REM } : {},
-    image_course_width: 356,
-    image_course_height: 267,
-    aspectRatio: 16 / 9,
-    small_logo: 1 / 1,
-    four_three: 4 / 3,
-    six_five: 6 / 5,
-    logo: 96 / 40,
-    banner: 1200 / 600,
-    image_course_rate: 9 / 16,
-    base_banner_width: 345,
-    base_banner_height: 195,
-    image_banner_rate: 195 / 345,
-    activeOpacity: 0.8,
-    fw800: "800",
-    fw400: "400",
-    fw500: "500",
-    fw600: "600",
-    fw700: "700",
-    flexstart: 'flex-start',
-    flexend: 'flex-end',
-    lineThrough: 'line-through',
-    flexWrap: 'wrap',
-    center: "center",
-    left: "left",
-    right: "right",
-    hidden: "hidden",
-    fwNormal: 'normal',
-    fwMedium: 'medium',
-    fwBold: 'bold',
-    w20pc: "20%",
-    w30pc: "30%",
-    w40pc: "40%",
-    w45pc: "45%",
-    w50pc: "50%",
-    w80pc: "80%",
-    w85pc: "85%",
-    w90pc: "90%",
-    w92pc: "92%",
-    w100pc: "100%",
-    w130pc: "130%",
-    w150pc: "150%",
-    absolute: "absolute",
-    uppercase: "uppercase",
-    spaceBetween: "space-between",
-    mw500: 500 * REM,
-    flexRow: 'row',
-    flexCol: 'column',
-    textUnderline: 'underline',
-    textItalic: "italic",
-    justify: 'justify',
-    button: {
-        marginLeft: 20 * REM,
-        marginRight: 20 * REM,
-        alignItems: 'center',
-        justifyContent: 'center',
-        borderRadius: 5 * REM,
-    },
-    buttonTitle: {
-        fontSize: 15 * REM,
-        padding: 11 * REM,
-        fontWeight: 'bold'
-    },
-    label: {
-        marginTop: 10 * REM,
-        fontWeight: '500',
-        fontSize: 14 * REM,
-        marginBottom: 3 * REM,
-        marginLeft: 20 * REM
-    },
-    textInput: {
-        padding: 10.5 * REM,
-        marginRight: 20 * REM,
-        marginLeft: 20 * REM,
-        borderRadius: 5 * REM,
-        color: "#333333",
-        fontSize: 14 * REM,
-        borderWidth: 1.5 * REM,
-        borderColor: '#DADADA80'
-    },
-    auto: 'auto',
-    base_desktop: 767,
-    split_desktop: 991,
-    wide_split_desktop: 1439,
-    base: (100 * (335 * REM) / (375 * REM)) + "%",
-    main_container: {
-        width: "100%",
-        maxWidth: 500 * REM,
-        flex: 1,
-        margin: 0,
-        marginLeft: "auto",
-        marginRight: "auto",
-        textAlign: 'flex-start'
-    },
-    container_text: {
-        width: 375 * REM,
-        alignItems: 'flex-start',
-        marginTop: 20 * REM,
-    },
-    shadow: {
-        shadowColor: "#000",
-        shadowOffset: {
-            width: 0,
-            height: 5 * REM,
-        },
-        shadowOpacity: 0.5,
-        shadowRadius: 8,
-        elevation: 11,
-    },
-    textShadow: {
-        textShadowColor: 'rgba(255, 255, 255, 0.75)',
-        textShadowOffset: { width: -1 * REM, height: 2 * REM },
-        textShadowRadius: 10
-    }
-}
-
-export function setSize(size) {
-    return size * REM;
-}

package/helpers/DeviceDetect/index.js

@@ -1,5 +0,0 @@
-let mobileCheck = {};
-mobileCheck.isMobile = true;
-mobileCheck.os = "native";
-
-export default mobileCheck;

package/helpers/DeviceDetect/index.web.js

@@ -1,9 +0,0 @@
-import * as mobiInfos from 'react-device-detect';
-
-let mobileCheck = mobiInfos;
-let os = "browser";
-if (typeof window.APP_CONFIG != "undefined" && typeof window.APP_CONFIG.os != "undefined") {
-    os = window.APP_CONFIG.os;
-}
-mobileCheck.os = os;
-export default mobileCheck;