diff options
Diffstat (limited to 'cds-ui/client-frankfurt/src/app')
8 files changed, 832 insertions, 0 deletions
diff --git a/cds-ui/client-frankfurt/src/app/app-routing.module.ts b/cds-ui/client-frankfurt/src/app/app-routing.module.ts new file mode 100644 index 000000000..b42468b9f --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/app-routing.module.ts @@ -0,0 +1,32 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2019 Orange. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import {NgModule} from '@angular/core'; +import {Routes, RouterModule} from '@angular/router'; + + +@NgModule({ + imports: [RouterModule.forRoot(routes)], + exports: [RouterModule] +}) +export class AppRoutingModule { +} + diff --git a/cds-ui/client-frankfurt/src/app/app.component.css b/cds-ui/client-frankfurt/src/app/app.component.css new file mode 100644 index 000000000..4a4a5f153 --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/app.component.css @@ -0,0 +1,326 @@ +/* Menu Styles */ +.primary-nav{ + position: fixed; + z-index: 999; +} +.menu{ + position: relative; +} +.menu ul{ + margin: 0; + padding: 0; + list-style: none; +} +.open-panel{ + border: none; + background-color:#fff; + padding: 0; +} + + .logo-icon { + background: #fff; + position: relative; + display: block; + text-align: center; + padding: 16px 0; + width: 50px; + height: 60px; + left: 0; + top: 0; + z-index: 1000; + cursor: pointer; + } + + /* .logo-icon:before { + content:"\2630"; + display: block; + color: #000; + line-height: 32px; + font-size: 16px; + } */ + + /* .openNav .logo-icon:before { + content:"\2715"; + display: block; + color: #000; + line-height: 32px; + font-size: 16px; + } + + .logo-icon:hover:before { + color: #777; + } */ + + .primary-nav .menu li { + position: relative; + } + + .menu .icon { + position: absolute; + top: 12px; + right: 10px; + pointer-events: none; + width: 30px; + height: 30px; + color: #fff; + text-align: center; + } + .menu .icon .fa{ + vertical-align: middle; + } + .menu, + .menu a, + .menu a:visited { + color: #fff; + text-decoration: none!important; + position: relative; + } + +.menu a{ + display: block; + white-space: nowrap; + padding: 10px 1em; + font-size: 12px; + font-weight: bold; + height: 52px; +line-height: 30px; +} + + .menu a:hover { + color: #fff; + } + + /* .menu { + margin-bottom: 3em; + } */ + + .menu-dropdown li .icon{ + padding: 2px 6px; + color: #fff; + + } + + .menu-dropdown li.active .icon { + color: #fff; + background: #265699; + border-radius: 50%; + } + .menu-dropdown li:hover{ + background: #172B4D; + } + + + .menu label { + margin-bottom: 0; + display: block; + } + + .menu label:hover { + cursor: pointer; + } + + .menu input[type="checkbox"] { + display: none; + } + + input#menu[type="checkbox"] { + display: none; + } + + + + + + + .sub-menu-dropdown { + display: none; + } + + .new-wrapper { + position: absolute; + left: 50px; + width: calc(100% - 50px); + transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1); + } + + #menu:checked + ul.menu-dropdown { + + left: 0; + -webkit-animation: all .45s cubic-bezier(0.77, 0, 0.175, 1); + animation: all .45s cubic-bezier(0.77, 0, 0.175, 1); + } + + .sub-menu-checkbox:checked + ul.sub-menu-dropdown { + display: block!important; + -webkit-animation: grow .45s cubic-bezier(0.77, 0, 0.175, 1); + animation: grow .45s cubic-bezier(0.77, 0, 0.175, 1); + } + + + .openNav .new-wrapper { + position: absolute; + transform: translate3d(200px, 0, 0); + width: calc(100% - 250px); + transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1); + } + + + .downarrow { + background: transparent; + position: absolute; + right: 50px; + top: 12px; + color: #fff; + width: 24px; + height: 24px; + text-align: center; + display: block; + } + + .downarrow:hover { + color: #fff; + } + + .menu { + position: absolute; + display: block; + left: -200px; + top: 0; + width: 250px; + height: 100vh; + transition: all 0.45s cubic-bezier(0.77, 0, 0.175, 1); + background-color: #1B3E6F; + z-index: 999; + } + + .menu-dropdown { + top: 0; + overflow-y: auto; + } + + .overflow-container { + position: relative; + height: calc(100vh - 60px)!important; + overflow-y: auto; + border-top: 60px solid #fff; + z-index: -1; + display:block; + } + + .menu .logotype { + position: absolute !important; + top: 16px; + left: 55px; + display: block; + } + + .sub-menu-dropdown { + background-color: #333; + } + + .menu:hover { + position: absolute; + left: 0; + top: 0; + } + + .openNav .menu:hover { + position: absolute; + left: -200px; + top: 60px; + } + + .openNav .menu { + top: 60px; + transform: translate3d(200px, 0, 0); + transition: transform .45s cubic-bezier(0.77, 0, 0.175, 1); + } + + /* label.logo-icon { + display: none; + } */ + + + + + + + + + + + + + + /* look and feel only, not needed for core menu*/ + + @-webkit-keyframes grow { + + 0% { + display: none; + opacity: 0; + } + 50% { + display: block; + opacity: 0.5; + } + 100% { + opacity: 1; + } + + } + + @keyframes grow { + + 0% { + display: none; + opacity: 0; + } + 50% { + display: block; + opacity: 0.5; + } + 100% { + opacity: 1 + } + + } + +/*User Profile*/ +.userProfile .dropdown{ + width: 100%; +} +.userProfile .dropdown:hover{ + background: #172B4D; +} +.userProfile .dropdown-text{ + background: transparent; + border: 0; + box-shadow: none; + font-size: 13px; + line-height: 40px; +} +.userProfile .dropdown-toggle{ + height: 40px; +} +.userProfile .dropdown-text::after{ + right: 14px; + top: 8px; + width: 24px; + height: 24px; + background: url(../assets/img/img-userProfile.png) center center no-repeat; + border: 0; + border-radius: 50%; +} + + + + + + + + + + + +
\ No newline at end of file diff --git a/cds-ui/client-frankfurt/src/app/app.component.html b/cds-ui/client-frankfurt/src/app/app.component.html new file mode 100644 index 000000000..b89b29573 --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/app.component.html @@ -0,0 +1,81 @@ +<div class="primary-nav"> + <img class="logo-icon open-panel nav-toggle" src="../assets/img/logo-icon.svg" title="CDS"> + <nav role="navigation" class="menu"> + <img class="logotype" src="../assets/img/logo-text.svg"> + <div class="overflow-container"> + <ul class="menu-dropdown"> + <li class="active"> + <a href="packages/list">Packages</a> + <span class="icon"> + <!-- <i class="fa fa-dashboard"></i> --> + <img src="../assets/img/icon-nav-packages.svg"> + </span> + </li> + <li class="menu-hasdropdown"> + <a href="#">Data Dictionary</a> + <span class="icon"> + <img src="../assets/img/icon-nav-dictionary.svg"> + </span> + <label title="toggle menu" for="settings"> + <span class="downarrow"> + <i class="fa fa-caret-down"></i> + </span> + </label> + <input type="checkbox" class="sub-menu-checkbox" id="settings" /> + <ul class="sub-menu-dropdown"> + <li> + <a href="">Link</a> + </li> + <li> + <a href="">Link</a> + </li> + <li> + <a href="">Link</a> + </li> + </ul> + </li> + <!-- <li> + <a href="#">Favourites</a> + <span class="icon"> + <i class="fa fa-heart"></i> + </span> + </li> + <li> + <a href="#">Messages</a> + <span class="icon"> + <i class="fa fa-envelope"></i> + </span> + </li> --> + </ul> + </div> + <ul class="menu-dropdown userProfile"> + <li> + <div class="dropdown"> + <input class="dropdown-toggle" type="text"> + <div class="dropdown-text">User name</div> + <ul class="dropdown-content"> + <li> + <a href="#">Settings</a> + </li> + <li> + <a href="#">Projects</a> + </li> + <li> + <a href="#">Log out</a> + </li> + </ul> + </div> + <!-- <span class="icon"> + <img src="../assets/img/img-userProfile.png"> + </span> --> + </li> + </ul> + + </nav> +</div> + +<div class="new-wrapper"> + <div class="container-fluid main-container"> + <router-outlet></router-outlet> + </div> +</div> diff --git a/cds-ui/client-frankfurt/src/app/app.component.spec.ts b/cds-ui/client-frankfurt/src/app/app.component.spec.ts new file mode 100644 index 000000000..b015063ad --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/app.component.spec.ts @@ -0,0 +1,56 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2019 Orange. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import { TestBed, async } from '@angular/core/testing'; +import { RouterTestingModule } from '@angular/router/testing'; +import { AppComponent } from './app.component'; + +describe('AppComponent', () => { + beforeEach(async(() => { + TestBed.configureTestingModule({ + imports: [ + RouterTestingModule + ], + declarations: [ + AppComponent + ], + }).compileComponents(); + })); + + it('should create the app', () => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app).toBeTruthy(); + }); + + it(`should have as title 'client-frankfurt'`, () => { + const fixture = TestBed.createComponent(AppComponent); + const app = fixture.debugElement.componentInstance; + expect(app.title).toEqual('client-frankfurt'); + }); + + it('should render title', () => { + const fixture = TestBed.createComponent(AppComponent); + fixture.detectChanges(); + const compiled = fixture.debugElement.nativeElement; + expect(compiled.querySelector('.content span').textContent).toContain('client-frankfurt app is running!'); + }); +}); diff --git a/cds-ui/client-frankfurt/src/app/app.component.ts b/cds-ui/client-frankfurt/src/app/app.component.ts new file mode 100644 index 000000000..259653aaf --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/app.component.ts @@ -0,0 +1,32 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2019 Orange. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import { Component } from '@angular/core'; + +@Component({ + selector: 'app-root', + templateUrl: './app.component.html', + styleUrls: ['./app.component.css'] +}) + +export class AppComponent { + title = 'client-frankfurt'; +} diff --git a/cds-ui/client-frankfurt/src/app/app.module.ts b/cds-ui/client-frankfurt/src/app/app.module.ts new file mode 100644 index 000000000..66093b38c --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/app.module.ts @@ -0,0 +1,54 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2019 Orange. All rights reserved. +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ + +import {BrowserModule} from '@angular/platform-browser'; +import {NgModule} from '@angular/core'; +import {NgbModule} from '@ng-bootstrap/ng-bootstrap'; +import {AppRoutingModule} from './app-routing.module'; +import {AppComponent} from './app.component'; +import {AngularFontAwesomeModule} from 'angular-font-awesome'; +import {NoopAnimationsModule} from '@angular/platform-browser/animations'; +import {MatTabsModule} from '@angular/material/tabs'; +import {ApiService} from './common/core/services/api.service'; +import {HttpClientModule} from '@angular/common/http'; + + + +@NgModule({ + declarations: [ + AppComponent, + + + ], + imports: [ + BrowserModule, + NgbModule, + AngularFontAwesomeModule, + AppRoutingModule, + NoopAnimationsModule, + MatTabsModule, + HttpClientModule + ], + providers: [ApiService], + bootstrap: [AppComponent] +}) +export class AppModule { +} diff --git a/cds-ui/client-frankfurt/src/app/common/constants/app-constants.ts b/cds-ui/client-frankfurt/src/app/common/constants/app-constants.ts new file mode 100644 index 000000000..11d0598d9 --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/common/constants/app-constants.ts @@ -0,0 +1,114 @@ +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 IBM Intellectual Property. All rights reserved. + +Modifications Copyright (C) 2019 Orange + +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ +export const GlobalContants = { + endpoints: {}, + cbawizard: { + stepsRequired: + { + stepCount: 4, + steps: [{ + name: 'CBA Metadata', + componentURL: '/controllerBlueprint/selectTemplate', + label: 'CBA Metadata', + link: '/blueprint/selectTemplate', + index: 0, + component: 'SelectTemplateComponent' + }, + { + name: 'Controller Blueprint Designer', + componentURL: '/controllerBlueprint/modifyTemplate', + label: 'Controller Blueprint Designer', + link: '/blueprint/modifyTemplate', + index: 1, + component: 'ModifyTemplateComponent' + }, + { + name: 'Test', + componentURL: '/controllerBlueprint/testTemplate', + label: 'Test', + link: '/blueprint/testTemplate', + index: 2, + component: 'TestTemplateComponent' + }, + { + name: 'Deploy', + componentURL: '/controllerBlueprint/deployTemplate', + label: 'Deploy', + link: '/blueprint/deployTemplate', + index: 3, + component: 'DeployTemplateComponent' + }] + } + }, + datadictionary: { + stepsRequired: + { + stepCount: 3, + steps: [{ + name: 'Resource Creation', componentURL: '/dataDictionary/selectTemplate', + label: 'Resource Creation', + component: 'ResourceCreationComponent' + + }, + { + name: 'Edit/Validate', componentURL: '/dataDictionary/modifyTemplate', + label: 'Edit/Validate', + component: 'ResourceEditComponent' + }, + { + name: 'Save', componentURL: '/dataDictionary/saveTemplate', + label: 'Save Resource', + component: 'SaveResourceComponent' + }] + } + + } +}; + +export const BlueprintURLs = { + getAllBlueprints: '/controllerblueprint/all', + searchByTag: '/controllerblueprint/searchByTags/', + save: '/controllerblueprint/create-blueprint', + publish: '/controllerblueprint/publish', + enrich: '/controllerblueprint/enrich-blueprint', + download: '/controllerblueprint/download-blueprint/', + deploy: '/controllerblueprint/deploy-blueprint', + getMetaDate: '/controllerblueprint/meta-data/' +}; + +export const ResourceDictionaryURLs = { + saveResourceDictionary: '/resourcedictionary/save', + searchResourceDictionaryByTags: '/resourcedictionary/search', + searchResourceDictionaryByName: '', + getSources: '/resourcedictionary/source-mapping', + getModelType: '/resourcedictionary/model-type', + getDataType: '/resourcedictionary/model-type/by-definition/data_type' +}; + +export const ControllerCatalogURLs = { + searchControllerCatalogByTags: '/controllercatalog/search', + saveControllerCatalog: '/controllercatalog/save', + getDefinition: '/controllercatalog/model-type/by-definition', + getDerivedFrom: '/controllercatalog/model-type/by-derivedfrom' +}; diff --git a/cds-ui/client-frankfurt/src/app/common/core/services/api.service.ts b/cds-ui/client-frankfurt/src/app/common/core/services/api.service.ts new file mode 100644 index 000000000..b26558b01 --- /dev/null +++ b/cds-ui/client-frankfurt/src/app/common/core/services/api.service.ts @@ -0,0 +1,137 @@ + +/* +============LICENSE_START========================================== +=================================================================== +Copyright (C) 2018 IBM Intellectual Property. All rights reserved. + +Modifications Copyright (C) 2019 Orange + +=================================================================== + +Unless otherwise specified, all software contained herein is licensed +under the Apache License, Version 2.0 (the License); +you may not use this software except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +============LICENSE_END============================================ +*/ +export const GlobalContants = { + endpoints: {}, + cbawizard: { + stepsRequired: + { + stepCount: 4, + steps: [{ + name: 'CBA Metadata', + componentURL: '/controllerBlueprint/selectTemplate', + label: 'CBA Metadata', + link: '/blueprint/selectTemplate', + index: 0, + component: 'SelectTemplateComponent' + }, + { + name: 'Controller Blueprint Designer', + componentURL: '/controllerBlueprint/modifyTemplate', + label: 'Controller Blueprint Designer', + link: '/blueprint/modifyTemplate', + index: 1, + component: 'ModifyTemplateComponent' + }, + { + name: 'Test', + componentURL: '/controllerBlueprint/testTemplate', + label: 'Test', + link: '/blueprint/testTemplate', + index: 2, + component: 'TestTemplateComponent' + }, + { + name: 'Deploy', + componentURL: '/controllerBlueprint/deployTemplate', + label: 'Deploy', + link: '/blueprint/deployTemplate', + index: 3, + component: 'DeployTemplateComponent' + }] + } + }, + datadictionary: { + stepsRequired: + { + stepCount: 3, + steps: [{ + name: 'Resource Creation', componentURL: '/dataDictionary/selectTemplate', + label: 'Resource Creation', + component: 'ResourceCreationComponent' + + }, + { + name: 'Edit/Validate', componentURL: '/dataDictionary/modifyTemplate', + label: 'Edit/Validate', + component: 'ResourceEditComponent' + }, + { + name: 'Save', componentURL: '/dataDictionary/saveTemplate', + label: 'Save Resource', + component: 'SaveResourceComponent' + }] + } + + } +}; + +export const BlueprintURLs = { + getAllBlueprints: '/controllerblueprint/all', + searchByTag: '/controllerblueprint/searchByTags/', + save: '/controllerblueprint/create-blueprint', + publish: '/controllerblueprint/publish', + enrich: '/controllerblueprint/enrich-blueprint', + download: '/controllerblueprint/download-blueprint/', + deploy: '/controllerblueprint/deploy-blueprint', + getMetaDate: '/controllerblueprint/meta-data/' +}; + +export const ResourceDictionaryURLs = { + saveResourceDictionary: '/resourcedictionary/save', + searchResourceDictionaryByTags: '/resourcedictionary/search', + searchResourceDictionaryByName: '', + getSources: '/resourcedictionary/source-mapping', + getModelType: '/resourcedictionary/model-type', + getDataType: '/resourcedictionary/model-type/by-definition/data_type' +}; + +export const ControllerCatalogURLs = { + searchControllerCatalogByTags: '/controllercatalog/search', + saveControllerCatalog: '/controllercatalog/save', + getDefinition: '/controllercatalog/model-type/by-definition', + getDerivedFrom: '/controllercatalog/model-type/by-derivedfrom' +}; + + + +import {Injectable} from '@angular/core'; +import {HttpClient, HttpHeaders, HttpResponse, HttpHeaderResponse} from '@angular/common/http'; +import {Observable} from 'rxjs'; + +@Injectable() +export class ApiService { + + constructor(private httpClient: HttpClient) { + } + + get(url: string, params?: any): Observable<any> { + return this.httpClient.get(url, params); + } + + post(url: string, body: any | null, options?: any): Observable<any> { + + return this.httpClient.post(url, body, options); + } +} |