import React, {Component} from 'react';
import PropTypes from 'prop-types';

import {
    Platform, StyleSheet, Text,
    TouchableWithoutFeedback, View, TextInput,
    Button,
    Animated, Dimensions, Image, PermissionsAndroid,
    StatusBar, TouchableNativeFeedback, TouchableOpacity, BackHandler, Alert, ProgressBarAndroid
    , NativeModules, Picker, FlatList
} from 'react-native';
import {responsiveHeight, responsiveWidth} from "react-native-responsive-dimensions"
import BaseScreen from "../BaseScreen";
import Icon from "react-native-vector-icons/MaterialIcons";
import BlurOverlay, {openOverlay, closeOverlay} from 'react-native-blur-overlay'
import I18n from 'react-native-i18n';
import {WebView} from 'react-native-webview';

type Props = {};
const route = require("./../../route.json")
const theme = require('./../../utils/theme.json')
export default class InterticielAds
    extends BaseScreen {
    static navigatorStyle = {
        drawUnderNavBar: true,
        navBarHidden: true,
        drawUnderStatusBar: false,
        statusBarHidden: true,
        statusBarTextColorScheme: 'light',
    };

    static options(passProps) {
        return {
            statusBar: {
                visible: false,
                drawBehind: true,
            },
            topBar: {
                drawBehind: true,
                visible: false,
                animate: false
            }
        };
    }


    constructor(props) {
        super(props);
    };


    render() {
        return (<BlurOverlay radius={14}
                             downsampling={2}
                             onPress={() => {
                                 this.setState({isPubShow: false})
                             }}
                             brightness={-200}

        >
            {this.renderChild()}
        </BlurOverlay>)
    }

    renderChild() {
        return (<View style={styles.container}>

            <WebView
                source={{uri: 'https://ilink-app.com/ads.html'}}
                style={{
                    width: responsiveWidth(100),
                    marginTop: 37 + responsiveHeight(4),
                    backgroundColor: 'white'
                }}
            />
            <View>
                <Button
                    title={I18n.t('QUIT_')}
                    color={theme.reddeconnect}
                    style={{position: 'absolute', zIndex: 10000}}
                    onPress={() => {
                        this.popOverLay()
                    }}
                >{I18n.t('QUIT_')}</Button>

            </View>

        </View>)

    }

    componentDidMount() {
        openOverlay()

    }

    async tryGetHtml() {
        response = await fetch('https://ad-server.ilink-app.com/ad_display/zone1/zone4.html')
    }

    popOverLay() {
        if (this.props.closeIntersticiel)
            this.props.closeIntersticiel()
        closeOverlay()

    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginTop: 30,
        backgroundColor: "white"
    },
    parent: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: "#000000AE"
    }
})