<che-toolbar che-title="{{projectDetailsController.projectName}}"
             che-title-icons-controller="projectDetailsController"
             che-button-name="Open"
             che-button-href="#/ide/{{projectDetailsController.namespace}}/{{projectDetailsController.workspaceName}}"
             che-breadcrumb-title="All projects"
             che-breadcrumb-href="#/workspace/{{projectDetailsController.namespace}}/{{projectDetailsController.workspaceName}}?tab=Projects"
             che-subheader-icon="chefont cheico-type-{{projectDetailsController.projectDetails.type}} cheico-type-blank"
             che-subheader-title="{{projectDetailsController.projectDetails.type}}">
</che-toolbar>
<md-progress-linear md-mode="indeterminate" ng-show="projectDetailsController.loading"></md-progress-linear>

<md-content md-scroll-y flex class="projects-details-project"
            ng-show="projectDetailsController.projectDetails"
            ng-if="projectDetailsController.getWorkspaceStatus() === 'RUNNING' || projectDetailsController.getWorkspaceStatus() === 'STARTING'">

  <!-- Name -->
  <che-label-container che-label-name="Name">
    <div class="project-details-input">
      <che-input che-form="projectInformationForm"
                 che-name="name"
                 che-place-holder="Name of the project"
                 ng-model="projectDetailsController.projectName"
                 required
                 unique-project-name="projectDetailsController.getWorkspaceProjects()"
                 ng-maxlength="128"
                 ng-pattern="/^[A-Za-z0-9_\-\.]+$/"
                 readonly>
        <div ng-message="required">A name is required.</div>
        <div ng-message="pattern">The name should not contain special characters like space, dollar, etc.</div>
        <div ng-message="maxlength">The name has to be less than 128 characters long.</div>
        <div ng-message="md-maxlength">The name has to be less than 128 characters long.</div>
        <div ng-message="uniqueProjectName">This project name is already used.</div>
      </che-input>
    </div>
  </che-label-container>

  <!-- Description -->
  <che-label-container che-label-name="Description">
    <div class="project-details-input">
      <ng-form name="projectInformationForm">
        <che-input che-form="projectInformationForm"
                   che-name="description"
                   che-place-holder="Description of the project"
                   che-width="auto"
                   ng-model="projectDetailsController.projectDescription"
                   ng-change="projectDetailsController.updateInfo(projectInformationForm.$valid)"
                   ng-maxlength="256">
          <div ng-message="maxlength">The name has to be less than 256 characters long.</div>
          <div ng-message="md-maxlength">The name has to be less than 256 characters long.</div>
        </che-input>
      </ng-form>
    </div>
  </che-label-container>

  <!-- Workspace -->
  <che-label-container che-label-name="Workspace">
    <div class="project-details-input">
      <che-input ng-model="projectDetailsController.workspaceName"
                 readonly></che-input>
    </div>
  </che-label-container>

  <!-- Repositories -->
  <project-repository></project-repository>

  <!-- Delete project -->
  <che-label-container class="workspace-delete-label"
                       che-label-name="Delete project">
    <che-button-danger che-button-title="Delete" ng-click="projectDetailsController.deleteProject()"/>
  </che-label-container>

</md-content>


<md-content ng-show="projectDetailsController.invalidProject">
  {{projectDetailsController.invalidProject}}
</md-content>

<md-content md-scroll-y flex class="projects-details-project"
            ng-if="(projectDetailsController.getWorkspaceStatus() !== 'RUNNING')"
            layout="column"
            layout-align="center center">
  <che-empty-state che-value="This project's workspace is not currently running."
                   che-icon-class="fa fa-folder-open"></che-empty-state>

  <che-link class="projects-details-project-ws-not-started"
            ng-href="#/workspace/{{projectDetailsController.namespace}}/{{projectDetailsController.workspaceName}}"
            che-link-text="Start workspace"></che-link>

</md-content>



