Merge pull request #6776 from Gamboster/v4

Feat: advanced settings added

src/app/app.module.ts

@@ -36,6 +36,7 @@ import { SendPage } from '../pages/send/send';
 import { SettingsPage } from '../pages/settings/settings';
 /* Settings */
 import { AboutPage } from '../pages/settings/about/about';
+import { AdvancedPage } from '../pages/settings/advanced/advanced';
 import { TermsOfUsePage } from '../pages/settings/about/terms-of-use/terms-of-use';
 import { AltCurrencyPage } from '../pages/settings/alt-currency/alt-currency';
 
@@ -71,6 +72,7 @@ export function createTranslateLoader(http: Http) {
     ScanPage,
     SettingsPage,
     AboutPage,
+    AdvancedPage,
     TermsOfUsePage,
     OnboardingPage,
     TourPage,
@@ -107,6 +109,7 @@ export function createTranslateLoader(http: Http) {
     SendPage,
     SettingsPage,
     AboutPage,
+    AdvancedPage,
     TermsOfUsePage,
     OnboardingPage,
     TourPage,

src/pages/settings/advanced/advanced.html

@@ -0,0 +1,54 @@
+<!--
+  Generated template for the AdvancedPage page.
+
+  See http://ionicframework.com/docs/components/#navigation for more info on
+  Ionic pages and navigation.
+-->
+<ion-header>
+
+  <ion-navbar>
+    <ion-title>Advanced</ion-title>
+  </ion-navbar>
+
+</ion-header>
+
+
+<ion-content padding>
+
+    <ion-card> 
+      <ion-card-header>
+        <div class="toggle-header">
+          <ion-label>Use Unconfirmed Funds</ion-label>
+          <ion-toggle [(ngModel)]="spendUnconfirmed" (ionChange)="spendUnconfirmedChange()" color="secondary" checked="true"></ion-toggle>
+        </div>
+      </ion-card-header>
+      <ion-card-content>
+        If enabled, wallets will also try to spend unconfirmed funds. This option may cause transaction delays.
+      </ion-card-content>
+    </ion-card>
+
+    <ion-card> 
+      <ion-card-header>
+        <div class="toggle-header">
+          <ion-label>Recent Transaction Card</ion-label>
+          <ion-toggle [(ngModel)]="recentTransactionsEnabled" (ionChange)="recentTransactionsChange()" color="secondary" checked="true"></ion-toggle>
+        </div>
+      </ion-card-header>
+      <ion-card-content>
+          If enabled, the Recent Transactions card - a list of transactions occuring across all wallets - will appear in the Home tab.
+      </ion-card-content>
+    </ion-card>
+
+      <ion-card> 
+        <ion-card-header>
+          <div class="toggle-header">
+            <ion-label>Show Next Steps Card</ion-label>
+            <ion-toggle [(ngModel)]="showNextSteps" (ionChange)="nextStepsChange()" color="secondary" checked="true"></ion-toggle>
+          </div>
+        </ion-card-header>
+        <ion-card-content>
+            If enabled, the "Next Steps Card" will appear in the Home tab.
+        </ion-card-content>
+      </ion-card>
+
+</ion-content>

src/pages/settings/advanced/advanced.scss

@@ -0,0 +1,7 @@
+page-advanced {
+	.toggle-header {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+}

src/pages/settings/advanced/advanced.ts

@@ -0,0 +1,33 @@
+import { Component } from '@angular/core';
+import { NavController, NavParams } from 'ionic-angular';
+
+@Component({
+  selector: 'page-advanced',
+  templateUrl: 'advanced.html',
+})
+export class AdvancedPage {
+
+  public spendUnconfirmed: boolean;
+  public recentTransactionsEnabled: boolean;
+  public showNextSteps: boolean;
+
+  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad AdvancedPage');
+  }
+
+  spendUnconfirmedChange() {
+    console.log("this.spendUnconfirmed", this.spendUnconfirmed);
+  }
+
+  recentTransactionsChange() {
+    console.log("this.recentTransactionsEnabled", this.recentTransactionsEnabled);    
+  }
+
+  nextStepsChange() {
+    console.log("this.showNextSteps", this.showNextSteps);    
+  }
+
+}

src/pages/settings/settings.html

@@ -80,6 +80,10 @@
     </ion-item>
 
     <ion-item-divider color="light">More</ion-item-divider>
+    <ion-item (click)="openAdvancedPage()">
+        <ion-icon name="hammer" item-start></ion-icon>
+        Advanced
+      </ion-item>
     <ion-item (click)="openAboutPage()">
       <ion-icon name="apps" item-start></ion-icon>
       About {{appName}}

src/pages/settings/settings.scss

@@ -1,3 +1,5 @@
 page-settings {
-
+  ion-item {
+		cursor: pointer;
+	}
 }

src/pages/settings/settings.ts

@@ -7,6 +7,7 @@ import { RateProvider } from '../../providers/rate/rate';
 import { AltCurrencyPage } from './alt-currency/alt-currency';
 
 import { AboutPage } from './about/about';
+import { AdvancedPage } from './advanced/advanced';
 
 @Component({
   selector: 'page-settings',
@@ -46,6 +47,10 @@ export class SettingsPage {
     this.language.set(lang);
   }
 
+  openAdvancedPage() {
+    this.navCtrl.push(AdvancedPage);
+  }
+
   openAboutPage() {
     this.navCtrl.push(AboutPage);
   }