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();

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

  @override
  Widget buildView(
      Map<String, dynamic> creationParams,
      Set<Factory<OneSequenceGestureRecognizer>> gestureRecognizers,
      PlatformViewCreatedCallback onPlatformViewCreated) {
    late DivElement _element;

    /// 这里使用时间作为唯一标识
    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 = AMap(_element, _mapOptions);
      }, onError: (e) {
        print('初始化错误：$e');
      });
    });

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