import { WebView } from 'react-native-webview';
import React, { PureComponent,Component,Button as Button_v0, } from 'react';
// import { Button as Button_v0,} from 'react';
import { Button } from 'react-native-paper';
// Button as R_Button



import { Button as Button_v2, useTheme } from 'react-native-paper';
import {
    Animated,
    Keyboard,
    SafeAreaView,
    TextInput,
    TouchableHighlight,
    TouchableOpacity,
    View,
    Button as Button_v1,

    // Text,
} from 'react-native';
import * as rn from 'react-native';
import * as rn_cam from './rn_cam';
import * as rn_vshot from './rn_vshot';
// rn_vshot.ExampleCaptureOnMountManually

var Text2 = rn.Text

import {AbstractButton} from '../react/features/base/toolbox/components';
import { Header, LoadingIndicator, Text } from '../react/features/base/react';




// clog("glob_vhook:",)
glob_vhook.btns = {
Button_v0,
Button_v1,
Button_v2,

}


function onMsg(event ){
    clog("OBMSG>>>>")
    var onMsg = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("onMsg",{that:this,event},{}) : {}
}


type Props = {}
// class Wview_ui extends AbstractButton<Props> {
class Wview_ui extends PureComponent<Props> {
// class Wview_ui extends AbstractButton<Props, any> {
    // icon = "IconMessage";
    constructor(props) {
        super(props);
        this.v1="a"
        clog("Wview_v1 init")
        glob_vhook.nodes.wvui = this
     }

     render() { 
        // return 
     }

}



function dbg_vbx_onpress(event){
    clog("dbg_vbx_onpress:",event)
    clog("dbg_vbx_onpress:a",arguments)
    clog("dbg_vbx_onpress:this",this)
    clog("dbg_vbx_onpress:color",this.color)
    clog("dbg_vbx_onpress:currentTarget",event.currentTarget)
    clog("dbg_vbx_onpress:prop_id",this.prop_id)
}
function fncb_only_v2(fn_name,arg1){
    var that0 = this
    // var ret = function(arg2){
    return function(arg2){
        // return tglob_au.run_dev_cbs(fn_name,{arg1,arg2,argx:arguments})
        // clog("???2",fn_name)
        var ret2 = tglob_au.run_dev_cbs(fn_name,{arg1,arg2,argx:arguments,thats:{that0,that1:this}})
        return ret2.o.ret
    }
    // return ret
}
function fncb_only(fn_name){
    var ret
    if (window.glob_vhook.rcb[fn_name]){
        // ret = window.glob_vhook.rcb[fn_name](fn_name,o,dflt_ret)
        // (fn_name,o,dflt_ret)
        ret = {status:1,fn:window.glob_vhook.rcb[fn_name]}
    } else {
        ret = {status:0,fn:window.nop}
    }
    return ret 
}



