import 'dart:convert' as convert;
import 'dart:ui';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:zhiying_base_widget/pages/search_page/search_page.dart';
import 'package:zhiying_comm/zhiying_comm.dart';

class HomeSreachDeleagater extends SliverPersistentHeaderDelegate {
  final Map<String, dynamic> model;
  HomeSreachWidget _searchWidget;
  Map<String, dynamic> _json;

  double _height;

  HomeSreachDeleagater(this.model) : super() {
    _height = MediaQueryData.fromWindow(window).padding.top + 44;
    String d = model['data'];
    _json = Map<String, dynamic>.from(convert.jsonDecode(d));
    _searchWidget = HomeSreachWidget(model);
  }

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    print('${shrinkOffset.toString()}');
    double percent = shrinkOffset / _height;
    print('${percent.toString()}');
    return Container(
        color: HexColor.fromHex(_json['sliding_bg'] ?? 'FF4242')
            .withOpacity(percent),
        child: _searchWidget);
  }

  @override
  double get maxExtent => _height;

  @override
  double get minExtent => _height;

  @override
  bool shouldRebuild(SliverPersistentHeaderDelegate oldDelegate) {
    return false;
  }
}

///
/// 首页搜索框
///
class HomeSreachWidget extends StatelessWidget {
  final Map<String, dynamic> model;

  Map<String, dynamic> _json;

  HomeSreachWidget(this.model) {
    String d = model['data'];
    _json = Map<String, dynamic>.from(convert.jsonDecode(d));
  }

  @override
  Widget build(BuildContext context) {
    return _HomeSreachContainer(_json);
  }
}

class _HomeSreachContainer extends StatelessWidget {
  final Map<String, dynamic> model;

  const _HomeSreachContainer(this.model);

  /// 打开搜索页
  void _openSreach(BuildContext context){
    // SkipModel skipModel = SkipModel.fromJson(model);
    // RouterUtil.route(skipModel, null, context);
    Navigator.push(context, MaterialPageRoute(
      builder: (context) => SearchPage(null)
    ));
  }

  @override
  Widget build(BuildContext context) {
    List<Widget> widgets = List();
    if (model.containsKey('left_icons')) {
      List icons = model['left_icons'];
      widgets.addAll(icons.map((data) {
        return GestureDetector(
          child: Container(
            width: 30,
            height: 30,
            margin: EdgeInsets.only(right: 10),
            child: CachedNetworkImage(
              imageUrl: data['icon'] ?? '',
              fit: BoxFit.fitHeight,
            ),
          ),
          onTap: () {
            SkipModel skipModel = SkipModel.fromJson(data);
            RouterUtil.route(skipModel, null, context);
          },
        );
      }).toList());
    }

    widgets.add(Expanded(
      child: GestureDetector(
        child: _getSreachWidget(),
        onTap: () => _openSreach(context),
      ),
    ));

    if (model.containsKey('right_icons')) {
      List icons = model['right_icons'];
      widgets.addAll(icons.map((data) {
        return GestureDetector(
          child: Container(
            width: 30,
            height: 30,
            margin: EdgeInsets.only(left: 10),
            child: CachedNetworkImage(
              imageUrl: data['icon'] ?? '',
              fit: BoxFit.fitHeight,
            ),
          ),
          onTap: () {
            SkipModel skipModel = SkipModel.fromJson(data);
            RouterUtil.route(skipModel, null, context);
          },
        );
      }).toList());
    }

    return Container(
      color: Colors.transparent,
      height: 30,
      width: double.infinity,
      margin: EdgeInsets.only(
          left: 12.5,
          right: 12.5,
          bottom: 7,
          top: MediaQueryData.fromWindow(window).padding.top + 7),
      child: Row(
        children: widgets,
      ),
    );
  }

  /// 搜索栏
  Widget _getSreachWidget() {
    return Container(
        height: 30,
        width: double.infinity,
        decoration: BoxDecoration(
            color: HexColor.fromHex('#ffffff').withOpacity(0.3),
            borderRadius: BorderRadius.circular(15)),
        child: Row(
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(left: 10, right: 4),
              child: Icon(
                Icons.search,
                color: HexColor.fromHex(
                    model['search_input_hint_text_color'] ?? '#ffffff'),
              ),
            ),
            Text(
              model['search_input_hint_text'] ?? '',
              style: TextStyle(
                  color: HexColor.fromHex(
                      model['search_input_hint_text_color'] ?? '#ffffff'),
                  fontSize: 13),
            )
          ],
        ));
  }
}
