This repository has been archived on 2020-03-24. You can view files and clone it, but cannot push or open issues or pull requests.
quay/static/js/directives/ui/dockerfile-path-select/dockerfile-path-select.component.ts
2017-02-28 16:51:42 -05:00

82 lines
2.9 KiB
TypeScript

import { Input, Component } from 'angular-ts-decorators';
@Component({
selector: 'dockerfilePathSelect',
template: `
<div class="dockerfile-path-select-element">
<div class="dropdown-select" placeholder="'Enter path containing a Dockerfile'"
selected-item="$ctrl.selectedPath"
lookahead-items="$ctrl.paths"
handle-input="$ctrl.setPath(input)"
handle-item-selected="$ctrl.setSelectedPath(datum.value)"
allow-custom-input="true"
hide-dropdown="!$ctrl.supportsFullListing">
<!-- Icons -->
<i class="dropdown-select-icon none-icon fa fa-folder-o fa-lg"
ng-show="$ctrl.isUnknownPath"></i>
<i class="dropdown-select-icon none-icon fa fa-folder fa-lg" style="color: black;"
ng-show="!$ctrl.isUnknownPath"></i>
<i class="dropdown-select-icon fa fa-folder fa-lg"></i>
<!-- Dropdown menu -->
<ul class="dropdown-select-menu pull-right" role="menu">
<li ng-repeat="path in $ctrl.paths">
<a ng-click="$ctrl.setSelectedPath(path)"
ng-if="path">
<i class="fa fa-folder fa-lg"></i> {{ path }}
</a>
</li>
<li class="dropdown-header" role="presentation"
ng-show="!$ctrl.paths.length">
No Dockerfiles found in repository
</li>
</ul>
</div>
<div style="padding: 10px">
<div class="co-alert co-alert-danger"
ng-show="!$ctrl.isValidPath && $ctrl.currentPath">
Path entered for folder containing Dockerfile is invalid: Must start with a '/'.
</div>
</div>
</div>
`,
})
export class DockerfilePathSelectComponent implements ng.IComponentController {
// FIXME: Use one-way data binding
@Input('=') public currentPath: string;
@Input('=') public isValidPath: boolean;
@Input('=') public paths: string[];
@Input('=') public supportsFullListing: boolean;
private isUnknownPath: boolean = true;
private selectedPath: string | null = null;
public $onChanges(changes: ng.IOnChangesObject): void {
this.isValidPath = this.checkPath(this.currentPath, this.paths, this.supportsFullListing);
}
public setPath(path: string): void {
this.currentPath = path;
this.selectedPath = null;
this.isValidPath = this.checkPath(path, this.paths, this.supportsFullListing);
}
public setSelectedPath(path: string): void {
this.currentPath = path;
this.selectedPath = path;
this.isValidPath = this.checkPath(path, this.paths, this.supportsFullListing);
}
private checkPath(path: string = '', paths: string[] = [], supportsFullListing: boolean): boolean {
this.isUnknownPath = false;
var isValidPath: boolean = false;
if (path.length > 0 && path[0] === '/') {
isValidPath = true;
this.isUnknownPath = supportsFullListing && paths.indexOf(path) < 0;
}
return isValidPath;
}
}