added modal and template creation

src/app/app.module.ts

@@ -12,6 +12,7 @@ import { OtaWizardPageModule } from '../pages/ota-wizard/ota-wizard.module';
 import { BlocklyPageModule } from '../pages/blockly/blockly.module';
 import { LoggingProvider } from '../providers/logging/logging';
 import { StorageProvider } from '../providers/storage/storage';
+import { AddItemPage } from '../pages/add-item/add-item';
 
 // 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:
@@ -23,6 +24,7 @@ export function createTranslateLoader(http: HttpClient) {
 @NgModule({
   declarations: [
     openSenseApp,
+    AddItemPage
   ],
   imports: [
     HttpClientModule,
@@ -41,6 +43,7 @@ export function createTranslateLoader(http: HttpClient) {
   bootstrap: [IonicApp],
   entryComponents: [
     openSenseApp,
+    AddItemPage
   ],
   providers: [
     StatusBar,

src/pages/add-item/add-item.html

@@ -0,0 +1,29 @@
+<ion-header>
+  <ion-toolbar color="secondary">
+    <ion-title>
+      Add Item
+    </ion-title>
+      <ion-buttons end>
+        <button ion-button icon-only (click)="close()"><ion-icon name="close"></ion-icon></button>
+      </ion-buttons>
+    </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <ion-list>
+
+    <ion-item>
+      <ion-label floating>Title</ion-label>
+      <ion-input type="text" [(ngModel)]="title"></ion-input>
+    </ion-item>
+
+    <ion-item>
+      <ion-label floating>Description</ion-label>
+      <ion-input type="text" [(ngModel)]="type"></ion-input>
+    </ion-item>
+
+  </ion-list>
+
+  <button full ion-button color="secondary" (click)="saveSensor()">Save</button> 
+
+</ion-content>

src/pages/add-item/add-item.module.ts

@@ -0,0 +1,13 @@
+import { NgModule } from '@angular/core';
+import { IonicPageModule } from 'ionic-angular';
+import { AddItemPage } from './add-item';
+
+@NgModule({
+  declarations: [
+    AddItemPage,
+  ],
+  imports: [
+    IonicPageModule.forChild(AddItemPage),
+  ],
+})
+export class AddItemPageModule {}

src/pages/add-item/add-item.scss

@@ -0,0 +1,3 @@
+page-add-item {
+
+}

src/pages/add-item/add-item.ts

@@ -0,0 +1,38 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, ViewController } from 'ionic-angular';
+
+/**
+ * Generated class for the AddItemPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+@IonicPage()
+@Component({
+  selector: 'page-add-item',
+  templateUrl: 'add-item.html',
+})
+export class AddItemPage {
+
+  title:string;
+  type:string;
+  id:string;
+  constructor(public navCtrl: NavController, public view: ViewController) {
+  }
+  saveSensor(){
+    let newSensor = {
+      title:this.title,
+      type:this.type,
+      id:this.id
+    }
+    this.view.dismiss(newSensor);
+  }
+  close(){
+    this.view.dismiss();
+  }
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad AddItemPage');
+  }
+
+}

src/pages/configuration/configuration.html

@@ -16,16 +16,16 @@
           <ion-card-header>
             <ion-card-title>{{'CONFIG.WIFI' | translate}} </ion-card-title>
           </ion-card-header>
-        <ion-card-content>
+          <ion-card-content>
-          <ion-item>
+            <ion-item>
-            <ion-label>SSID</ion-label>
+              <ion-label>SSID</ion-label>
-            <ion-input [(ngModel)]="SSID" placeholder="GIATSCHOOL-NET"></ion-input>
+              <ion-input [(ngModel)]="ssid" placeholder="GIATSCHOOL-NET"></ion-input>
-          </ion-item>
+            </ion-item>
-          <ion-item>
+            <ion-item>
-            <ion-label>Password</ion-label>
+              <ion-label>Password</ion-label>
-            <ion-input [(ngModel)]="pw" placeholder="********"></ion-input>
+              <ion-input [(ngModel)]="pw" placeholder="********"></ion-input>
-          </ion-item>
+            </ion-item>
-        </ion-card-content>
+          </ion-card-content>
         </ion-card>
       </ion-col>
       <ion-col col-12 col-md-5>
@@ -34,15 +34,50 @@
             <ion-card-title>{{ 'CONFIG.IDS' | translate }}</ion-card-title>
           </ion-card-header>
           <ion-card-content>
-            <ion-item>
+            <ion-grid>
-              <ion-label>senseBoxID</ion-label>
+              <ion-row>
-              <ion-input [(ngModel)]="senseboxid" placeholder="5c4f75e83580950019240779"></ion-input>
+                <ion-item>
-            </ion-item>
+                  <ion-label>senseBoxID</ion-label>
-            <ion-item>
+                  <ion-input [(ngModel)]="senseboxid" placeholder="5c4f75e83580950019240779"></ion-input>
-              <ion-label>Temperature</ion-label>
+                </ion-item>
-              <ion-input [(ngModel)]="temp" placeholder="5c4f75e83580950019240779"></ion-input>
+              </ion-row>
-            </ion-item>
+              <ion-row *ngFor="let sensor of sensors;let i=index;let last = last">
-            <ion-item>
+                <ion-col col-10>
+                  <ion-item>
+                    <ion-label>{{sensor.title}}</ion-label>
+                    <ion-input [(ngModel)]="temp"></ion-input>
+                  </ion-item>
+                  </ion-col>
+                  <ion-col *ngIf="last" col-2>
+                    <button ion-item (click)="addSensor()">
+                      <ion-icon name="add" item-start></ion-icon>
+                    </button>
+                  </ion-col>
+              </ion-row>
+              <!-- <ion-row>
+                <ion-col col-10>
+                <ion-item>
+                  <ion-label>Temperature</ion-label>
+                  <ion-input [(ngModel)]="temp" placeholder="5c4f75e83580950019240779"></ion-input>      
+                </ion-item>    
+                </ion-col>
+                <ion-col col-2>
+                  <button ion-item (click)="addSensor()">
+                    <ion-icon (click)="addSensor()" name="add" item-start></ion-icon>
+                    <ion-label>Add sensor</ion-label>
+                  </button>
+                </ion-col>
+              </ion-row> -->
+              <ion-row>
+                <button ion-item (click)="uploadStandardSketch()">
+                  <ion-icon name="refresh" item-start></ion-icon>
+                  <ion-label>
+                    <h2 translate>CONFIG.BUTTON</h2>
+                  </ion-label>
+                </button>
+              </ion-row>
+            </ion-grid>
+            <!-- <ion-item>
               <ion-label>Humidity</ion-label>
               <ion-input [(ngModel)]="humi" placeholder="5c4f75e83580950019240779"></ion-input>
             </ion-item>
@@ -65,14 +100,9 @@
             <ion-item>
               <ion-label>PM25</ion-label>
               <ion-input [(ngModel)]="pm25" placeholder="5c4f75e83580950019240779"></ion-input>
-            </ion-item>
+            </ion-item> -->
-            <button ion-item (click)="uploadStandardSketch()">
+
-              <ion-icon name="refresh" item-start></ion-icon>
+          </ion-card-content>
-              <ion-label>
-                <h2 translate>CONFIG.BUTTON</h2>
-              </ion-label>
-            </button>
-              </ion-card-content>
         </ion-card>
       </ion-col>
     </ion-row>
@@ -82,4 +112,4 @@
       </ion-col>
     </ion-row>
   </ion-grid>
-</ion-content>
+</ion-content>

src/pages/configuration/configuration.ts

@@ -1,7 +1,8 @@
 import { Component, } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { IonicPage, NavController, NavParams, ModalController} from 'ionic-angular';
 import { OtaWizardPage } from '../ota-wizard/ota-wizard';
 import { HttpClient } from '@angular/common/http';
+import { AddItemPage } from '../add-item/add-item';
 /**
  * Generated class for the AboutPage page.
  *
@@ -15,6 +16,7 @@ import { HttpClient } from '@angular/common/http';
   templateUrl: 'configuration.html',
 })
 export class ConfigurationPage {
+  public sensors=[];
   temp : string;
   humi : string;
   lux : string;
@@ -26,12 +28,9 @@ export class ConfigurationPage {
   pressure:string;
   rain:string;
   senseboxid:string;
-  constructor(public navCtrl: NavController, public navParams: NavParams,private http:HttpClient) {
+  constructor(public navCtrl: NavController, public navParams: NavParams,private http:HttpClient,public modalCtrl:ModalController) {
   }
 
-  async launchOtaWizard () {
-
-  }
   applyTemplate(template, properties) {
     var returnValue = "";
 
@@ -42,44 +41,56 @@ export class ConfigurationPage {
         var fragmentSections = templateFragments[i].split("}@", 2);
         returnValue += properties[fragmentSections[0]];
         returnValue += fragmentSections[1];
-    }
+  }
 
     return returnValue;
 }
-  uploadStandardSketch(){
+   async uploadStandardSketch(){
-    // possily add define statements here based on inputs given or checkboxes checked 
+    var values = {
-    let sketchy = "#define HDC1080\n";
+      SSID: this.ssid,
+      PASSWORD:this.pw,
+      INGRESS_DOMAIN:"ingress.opensensemap.org",
+      SENSEBOX_ID:this.senseboxid,
+      NUM_SENSORS:6,
+      TEMPERSENSOR_ID:this.temp,
+      RELLUFSENSOR_ID:this.humi,
+      BELEUCSENSOR_ID:this.lux,
+      UVINTESENSOR_ID:this.uv,
+      LUFTDRSENOSR_ID:this.pressure,
+      REGENMSENSOR_ID:this.rain,
+      PM10SENSOR_ID:this.pm10,
+      PM25SENSOR_ID:this.pm25
+    };
     this.http.get("assets/templates/homev2Wifi.tpl",{responseType:"text"}).subscribe(data=>{
-      sketchy = sketchy+data;
+      let sketch  = this.applyTemplate(data,values);
-      var values = {
+      this.navCtrl.push(OtaWizardPage, { sketch })    
-        SSID: this.ssid,
+    })
-        PASSWORD:this.pw,
+  }
-        INGRESS_DOMAIN:"ingress.opensensemap.org",
+
-        SENSEBOX_ID:this.senseboxid,
+  addSensor(){
-        NUM_SENSORS:6,
+    console.log("adding sensor");
-        TEMPERSENSOR_ID:this.temp,
+    
-        RELLUFSENSOR_ID:this.humi,
+    let addModal = this.modalCtrl.create(AddItemPage);
-        BELEUCSENSOR_ID:this.lux,
+
-        UVINTESENSOR_ID:this.uv,
+    addModal.onDidDismiss((sensor)=>{
-        LUFTDRSENOSR_ID:this.pressure,
+      if(sensor){
-        REGENMSENSOR_ID:this.rain,
+        this.saveSensor(sensor);
-        PM10SENSOR_ID:this.pm10,
+      }
-        PM25SENSOR_ID:this.pm25
-      };
-      sketchy  = this.applyTemplate(sketchy,values);
     })
 
-    /**
+    addModal.present();
-     * Start OTA Wizard here but with the pre defined sketch here and not with the blockly sketch 
+
-     * 
+  }
-     ** 
+
-     */
+  saveSensor(sensor){
-    const sketch =  'void setup(){Serial.begin(9600);} void loop(){Serial.println("Working");}'
+    this.sensors.push(sensor);
-    this.navCtrl.push(OtaWizardPage, { sketchy })
   }
 
   ionViewDidLoad() {
-    console.log('ionViewDidLoad ConfigPage');
+    this.sensors =[
+      {title:"Temperatur",type:"temp"},
+      {title:"Temperatur",type:"temp"}
+    ]
   }
 
 }