add StorageProvider & SettingsPage

infrastructure for persisting settings & data, needed for upcoming stuff

src/app/app.module.ts

@@ -10,6 +10,7 @@ import { TranslateHttpLoader } from '@ngx-translate/http-loader';
 import { openSenseApp } from './app.component';
 import { OtaWizardPageModule } from '../pages/ota-wizard/ota-wizard.module';
 import { BlocklyPageModule } from '../pages/blockly/blockly.module';
+import { StorageProvider } from '../providers/storage/storage';
 
 // For AoT compilation (production builds) we need to have a factory for the loader of translation files.
 // @TODO: we possibly could optimize this by using a static loader in combination with webpack:
@@ -44,6 +45,7 @@ export function createTranslateLoader(http: HttpClient) {
     StatusBar,
     SplashScreen,
     {provide: ErrorHandler, useClass: IonicErrorHandler},
+    StorageProvider,
   ]
 })
 export class AppModule {}

src/pages/settings/settings.html

@@ -0,0 +1,21 @@
+<ion-header>
+  <ion-navbar>
+    <button ion-button menuToggle>
+      <ion-icon name="menu"></ion-icon>
+    </button>
+    <ion-title>{{ 'SETTINGS.TITLE' | translate }}</ion-title>
+  </ion-navbar>
+</ion-header>
+
+<ion-content padding>
+  <ion-list inset>
+    <ion-item>
+      <ion-icon name="megaphone" item-start></ion-icon>
+      <ion-label>
+        <h2 translate>SETTINGS.LOG_OPTIN.TITLE</h2>
+        <p [innerHTML]="'SETTINGS.LOG_OPTIN.TEXT' | translate"></p>
+      </ion-label>
+      <ion-toggle (ngModelChange)="onSettingsChange('logOptin', $event)" [ngModel]="settings.logOptin"></ion-toggle>
+    </ion-item>
+  </ion-list>
+</ion-content>

src/pages/settings/settings.module.ts

@@ -0,0 +1,15 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { SettingsPage } from './settings';
+import { TranslateModule } from '@ngx-translate/core';
+
+@NgModule({
+  declarations: [
+    SettingsPage,
+  ],
+  imports: [
+    TranslateModule,
+    IonicPageModule.forChild(SettingsPage),
+  ],
+})
+export class SettingsPageModule {}

src/pages/settings/settings.scss

@@ -0,0 +1,3 @@
+page-settings {
+
+}

src/pages/settings/settings.ts

@@ -0,0 +1,23 @@
+import { Component } from '@angular/core';
+import { IonicPage } from 'ionic-angular';
+
+import { StorageProvider, SETTINGS } from '../../providers/storage/storage';
+
+
+@IonicPage()
+@Component({
+  selector: 'page-settings',
+  templateUrl: 'settings.html',
+})
+export class SettingsPage {
+  settings = {}
+
+  constructor(private storage: StorageProvider) {
+    this.settings = this.storage.get(SETTINGS)
+  }
+
+  onSettingsChange (name, value) {
+    this.settings[name] = value
+    this.storage.set(SETTINGS, this.settings)
+  }
+}

src/providers/storage/storage.ts

@@ -0,0 +1,33 @@
+import { Injectable } from '@angular/core';
+
+export const SETTINGS = 'appsettings'
+
+@Injectable()
+export class StorageProvider {
+  private cache: Map<string, any> = new Map()
+
+  constructor () {
+    this.registerKey(SETTINGS, {
+      logOptin: false,
+    })
+  }
+
+  registerKey (key, defaultValue) {
+    const stored = localStorage.getItem(key)
+    if (!stored) {
+      localStorage.setItem(key, JSON.stringify(defaultValue))
+      this.cache[key] = defaultValue
+    } else {
+      this.cache[key] = JSON.parse(stored)
+    }
+  }
+
+  get (key) {
+    return this.cache[key]
+  }
+
+  set (key, value) {
+    localStorage.setItem(key, JSON.stringify(value))
+    this.cache[key] = value
+  }
+}