import * as React from "react";
import { Switch, Route, HashRouter } from "react-router-dom";
import { OrganizationUnits } from "./Modules/Organization/OrganizationUnits";
import { Workspace } from "./Modules/Entities/WorkSpace";
import { EntityList } from "./Modules/Entities/EntityList";
import { RecordDetails } from "./Modules/Entities/RecordDetails";
import { SideBarLeft } from "../../Controls/SideBarLeft";
import { Header } from "../../Controls/Header";
// import { FileService,EntityService} from "../../Services";
import { INavLinkGroup } from "office-ui-fabric-react/lib/Nav";
import { initializeIcons } from "office-ui-fabric-react/lib/Icons";
import { RecordWizard } from "./Modules/Entities/RecordWizard";
import { CachingService } from "src/Services";

import { loadTheme } from "office-ui-fabric-react";

import Dashboard from "./Modules/Dashboard/Dashboard";
import RecordsGroupedList from "./Modules/Entities/RecordsGroupedList";
import { RecordView } from "./Modules/Entities/RecordView";
import { RecordsList } from "src/Customizations/Views/RecordsList";
import DriveDetails from "./Modules/Documents/DriveDetails";
import FolderDetails from "./Modules/Documents/FolderDetails";
import { ListRecordsCriteria, FieldQuery, Sorting } from "src/Models";
import { DateUtils } from "src/Utils";
import { OrganizationUnitList } from "./Modules/Organization/OrganizationsList";
import { PositionsList } from "./Modules/Organization/PositionsList";
import { SecurityGroupsList } from "./Modules/Organization/SecurityGroupsList";
import { UsersList } from "./Modules/Organization/UsersList";
// import { create } from "domain";

export class Main extends React.Component<any, any> {
  // private _fileService:FileService = new FileService();
  // private _entityService:EntityService = new EntityService();
  private parentRef: any = React.createRef<HTMLElement>();
  private sideBarRef: any = React.createRef<HTMLElement>();
  private dateUtil: DateUtils = new DateUtils();
  private _loggedInUser: any;

