import 'dart:async';
import 'dart:js_interop' as js;
import 'dart:js_interop_unsafe' as js_util;

import 'package:flutter/material.dart';
import 'package:gymlink_module_web/main.dart';
import 'package:gymlink_module_web/pages/main.dart';
import 'package:gymlink_module_web/theme.dart';

@js.JSExport()
class MyAppStateWeb extends State<MyApp> {
  final _streamController = StreamController<void>.broadcast();
  bool _isLoading = true;
  ThemeData theme = myTheme;
  bool black_theme = false;

  @override
  void initState() {
    super.initState();
    final export = js.createJSInteropWrapper(this);
    js.globalContext['_appState'] = export;
    js.globalContext.callMethod('_stateSet'.toJS);
  }

  @override
  void dispose() {
    _streamController.close();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GymLink Module',
      theme: theme,
      debugShowCheckedModeBanner: false,
      home: MainPage(isLoading: _isLoading),
    );
  }

  @js.JSExport()
  void onTokenReceived(String token) {
    if (token == 'token123') {
      setState(() {
        _isLoading = false;
      });
    }
  }

  @js.JSExport()
  void changeColor(int color) {
    setState(() {
      black_theme = !black_theme; //FIXME: TEMPORARY
      theme = getThemeData(Color(color), black_theme);
    });
  }
}