// class Wview_btns extends Component<Props> {
class Wview_btns extends PureComponent<Props> {
    constructor(props) {
        super(props);
    }
    render(){
        // wview_btns = tglob_au.run_dev_cbs("wview_btns",{that:this})
        var x1 = tglob_au.run_dev_cbs("wview_btns",{that:this}) || {o:{}}
        var wview_btns = x1.o.ret || {}
        // clog("\n\n\n\nwview_btns",wview_btns)

        // wview_btns.style_b1 || {}
        // wview_btns.style_b2 || {}
        // wview_btns.style_v0 || {}


                         // color = { wv0_styles_dev.vb1_color || "#00ffffff" }
                         // onPress = {fncb_only("vbx_press").fn.bind(this)}
                        // style={wview_btns.style_v0 || {}}


            // prop_id = "b1"
            // prop_id = "b2"

                        // <View  style={wview_btns.style_v1 || {}}>
                                    // </View>
                        // <View  style={wview_btns.style_v2 || {}}>
                                    // </View>


                        // style={ {} }
        // return (


        // NEED CONSTS DEFS
        var ret_con = {}
        var ret =  (
                        <View  style={wview_btns.style_v0 || {}}>
            <Button_v2 
            prop_id = "b1"
                         style = { wview_btns.style_b1 || {}} 
                         labelStyle = { wview_btns.style_b2l || {}} 
                         color={wview_btns.color_b1}
                         onPress = {fncb_only_v2("vbx_press",{wvt:this,ret_con,button_action:"wb_toggle"})}
                         >
             {wview_btns.b1_txt  || "udef1"}
             </Button_v2>


            <Button_v2 
            prop_id = "b2"
                         style = { wview_btns.style_b2 || {}} 
                         labelStyle = { wview_btns.style_b2l || {}} 

                         color={wview_btns.color_b2}
                         onPress = {fncb_only_v2("vbx_press",{wvt:this,ret_con,button_action:"tbox_toggle"})}
                         >
             {wview_btns.b2_txt  || "udef2"}
             </Button_v2>
             {
                !!0 && <Text style={wview_btns.style_v2 || {}}>Wview_vx</Text>
             }
             { !!0 && <Text style={wview_btns.style_v2 || {}}>Wview_vx2</Text> }



                              
                                    </View>

            )
        ret_con.ret= ret
        return ret 

    }
}
class Wview_vx extends Component<Props> {
    constructor(props) {
        super(props);
    }
    render(){
        var wb_url
        // tglob_au.run_dev_cbs("render_vvx",{that:this,args:arguments,a:"z?"})
        if (glob_vhook?.fns?.gen_xcal_room3) {
            wb_url = glob_vhook.fns.gen_xcal_room3().room_url
        } else {
            // wb_url = "https://excalidraw.videocorners.com/#room=4zmaf7d5jtcx4pqgruba,4zmaf7BMXbI6tCEiW7rbgy"
            wb_url = "https://excalidraw.videocorners.com/#room=4zxcald5jtcx4pqgruba,4zxcalBMXbI6tCEiW7rbgy"
        }


                    var webview_style = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("webview_style",{that:this},{}) : {}
                    var wv0_styles = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("wv0_styles",{that:this},{}) : {}
            // <View
            // style = {wv0_styles.v1 || {}}
            // >
            var wv0_styles_dev = this.wv0_styles_dev || {}


  // window.postMessage("Your message");
// console.log(">>>>>>>..?")
            var injectedJs = `(function(){
console.log(">>>>>>>..")
this.webView.postMessage("ZZ")
                return "Send me back!"}());
`;
injectedJs =`
          setTimeout(function () {
            window.ReactNativeWebView.postMessage("Hello!")
            console.log("QWETUI\n")
            window.top.postMessage('hello2', '*')
          }, 2000)
`

        // clog("VVX:")
        return (
            <View style={wv0_styles_dev.vx_v}>

            <WebView source = {{uri:wb_url}}
            style = {wv0_styles_dev.webview_style || {}}
            injectedJavaScript={injectedJs}

    startInLoadingState
    javaScriptEnabledAndroid={true}
    javaScriptEnabled={true}

            onMessage={onMsg}
            ></WebView>
            </View>
            )




        return (
            <View style={this.props.vx_v}>
                <Text style={this.props.vx_tx} >Wview_vx</Text>
            </View>
            )
    }
}
// class Wview_vx


class Wview_v1 extends PureComponent<Props> {
// class Wview_v1 extends Component<Props> {
    constructor(props) {
        super(props);
    // const { palette } = useTheme();
        this.v1="a"

        // this.palette=palette
        tglob_au.reg_qxi_cb(this.rs_state.bind(this),"SET_TILE_VIEW_DIMENSIONS","RS_STATE")
        tglob_au.reg_dev_cb(this.rs_state2.bind(this),"rerender_Wview_v1","rerender")

        clog("Wview_v1 init")
     }
     rs_state2(a1,a2,a3,a4,a5){
                    this.setState(() => {
                return { unseen3: Math.random() }
            });
     }
     rs_state(a1,a2,a3,a4,a5){
        // clog("RS_STATE",this,{a1,a2,a3,a4,a5})
        // clog("RS_STATE",{a1,a2,a3,a4,a5})

            this.setState(() => {
                // console.log('setting state');
                    var wv0_dev = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("wv0_dev",{that:this},{}) : {}
                // return { unseen: "does not display" }
                return { unseen2: wv0_dev.ret }
            });
            /*
            try {
                 // var s = this.props
                 var s = this.state 
                 clog("::::",s)

             } catch (err){
                console.error("ERR:,")
             }
            */

     }
     /*

    componentDidMount() {
        setInterval(() => {
            this.setState(() => {
                // console.log('setting state');
                    var wv0_dev = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("wv0_dev",{that:this},{}) : {}
                return { unseen: "does not display" }
                // return { unseen: wv0_dev.ret }
            });
        }, 1000);
    }
     */

