import React, { PropTypes } from 'react';
import { List, ListItem, Card, CardText, CardTitle } from 'material-ui';

const Plan = ({ AcademicSubPlan, PlanDescription }) => {
  if (Array.isArray(AcademicSubPlan)) {
    const subplans = AcademicSubPlan.filter(({ SubPlan }) => SubPlan !== '');
    return (
      <ListItem
        style={{ paddingBottom: '0px' }}
        secondaryText={
          <div style={{ color: 'black' }}>
            {PlanDescription}
          </div>
        }
        primaryText={<div style={{ fontWeight: 'bold' }}>Academic Plan</div>}
        primaryTogglesNestedList
        disabled
        secondaryTextLines={PlanDescription.length > 21 ? 2 : 1}
        nestedItems={
          subplans &&
          subplans.map(({ SubPlanDescription }, index) =>
            <ListItem
              style={{ color: 'black', fontSize: '.9em' }}
              key={index}
              secondaryText={
                <div style={{ color: 'black' }}>
                  {SubPlanDescription}
                </div>
              }
              primaryText={
                <div style={{ fontWeight: 'bold', fontSize: '1.1em' }}>Academic Sub Plan</div>
              }
              secondaryTextLines={SubPlanDescription.length > 21 ? 2 : 1}
              disabled
            />,
          )
        }
      />
    );
  }
  return (
    <ListItem
      secondaryText={
        <div style={{ color: 'black' }}>
          {PlanDescription}
        </div>
      }
      primaryText={<div style={{ fontSize: '1.2em', fontWeight: 'bold' }}>Academic Plan</div>}
    />
  );
};

Plan.propTypes = { plan: PropTypes.object };

const GPA = ({ CumGPA, AcademicLevel, AcademicLoad, Units, AcademicProgram }) =>
  <div style={{ fontSize: '14px', padding: '10px' }}>
    Cumulative GPA: {CumGPA} <br />
    Academic Load: {AcademicLoad} <br />
    Level: {AcademicLevel} <br />
    Units (Credits): {Units}
  </div>;

GPA.propTypes = { career: PropTypes.object };

function toSemesterString(EffectiveDate) {
  if (!EffectiveDate) {
    return '';
  }
  const [year, month, date] = EffectiveDate.split('-');
  const numMonth = parseInt(month, 10);
  switch (numMonth) {
    case 1:
      return `January ${date}, ${year}`;
    case 2:
      return `February ${date}, ${year}`;
    case 3:
      return `March ${date}, ${year}`;
    case 4:
      return `April ${date}, ${year}`;
    case 5:
      return `May ${date}, ${year}`;
    case 6:
      return `June ${date}, ${year}`;
    case 7:
      return `July ${date}, ${year}`;
    case 8:
      return `August ${date}, ${year}`;
    case 9:
      return `September ${date}, ${year}`;
    case 10:
      return `October ${date}, ${year}`;
    case 11:
      return `November ${date}, ${year}`;
    case 12:
      return `December ${date}, ${year}`;
  }
}

const Program = ({
  ProgramDescription,
  AcademicPlan,
  Status,
  Action,
  AdmitTerm,
  effectiveSemester,
  BeginDate,
  EffectiveDate,
  progStyle,
}) =>
  <List style={progStyle}>
    <div style={{ fontWeight: 'bold', fontSize: '1.4em', margin: 0, padding: 0 }}>
      Academic Program
    </div>
    <div style={{ margin: 0, padding: 0 }}>
      {ProgramDescription}
    </div>
    {effectiveSemester &&
      <div style={{ fontSize: '14px', fontStyle: 'italic' }}>
        Program effective beginning{' '}
        {Action === 'PLNC' ? toSemesterString(EffectiveDate) : toSemesterString(BeginDate)}
      </div>}
    {Status === 'DC' &&
      <div style={{ fontStyle: 'italic' }}>
        Program effective through {toSemesterString(EffectiveDate)}
      </div>}
    {AcademicPlan && AcademicPlan.map((plan, i) => <Plan key={i} {...plan} />)}
  </List>;

const CurrentPrograms = ({ career }) => {
  const programs = career.AcademicProgram.currentPrograms
    .filter(program => program.Program !== '')
    .map((program, index) => <Program key={`${index}-current-${program.Program}`} {...program} />);
  let careerDisplayName = '';

  switch (career.AcademicCareer) {
    case 'UGRD':
      careerDisplayName = '(Undergraduate)';
      break;
    case 'GRAD':
      careerDisplayName = '(Graduate)';
      break;
    case 'LAW':
      careerDisplayName = '(Law)';
      break;
    default:
      careerDisplayName = `(${career.AcademicCareer})`;
  }
  return (
    <div style={{ paddingBottom: '20px' }}>
      <div style={{ fontWeight: 'bold', fontSize: '1.5em', margin: 0, padding: 0 }}>
        Your Current Program {careerDisplayName}
      </div>
      {programs.length > 0
        ? <div>
          {programs}
          <GPA {...career} />
        </div>
        : <div>Not currently active in a program.</div>}
    </div>
  );
};

const FuturePrograms = ({ career }) => {
  const programs = career.AcademicProgram.futurePrograms.map((program, index) =>
    <Program
      key={`${index}-future=${program.Program}`}
      {...program}
      progStyle={{ marginLeft: '25px' }}
    />,
  );
  let careerDisplayName = '';

  switch (career.AcademicCareer) {
    case 'UGRD':
      careerDisplayName = '(Undergraduate)';
      break;
    case 'GRAD':
      careerDisplayName = '(Graduate)';
      break;
    case 'LAW':
      careerDisplayName = '(Law)';
      break;
    default:
      careerDisplayName = `(${career.AcademicCareer})`;
  }
  return programs && programs.length > 0
    ? <Card zDepth={0}>
      <CardTitle
        actAsExpander
        showExpandableButton
        style={{
          fontWeight: 'bold',
          fontSize: '1.5em',
          marginBottom: '0',
          paddingBottom: '0',
          marginLeft: '0',
          paddingLeft: '0',
        }}
      >
          Your Future Program {careerDisplayName}
      </CardTitle>
      <CardText expandable>
        {programs}
      </CardText>
    </Card>
    : <div />;
};

const Career = ({ career }) => {
  const display = career
    ? (<div>
      {career
          // .filter(c => c.AcademicProgram.currentPrograms.length > 0)
          .map(c => <CurrentPrograms key={c.AcademicCareer + c.AcadProgramPrimary} career={c} />)}
      {career
          .filter(
            c =>
              c.AcademicProgram.futurePrograms.length > 0 &&
              c.AcademicProgram.futurePrograms[0].Program !== '',
          )
          .map(c => <FuturePrograms key={c.AcademicCareer + c.AcadProgramPrimary} career={c} />)}
    </div>)
    : <div key={'no'}>No career(s) found</div>;

  return display;
};

export default Career;