From e59d394491a05bb4bb14b7510aa1a28d13755e6d Mon Sep 17 00:00:00 2001 From: alecmerdler Date: Tue, 21 Feb 2017 15:59:26 -0800 Subject: [PATCH] refactoring linear workflow directives --- .../linear-workflow-section.component.html | 7 ++ .../linear-workflow-section.component.spec.ts | 25 +++++ .../linear-workflow-section.component.ts | 32 +++++++ .../linear-workflow.component.html | 39 ++++++++ .../linear-workflow.component.spec.ts | 19 ++++ .../linear-workflow.component.ts | 48 +++++++++- .../manage-trigger-custom-git.component.html | 86 ++++++++++++++---- .../manage-trigger-githost.component.html | 4 +- static/js/quay.module.ts | 2 + test/data/test.db | Bin 1314816 -> 1314816 bytes 10 files changed, 240 insertions(+), 22 deletions(-) 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 203537eee25924398dc0f5497646dfd60349ae45..415776f78184bea83328ba45eaeaeb7ba35d8714 100644 GIT binary patch delta 806 zcmZ|NJxo(k6bJBo&wKRs^<8>eX^f=usA!EJR9^d9pp{6gBt{crjWNMMLW^2rEJ|XG z_(3RxAu%OF7)}QU1|n|85OW6xHwT9a|eudL;l z!o0qG^b)Vn7hV?lhXSmlX5%m!0qEkx@>BqhBW?F+Iz(-{(FyN$8^;+190*&F@B!Y# zJ2;LrEB5wbc`*WEr27wfJI(Y!Rn3_s!+|89lodUd$;>o( z4-V{3nvkDfz=hpZKN%G`$@^t@1$=^TRl(oB&n*$1=QvQY3}N}K3a?buYLc-8QLvh_ zdkN|mb*=)2{?A731=UeBMORuBk76iZ#Z-KQ1i9N zG;xICB98c*YU))?xnQxIoSTdV8H<FQr8YGZQ<0rnGcy$8j7dwiDY)Y!!9l*zq%V zUd{`oOczxJYNZwysoF}+q7o}4B!sf)o<$dIkl3Uppx5udCPZoIZxekOvJ8_wECCzdpcKfZrV7Ie&A1ssca$!_E8LIq;q1{p&Gs z=kW1sz=Pvldu@OE0C?eW_W=N%|N7$o^ZS=$;MyUGfe$ZLXMZ{Yu*1s};OuL4pR2~< zPd^8Ka%nO5rw@VeA4(5_;-%$#d-`qQ`laRB!}e|9mzS33_NVUxFCOl_3;g+NZh3M4 z)uB|&T-C3&NDeza!zy3a*8?N;oe7A|B9Uf(Cq^BK6E?(0tnju3;+w%8`qAQ zqq72=1+jCX&jQbLXD?lN!NSk%rct9s5yNV#h;&i1-q7n^Mv=Q>Ls4oP-f!z7XK+Sa zmJO*wGmI!HJ-%1LS%YH@N$&t<1f}jG<-2I*0;OLpIJp!$u6b6ir_894^BLyyk3Cbx$^q;CwWcnD>r@x1J?>h@u>LI55D`0 zZyn`5R=oAX4sfx-Xow({GKLRm3LgvyBtnb`!p1P$A#Hm&LdlUk!0%oTmKQ|%qN6bv zYDercI)5SY=2Hc1i6WnRBFium$FzB-TyBMfRaAvjPTr~sK?}9oc1zcS8a&^uHtH%M zCz`u6N?PJ;T8X7WXZHSzZ zq_La|BSFd5mf4?zgg9tqQQ0fCUA|h;XBfFcVTqPW#5SM0n0CBQ&8XNEW}w+hVFNYk2c3~ulQwnI?M<0P)Rt|r%Cs4lNiXkv zYWZ?W9TPaeSd?tAOnEFhB>id9v6eA08_I;$B>D2D*KERkSMU;4v`e2OfG2>D3rafBqCc$V!&qO|UE9hM0 z4Ot6n?H=O#U2S!q!ac(Q9kg-nhGzZ5X}| z%XN0iccvR=WkoJ*f^|t>bm5Xx3$!t%tVYhn8%e#TT(0T{DPyKHUnWR*LGqpYDEdh6v+!?J0ZKx80kRi92R9S@Um$+(s|4~ayI2tVagj&{=i+O?`4A;AbUk35u3 zwx(%3Eg9~I6>zG~x)nqpjGIU)gTsZUgc=@}*UPEbQwLjPzSHEm#y6t&T+W)kN-`2` z8l@~M;#_eu6il#-WLTW`duqvV=^pDw?aCOQ4KtXn64I1wBF$NgSk!Ey&e+;O<@=>o zLvD_3Szg&V9)(~>^;>9Coh+l4nvMk%i50uzND{SavLU^b_`zsG#?IwEGxdHnmr_$7 z2WHw`Gm8!}4>Zt5j0QVGCqxjm<=Pf*@LFm{n$%2V(Gj!!zZwW7ujdp!ZTDg`3}#k$ zJ+F*}#0)$YE`jMtr_x|L?PE&@cIss9L{S>u zM#Hu^o;tD6$TZM1`_g*28i%EFsM~7R*J+(?ORUGwYpt?08PJ0v@3V;866O8?vt<`< z)s@`4t!JQ5Hx&+#EM8LVDz>J0W0q1ap*x+`Dh^FD{mDoe*Bx%q#kr}~vzAh+ zWTEV8+Xu~eY(-eh@CvQF8o#$N3xt;^%+{n3^^Nqvf-Lu7q;Bk>God4y#S|sxf{Xy|S7H@re F<-Z`z7a#xt