--- /dev/null
+<h6 class="create-title">CREATE</h6>
+<div class="card creat-card">
+ <div class="single-line">
+ <label class="label-name">Name</label>
+ <div class="label-input">
+ <input type="input" placeholder="Topology name.vLB.CDS">
+ </div>
+ </div>
+ <hr />
+ <div class="single-line">
+ <label class="label-name">Management Type</label>
+ <div class="label-input">
+ <div class="row">
+ <div class="col-md-4 d-flex">
+ <a class="select-type active" href="#">
+ <div class="select-type-icon"><span class="icon-template-mapping"></span></div>
+ <div>Template And Support Mapping</div>
+ </a>
+ </div>
+ <div class="col-md-4 d-flex">
+ <a class="select-type" href="#">
+ <div class="select-type-icon"><span class="icon-template"></span></div>
+ <div>Template Only</div>
+ </a>
+ </div>
+ <div class="col-md-4 d-flex">
+ <a class="select-type" href="#">
+ <div class="select-type-icon"><span class="icon-mapping"></span></div>
+ <div>Mapping Only</div>
+ </a>
+
+ </div>
+ </div>
+
+ </div>
+ </div>
+ <hr />
+ <div class="single-line">
+ <label class="label-name">Type</label>
+ <div class="label-input">
+ <label name="trst">
+ <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value=Velcoity>
+
+ <span>
+ Velcoity
+ </span>
+ </label>
+ <label name="trst">
+ <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value=Velcoity>
+
+ <span>
+ Jinja
+ </span>
+ </label>
+ <label name="trst">
+ <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value=Velcoity>
+
+ <span>
+ Kotlin
+ </span>
+ </label>
+ </div>
+ </div>
+</div>
+
+<div class="template-mapping-accordion">
+ <div id="accordion">
+ <div class="card">
+ <div class="card-header" id="headingOne">
+ <h5 class="mb-0 d-flex justify-content-between">
+ <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true"
+ aria-controls="collapseOne">
+ 1. Create Template
+ </button>
+
+ </h5>
+ </div>
+
+ <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
+ <div class="card-body">
+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3
+ wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum
+ eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla
+ assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
+ sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer
+ farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
+ labore sustainable VHS.
+ </div>
+ </div>
+ </div>
+ <div class="card">
+ <div class="card-header" id="headingTwo">
+ <h5 class="mb-0">
+ <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo"
+ aria-expanded="false" aria-controls="collapseTwo">
+ 2. Manage Mapping
+ </button>
+ </h5>
+ </div>
+ <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
+ <div class="card-body">
+ Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3
+ wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum
+ eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla
+ assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
+ sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer
+ farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
+ labore sustainable VHS.
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
\ No newline at end of file
--- /dev/null
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TemplMappCreationComponent } from './templ-mapp-creation.component';
+
+describe('TemplateMappingCreationComponent', () => {
+ let component: TemplMappCreationComponent;
+ let fixture: ComponentFixture<TemplMappCreationComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ TemplMappCreationComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(TemplMappCreationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
--- /dev/null
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-templ-mapp-creation',
+ templateUrl: './templ-mapp-creation.component.html',
+ styleUrls: ['./templ-mapp-creation.component.css']
+})
+export class TemplMappCreationComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
--- /dev/null
+<h6>Basic List Template and mapping</h6>
+<div>
+ <a (click)="openCreationView()" class="action-button">
+ <span>Create</span>
+ </a>
+</div>
\ No newline at end of file
--- /dev/null
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TemplMappListingComponent } from './templ-mapp-listing.component';
+
+describe('TemplMappListingComponent', () => {
+ let component: TemplMappListingComponent;
+ let fixture: ComponentFixture<TemplMappListingComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ TemplMappListingComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(TemplMappListingComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
--- /dev/null
+import { Component, OnInit, Output, EventEmitter } from '@angular/core';
+
+@Component({
+ selector: 'app-templ-mapp-listing',
+ templateUrl: './templ-mapp-listing.component.html',
+ styleUrls: ['./templ-mapp-listing.component.css']
+})
+export class TemplMappListingComponent implements OnInit {
+ @Output() showCreationViewParentNotification = new EventEmitter<any>();
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+ openCreationView() {
+ this.showCreationViewParentNotification.emit('tell parent to open create views');
+ }
+
+}
-<h6 class="create-title">CREATE</h6>
-<div class="card creat-card">
- <div class="single-line">
- <label class="label-name">Name</label>
- <div class="label-input">
- <input type="input" placeholder="Topology name.vLB.CDS">
- <!--(input)="searchPackages($event)" [(ngModel)]="metaDataTab.name"-->
-
- </div>
- </div>
- <hr/>
- <div class="single-line">
- <label class="label-name">Management Type</label>
- <div class="label-input">
- <div class="row">
- <div class="col-md-4 d-flex">
- <a class="select-type active" href="#">
- <div class="select-type-icon"><span class="icon-template-mapping"></span></div>
- <div>Template And Support Mapping</div>
- </a>
- </div>
- <div class="col-md-4 d-flex">
- <a class="select-type" href="#">
- <div class="select-type-icon"><span class="icon-template"></span></div>
- <div>Template Only</div>
- </a>
- </div>
- <div class="col-md-4 d-flex">
- <a class="select-type" href="#">
- <div class="select-type-icon"><span class="icon-mapping"></span></div>
- <div>Mapping Only</div>
- </a>
-
- </div>
- </div>
-
- </div>
- </div>
- <hr/>
- <div class="single-line">
- <label class="label-name">Type</label>
- <div class="label-input">
- <label name="trst">
- <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios1" value=Velcoity>
-
- <span>
- Velcoity
- </span>
- </label>
- <label name="trst">
- <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios2" value=Velcoity>
-
- <span>
- Jinja
- </span>
- </label>
- <label name="trst">
- <input class="form-check-input" type="radio" name="exampleRadios" id="exampleRadios3" value=Velcoity>
-
- <span>
- Kotlin
- </span>
- </label>
- </div>
- </div>
+<div *ngIf="!creationView">
+ <app-templ-mapp-listing
+ (showCreationViewParentNotification)="openCreationView($event)">
+ </app-templ-mapp-listing>
</div>
-<div class="template-mapping-accordion">
- <div id="accordion">
- <div class="card">
- <div class="card-header" id="headingOne">
- <h5 class="mb-0 d-flex justify-content-between">
- <button class="btn btn-link" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true"
- aria-controls="collapseOne">
- 1. Create Template
- </button>
-
- </h5>
- </div>
-
- <div id="collapseOne" class="collapse show" aria-labelledby="headingOne" data-parent="#accordion">
- <div class="card-body">
- Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3
- wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum
- eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla
- assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
- sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer
- farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
- labore sustainable VHS.
- </div>
- </div>
- </div>
- <div class="card">
- <div class="card-header" id="headingTwo">
- <h5 class="mb-0">
- <button class="btn btn-link collapsed" data-toggle="collapse" data-target="#collapseTwo"
- aria-expanded="false" aria-controls="collapseTwo">
- 2. Manage Mapping
- </button>
- </h5>
- </div>
- <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordion">
- <div class="card-body">
- Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3
- wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum
- eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla
- assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
- sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer
- farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus
- labore sustainable VHS.
- </div>
- </div>
- </div>
- </div>
+<div *ngIf="creationView">
+ <app-templ-mapp-creation></app-templ-mapp-creation>
</div>
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { TemplateMappingComponent } from './template-mapping.component';
+import { TemplMappCreationComponent } from './templ-mapp-creation/templ-mapp-creation.component';
+import { TemplMappListingComponent } from './templ-mapp-listing/templ-mapp-listing.component';
+import { By } from '@angular/platform-browser';
describe('TemplateMappingComponent', () => {
let component: TemplateMappingComponent;
beforeEach(async(() => {
TestBed.configureTestingModule({
- declarations: [ TemplateMappingComponent ]
+ declarations: [
+ TemplateMappingComponent,
+ TemplMappCreationComponent,
+ TemplMappListingComponent
+ ]
})
.compileComponents();
}));
it('should create', () => {
expect(component).toBeTruthy();
});
+
+
+ it('should load create component if create flag is true', () => {
+ component.creationView = true;
+ fixture.detectChanges();
+ const compiled = fixture.debugElement.nativeElement;
+
+ const element = fixture.debugElement.query(By.css('app-templ-mapp-creation'));
+ expect(element).toBeTruthy();
+ const child: TemplMappCreationComponent = element.componentInstance;
+ expect(child).not.toBeNull();
+
+ const listElement = fixture.debugElement.query(By.css('app-templ-mapp-listing'));
+ expect(listElement).toBeFalsy();
+
+ });
+
+ it('should load listing component by default', () => {
+ const compiled = fixture.debugElement.nativeElement;
+
+ const element = fixture.debugElement.query(By.css('app-templ-mapp-creation'));
+ expect(element).toBeFalsy();
+
+ const listElement = fixture.debugElement.query(By.css('app-templ-mapp-listing'));
+ expect(listElement).toBeTruthy();
+ const child: TemplMappListingComponent = listElement.componentInstance;
+ expect(child).not.toBeNull();
+
+ });
});
styleUrls: ['./template-mapping.component.css']
})
export class TemplateMappingComponent implements OnInit {
+ creationView = false;
constructor() { }
ngOnInit() {
}
+ openCreationView() {
+ this.creationView = true;
+ }
+
}
import {AceEditorModule} from 'ng2-ace-editor';
import {MetadataTabComponent} from './package-creation/metadata-tab/metadata-tab.component';
import {DslDefinitionsTabComponent} from './package-creation/dsl-definitions-tab/dsl-definitions-tab.component';
+import { TemplMappCreationComponent } from './package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component';
+import { TemplMappListingComponent } from './package-creation/template-mapping/templ-mapp-listing/templ-mapp-listing.component';
@NgModule({
declarations: [PackagesDashboardComponent,
PackageCreationComponent,
ImportsTabComponent,
TemplateMappingComponent,
+ TemplMappCreationComponent,
+ TemplMappListingComponent,
SourceEditorComponent,
ScriptsTabComponent,
MetadataTabComponent,
Code Review / ccsdk / cds.git / commitdiff