import 'package:flutter/material.dart';
import 'package:openmediacentermobile/shufflescreen.dart';
import 'package:openmediacentermobile/video_feed.dart';

import 'api/token.dart';
import 'login/logincontext.dart';

class DrawerPage extends StatefulWidget {
  const DrawerPage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  _DrawerPageState createState() => _DrawerPageState();
}

enum Section { HOME, SHUFFLE, LOGOUT }

class _DrawerPageState extends State<DrawerPage> {
  Section sec = Section.HOME;

  @override
  Widget build(BuildContext context) {
    Widget body;
    String title;

    /// You can easily control the section for example inside the initState where you check
    /// if the user logged in, or other related logic
    switch (sec) {

    /// Display the home section, simply by
      case Section.HOME:
        body = const VideoFeed();
        title = widget.title;
        break;

      case Section.SHUFFLE:
        body = const ShuffleScreen();
        title = "Shuffle";
        break;

      case Section.LOGOUT:
        body = const Text("also todo");
        title = "Settings";
        break;
    }

    var loginctx = LoginContext.of(context);

    return Scaffold(
      appBar: AppBar(title: Text(title), actions: [
        IconButton(
            onPressed: () {
              loginctx.onLoggin(false);
              Token.getInstance().setToken("", "");
            },
            icon: const Icon(Icons.logout))
      ],),
      body: body,
      drawer: Drawer(
        child: ListView(children: [
          ListTile(
            title: const Text('Home'),
            leading: const Icon(Icons.home),
            onTap: () {
              setState(() {
                sec = Section.HOME;
              });
              Navigator.pop(context);
            },
          ),
          ListTile(
            title: const Text('Shuffle'),
            leading: const Icon(Icons.update),
            onTap: () {
              setState(() {
                sec = Section.SHUFFLE;
              });
              Navigator.pop(context);
            },
          ),
          ListTile(
            title: const Text('Settings'),
            leading: const Icon(Icons.settings),
            onTap: () {
              setState(() {
                sec = Section.LOGOUT;
              });
              Navigator.pop(context);
            },
          ),
        ]),
      ),
    );
  }
}