Added server

Client/src/app/components/settings/serverSettings/serverSettings.component.html

@@ -0,0 +1,20 @@
+<ion-list>
+  <ion-list-header>
+    <ion-label (click)="test()"> Remote Server Settings </ion-label>
+  </ion-list-header>
+  <ion-item>
+    <ion-label position="fixed">Protocol</ion-label>
+    <ion-select [value]="protocol" (ionChange)="onProtocolChange($event)">
+      <ion-select-option value="http">http</ion-select-option>
+      <ion-select-option value="https">https</ion-select-option>
+    </ion-select>
+  </ion-item>
+  <ion-item>
+    <ion-label position="fixed">Address</ion-label>
+    <ion-input placeholder="placeholder" (ionChange)="onAddressChange($event)" [value]="address"></ion-input>
+  </ion-item>
+  <ion-item>
+    <ion-label position="fixed">Port</ion-label>
+    <ion-input number placeholder="8080" (ionChange)="onPortChange($event)" [value]="port"></ion-input>
+  </ion-item>
+</ion-list>

Client/src/app/components/settings/serverSettings/serverSettings.component.spec.ts

@@ -0,0 +1,28 @@
+/* tslint:disable:no-unused-variable */
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+import { DebugElement } from '@angular/core';
+
+import { ServerSettingsComponent } from './serverSettings.component';
+
+describe('ServerSettingsComponent', () => {
+  let component: ServerSettingsComponent;
+  let fixture: ComponentFixture<ServerSettingsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ServerSettingsComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ServerSettingsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

Client/src/app/components/settings/serverSettings/serverSettings.component.ts

@@ -0,0 +1,49 @@
+import { getAddress, getPort, getProtocol } from './../../../store/gotobed.selectors';
+import { Store } from '@ngrx/store';
+
+import { Component, OnInit } from '@angular/core';
+import { PortSettingsChanged, ProtocolSettingsChanged, SaveAddressSettings } from 'src/app/store/gotobed.actions';
+import { GotobedState } from 'src/app/store/gotobed.state';
+import { InputCustomEvent } from 'src/app/gotobed.models';
+
+@Component({
+  selector: 'app-serversettings',
+  templateUrl: './serverSettings.component.html',
+  styleUrls: ['./serverSettings.component.scss']
+})
+export class ServerSettingsComponent implements OnInit{
+
+  constructor(private _store: Store<GotobedState>) { }
+
+  port = null;
+  address = "";
+  protocol = "";
+
+  ngOnInit() {
+    console.log("#Render server settings");
+    this._store
+      .select(getPort)
+      .subscribe(port => (this.port = port));
+
+    this._store
+      .select(getAddress)
+      .subscribe(address => (this.address = address));
+
+    this._store
+      .select(getProtocol)
+      .subscribe(protocol => (this.protocol = protocol));
+  }
+
+  onProtocolChange(protocol: InputCustomEvent){
+    console.log(protocol.detail.value) 
+    this._store.dispatch(new ProtocolSettingsChanged(protocol.detail.value));
+  }
+  onAddressChange(address: InputCustomEvent){
+    console.log(address.detail.value)
+    this._store.dispatch(new SaveAddressSettings(address.detail.value));
+  }
+  onPortChange(port: InputCustomEvent){
+    console.log(port.detail.value) 
+    this._store.dispatch(new PortSettingsChanged(port.detail.value));
+  }
+}