From d43893528b038d7e0cad22bbd9475de1e55199ef Mon Sep 17 00:00:00 2001 From: sosguns2002 Date: Sat, 17 Mar 2018 15:05:55 +0200 Subject: [PATCH] Frontend as a Package --- interactive-mining-angular-frontend/README.md | 33 ++++++++++++++++--- .../public_api.ts | 2 +- .../src/app/app-routing.module.ts | 14 ++------ .../src/app/app.component.html | 2 +- .../src/app/app.component.ts | 15 +++++++-- .../src/app/app.module.ts | 13 ++++++-- .../configuration.component.html | 1 + .../app/configuration/configuration.module.ts | 4 ++- .../settings/settings.component.ts | 6 ++-- .../src/app/contents/contents.component.html | 1 + .../src/app/contents/contents.module.ts | 4 ++- .../contentstable/contentstable.component.ts | 6 ++-- .../interactive-mining-routing.module.ts | 30 +++++++++++++++++ ...t.css => interactive-mining.component.css} | 0 .../interactive-mining.component.html | 1 + ...s => interactive-mining.component.spec.ts} | 12 +++---- .../interactive-mining.component.ts | 17 ++++++++++ ...module.ts => interactive-mining.module.ts} | 24 +++++++------- .../interactivemining.component.html | 2 -- .../interactivemining.component.ts | 31 ----------------- .../manageprofiles.component.html | 1 + .../manageprofiles.component.ts | 12 +++---- .../manageprofiles/manageprofiles.module.ts | 6 ++-- .../manageprofiles/manageprofiles.service.ts | 2 +- .../saveprofile/saveprofile.component.html | 1 + .../app/saveprofile/saveprofile.component.ts | 6 ++-- .../src/app/saveprofile/saveprofile.module.ts | 4 ++- .../src/app/stepsnvabar/stepsnavbar.module.ts | 18 ++++++++++ .../stepsnvabar/stepsnvabar.component.html | 6 ++-- .../app/stepsnvabar/stepsnvabar.component.ts | 13 ++++---- .../src/app/util.ts | 2 +- .../src/assets/README | 15 +++++++++ 32 files changed, 200 insertions(+), 104 deletions(-) create mode 100644 interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining-routing.module.ts rename interactive-mining-angular-frontend/src/app/interactivemining/{interactivemining.component.css => interactive-mining.component.css} (100%) create mode 100644 interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.html rename interactive-mining-angular-frontend/src/app/interactivemining/{interactivemining.component.spec.ts => interactive-mining.component.spec.ts} (51%) create mode 100644 interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.ts rename interactive-mining-angular-frontend/src/app/interactivemining/{interactivemining.module.ts => interactive-mining.module.ts} (59%) delete mode 100644 interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.html delete mode 100644 interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.ts create mode 100644 interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnavbar.module.ts create mode 100644 interactive-mining-angular-frontend/src/assets/README diff --git a/interactive-mining-angular-frontend/README.md b/interactive-mining-angular-frontend/README.md index 2b14a04..9e909b5 100644 --- a/interactive-mining-angular-frontend/README.md +++ b/interactive-mining-angular-frontend/README.md @@ -2,6 +2,35 @@ This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.3.0. +# Import + +Import Module + + import {InteractiveMiningModule} from 'interactiveminingv3'; + +Place these files in your .angular-cli.json + + "styles": [ + "../node_modules/interactiveminingv3/assets/css/interactive-mining.css", + "../node_modules/interactiveminingv3/assets/css/animations.css" + ], + "scripts": [ + "../node_modules/jquery/dist/jquery.min.js", + "../node_modules/uikit/dist/js/uikit.min.js", + "../node_modules/uikit/dist/js/uikit-icons.min.js", + "../node_modules/interactiveminingv3/assets/js/ResizeSensor.js", + "../node_modules/interactiveminingv3/assets/js/jquery.sticky-sidebar.js" + ] + +Store to LocalStorage the Username and the Backend + + localStorage.setItem('user_id', this._userid); + localStorage.setItem('mining_backend_address', this._backendserveraddress); + +# Usage + +Navigate to `http://.../mining` with your project's router + ## Development server Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. @@ -22,7 +51,3 @@ Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github. Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/). Before running the tests make sure you are serving the app via `ng serve`. - -## Further help - -To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md). diff --git a/interactive-mining-angular-frontend/public_api.ts b/interactive-mining-angular-frontend/public_api.ts index ee00306..5240652 100644 --- a/interactive-mining-angular-frontend/public_api.ts +++ b/interactive-mining-angular-frontend/public_api.ts @@ -1 +1 @@ -export * from './src/app/interactivemining/interactivemining.module'; +export * from './src/app/interactivemining/interactive-mining.module'; diff --git a/interactive-mining-angular-frontend/src/app/app-routing.module.ts b/interactive-mining-angular-frontend/src/app/app-routing.module.ts index 7ac27ba..1a67502 100644 --- a/interactive-mining-angular-frontend/src/app/app-routing.module.ts +++ b/interactive-mining-angular-frontend/src/app/app-routing.module.ts @@ -1,20 +1,12 @@ import { NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; -import {ContentComponent} from './contents/contents.component'; -import {ConfigurationComponent} from './configuration/configuration.component'; -import {SaveprofileComponent} from './saveprofile/saveprofile.component'; -import {ManageprofilesComponent} from './manageprofiles/manageprofiles.component'; -export const InteractiveMiningRoutes: Routes = [ - { path: '', redirectTo: '/manage-profiles', pathMatch: 'full' }, - { path: 'manage-profiles', component: ManageprofilesComponent }, - { path: 'upload-content', component: ContentComponent }, - { path: 'configure-profile', component: ConfigurationComponent }, - { path: 'save-profile', component: SaveprofileComponent } +export const AppRoutes: Routes = [ + { path: '', redirectTo: '/mining', pathMatch: 'full' } ]; @NgModule({ - imports: [ RouterModule.forRoot(InteractiveMiningRoutes) ], + imports: [ RouterModule.forRoot(AppRoutes) ], exports: [ RouterModule ] }) export class AppRoutingModule { } diff --git a/interactive-mining-angular-frontend/src/app/app.component.html b/interactive-mining-angular-frontend/src/app/app.component.html index cc7d99a..0680b43 100644 --- a/interactive-mining-angular-frontend/src/app/app.component.html +++ b/interactive-mining-angular-frontend/src/app/app.component.html @@ -1 +1 @@ - + diff --git a/interactive-mining-angular-frontend/src/app/app.component.ts b/interactive-mining-angular-frontend/src/app/app.component.ts index 7b0f672..c0f6a81 100644 --- a/interactive-mining-angular-frontend/src/app/app.component.ts +++ b/interactive-mining-angular-frontend/src/app/app.component.ts @@ -1,10 +1,21 @@ -import { Component } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) -export class AppComponent { +export class AppComponent implements OnInit { + + private _userid = 'user5649231'; + private _backendserveraddress = 'http://localhost:8080'; + title = 'app'; + + ngOnInit() { + localStorage.setItem('user_id', this._userid); + console.log(localStorage.getItem('user_id'), this._userid); + localStorage.setItem('mining_backend_address', this._backendserveraddress); + console.log(localStorage.getItem('mining_backend_address'), this._backendserveraddress); + } } diff --git a/interactive-mining-angular-frontend/src/app/app.module.ts b/interactive-mining-angular-frontend/src/app/app.module.ts index 584d9e9..b00eed8 100644 --- a/interactive-mining-angular-frontend/src/app/app.module.ts +++ b/interactive-mining-angular-frontend/src/app/app.module.ts @@ -1,16 +1,25 @@ import {NgModule} from '@angular/core'; import {AppComponent} from './app.component'; -import {InteractiveMiningModule} from './interactivemining/interactivemining.module'; +import {AppRoutingModule} from './app-routing.module'; +import {Router} from '@angular/router'; +import {BrowserModule} from '@angular/platform-browser'; +import {InteractiveMiningModule} from './interactivemining/interactive-mining.module'; @NgModule({ declarations: [ AppComponent ], imports: [ - InteractiveMiningModule + BrowserModule, + InteractiveMiningModule, + AppRoutingModule ], bootstrap: [AppComponent] }) export class AppModule { + // Diagnostic only: inspect router configuration + constructor(router: Router) { + console.log('Routes: ', JSON.stringify(router.config, undefined, 2)); + } } diff --git a/interactive-mining-angular-frontend/src/app/configuration/configuration.component.html b/interactive-mining-angular-frontend/src/app/configuration/configuration.component.html index 1d5256d..5f813f1 100644 --- a/interactive-mining-angular-frontend/src/app/configuration/configuration.component.html +++ b/interactive-mining-angular-frontend/src/app/configuration/configuration.component.html @@ -1,3 +1,4 @@ +
diff --git a/interactive-mining-angular-frontend/src/app/configuration/configuration.module.ts b/interactive-mining-angular-frontend/src/app/configuration/configuration.module.ts index 455b1af..bd9732e 100644 --- a/interactive-mining-angular-frontend/src/app/configuration/configuration.module.ts +++ b/interactive-mining-angular-frontend/src/app/configuration/configuration.module.ts @@ -5,12 +5,14 @@ import { ConfigurationComponent } from './configuration.component'; import { SettingsComponent } from './settings/settings.component'; import { ResultspreviewComponent } from './resultspreview/resultspreview.component'; import {ConfigurationService} from './configuration.service'; +import {StepsnavbarModule} from '../stepsnvabar/stepsnavbar.module'; @NgModule({ imports: [ CommonModule, FormsModule, - ReactiveFormsModule + ReactiveFormsModule, + StepsnavbarModule ], exports: [ ConfigurationComponent diff --git a/interactive-mining-angular-frontend/src/app/configuration/settings/settings.component.ts b/interactive-mining-angular-frontend/src/app/configuration/settings/settings.component.ts index 032eca5..2915a9d 100644 --- a/interactive-mining-angular-frontend/src/app/configuration/settings/settings.component.ts +++ b/interactive-mining-angular-frontend/src/app/configuration/settings/settings.component.ts @@ -3,7 +3,7 @@ import {Settings} from './settings'; import {Phrase} from './phrase'; import {FormBuilder, FormGroup, Validators} from '@angular/forms'; import {ConfigurationService} from '../configuration.service'; -import {Router} from '@angular/router'; +import {ActivatedRoute, Router} from '@angular/router'; @Component({ selector: 'app-settings', @@ -31,7 +31,7 @@ export class SettingsComponent implements OnInit { { value: 'lowercase', display: ' lowercase' } ]; - constructor(private formBuilder: FormBuilder, private router: Router, private configurationService: ConfigurationService) { } + constructor(private formBuilder: FormBuilder, private route: ActivatedRoute, private router: Router, private configurationService: ConfigurationService) { } ngOnInit() { this.positivePhraseForm = this.formBuilder.group({ @@ -245,7 +245,7 @@ export class SettingsComponent implements OnInit { saveProfile(): void { this.configurationService.saveProfileParameters(this.getSettingsFromLocalStorage()) - .subscribe(() => this.router.navigate(['/save-profile'])); + .subscribe(() => this.router.navigate(['../save-profile'], {relativeTo: this.route})); } } diff --git a/interactive-mining-angular-frontend/src/app/contents/contents.component.html b/interactive-mining-angular-frontend/src/app/contents/contents.component.html index 68a895e..3cb123c 100644 --- a/interactive-mining-angular-frontend/src/app/contents/contents.component.html +++ b/interactive-mining-angular-frontend/src/app/contents/contents.component.html @@ -1,3 +1,4 @@ +
diff --git a/interactive-mining-angular-frontend/src/app/contents/contents.module.ts b/interactive-mining-angular-frontend/src/app/contents/contents.module.ts index cb97f9e..e37ed68 100644 --- a/interactive-mining-angular-frontend/src/app/contents/contents.module.ts +++ b/interactive-mining-angular-frontend/src/app/contents/contents.module.ts @@ -6,6 +6,7 @@ import { ContentComponent } from './contents.component'; import {ContentsService} from './contents.service'; import {FileUploadDirective} from '../file-upload.directive'; import {AutosizeDirective} from './autosize.directive'; +import {StepsnavbarModule} from '../stepsnvabar/stepsnavbar.module'; @NgModule({ exports: [ @@ -16,7 +17,8 @@ import {AutosizeDirective} from './autosize.directive'; ], imports: [ CommonModule, - FormsModule + FormsModule, + StepsnavbarModule ], declarations: [ ContentstableComponent, diff --git a/interactive-mining-angular-frontend/src/app/contents/contentstable/contentstable.component.ts b/interactive-mining-angular-frontend/src/app/contents/contentstable/contentstable.component.ts index f7f0876..c3ace3d 100644 --- a/interactive-mining-angular-frontend/src/app/contents/contentstable/contentstable.component.ts +++ b/interactive-mining-angular-frontend/src/app/contents/contentstable/contentstable.component.ts @@ -1,7 +1,7 @@ import {Component, OnInit, ViewChildren} from '@angular/core'; import { Content } from '../content'; import {ContentsService} from '../contents.service'; -import {Router} from '@angular/router'; +import {ActivatedRoute, Router} from '@angular/router'; @Component({ selector: 'app-contentstable', @@ -16,7 +16,7 @@ export class ContentstableComponent implements OnInit { results = ''; @ViewChildren('focusOnNew') focusOnNewInputs; - constructor(private contentsService: ContentsService, private router: Router) { } + constructor(private contentsService: ContentsService, private route: ActivatedRoute, private router: Router) { } ngOnInit() { this.getContent(); @@ -98,7 +98,7 @@ export class ContentstableComponent implements OnInit { this.contentsService.updateContent(this.contentArray) .subscribe(value => { localStorage.setItem('concepts', value); - this.router.navigate(['/configure-profile']); + this.router.navigate(['../configure-profile'], {relativeTo: this.route}); }); } diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining-routing.module.ts b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining-routing.module.ts new file mode 100644 index 0000000..8c4a27b --- /dev/null +++ b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining-routing.module.ts @@ -0,0 +1,30 @@ +import { NgModule } from '@angular/core'; +import {RouterModule, Routes} from '@angular/router'; +import {SaveprofileComponent} from '../saveprofile/saveprofile.component'; +import {ConfigurationComponent} from '../configuration/configuration.component'; +import {ContentComponent} from '../contents/contents.component'; +import {ManageprofilesComponent} from '../manageprofiles/manageprofiles.component'; +import {InteractiveMiningComponent} from './interactive-mining.component'; + +const interactiveMiningRoutes: Routes = [ + { + path: 'mining', + component: InteractiveMiningComponent, + children: [ + { path: 'manage-profiles', component: ManageprofilesComponent }, + { path: 'upload-content', component: ContentComponent }, + { path: 'configure-profile', component: ConfigurationComponent }, + { path: 'save-profile', component: SaveprofileComponent } + ] + } +]; + +@NgModule({ + imports: [ + RouterModule.forChild(interactiveMiningRoutes) + ], + exports: [ + RouterModule + ] +}) +export class InteractiveMiningRoutingModule { } diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.css b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.css similarity index 100% rename from interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.css rename to interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.css diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.html b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.html new file mode 100644 index 0000000..0680b43 --- /dev/null +++ b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.html @@ -0,0 +1 @@ + diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.spec.ts b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.spec.ts similarity index 51% rename from interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.spec.ts rename to interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.spec.ts index 2aae1cc..acd77f9 100644 --- a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.spec.ts +++ b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.spec.ts @@ -1,20 +1,20 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { InteractiveminingComponent } from './interactivemining.component'; +import { InteractiveMiningComponent } from './interactive-mining.component'; -describe('InteractiveminingComponent', () => { - let component: InteractiveminingComponent; - let fixture: ComponentFixture; +describe('InteractiveMiningComponent', () => { + let component: InteractiveMiningComponent; + let fixture: ComponentFixture; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ InteractiveminingComponent ] + declarations: [ InteractiveMiningComponent ] }) .compileComponents(); })); beforeEach(() => { - fixture = TestBed.createComponent(InteractiveminingComponent); + fixture = TestBed.createComponent(InteractiveMiningComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.ts b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.ts new file mode 100644 index 0000000..9c01837 --- /dev/null +++ b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; +import {ActivatedRoute, Router} from '@angular/router'; + +@Component({ + selector: 'app-interactive-mining', + templateUrl: './interactive-mining.component.html', + styleUrls: ['./interactive-mining.component.css'] +}) +export class InteractiveMiningComponent implements OnInit { + + constructor(private route: ActivatedRoute, private router: Router) { } + + ngOnInit() { + this.router.navigate(['manage-profiles'], {relativeTo: this.route}); + } + +} diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.module.ts b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.module.ts similarity index 59% rename from interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.module.ts rename to interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.module.ts index c4241c5..cae3106 100644 --- a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.module.ts +++ b/interactive-mining-angular-frontend/src/app/interactivemining/interactive-mining.module.ts @@ -1,32 +1,30 @@ import {NgModule} from '@angular/core'; import {CommonModule} from '@angular/common'; -import {InteractiveminingComponent} from './interactivemining.component'; import {ConfigurationModule} from '../configuration/configuration.module'; -import {ManagprofilesModule} from '../manageprofiles/manageprofiles.module'; +import {ManageprofilesModule} from '../manageprofiles/manageprofiles.module'; import {SaveprofileModule} from '../saveprofile/saveprofile.module'; -import {BrowserModule} from '@angular/platform-browser'; import {ContentModule} from '../contents/contents.module'; -import {AppRoutingModule} from '../app-routing.module'; import {HttpClientModule} from '@angular/common/http'; -import {StepsnvabarComponent} from '../stepsnvabar/stepsnvabar.component'; +import {AppRoutingModule} from '../app-routing.module'; +import {InteractiveMiningRoutingModule} from './interactive-mining-routing.module'; +import {InteractiveMiningComponent} from './interactive-mining.component'; @NgModule({ imports: [ CommonModule, - BrowserModule, - ManagprofilesModule, + InteractiveMiningRoutingModule, + ManageprofilesModule, ContentModule, ConfigurationModule, SaveprofileModule, HttpClientModule, - AppRoutingModule - ], - exports: [ - InteractiveminingComponent + AppRoutingModule, ], declarations: [ - InteractiveminingComponent, - StepsnvabarComponent + InteractiveMiningComponent + ], + exports: [ + InteractiveMiningComponent ] }) export class InteractiveMiningModule { diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.html b/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.html deleted file mode 100644 index 01f14ce..0000000 --- a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.html +++ /dev/null @@ -1,2 +0,0 @@ - - diff --git a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.ts b/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.ts deleted file mode 100644 index 36ff692..0000000 --- a/interactive-mining-angular-frontend/src/app/interactivemining/interactivemining.component.ts +++ /dev/null @@ -1,31 +0,0 @@ -import {Component, Input, OnInit} from '@angular/core'; - -@Component({ - selector: 'app-interactivemining', - templateUrl: './interactivemining.component.html', - styleUrls: ['./interactivemining.component.css'] -}) -export class InteractiveminingComponent implements OnInit { - - private _userid = 'None'; - private _backendserveraddress = 'None'; - - constructor() { } - - ngOnInit() { - } - - @Input('userid') - set userid(userid: string) { - localStorage.setItem('user_id', userid); - this._userid = userid; - } - - @Input('backendserveraddress') - set backendserveraddress(backendserveraddress: string) { - localStorage.setItem('backendaddress', backendserveraddress); - this._backendserveraddress = backendserveraddress; - - } - -} diff --git a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.html b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.html index 93098bb..cac9f3a 100644 --- a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.html +++ b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.html @@ -1,3 +1,4 @@ +

Your mining profiles

diff --git a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.ts b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.ts index 1e7a4b5..81978a0 100644 --- a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.ts +++ b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.component.ts @@ -1,6 +1,6 @@ import {Component, OnInit} from '@angular/core'; import {ManageprofilesService} from './manageprofiles.service'; -import {Router} from '@angular/router'; +import {ActivatedRoute, Router} from '@angular/router'; import UIkit from 'uikit'; import {PaginationInstance} from 'ngx-pagination'; import {ProfileMetadata} from './profile-metadata'; @@ -25,7 +25,7 @@ export class ManageprofilesComponent implements OnInit { currentPage: 1 }; - constructor(private manageProfilesService: ManageprofilesService, private router: Router) { + constructor(private manageProfilesService: ManageprofilesService, private route: ActivatedRoute, private router: Router) { } ngOnInit() { @@ -71,7 +71,7 @@ export class ManageprofilesComponent implements OnInit { localStorage.setItem('punctuation', res.punctuation); localStorage.setItem('stopwords', res.stopwords); localStorage.setItem('lettercase', res.lettercase); - this.router.navigate(['/upload-content']); + this.router.navigate(['../upload-content'], {relativeTo: this.route}); }); } @@ -94,7 +94,7 @@ export class ManageprofilesComponent implements OnInit { // clear localstorage values this.clearLocalStorage(); this.manageProfilesService.createNewProfile() - .subscribe(() => this.router.navigate(['/upload-content'])); + .subscribe(() => this.router.navigate(['../upload-content'], {relativeTo: this.route})); } fileChangeUpload(event): void { @@ -118,7 +118,7 @@ export class ManageprofilesComponent implements OnInit { localStorage.setItem('punctuation', res.punctuation); localStorage.setItem('stopwords', res.stopwords); localStorage.setItem('lettercase', res.lettercase); - this.router.navigate(['/upload-content']); + this.router.navigate(['../upload-content'], {relativeTo: this.route}); }); } } @@ -148,7 +148,7 @@ export class ManageprofilesComponent implements OnInit { localStorage.setItem('punctuation', res.punctuation); localStorage.setItem('stopwords', res.stopwords); localStorage.setItem('lettercase', res.lettercase); - this.router.navigate(['/upload-content']); + this.router.navigate(['../upload-content'], {relativeTo: this.route}); }); } diff --git a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.module.ts b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.module.ts index 59e073f..e0a3bb7 100644 --- a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.module.ts +++ b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.module.ts @@ -4,12 +4,14 @@ import { CommonModule } from '@angular/common'; import { ManageprofilesComponent } from './manageprofiles.component'; import { NgxPaginationModule } from 'ngx-pagination'; import { ManageprofilesService } from './manageprofiles.service'; +import {StepsnavbarModule} from '../stepsnvabar/stepsnavbar.module'; @NgModule({ imports: [ CommonModule, FormsModule, - NgxPaginationModule + NgxPaginationModule, + StepsnavbarModule ], exports: [ ManageprofilesComponent @@ -19,4 +21,4 @@ import { ManageprofilesService } from './manageprofiles.service'; ], declarations: [ManageprofilesComponent] }) -export class ManagprofilesModule { } +export class ManageprofilesModule { } diff --git a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.service.ts b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.service.ts index bdc222e..1a516aa 100644 --- a/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.service.ts +++ b/interactive-mining-angular-frontend/src/app/manageprofiles/manageprofiles.service.ts @@ -36,7 +36,7 @@ export class ManageprofilesService { downloadProfile(profileId: string): Observable { return this.http.post(this.backendServerAddress + this.downloadProfileUrl, - {user: this.userId, id: profileId}, {responseType: 'blob', withCredentials: true}) + {user: this.userId, id: profileId}, {responseType: 'blob'}) .catch(this.util.handleError); } diff --git a/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.html b/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.html index 5bd8ef0..cc3e07a 100644 --- a/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.html +++ b/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.html @@ -1,3 +1,4 @@ +
diff --git a/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.ts b/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.ts index 2e4405e..4952d07 100644 --- a/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.ts +++ b/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit } from '@angular/core'; import UIkit from 'uikit'; import {SaveprofileService} from './saveprofile.service'; -import {Router} from '@angular/router'; +import {ActivatedRoute, Router} from '@angular/router'; @Component({ selector: 'app-saveprofile', @@ -14,7 +14,7 @@ export class SaveprofileComponent implements OnInit { public docnName = ''; public docsNumber = 0; - constructor(private saveprofileService: SaveprofileService, private router: Router) { } + constructor(private saveprofileService: SaveprofileService, private route: ActivatedRoute, private router: Router) { } ngOnInit() { if (localStorage.getItem('profilename') && localStorage.getItem('profilename') !== 'undefined') { @@ -39,7 +39,7 @@ export class SaveprofileComponent implements OnInit { return; } else { this.saveprofileService.saveProfile(this.profileName, localStorage.getItem('profileid'), this.docnName, this.docsNumber) - .subscribe(() => this.router.navigate(['/manage-profiles'])); + .subscribe(() => this.router.navigate(['../manage-profiles'], {relativeTo: this.route})); } } diff --git a/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.module.ts b/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.module.ts index 547bfac..1ce16e5 100644 --- a/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.module.ts +++ b/interactive-mining-angular-frontend/src/app/saveprofile/saveprofile.module.ts @@ -3,11 +3,13 @@ import { FormsModule } from '@angular/forms'; import { CommonModule } from '@angular/common'; import { SaveprofileComponent } from './saveprofile.component'; import {SaveprofileService} from './saveprofile.service'; +import {StepsnavbarModule} from '../stepsnvabar/stepsnavbar.module'; @NgModule({ imports: [ CommonModule, - FormsModule + FormsModule, + StepsnavbarModule ], exports: [ SaveprofileComponent diff --git a/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnavbar.module.ts b/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnavbar.module.ts new file mode 100644 index 0000000..54b1a67 --- /dev/null +++ b/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnavbar.module.ts @@ -0,0 +1,18 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import {StepsnvabarComponent} from './stepsnvabar.component'; +import {RouterModule} from '@angular/router'; + +@NgModule({ + imports: [ + CommonModule, + RouterModule + ], + exports: [ + StepsnvabarComponent + ], + declarations: [ + StepsnvabarComponent + ] +}) +export class StepsnavbarModule { } diff --git a/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.html b/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.html index b4e44f2..ec803bb 100644 --- a/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.html +++ b/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.html @@ -30,9 +30,9 @@
diff --git a/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.ts b/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.ts index 640175b..60baf8b 100644 --- a/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.ts +++ b/interactive-mining-angular-frontend/src/app/stepsnvabar/stepsnvabar.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import {NavigationEnd, Router} from '@angular/router'; +import {ActivatedRoute, NavigationEnd, Router} from '@angular/router'; @Component({ selector: 'app-stepsnvabar', @@ -10,7 +10,7 @@ export class StepsnvabarComponent implements OnInit { private proccessStep = 0; - constructor(private router: Router) { + constructor(private route: ActivatedRoute, private router: Router) { router.events.subscribe((val) => { // see also if (val instanceof NavigationEnd) { @@ -22,11 +22,12 @@ export class StepsnvabarComponent implements OnInit { ngOnInit() {} changeStep(url: string): void { - if (url === '/upload-content') { + console.log(url); + if (url.endsWith('upload-content')) { this.proccessStep = 1; - } else if (url === '/configure-profile') { + } else if (url.endsWith('configure-profile')) { this.proccessStep = 2; - } else if (url === '/save-profile') { + } else if (url.endsWith('save-profile')) { this.proccessStep = 3; } else { this.proccessStep = 0; @@ -34,7 +35,7 @@ export class StepsnvabarComponent implements OnInit { } cancelHandle(): void { - this.router.navigate(['/manage-profiles']); + this.router.navigate(['../manage-profiles'], {relativeTo: this.route}); } } diff --git a/interactive-mining-angular-frontend/src/app/util.ts b/interactive-mining-angular-frontend/src/app/util.ts index 70490c8..1644379 100644 --- a/interactive-mining-angular-frontend/src/app/util.ts +++ b/interactive-mining-angular-frontend/src/app/util.ts @@ -28,7 +28,7 @@ export class Util { } public getBackendServerAddress(): string { - return localStorage.getItem('backendaddress'); + return localStorage.getItem('mining_backend_address'); } } diff --git a/interactive-mining-angular-frontend/src/assets/README b/interactive-mining-angular-frontend/src/assets/README new file mode 100644 index 0000000..532a1ac --- /dev/null +++ b/interactive-mining-angular-frontend/src/assets/README @@ -0,0 +1,15 @@ +HOW TO INSTALL + +Put these in .angular-cli.json + + "styles": [ + "../node_modules/interactiveminingv3/assets/css/interactive-mining.css", + "../node_modules/interactiveminingv3/assets/css/animations.css" + ] + "scripts": [ + "../node_modules/jquery/dist/jquery.min.js", + "../node_modules/uikit/dist/js/uikit.min.js", + "../node_modules/uikit/dist/js/uikit-icons.min.js", + "../node_modules/interactiveminingv3/assets/js/ResizeSensor.js", + "../node_modules/interactiveminingv3/assets/js/jquery.sticky-sidebar.js" + ] \ No newline at end of file