import ‘dart:async’;
import ‘dart:html’;

import ‘package:flutter/material.dart’;
import ‘package:flutter_webview_plugin/flutter_webview_plugin.dart’;
//import ‘package:flutter_webview_plugin/flutter_webview_plugin.dart’;

//配置携程网白名单，这些白名单，是携程首页可能的白名单，
const CATCH_URLS = [‘dp.ctrip.com/’,‘m.ctrip.com/’,‘m.ctrip.com/html5/’,'m.ctrip.com/html5’];

class WebView extends StatefulWidget {

final String url;
final String statusBarColor;
final String title;
final bool hideAppBar;
final bool backForbid;

const WebView({Key key, this.url, this.statusBarColor, this.title, this.hideAppBar, this.backForbid = false}) : super(key: key);

@override
_WebViewState createState() => _WebViewState();

}

class _WebViewState extends State{
final webViewReference = FlutterWebviewPlugin();
StreamSubscription _onUrlChanged;
StreamSubscription _onStateChanged;
StreamSubscription _onHttppError;
var exiting = false;//返回的一个状态标志位，默认是false

@override
void initState() {
super.initState();

webViewReference.close();
_onUrlChanged =  webViewReference.onUrlChanged.listen((String url){
    print("onurl_Changed______");
});//注册页面监听，url发生改变

_onStateChanged = webViewReference.onStateChanged.listen((WebViewStateChanged state){
print(‘StateChanged--------------------’);
switch(state.type){
case WebViewState.startLoad:
//当url发生变化的时候，接收监听，不让网页上的返回按钮回到携程的首页，而是返回到我们flutter 首页，如果返回的url在白名单里面，不做任何处理，否则返回到flutter首页
if(_isToMian(state.url) && !exiting){

          if(widget.backForbid){
            webViewReference.launch(widget.url);
          }else {
            print('返回的url==$state.url');
            Navigator.pop(context);
            exiting = true;//为了H5页面不重复返回
          }
        }
      break;
    default:
      break;
  }
});

//加载网页错误时候的监听
_onHttppError = webViewReference.onHttpError.listen((error){
print(‘网络错误$error’);
});

}

@override
//移除监听
void dispose() {
super.dispose();
_onUrlChanged.cancel();
_onStateChanged.cancel();
_onHttppError.cancel();
webViewReference.dispose();//关闭webview
}

_isToMian(String url){
bool contain = false;
for(final value in CATCH_URLS){
//如果url里面包含白名单，url? 如果url不存在，就不会调用endsWith,防止url为空，发生错误
if(url?.endsWith(value)??false){
contain = true;
print(‘contain===$contain’);
break;
}
}
return contain;
}
@override
Widget build(BuildContext context) {

String statusBarColorsStr = widget.statusBarColor ?? 'ffffff';
Color backButtonColor;
if(statusBarColorsStr == 'ffffff'){
  backButtonColor = Colors.black;
}else {
  backButtonColor = Colors.white;
}
// TODO: implement build
return Scaffold(
  body: Column(
    children: <Widget>[
      //导航栏appBar Color(int.parse('0xff'+statusBarColorsStr)  将str类型颜色转换成16进制
      _appBar(Color(int.parse('0xff'+statusBarColorsStr)),backButtonColor),
      Expanded(
        //webView页面，webViewPlugin提供的webViewScaffold
        child: WebviewScaffold(
          url: widget.url,//h5网页地址
          withZoom: true,//是否支持缩放
          withLocalStorage: true,//支持缓存
          hidden: true,//加载完成前隐藏webview
          //初始化加载网页时显示的动画
          initialChild: Container(
            color: Colors.white,
            child: Center(
              child: Text('waiting...'),
            ),
          ),//设置初始化界面
        ),
      ),
    ],
  ),
);

}

_appBar(Color background,Color backButtonColor){

if(widget.hideAppBar??false){
  return Container(
    color: backButtonColor,
    height: 30,
);
}else {
  return Container(

     child: FractionallySizedBox(//让组件撑满整个屏幕
       widthFactor: 1,
     child: Stack(
      children: <Widget>[
        //返回按钮
        GestureDetector(
          child: Container(
            margin: EdgeInsets.only(left: 10),
            child: Icon(Icons.close,
            color: backButtonColor,
              size: 26,
            ),
          ),
        ),
        //定位网页标题
        Positioned(
          left: 0,
          right: 0,
          child: Center(
            child: Text(widget.title??'',style:TextStyle(color: backButtonColor,fontSize: 20)),
          ),
        ),
      ],
    ),
  ),
);
}

}
}