<p class="Artifact-empty" ng-if="artifactList.all.length === 0" translate>
    No artifact found.
</p>

<ul class="ArtifactList" ng-if="artifactList.all.length ">
    <li class="ArtifactList-item ArtifactList-item--primary ArtifactList-{{:: artifact.type }}"
        id="{{:: artifact.id }}"
        ng-repeat="artifact in artifactList.all track by artifact.id">
        <div class="Artifact-info" ng-switch="artifactList.isInEditionMode($index)">
            <a ng-switch-default href=""
               class="Artifact-link Artifact-link--primary"
               ng-click="artifactList.openArtifact(artifact)"
               ng-class="{'Artifact-disabled': artifact.status && !artifact.status.compatible, 'Artifact-enabled': !artifact.status || artifact.status.compatible}">
                <span ng-if="artifact.icon" class="Artifact-icon"
                      uib-tooltip="{{::artifactList.getTooltipMessage(artifact)}}"
                      tooltip-popup-delay="500">
                    <identicon name="{{artifact.id}}" size="25"
                               foreground-color="[198, 199, 228, 255]"
                               background-color="[0,0,0,0]"                               >
                    </identicon>
                      <i>
                    <i ng-if="artifact.hasValidationError" class="fa identicon-error-overlay"></i>
                    <i ng-if="artifact.status && !artifact.status.compatible" class="fa identicon-forbidden-overlay"></i>
                    <i ng-if="artifact.status && artifact.status.migration" class="fa identicon-warning-overlay"></i>
                </i>

                </span>
                <i ng-if="!artifact.icon" class="ui-icon ui-{{:: artifact.type }}s Artifact-icon"
                   uib-tooltip="{{::artifactList.getTooltipMessage(artifact)}}"
                   tooltip-popup-delay="500">
                    <i ng-if="artifact.hasValidationError" class="fa error-overlay"></i>
                    <i ng-if="artifact.status && !artifact.status.compatible" class="fa forbidden-overlay"></i>
                    <i ng-if="artifact.status && artifact.status.migration" class="fa warning-overlay"></i>
                </i>

                <span class="Artifact-text">
                    <span class="Artifact-name"
                          uib-tooltip-template="'js/home/artifact-list/artifact-tooltip-template.html'"
                          tooltip-popup-delay="500"
                          tooltip-placement="top-left">{{artifact.name}}
                    </span>
                    <span class="Artifact-metadata"
                    >{{:: artifactList.translateKeys('Last Update:') }} {{:: artifact.lastUpdate | date:'short' }}</span>
                </span>
            </a>
            <form name="renameArtifact" class="Artifact-form"
                  ng-switch-when="true"
                  ng-submit="renameArtifact.$valid && artifactList.renameItem(artifact)"
                  ng-init="artifact.newName = artifact.name">
                <div>
                    <input name="name" class="form-control" required
                           ui-validate="{alreadyExists : '!artifactList.isArtifactNameAlreadyExist($value, artifact, artifactList.existingArtifacts)'}"
                           ui-validate-watch="'artifact'"
                           data-autofocus
                           id="page-name-input-{{:: $index }}"
                           ng-model="artifact.newName"
                           ng-blur="renameArtifact.$valid && artifactList.renameItem(artifact)"
                           artifact-name-validation>
                </div>
            </form>
        </div>
        <div class="Artifact-actions">
            <span ng-if="artifactList.isInEditionMode($index)">
                <button class="Artifact-button Artifact-button--primary Artifact-rename"
                        ng-mousedown="artifactList.toggleItemEdition($index)"
                        type="button"
                        uib-tooltip="{{artifactList.translateKeys('Cancel')}}">
                    <i class='fa fa-times'></i>
                </button>
                <span ng-if="artifactList.isValid($index)">
                <button class="Artifact-button Artifact-button--primary Artifact-rename"
                        ng-click="artifactList.toggleItemEdition($index)"
                        type="button"
                        uib-tooltip="{{artifactList.translateKeys('Rename')}}"
                        tooltip-popup-delay="500"
                        ng-if=":: artifactList.getRepository(artifact.type).rename">
                    <i class='fa fa-check'></i>
                </button>
                </span>
            </span>
            <span ng-if="!artifactList.isInEditionMode($index)">
                <button class="Artifact-button  Artifact-rename"
                        ng-class="{'Artifact-button--primary-disabled': artifact.status && !artifact.status.compatible, 'Artifact-button--primary': !artifact.status || artifact.status.compatible}"
                        ng-click="artifactList.toggleItemEdition($index)"
                        type="button"
                        uib-tooltip="{{artifactList.translateKeys('Rename')}}"
                        tooltip-popup-delay="500"
                        ng-if=":: artifactList.getRepository(artifact.type).rename"
                        ng-disabled="artifact.status && !artifact.status.compatible"/>
                <i class='fa fa-pencil'></i>
            </span>

            <favorite-button artifact-repository="::artifactList.getRepository(artifact.type)"
                             artifact=":: artifact"></favorite-button>
            <button class="Artifact-button Artifact-export"
                    ng-class="{'Artifact-button--primary-disabled': artifact.status && !artifact.status.compatible, 'Artifact-button--primary': !artifact.status || artifact.status.compatible}"
                    ng-click="artifactList.exportArtifact(artifact)"
                    uib-tooltip="{{:: artifactList.translateKeys('Export')}}"
                    tooltip-popup-delay="500"
                    ng-disabled="artifact.status && !artifact.status.compatible">
                <i class="ui-icon ui-export"></i>
            </button>
            <button class="Artifact-button Artifact-button--primary Artifact-delete"
                    type="button"
                    ng-click="artifactList.deleteArtifact(artifact)"
                    uib-tooltip="{{:: artifactList.translateKeys('Delete')}}"
                    tooltip-popup-delay="500">
                <i class="fa fa-trash"></i>
            </button>
        </div>
    </li>
</ul>
