-
-
-
-
-
-
- Useful shortcuts
-
-
- ctrl + + to zoom in
- ctrl + - to zoom out
- ctrl + 0 to reset zoom
- ctrl + h to hide toolbar
- ctrl + a to select all items on map
- ctrl + shift + a to deselect all items on map
- ctrl + shift + s to go to preferences
-
-
-
-
- Third party components
-
-
-
-
-
- Release notes
-
-
-
-
-
+
+
+
+
+
+
+ Useful shortcuts
+
+
+ ctrl + + to zoom in
+ ctrl + - to zoom out
+ ctrl + 0 to reset zoom
+ ctrl + h to hide toolbar
+ ctrl + a to select all items on map
+ ctrl + shift + a to deselect all items on map
+ ctrl + shift + s to go to preferences
+
+
+
+
+ Third party components
+
+
+
+
+
+ Release notes
+
+
+
+
+
+
+
diff --git a/src/app/components/help/help.component.scss b/src/app/components/help/help.component.scss
index e69de29b..d6a023a9 100644
--- a/src/app/components/help/help.component.scss
+++ b/src/app/components/help/help.component.scss
@@ -0,0 +1,4 @@
+.full-width {
+ width: 50%;
+ margin-top: 20px;
+}
diff --git a/src/app/components/help/help.component.ts b/src/app/components/help/help.component.ts
index 512a9d21..032c5793 100644
--- a/src/app/components/help/help.component.ts
+++ b/src/app/components/help/help.component.ts
@@ -1,33 +1,31 @@
-import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
+import { Component, OnInit } from '@angular/core';
@Component({
-selector: 'app-help',
-templateUrl: './help.component.html',
-styleUrls: ['./help.component.scss']
+ selector: 'app-help',
+ templateUrl: './help.component.html',
+ styleUrls: ['./help.component.scss'],
})
export class HelpComponent implements OnInit {
- thirdpartylicenses = '';
- releasenotes = '';
+ thirdpartylicenses = '';
+ releasenotes = '';
- constructor(
- private httpClient: HttpClient
- ) {}
+ constructor(private httpClient: HttpClient) {}
- ngOnInit() {
- this.httpClient.get(window.location.href + '/3rdpartylicenses.txt', {responseType: 'text'})
- .subscribe(data => {
- this.thirdpartylicenses = data.replace(new RegExp('\n', 'g'), "
")
- },
- error => {
- if (error.status === 404) {
- this.thirdpartylicenses = 'File not found';
- }
- });
+ ngOnInit() {
+ this.httpClient.get(window.location.href + '/3rdpartylicenses.txt', { responseType: 'text' }).subscribe(
+ (data) => {
+ this.thirdpartylicenses = data.replace(new RegExp('\n', 'g'), '
');
+ },
+ (error) => {
+ if (error.status === 404) {
+ this.thirdpartylicenses = 'File not found';
+ }
+ }
+ );
- this.httpClient.get('ReleaseNotes.txt', {responseType: 'text'})
- .subscribe(data => {
- this.releasenotes = data.replace(new RegExp('\n', 'g'), "
")
- });
- }
+ this.httpClient.get('ReleaseNotes.txt', { responseType: 'text' }).subscribe((data) => {
+ this.releasenotes = data.replace(new RegExp('\n', 'g'), '
');
+ });
+ }
}
diff --git a/src/app/components/help/report-issue/filter.tsx b/src/app/components/help/report-issue/filter.tsx
new file mode 100644
index 00000000..0ced31d4
--- /dev/null
+++ b/src/app/components/help/report-issue/filter.tsx
@@ -0,0 +1,24 @@
+import React, {Component} from "react";
+import Form from 'react-bootstrap/Form';
+
+const formGroupStyle = {
+ margin: '20px'
+};
+
+class FilterComponent extends Component
{
+ constructor(props) {
+ super(props);
+ }
+
+ render() {
+ return (
+
+
+
+
+
+ )
+ }
+}
+
+export default FilterComponent;
\ No newline at end of file
diff --git a/src/app/components/help/report-issue/issue-list.tsx b/src/app/components/help/report-issue/issue-list.tsx
new file mode 100644
index 00000000..835f6099
--- /dev/null
+++ b/src/app/components/help/report-issue/issue-list.tsx
@@ -0,0 +1,95 @@
+import React, { Component } from "react";
+import Card from 'react-bootstrap/Card';
+import Spinner from 'react-bootstrap/Spinner';
+import IssueComponent from './issue';
+import FilterComponent from './filter';
+import e from '../../../event-bus';
+
+const wrapperStyle = {
+ justifyContent: 'center' as 'center',
+ display: 'flex',
+ flex: 1,
+ flexDirection: 'row' as 'row',
+ flexWrap: 'wrap' as 'wrap',
+ margin: '20px'
+};
+
+const cardStyle = {
+ width: '300px',
+ margin: '20px'
+};
+
+const cardTitleStyle = {
+ color: 'red'
+};
+const message = 'Thank you for reporting the issue!';
+const apiUrl = 'https://api.github.com/repos/GNS3/gns3-web-ui/issues';
+const newIssueLink = 'https://github.com/GNS3/gns3-web-ui/issues/new';
+
+class IssueListComponent extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ issues: [],
+ filteredIssues: [],
+ isFetching: true
+ };
+ }
+
+ componentDidMount() {
+ fetch(apiUrl)
+ .then(response => response.json())
+ .then(data => this.setState({
+ issues: data,
+ filteredIssues: data,
+ isFetching: false
+ }));
+ }
+
+ handleChange = (event) => {
+ let filter = event.target.value;
+ let filteredIssues = this.state.issues;
+
+ filteredIssues = filteredIssues.filter((issue) => {
+ return issue.title.toLowerCase().includes(filter.toLowerCase())
+ });
+
+ this.setState({
+ filteredIssues: filteredIssues
+ });
+ }
+
+ newIssueOpened = (event) => {
+ e.emit('message', { text: message });
+ }
+
+ render() {
+ return (
+
+
+
+
+
+ {this.state.isFetching ? (
+
+
+
+ ) : (
+
+ {this.state.filteredIssues.map(issue =>
+
+ )}
+
+
+ Don't see your issue here?
+ Open new issue
+
+
+
+ )}
+
+
+
, this.containerRef.nativeElement);
+ }
+}
diff --git a/src/app/components/installed-software/install-software/install-software.component.html b/src/app/components/installed-software/install-software/install-software.component.html
index dba60bbf..d6140ef6 100644
--- a/src/app/components/installed-software/install-software/install-software.component.html
+++ b/src/app/components/installed-software/install-software/install-software.component.html
@@ -1,3 +1,3 @@
\ No newline at end of file
+
diff --git a/src/app/components/installed-software/install-software/install-software.component.spec.ts b/src/app/components/installed-software/install-software/install-software.component.spec.ts
index 33f9e4df..9d88320e 100644
--- a/src/app/components/installed-software/install-software/install-software.component.spec.ts
+++ b/src/app/components/installed-software/install-software/install-software.component.spec.ts
@@ -1,5 +1,4 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
import { InstallSoftwareComponent } from './install-software.component';
describe('InstallSoftwareComponent', () => {
@@ -8,9 +7,8 @@ describe('InstallSoftwareComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
- declarations: [ InstallSoftwareComponent ]
- })
- .compileComponents();
+ declarations: [InstallSoftwareComponent],
+ }).compileComponents();
}));
beforeEach(() => {
diff --git a/src/app/components/installed-software/install-software/install-software.component.ts b/src/app/components/installed-software/install-software/install-software.component.ts
index 88733ada..7e1cd18a 100644
--- a/src/app/components/installed-software/install-software/install-software.component.ts
+++ b/src/app/components/installed-software/install-software/install-software.component.ts
@@ -1,10 +1,10 @@
-import { Component, OnInit, Output, EventEmitter, Input, OnDestroy, OnChanges } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output } from '@angular/core';
import { ElectronService } from 'ngx-electron';
@Component({
selector: 'app-install-software',
templateUrl: './install-software.component.html',
- styleUrls: ['./install-software.component.scss']
+ styleUrls: ['./install-software.component.scss'],
})
export class InstallSoftwareComponent implements OnInit, OnDestroy, OnChanges {
@Input('software')
@@ -12,14 +12,12 @@ export class InstallSoftwareComponent implements OnInit, OnDestroy, OnChanges {
@Output()
installedChanged = new EventEmitter();
-
+
public disabled = false;
public readyToInstall = true;
public buttonText: string;
- constructor(
- private electronService: ElectronService
- ) { }
+ constructor(private electronService: ElectronService) {}
ngOnInit() {
this.electronService.ipcRenderer.on(this.responseChannel, (event, data) => {
@@ -38,7 +36,7 @@ export class InstallSoftwareComponent implements OnInit, OnDestroy, OnChanges {
install() {
this.disabled = true;
- this.buttonText = "Installing";
+ this.buttonText = 'Installing';
this.electronService.ipcRenderer.send('installed-software-install', this.software);
}
@@ -50,10 +48,9 @@ export class InstallSoftwareComponent implements OnInit, OnDestroy, OnChanges {
this.disabled = this.software.installed;
if (this.software.installed) {
- this.buttonText = "Installed";
- }
- else {
- this.buttonText = "Install";
+ this.buttonText = 'Installed';
+ } else {
+ this.buttonText = 'Install';
}
}
}
diff --git a/src/app/components/installed-software/installed-software.component.html b/src/app/components/installed-software/installed-software.component.html
index f81d01e4..1cd1f121 100644
--- a/src/app/components/installed-software/installed-software.component.html
+++ b/src/app/components/installed-software/installed-software.component.html
@@ -1,36 +1,37 @@
-
-
-
-
-
-
- Name
-
-
- {{ row.name }}
-
+
+
+
+
+
+ Name
+
+
+ {{ row.name }}
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
\ No newline at end of file
+
diff --git a/src/app/components/installed-software/installed-software.component.spec.ts b/src/app/components/installed-software/installed-software.component.spec.ts
index c52bc58a..d1c8d2ea 100644
--- a/src/app/components/installed-software/installed-software.component.spec.ts
+++ b/src/app/components/installed-software/installed-software.component.spec.ts
@@ -1,5 +1,4 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
import { InstalledSoftwareComponent } from './installed-software.component';
describe('InstalledSoftwareComponent', () => {
@@ -8,9 +7,8 @@ describe('InstalledSoftwareComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
- declarations: [ InstalledSoftwareComponent ]
- })
- .compileComponents();
+ declarations: [InstalledSoftwareComponent],
+ }).compileComponents();
}));
beforeEach(() => {
diff --git a/src/app/components/installed-software/installed-software.component.ts b/src/app/components/installed-software/installed-software.component.ts
index 8ebdb4b0..17f58e35 100644
--- a/src/app/components/installed-software/installed-software.component.ts
+++ b/src/app/components/installed-software/installed-software.component.ts
@@ -1,12 +1,12 @@
-import { Component, OnInit, ChangeDetectorRef } from '@angular/core';
-import { InstalledSoftwareService } from '../../services/installed-software.service';
import { DataSource } from '@angular/cdk/table';
-import { Observable, of, BehaviorSubject } from 'rxjs';
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { BehaviorSubject, Observable } from 'rxjs';
+import { InstalledSoftwareService } from '../../services/installed-software.service';
@Component({
selector: 'app-installed-software',
templateUrl: './installed-software.component.html',
- styleUrls: ['./installed-software.component.scss']
+ styleUrls: ['./installed-software.component.scss'],
})
export class InstalledSoftwareComponent implements OnInit {
dataSource: InstalledSoftwareDataSource;
@@ -15,7 +15,7 @@ export class InstalledSoftwareComponent implements OnInit {
constructor(
private installedSoftwareService: InstalledSoftwareService,
private changeDetectorRef: ChangeDetectorRef
- ) { }
+ ) {}
ngOnInit() {
this.dataSource = new InstalledSoftwareDataSource(this.installedSoftwareService);
@@ -32,7 +32,7 @@ export class InstalledSoftwareComponent implements OnInit {
}
}
-export class InstalledSoftwareDataSource extends DataSource
 {
+export class InstalledSoftwareDataSource extends DataSource {
installed = new BehaviorSubject([]);
constructor(private installedSoftwareService: InstalledSoftwareService) {
@@ -49,9 +49,8 @@ export class InstalledSoftwareDataSource extends DataSource {
refresh() {
let installedSoftware = this.installedSoftwareService.list();
installedSoftware.push({
- type: 'adbutler'
+ type: 'adbutler',
});
this.installed.next(installedSoftware);
}
-
}
diff --git a/src/app/components/notification-box/notification-box.component.html b/src/app/components/notification-box/notification-box.component.html
deleted file mode 100644
index 350fe7ce..00000000
--- a/src/app/components/notification-box/notification-box.component.html
+++ /dev/null
@@ -1,9 +0,0 @@
-
diff --git a/src/app/components/notification-box/notification-box.component.scss b/src/app/components/notification-box/notification-box.component.scss
deleted file mode 100644
index da396715..00000000
--- a/src/app/components/notification-box/notification-box.component.scss
+++ /dev/null
@@ -1,39 +0,0 @@
-.notification-box {
- position: fixed;
- bottom: 20px;
- right: 20px;
- width: 412px;
- height: 108px;
-}
-
-.content {
- background-color: #263238;
- padding-left: 8px;
- border-left: 2px solid #0097a7;
- border-right: 2px solid #0097a7;
- border-bottom: 2px solid #0097a7;
-}
-
-.lightTheme {
- background-color: white!important;
-}
-
-.close-button {
- position: fixed;
- bottom: 90px;
- right: 30px;
- cursor: pointer;
-}
-
-.mat-icon:hover {
- color: #0097a7;
-}
-
-.check-button {
- background-color: #0097a7;
- margin-top: -10px;
-}
-
-.hidden {
- visibility: hidden;
-}
diff --git a/src/app/components/notification-box/notification-box.component.ts b/src/app/components/notification-box/notification-box.component.ts
deleted file mode 100644
index e2768f54..00000000
--- a/src/app/components/notification-box/notification-box.component.ts
+++ /dev/null
@@ -1,114 +0,0 @@
-import { Component, OnInit, OnDestroy, ComponentFactoryResolver, ViewContainerRef, ViewChild } from '@angular/core';
-import { timer, Observable, Subscription } from 'rxjs';
-import { ThemeService } from '../../services/theme.service';
-import { AdbutlerComponent } from '../adbutler/adbutler.component';
-import { Router } from '@angular/router';
-import { Location } from '@angular/common';
-
-@Component({
- selector: 'app-notification-box',
- templateUrl: './notification-box.component.html',
- styleUrls: ['./notification-box.component.scss']
-})
-export class NotificationBoxComponent implements OnInit, OnDestroy {
- @ViewChild('dynamicComponentContainer', { read: ViewContainerRef }) dynamicComponentContainer;
-
- timer: Observable;
- viewTimer: Observable;
- timerSubscription: Subscription;
- viewTimerSubscription: Subscription;
- viewsCounter = 0;
- ticks: number = 1000;
- progress: number = 0;
- isAdLoaded = false;
- isVisible = false;
- interval = 10;
-
- delayTime: number = 5000;
- breakTime: number = 20 * 60;
- isEndless: boolean = true;
-
- numberOfViews: number = 1;
- isLightThemeEnabled: boolean = false;
-
- constructor(
- private themeService: ThemeService,
- private componentFactoryResolver: ComponentFactoryResolver,
- private viewContainerRef: ViewContainerRef,
- private location: Location
- ) {}
-
- ngOnInit() {
- let adbutler = localStorage.getItem('adbutler');
- var today = new Date().toISOString().substring(0, 10);
-
- // to show ad once a day
- // if (!this.location.path().includes('nodes') && !(adbutler == today)) this.startTimer();
-
- if (!this.location.path().includes('nodes')) this.startTimer();
- this.themeService.getActualTheme() === 'light' ? this.isLightThemeEnabled = true : this.isLightThemeEnabled = false;
- }
-
- ngAfterViewInit() {
- this.createDynamicAdComponent();
- }
-
- createDynamicAdComponent() : void {
- const factory = this.componentFactoryResolver.resolveComponentFactory(AdbutlerComponent);
- const componentRef = this.dynamicComponentContainer.createComponent(factory);
- componentRef.instance.theme = this.themeService.getActualTheme() === 'light';
- componentRef.instance.onLoad.subscribe(event => {
- this.onLoadingAdbutler(event);
- })
- componentRef.changeDetectorRef.detectChanges();
- }
-
- startTimer() {
- this.timer = timer(this.delayTime, 1000);
- setTimeout(() => {
- this.showNotification();
- }, 5000);
-
- this.timerSubscription = this.timer.subscribe(() => {
- this.ticks++;
- if (this.ticks > this.breakTime && !this.isVisible && navigator.onLine && this.isAdLoaded) {
- this.ticks = 0;
- this.showNotification();
- this.viewsCounter++;
- if (!this.isEndless){
- if (this.viewsCounter === this.numberOfViews) {
- this.timerSubscription.unsubscribe();
- }
- }
- }
- });
- }
-
- onLoadingAdbutler(event) {
- this.isAdLoaded = event;
- }
-
- showNotification() {
- // localStorage.setItem('adbutler', new Date().toISOString().substring(0, 10));
-
- this.viewTimer = timer(0, 100);
- this.progress = 0;
- this.isVisible = true;
- this.viewTimerSubscription = this.viewTimer.subscribe(() => {
- this.progress += 1;
- if (this.progress > 100) {
- this.isVisible = false;
- this.viewTimerSubscription.unsubscribe();
- }
- });
- }
-
- closeNotification() {
- this.isVisible = false;
- }
-
- ngOnDestroy() {
- this.timerSubscription.unsubscribe();
- this.viewTimerSubscription.unsubscribe();
- }
-}
diff --git a/src/app/components/page-not-found/page-not-found.component.html b/src/app/components/page-not-found/page-not-found.component.html
index 0c777606..d4b33a2d 100644
--- a/src/app/components/page-not-found/page-not-found.component.html
+++ b/src/app/components/page-not-found/page-not-found.component.html
@@ -1,6 +1,7 @@
-
+
diff --git a/src/app/components/page-not-found/page-not-found.component.scss b/src/app/components/page-not-found/page-not-found.component.scss
index b3dfebed..cc26754b 100644
--- a/src/app/components/page-not-found/page-not-found.component.scss
+++ b/src/app/components/page-not-found/page-not-found.component.scss
@@ -1,3 +1,3 @@
div {
- text-align: center
+ text-align: center;
}
diff --git a/src/app/components/page-not-found/page-not-found.component.ts b/src/app/components/page-not-found/page-not-found.component.ts
index ec0871c7..db812fa7 100644
--- a/src/app/components/page-not-found/page-not-found.component.ts
+++ b/src/app/components/page-not-found/page-not-found.component.ts
@@ -1,10 +1,10 @@
import { Component } from '@angular/core';
@Component({
- selector: 'app-page-not-found',
- templateUrl: './page-not-found.component.html',
- styleUrls: ['./page-not-found.component.scss']
+ selector: 'app-page-not-found',
+ templateUrl: './page-not-found.component.html',
+ styleUrls: ['./page-not-found.component.scss'],
})
export class PageNotFoundComponent {
- constructor(){}
+ constructor() {}
}
diff --git a/src/app/components/preferences/built-in/built-in-preferences.component.html b/src/app/components/preferences/built-in/built-in-preferences.component.html
index 06e03fd3..04a5bb21 100644
--- a/src/app/components/preferences/built-in/built-in-preferences.component.html
+++ b/src/app/components/preferences/built-in/built-in-preferences.component.html
@@ -1,23 +1,23 @@
-