diff --git a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html index e69de29bb..0a6560404 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html +++ b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html @@ -0,0 +1,7 @@ +
+
+
+ +
diff --git a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts index e69de29bb..11f514f5b 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts @@ -0,0 +1,25 @@ +import { LinearWorkflowSectionComponent } from './linear-workflow-section.component'; +import { LinearWorkflowComponent } from './linear-workflow.component'; +import Spy = jasmine.Spy; + + +describe("LinearWorkflowSectionComponent", () => { + var component: LinearWorkflowSectionComponent; + var parentMock: LinearWorkflowComponent; + + beforeEach(() => { + component = new LinearWorkflowSectionComponent(); + parentMock = new LinearWorkflowComponent(); + component.parent = parentMock; + }); + + describe("$onInit", () => { + + it("calls parent component to add itself as a section", () => { + var addSectionSpy: Spy = spyOn(parentMock, "addSection").and.returnValue(null); + component.$onInit(); + + expect(addSectionSpy.calls.argsFor(0)[0]).toBe(component); + }); + }); +}); diff --git a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts index e69de29bb..6a8c6f144 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts @@ -0,0 +1,32 @@ +import { Component, Output, Input } from 'angular-ts-decorators'; +import { LinearWorkflowComponent } from './linear-workflow.component'; + + +/** + * A component which displays a single section in a linear workflow. + */ +@Component({ + selector: 'linearWorkflowSection', + templateUrl: '/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html', + transclude: true, + require: { + parent: '^linearWorkflow' + } +}) +export class LinearWorkflowSectionComponent implements ng.IComponentController { + + @Input('@') public sectionId: string; + @Input('@') public sectionTitle: string; + @Input() public sectionValid: boolean = false; + public sectionVisible: boolean = false; + public isCurrentSection: boolean = false; + public parent: LinearWorkflowComponent; + + constructor() { + + } + + public $onInit(): void { + this.parent.addSection(this); + } +} diff --git a/static/js/directives/ui/linear-workflow/linear-workflow.component.html b/static/js/directives/ui/linear-workflow/linear-workflow.component.html index e69de29bb..eec4daa80 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow.component.html +++ b/static/js/directives/ui/linear-workflow/linear-workflow.component.html @@ -0,0 +1,39 @@ +
+ +
+ +
+ + + + + +
+ + + + +
+ Next: +
    +
  • + {{ section.title }} +
    • +
+
+
+
+
\ No newline at end of file diff --git a/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts b/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts index e69de29bb..34ddedb62 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts @@ -0,0 +1,19 @@ +import { LinearWorkflowComponent, SectionInfo } from './linear-workflow.component'; +import { LinearWorkflowSectionComponent } from './linear-workflow-section.component'; + + +describe("LinearWorkflowComponent", () => { + var component: LinearWorkflowComponent; + + beforeEach(() => { + component = new LinearWorkflowComponent(); + }); + + describe("addSection", () => { + + }); + + describe("onNextSection", () => { + + }); +}); diff --git a/static/js/directives/ui/linear-workflow/linear-workflow.component.ts b/static/js/directives/ui/linear-workflow/linear-workflow.component.ts index a82e01b54..a3d421051 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow.component.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow.component.ts @@ -1,10 +1,56 @@ import { Component, Output, Input } from 'angular-ts-decorators'; +import { LinearWorkflowSectionComponent } from './linear-workflow-section.component'; +/** + * A component that which displays a linear workflow of sections, each completed in order before the next + * step is made visible. + */ @Component({ selector: 'linearWorkflow', - templateUrl: '/static/js/directives/ui/linear-workflow/linear-workflow.component.html' + templateUrl: '/static/js/directives/ui/linear-workflow/linear-workflow.component.html', + transclude: true }) export class LinearWorkflowComponent implements ng.IComponentController { + @Input('@') public doneTitle: string; + @Output() public onWorkflowComplete: (event: any) => void; + private sections: SectionInfo[] = []; + private currentSection: SectionInfo; + + + constructor() { + + } + + public $onInit(): void { + + } + + public addSection(section: LinearWorkflowSectionComponent): void { + this.sections.push({ + index: this.sections.length, + section: section, + }); + } + + public onNextSection(): void { + if (this.currentSection.section.sectionValid) { + if (this.currentSection.index + 1 >= this.sections.length) { + this.onWorkflowComplete({}); + } + else { + this.currentSection = this.sections[this.currentSection.index]; + } + } + } +} + + +/** + * A type representing a section of the linear workflow. + */ +export type SectionInfo = { + index: number; + section: LinearWorkflowSectionComponent; } diff --git a/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html b/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html index 563ac04f9..a82102122 100644 --- a/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html +++ b/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html @@ -1,19 +1,18 @@
-
+ -
+

Enter repository

- - Please enter the HTTP or SSH style URL used to clone your git repository: - + Please enter the HTTP or SSH style URL used to clone your git repository: @@ -23,13 +22,14 @@

It is the responsibility of the git repository to invoke a webhook to tell that a commit has been added.

-
+ -
+

Select build context directory

@@ -42,6 +42,56 @@

The build context directory is the path of the directory containing the Dockerfile and any other files to be made available when the build is triggered.

If the Dockerfile is located at the root of the git repository, enter / as the build context directory.

-
-
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/static/js/directives/ui/manage-trigger-githost/manage-trigger-githost.component.html b/static/js/directives/ui/manage-trigger-githost/manage-trigger-githost.component.html index de8dc9bc9..6c2f2837d 100644 --- a/static/js/directives/ui/manage-trigger-githost/manage-trigger-githost.component.html +++ b/static/js/directives/ui/manage-trigger-githost/manage-trigger-githost.component.html @@ -11,9 +11,7 @@ section-valid="$ctrl.local.selectedNamespace">

Select {{ $ctrl.namespaceTitle }}

- - Please select the {{ $ctrl.namespaceTitle }} under which the repository lives - + Please select the {{ $ctrl.namespaceTitle }} under which the repository lives
diff --git a/static/js/quay.module.ts b/static/js/quay.module.ts index 60dbe5933..f8d54c5a0 100644 --- a/static/js/quay.module.ts +++ b/static/js/quay.module.ts @@ -9,6 +9,7 @@ import { DockerfilePathSelectComponent } from './directives/ui/dockerfile-path-s import { ManageTriggerCustomGitComponent } from './directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component'; import { ManageTriggerGithostComponent } from './directives/ui/manage-trigger-githost/manage-trigger-githost.component'; import { LinearWorkflowComponent } from './directives/ui/linear-workflow/linear-workflow.component'; +import { LinearWorkflowSectionComponent } from './directives/ui/linear-workflow/linear-workflow-section.component'; import { QuayConfig } from './quay-config.module'; import { QuayRun } from './quay-run.module'; @@ -28,6 +29,7 @@ import { QuayRun } from './quay-run.module'; ManageTriggerCustomGitComponent, ManageTriggerGithostComponent, LinearWorkflowComponent, + LinearWorkflowSectionComponent, ], providers: [ ViewArrayImpl, diff --git a/test/data/test.db b/test/data/test.db index 203537eee..415776f78 100644 Binary files a/test/data/test.db and b/test/data/test.db differ