     render() {


        var wb_url

        // clog("Wview_v1 render")
        // console.log("wview_v1 render.")
        
        if (glob_vhook?.fns?.gen_xcal_room3) {
            wb_url = glob_vhook.fns.gen_xcal_room3().room_url
        } else {
            // wb_url = "https://excalidraw.videocorners.com/#room=4zmaf7d5jtcx4pqgruba,4zmaf7BMXbI6tCEiW7rbgy"
            wb_url = "https://excalidraw.videocorners.com/#room=4zxcald5jtcx4pqgruba,4zxcalBMXbI6tCEiW7rbgy"
        }
        




     	            var webview_style = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("webview_style",{that:this},{}) : {}
                    var wv0_styles = window.glob_vhook.fns.glob_dev_fncb ? window.glob_vhook.fns.glob_dev_fncb("wv0_styles",{that:this},{}) : {}
            // <View
            // style = {wv0_styles.v1 || {}}
            // >
            var wv0_styles_dev = this.wv0_styles_dev || {}


  // window.postMessage("Your message");
// console.log(">>>>>>>..?")
            var injectedJs = `(function(){
console.log(">>>>>>>..")
this.webView.postMessage("ZZ")
                return "Send me back!"}());
`;
injectedJs =`
          setTimeout(function () {
            window.ReactNativeWebView.postMessage("Hello!")
            console.log("QWETUI\n")
            window.top.postMessage('hello2', '*')
          }, 2000)
`

             // <View style = { wv0_styles.v1 || {} }>
            // style = {webview_style}
                
            // <WebView source = {{uri:"https://excalidraw.videocorners.com/#room=4zxcald5jtcx4pqgruba,4zxcalBMXbI6tCEiW7rbgy"}}
            // <WebView source = {{uri:"https://excalidraw.videocorners.com/#room=4zxcald5jtcx4pqgruba,4zxcalBMXbI6tCEiW7rbgy"}}
             // {t('polls.create.create')}
             // <Wview_ui style = { wv0_styles_dev.vb1 || {}} />
             // vx_v
// vx_tx
     	return (
             <View style = { wv0_styles_dev.v1 || {} }>

             <Text style = { wv0_styles_dev.txt || {} }
             >
             Z??
             </Text>
             <Wview_vx 
             vx_tx = { wv0_styles_dev.vx_tx || {} } 
             vx_v = { wv0_styles_dev.vx_v || {} } 
             ></Wview_vx>
             <rn_vshot.ExampleCaptureOnMountManually></rn_vshot.ExampleCaptureOnMountManually>
             <Wview_btns
             pt0 = { wv0_styles_dev.wv_b0 || {}}
             style = { wv0_styles_dev.wv_b || {}}
             ></Wview_btns>

 


                         <Button_v2 
                         title = "Cheems"
                         style = { wv0_styles_dev.vb1 || {}} 
color = { wv0_styles_dev.vb1_color || "#00ffffff" }
onPress = {fncb_only("vb1_press").fn.bind(this)}
>
             {wv0_styles_dev.vb1_txt  || "udef"}
             </Button_v2>
            <Text2 style = { wv0_styles_dev.txt2 || {} }
             >
             Z2
             </Text2>
            </View>
     	)
     }
}

             // <rn_cam.ExampleApp></rn_cam.ExampleApp>
// color = { this.palette.screen01Header }


export {Wview_v1}