import 'dart:html';
import 'dart:js_util';
import 'dart:ui_web';

import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter/services.dart';
import 'package:flutter_web_plugins/flutter_web_plugins.dart';

import 'src/core/amap_flutter_platform.dart';
import 'src/web/amap.dart';
import 'src/web/amap_loader.dart';
import 'src/web/utils.dart';

/**
 * web地图
 */
class AmapFlutterMapWeb extends AMapFlutterPlatform {
  AmapFlutterMapWeb();

  late AMap _aMap;
  late DivElement _element;

  static void registerWith(Registrar registrar) {
    AMapFlutterPlatform.instance = AmapFlutterMapWeb();
  }

  @override
  Widget buildView(
      Map<String, dynamic> creationParams,
      Set<Factory<OneSequenceGestureRecognizer>> gestureRecognizers,
      PlatformViewCreatedCallback onPlatformViewCreated) {
    /// 这里使用时间作为唯一标识
    String _divId = DateTime.now().toIso8601String();

    /// 先创建div并注册
    platformViewRegistry.registerViewFactory(_divId, (int viewId) {
      /// 地图需要的Div
      _element = DivElement()
        ..style.width = '100%'
        ..style.height = '100%'
        ..style.margin = '0';

      return _element;
    });

    SchedulerBinding.instance.addPostFrameCallback((_) {
      /// 创建地图
      var promise = load(LoaderOptions(
        key: 'f759e608583c169bb23d7817ed05583d',
        version: '2.0',
        plugins: ['AMap.Scale'],
      ));

      promiseToFuture(promise).then((value) {
        consoleLog('初始化成功：value = ${stringify(value)}');
        MapOptions _mapOptions = MapOptions(
          zoom: 13,
        );
        _aMap = AMap(_element, _mapOptions);
      }, onError: (e) {
        print('初始化错误：$e');
      });
    });

    return HtmlElementView(
      viewType: _divId,
      onPlatformViewCreated: onPlatformViewCreated,
    );
  }

  /// 导航
  void navDriving() {
    _aMap.plugin(["AMap.Driving"], allowInterop(() {
      var driving = Driving(DrivingOptions(map: _aMap, panel: _element));
      driving
          .search(LngLat(116.379028, 39.865042), LngLat(116.427281, 39.903719),
              allowInterop((status, result) {
        print("=====11111 status $status result = ${stringify(result)}");
      }));
    }));
  }
}