diff --git a/vds-app/App/components/Variables.js b/vds-app/App/components/Variables.js index e182241..a1a3590 100644 --- a/vds-app/App/components/Variables.js +++ b/vds-app/App/components/Variables.js @@ -45,3 +45,8 @@ export const examScheme = [ {section: "physiopathology", questions: 1, points: 2}, {section: "pilotingTechniques", questions: 5, points: 4} ] + +export const credentials = { + adMobUnitIDTest: "ca-app-pub-3940256099942544/6300978111", + adMobUnitID: "ca-app-pub-3940256099942544/6300978111" // "ca-app-pub-4145771316565790/1848957462", +} diff --git a/vds-app/App/index.js b/vds-app/App/index.js index 1de72d9..4896a85 100644 --- a/vds-app/App/index.js +++ b/vds-app/App/index.js @@ -1,6 +1,7 @@ import { createStackNavigator, createAppContainer } from "react-navigation" import Splash from "./screens/Splash" +import Banner from "./screens/Banner" import QuizIndex from "./screens/QuizIndex" import Quiz from "./screens/Quiz" import Exam from "./screens/Exam" @@ -17,6 +18,16 @@ const MainStack = createStackNavigator({ } }) }, + Banner: { + screen: Banner, + navigationOptions: ({ navigation }) => ({ + header: null, + backgroundColor: colors.yellow, + headerStyle: { + backgroundColor: colors.yellow + } + }) + }, QuizIndex: { screen: QuizIndex, navigationOptions: ({ navigation }) => ({ diff --git a/vds-app/App/screens/Banner.js b/vds-app/App/screens/Banner.js new file mode 100644 index 0000000..5b5c52d --- /dev/null +++ b/vds-app/App/screens/Banner.js @@ -0,0 +1,59 @@ +import React from "react" +import { View, StyleSheet, StatusBar, Text, Dimensions } from "react-native" +import { AdMobBanner, AdMobInterstitial, PublisherBanner, AdMobRewarded } from "expo-ads-admob" + +import { colors, texts, credentials } from "../components/Variables" + +const screen = Dimensions.get("window") + +const styles = StyleSheet.create({ + container: { + backgroundColor: colors.yellow, + position: "absolute", + bottom: 0, + left: 0, + right: 0, + flex: 1, + alignItems: "center", + justifyContent: "center" + }, + title: { + color: colors.white, + fontSize: 25, + textAlign: "center", + fontWeight: "600", + paddingVertical: 20 + }, + banner: { + width: "100%", + height: "100%", + marginVertical: 20 + }, +}) + +class Banner extends React.Component { + + state = { + results: false + } + + bannerError = (e) => { + console.log("Banner error: ", e) + } + + render() { + + return ( + + + + + ) + } +} + +export default Banner diff --git a/vds-app/App/screens/Splash.js b/vds-app/App/screens/Splash.js index b2eb034..7b01b8b 100644 --- a/vds-app/App/screens/Splash.js +++ b/vds-app/App/screens/Splash.js @@ -1,12 +1,15 @@ import React from "react" import { View, StyleSheet, StatusBar, Text, SafeAreaView, Dimensions, Image } from "react-native" +import { AdMobBanner } from "expo-ads-admob" import { Button, ButtonContainer } from "../components/Button" -import { colors, texts } from "../components/Variables" +import { colors, texts, credentials } from "../components/Variables" import { examQuestions } from "../components/ExamQuestions" const screen = Dimensions.get("window") const logo = require("../assets/logo.png") +const maxTime = 10 +let interval = null const styles = StyleSheet.create({ container: { @@ -14,6 +17,26 @@ const styles = StyleSheet.create({ flex: 1, paddingHorizontal: 20 }, + bannerContainer: { + backgroundColor: colors.dark_blue, + position: "absolute", + bottom: 0, + left: 0, + right: 0, + flex: 1, + alignItems: "center", + justifyContent: "center", + height: screen.height-230 + }, + bannerContainerColapsed: { + backgroundColor: colors.dark_blue, + height: 300 + }, + banner: { + width: 300, + height: 250, + marginVertical: 20 + }, title: { color: colors.white, fontSize: 25, @@ -29,6 +52,14 @@ const styles = StyleSheet.create({ paddingVertical: 20, marginTop: 20, }, + timer: { + color: colors.white, + fontSize: 30, + textAlign: "center", + fontWeight: "600", + paddingVertical: 20, + marginBottom: 20, + }, safearea: { flex: 1, marginTop: 10, @@ -49,12 +80,37 @@ const styles = StyleSheet.create({ class Splash extends React.Component { state = { - results: false + bannerExpanded: true, + timer: maxTime } + bannerError = (e) => { + console.log("Banner error: ", e) + } render() { + if(this.state.timer==maxTime) { + interval = setInterval( () => { + this.setState( (state) => { + return { + timer: this.state.timer-1, + } + }) + }, 1000) + } + + if(this.state.timer < 1) { + clearInterval(interval) + setTimeout( () => { + this.setState( (state) => { + return { + bannerExpanded: false + } + }) + }, 500) + } + return ( @@ -85,14 +141,24 @@ class Splash extends React.Component { color: colors.blue })} /> - - - + + + + { + this.state.bannerExpanded ? ( + {this.state.timer} + ) : null + } + ) } diff --git a/vds-app/app.json b/vds-app/app.json index efb7994..ea40beb 100644 --- a/vds-app/app.json +++ b/vds-app/app.json @@ -17,6 +17,11 @@ "fallbackToCacheTimeout": 10 }, "assetBundlePatterns": ["**/*"], + "android": { + "config": { + "googleMobileAdsAppId": "ca-app-pub-4145771316565790~1876877627" + } + }, "ios": { "supportsTablet": true } diff --git a/vds-app/package.json b/vds-app/package.json index bf50f1c..8f82578 100644 --- a/vds-app/package.json +++ b/vds-app/package.json @@ -9,8 +9,10 @@ }, "dependencies": { "expo": "^35.0.0", + "expo-ads-admob": "~7.0.0", "react": "16.8.3", "react-native": "https://github.com/expo/react-native/archive/sdk-35.0.0.tar.gz", + "react-native-admob": "1.3.2", "react-native-gesture-handler": "~1.3.0", "react-native-reanimated": "~1.2.0", "react-navigation": "^3.6.1"