  constructor(props: any) {
    super(props);
    let cachingService: CachingService = new CachingService();
    let themeColor = cachingService.readPersistant("ThemeColor");

    this._loggedInUser = cachingService.read("LoggedInUser");
    //debugger;
    if (themeColor == "blueTheme") {
      //require("../../Assets/styles/blue-theme.css");

      loadTheme({
        palette: {
          themePrimary: "#145388",
          themeLighterAlt: "#f2f6fa",
          themeLighter: "#ccddec",
          themeLight: "#a3c2db",
          themeTertiary: "#5a8db7",
          themeSecondary: "#266396",
          themeDarkAlt: "#124b7a",
          themeDark: "#0f3f67",
          themeDarker: "#0b2f4c",
          neutralLighterAlt: "#f8f8f8",
          neutralLighter: "#f4f4f4",
          neutralLight: "#eaeaea",
          neutralQuaternaryAlt: "#dadada",
          neutralQuaternary: "#d0d0d0",
          neutralTertiaryAlt: "#c8c8c8",
          neutralTertiary: "#c2c2c2",
          neutralSecondary: "#858585",
          neutralPrimaryAlt: "#4b4b4b",
          neutralPrimary: "#333333",
          neutralDark: "#272727",
          black: "#1d1d1d",
          white: "#ffffff"
        }
      });
    } else if (themeColor == "purpleTheme") {
      //require("../../Assets/styles/purple-theme.css");
      loadTheme({
        palette: {
          themePrimary: "#922c88",
          themeLighterAlt: "#fbf4fa",
          themeLighter: "#edd3eb",
          themeLight: "#deafd9",
          themeTertiary: "#bd6eb5",
          themeSecondary: "#9f3d95",
          themeDarkAlt: "#83277a",
          themeDark: "#6e2167",
          themeDarker: "#51184c",
          neutralLighterAlt: "#f8f8f8",
          neutralLighter: "#f4f4f4",
          neutralLight: "#eaeaea",
          neutralQuaternaryAlt: "#dadada",
          neutralQuaternary: "#d0d0d0",
          neutralTertiaryAlt: "#c8c8c8",
          neutralTertiary: "#c2c2c2",
          neutralSecondary: "#858585",
          neutralPrimaryAlt: "#4b4b4b",
          neutralPrimary: "#333333",
          neutralDark: "#272727",
          black: "#1d1d1d",
          white: "#ffffff"
        }
      });
    } else if (themeColor == "brownTheme") {
      //require("../../Assets/styles/brown-theme.css");
      loadTheme({
        palette: {
          themePrimary: '#b99229',
          themeLighterAlt: '#fcfaf4',
          themeLighter: '#f4ecd6',
          themeLight: '#eadcb4',
          themeTertiary: '#d6bb72',
          themeSecondary: '#c29f3d',
          themeDarkAlt: '#a88525',
          themeDark: '#8d701f',
          themeDarker: '#685317',
          neutralLighterAlt: '#f8f8f8',
          neutralLighter: '#f4f4f4',
          neutralLight: '#eaeaea',
          neutralQuaternaryAlt: '#dadada',
          neutralQuaternary: '#d0d0d0',
          neutralTertiaryAlt: '#c8c8c8',
          neutralTertiary: '#c2c2c2',
          neutralSecondary: '#858585',
          neutralPrimaryAlt: '#4b4b4b',
          neutralPrimary: '#333333',
          neutralDark: '#272727',
          black: '#1d1d1d',
          white: '#ffffff',
        }
      });
    } else if (themeColor == "lightGreenTheme") {
      //require("../../Assets/styles/light-green-theme.css");
      loadTheme({
        palette: {
          themePrimary: '#74bb3f',
          themeLighterAlt: '#f8fcf6',
          themeLighter: '#e5f4da',
          themeLight: '#d0eabc',
          themeTertiary: '#a6d681',
          themeSecondary: '#82c251',
          themeDarkAlt: '#69a839',
          themeDark: '#598d30',
          themeDarker: '#416823',
          neutralLighterAlt: '#f8f8f8',
          neutralLighter: '#f4f4f4',
          neutralLight: '#eaeaea',
          neutralQuaternaryAlt: '#dadada',
          neutralQuaternary: '#d0d0d0',
          neutralTertiaryAlt: '#c8c8c8',
          neutralTertiary: '#c2c2c2',
          neutralSecondary: '#858585',
          neutralPrimaryAlt: '#4b4b4b',
          neutralPrimary: '#333333',
          neutralDark: '#272727',
          black: '#1d1d1d',
          white: '#ffffff',
        }
      });
    } else {
      //require("../../Assets/styles/green-theme.css");
      loadTheme({
        palette: {
          themePrimary: "#576a3d",
          themeLighterAlt: "#f3ffe2",
          themeLighter: "#e7ffc6",
          themeLight: "#c1e291",
          themeTertiary: "#bce283",
          themeSecondary: "#abe05c",
          themeDarkAlt: "#a6e549",
          themeDark: "#6fa51f",
          themeDarker: "#305100",
          neutralLighterAlt: "#f8f8f8",
          neutralLighter: "#f4f4f4",
          neutralLight: "#eaeaea",
          neutralQuaternaryAlt: "#dadada",
          neutralQuaternary: "#d0d0d0",
          neutralTertiaryAlt: "#c8c8c8",
          neutralTertiary: "#c2c2c2",
          neutralSecondary: "#858585",
          neutralPrimaryAlt: "#4b4b4b",
          neutralPrimary: "#333333",
          neutralDark: "#272727",
          black: "#1d1d1d",
          white: "#ffffff"
        }
      });
    }

    initializeIcons(undefined, { disableWarnings: true });

    this.state = {
      groups: new Array<INavLinkGroup>(),
      subNavOpened: false,
      themeColor: themeColor
    };
  }

