import 'dart:convert';

import 'package:fis_ui/index.dart';
import 'package:fis_ui/values/font_sizes.dart';
import 'package:fis_ui/values/paddings.dart';
import 'package:fis_ui/widgets/webview/webview.dart';
import 'package:flutter/material.dart';
import 'package:flyinsono/architecture/utils/webviewx.dart';
import 'package:flyinsono/views/common/device_live/device_live_detail/state.dart';
import 'package:webviewx/webviewx.dart';

class SonopostLivePanel extends FStatelessWidget {
  late final DeviceStateModel model;
  late final String json;
  SonopostLivePanel(this.model) {
    final dto = model.liveInfo!.dto;
    json = jsonEncode(dto!.toJson());
  }

  @override
  FWidget build(BuildContext context) {
    late WebViewXController webViewController;
    return FFutureBuilder<String>(
      future: DefaultAssetBundle.of(context)
          .loadString("assets/webview/device_live.html"),
      builder: (context, snapshot) {
        if (snapshot.connectionState != ConnectionState.done ||
            snapshot.data == null) {
          return const FCenter(
            child: FSizedBox(
              width: 20,
              height: 20,
              child: FCircularProgressIndicator(),
            ),
          );
        }
        return FLayoutBuilder(
          builder: (context, constraints) {
            final webview = FWebViewX(
              height: constraints.maxHeight,
              width: constraints.maxWidth,
              initialContent: snapshot.data!,
              initialSourceType: SourceType.html,
              javascriptMode: JavascriptMode.unrestricted,
              ignoreAllGestures: false,
              onWebViewCreated: (controller) {
                webViewController = controller;
              },
              onPageFinished: (p0) {},
              dartCallBacks: {
                DartCallback(
                  name: "Dart_GetLiveData",
                  callBack: (_) {
                    // TODO: [device_live][finlay] 这里json要返回当前最新的数据
                    return json;
                  },
                ),
                WebviewXDartAsyncCallback(
                  controllerGetter: () => webViewController,
                  methods: {
                    "checkLiveState": (data) async {
                      final result = 1; // TODO：[Finlay] 实现重新进入直播逻辑
                      // TODO: [device_live][Finlay] 重构魔盒代码
                      // await controller.checkLiveDeviceState(data);
                      if (result == 2) {
                        // 更新直播信息，重载页面
                        Future.delayed(const Duration(milliseconds: 100), () {
                          webViewController.reload();
                        });
                      }
                      return result == 1;
                    },
                  },
                ),
              },
            );
            return FStack(
              children: [
                webview,
                FSizedBox(
                  height: FPaddings.SECONDARY_BUTTON,
                  child: FCenter(
                    child: FText(
                      model.dto.displayName!,
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: FFontSizes.BODY,
                      ),
                    ),
                  ),
                ),
              ],
            );
          },
        );
      },
    );
  }
}