  public render(): JSX.Element {
    return (
      <HashRouter basename="/">
        <div className="sub-hidden menu-mobile" ref={this.parentRef}>
          {
            this.state.themeColor == "blueTheme" ? (
              <link rel="stylesheet" type="text/css" href="/content/blue-theme.css" />
            ) : (
                this.state.themeColor == "purpleTheme" ? (
                  <link rel="stylesheet" type="text/css" href="/content/purple-theme.css" />
                ) : (
                    this.state.themeColor == "brownTheme" ? (
                      <link rel="stylesheet" type="text/css" href="/content/brown-theme.css" />
                    ) : (
                        this.state.themeColor == "lightGreenTheme" ? (
                          <link rel="stylesheet" type="text/css" href="/content/light-green-theme.css" />
                        ) : (
                            <link rel="stylesheet" type="text/css" href="/content/green-theme.css" />
                          )
                      )
                  )
              )
          }
          <div className="layout-header">
            <Header
              pageContainerRef={this.parentRef}
              sideRef={this.sideBarRef}
            />
          </div>
          <div className="layout-page">
            <div className="layout-side-mav">
              {" "}
              {/* .layout-side-mav-full-width */}
              <SideBarLeft
                pageContainerRef={this.parentRef}
                ref={this.sideBarRef}
                Groups={this.state.groups}
                toggleSubNav={this._toggleSubNav.bind(this)}
              />
            </div>
            <div className="layout-content">
              <Switch>
                <Route path="/dashboard" component={Dashboard} exact />
                <Route path="/workspace" component={Workspace} exact />
                <Route
                  path="/organizationunits"
                  component={OrganizationUnits}
                  exact
                />
                <Route path="/entitylist/:id" component={EntityList} exact />
                <Route
                  path="/recordslist"
                  component={(props: any) => <RecordsList {...props} />}
                  exact
                />
                <Route
                  path="/correspondences"
                  component={(props: any) => <RecordsList {...props} />}
                  exact
                />
                <Route
                  path="/drafts"
                  component={(props: any) => {

                    let draftsCriteria = new ListRecordsCriteria();
                    draftsCriteria.asLookup = false;
                    draftsCriteria.entityId = 14;
                    draftsCriteria.query = new Array<FieldQuery>();
                    let draftsFieldQuery = new FieldQuery();
                    draftsFieldQuery.fieldId = 176;
                    draftsFieldQuery.value = "22";
                    draftsCriteria.sorting = new Sorting();
                    draftsCriteria.sorting.fieldId = 190;
                    draftsCriteria.sorting.direction = 1;
                    draftsCriteria.query.push(draftsFieldQuery);

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", draftsCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-inbox-out');
                    cachingService.store("screenTitle", 'Drafts');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/outgoing"
                  component={(props: any) => {
                    let outgoingListCriteria = new ListRecordsCriteria();
                    outgoingListCriteria.asLookup = false;
                    outgoingListCriteria.entityId = 14;
                    outgoingListCriteria.query = new Array<FieldQuery>();
                    let outgoingFieldQuery = new FieldQuery();
                    outgoingFieldQuery.fieldId = 278;
                    outgoingFieldQuery.value = this._loggedInUser ? this._loggedInUser.organizationUnit.id : 0;
                    outgoingFieldQuery.queryOperator = 0;
                    outgoingListCriteria.query.push(outgoingFieldQuery);
                    outgoingListCriteria.sorting = new Sorting();
                    outgoingListCriteria.sorting.fieldId = 190;
                    outgoingListCriteria.sorting.direction = 1;

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", outgoingListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-inbox-out');
                    cachingService.store("screenTitle", 'Outgoing');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/urgent"
                  component={(props: any) => {
                    let urgentCriteria = new ListRecordsCriteria();
                    urgentCriteria.asLookup = false;
                    urgentCriteria.entityId = 14;
                    urgentCriteria.query = new Array<FieldQuery>();
                    let urgentFieldQuery = new FieldQuery();
                    urgentFieldQuery.fieldId = 163;
                    urgentFieldQuery.value = "17";
                    urgentCriteria.sorting = new Sorting();
                    urgentCriteria.sorting.fieldId = 190;
                    urgentCriteria.sorting.direction = 1;
                    urgentCriteria.query.push(urgentFieldQuery);

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", urgentCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-inbox-out');
                    cachingService.store("screenTitle", 'Urgent');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/late"
                  component={(props: any) => {

                    // change here  for number of late
                    let lateCriteria: ListRecordsCriteria = new ListRecordsCriteria();
                    lateCriteria.entityId = 14;
                    lateCriteria.query = new Array<FieldQuery>();
                    let lateFieldQuery = new FieldQuery();
                    lateFieldQuery.fieldId = 159;
                    lateFieldQuery.value = this.dateUtil.formatToServerDateTime(new Date());
                    lateFieldQuery.queryOperator = 2;
                    lateCriteria.query.push(lateFieldQuery);
                    let lateFieldQuery2 = new FieldQuery();
                    lateFieldQuery2.fieldId = 176;
                    lateFieldQuery2.value = "62";
                    lateFieldQuery2.queryOperator = 1;
                    lateCriteria.query.push(lateFieldQuery2);
                    lateCriteria.sorting = new Sorting();
                    lateCriteria.sorting.fieldId = 190;
                    lateCriteria.sorting.direction = 1;

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", lateCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-inbox-out');
                    cachingService.store("screenTitle", 'Late');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/createCorrespondence"
                  component={(props: any) => {
                    let outgoingListCriteria = new ListRecordsCriteria();
                    outgoingListCriteria.asLookup = false;
                    outgoingListCriteria.entityId = 14;
                    outgoingListCriteria.query = new Array<FieldQuery>();
                    let outgoingFieldQuery = new FieldQuery();
                    outgoingFieldQuery.fieldId = 278;
                    outgoingFieldQuery.value = this._loggedInUser ? this._loggedInUser.organizationUnit.id : 0;
                    outgoingListCriteria.query.push(outgoingFieldQuery);

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", outgoingListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-plus');
                    cachingService.store("screenTitle", 'createCorrespondence');

                    return <RecordWizard {...props} />
                  }}
                  exact
                />
                <Route
                  path="/tasks"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 24;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-plus');
                    cachingService.store("screenTitle", 'Tasks');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/createTask"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 24;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-plus');
                    cachingService.store("screenTitle", 'createTask');

                    return <RecordWizard {...props} />
                  }}
                  exact
                />
                <Route
                  path="/meetingTemplates"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 32;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-calendar-edit');
                    cachingService.store("screenTitle", 'Meeting Templates');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/createMeetingTemplate"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 32;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-calendar-alt');
                    cachingService.store("screenTitle", 'Create Meeting Template');

                    return <RecordWizard {...props} />
                  }}
                  exact
                />
                <Route
                  path="/meetings"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 33;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-calendar-alt');
                    cachingService.store("screenTitle", 'Meetings');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/:templateId/createMeeting"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 33;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-calendar-edit');
                    cachingService.store("screenTitle", 'Create Meeting');

                    return <RecordWizard createMeeting_TemplateId={props.match.params.templateId} {...props} />
                  }}
                  exact
                />
                 <Route
                  path="/meetingRooms"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 36;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-location');
                    cachingService.store("screenTitle", 'Meeting Rooms');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                <Route
                  path="/createMeetingRoom"
                  component={(props: any) => {
                    let tasksListCriteria = new ListRecordsCriteria();
                    tasksListCriteria.asLookup = false;
                    tasksListCriteria.entityId = 36;
                    tasksListCriteria.query = new Array<FieldQuery>();

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", tasksListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-location');
                    cachingService.store("screenTitle", 'Create Meeting Room');

                    return <RecordWizard {...props} />
                  }}
                  exact
                />
                <Route
                  path="/incoming"
                  component={(props: any) => {
                    let outgoingListCriteria = new ListRecordsCriteria();
                    outgoingListCriteria.asLookup = false;
                    outgoingListCriteria.entityId = 14;
                    outgoingListCriteria.query = new Array<FieldQuery>();
                    let outgoingFieldQuery = new FieldQuery();
                    outgoingFieldQuery.fieldId = 278;
                    outgoingFieldQuery.value = this._loggedInUser ? this._loggedInUser.organizationUnit.id : 0;
                    outgoingFieldQuery.queryOperator = 1;
                    outgoingListCriteria.query.push(outgoingFieldQuery);
                    outgoingListCriteria.sorting = new Sorting();
                    outgoingListCriteria.sorting.fieldId = 190;
                    outgoingListCriteria.sorting.direction = 1;

                    let cachingService: CachingService = new CachingService();
                    cachingService.store("Params", outgoingListCriteria);
                    cachingService.store("screenIconClassName", 'fal fa-inbox-in');
                    cachingService.store("screenTitle", 'Incoming');

                    return <RecordsList {...props} />
                  }}
                  exact
                />
                {/* <Route
                  path="/incoming"
                  component={(props: any) => <RecordsList {...props} />}
                  exact
                />
                <Route
                  path="/outgoing"
                  component={(props: any) => <RecordsList {...props} />}
                  exact
                />
                <Route
                  path="/archived"
                  component={(props: any) => <RecordsList {...props} />}
                  exact
                /> */}
                <Route
                  path="/recordDetails/:entityId/:id"
                  component={RecordDetails}
                  exact
                />
                <Route
                  path="/recordView/:entityId/:id"
                  component={RecordView}
                  exact
                />
                <Route
                  path="/recordWizard"
                  component={(props: any) => <RecordWizard {...props} />}
                  exact
                />
                <Route
                  path="/recordWizard/:id"
                  component={(props: any) => <RecordWizard {...props} />}
                  exact
                />
                {/* <Route path="/recordWizard" component={RecordWizard} exact></Route> */}
                <Route
                  path="/groupedList"
                  component={RecordsGroupedList}
                  exact
                />
                <Route path="/" component={Dashboard} exact />

                <Route path="/drive/:id" component={DriveDetails}></Route>
                <Route path="/folder/:id" component={FolderDetails}></Route>
                <Route path="/organizationalUnits" component={OrganizationUnitList}></Route>
                <Route path="/positions" component={PositionsList}></Route>
                <Route path="/securityGroups" component={SecurityGroupsList}></Route>
                <Route path="/userAccounts" component={UsersList}></Route>
              </Switch>
            </div>
          </div>
        </div>
      </HashRouter>
    );
  }

  private _toggleSubNav(opened: any) {
    if (!this.state.subNavOpened && opened) {
      this.setState({ subNavOpened: opened });
    } else if (this.state.subNavOpened && !opened) {
      this.setState({ subNavOpened: opened });
    }
  }
}

export default Main;
