added modal and template creation

development
Thiemann96 5 years ago
parent e93cde8675
commit 7d77abe995

@ -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,

@ -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>

@ -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 {}

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

@ -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');
}
}

@ -16,16 +16,16 @@
<ion-card-header>
<ion-card-title>{{'CONFIG.WIFI' | translate}} </ion-card-title>
</ion-card-header>
<ion-card-content>
<ion-item>
<ion-label>SSID</ion-label>
<ion-input [(ngModel)]="SSID" placeholder="GIATSCHOOL-NET"></ion-input>
</ion-item>
<ion-item>
<ion-label>Password</ion-label>
<ion-input [(ngModel)]="pw" placeholder="********"></ion-input>
</ion-item>
</ion-card-content>
<ion-card-content>
<ion-item>
<ion-label>SSID</ion-label>
<ion-input [(ngModel)]="ssid" placeholder="GIATSCHOOL-NET"></ion-input>
</ion-item>
<ion-item>
<ion-label>Password</ion-label>
<ion-input [(ngModel)]="pw" placeholder="********"></ion-input>
</ion-item>
</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-label>senseBoxID</ion-label>
<ion-input [(ngModel)]="senseboxid" placeholder="5c4f75e83580950019240779"></ion-input>
</ion-item>
<ion-item>
<ion-label>Temperature</ion-label>
<ion-input [(ngModel)]="temp" placeholder="5c4f75e83580950019240779"></ion-input>
</ion-item>
<ion-item>
<ion-grid>
<ion-row>
<ion-item>
<ion-label>senseBoxID</ion-label>
<ion-input [(ngModel)]="senseboxid" placeholder="5c4f75e83580950019240779"></ion-input>
</ion-item>
</ion-row>
<ion-row *ngFor="let sensor of sensors;let i=index;let last = last">
<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>
<button ion-item (click)="uploadStandardSketch()">
<ion-icon name="refresh" item-start></ion-icon>
<ion-label>
<h2 translate>CONFIG.BUTTON</h2>
</ion-label>
</button>
</ion-card-content>
</ion-item> -->
</ion-card-content>
</ion-card>
</ion-col>
</ion-row>
@ -82,4 +112,4 @@
</ion-col>
</ion-row>
</ion-grid>
</ion-content>
</ion-content>

@ -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(){
// possily add define statements here based on inputs given or checkboxes checked
let sketchy = "#define HDC1080\n";
async uploadStandardSketch(){
var values = {
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;
var values = {
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
};
sketchy = this.applyTemplate(sketchy,values);
let sketch = this.applyTemplate(data,values);
this.navCtrl.push(OtaWizardPage, { sketch })
})
}
addSensor(){
console.log("adding sensor");
let addModal = this.modalCtrl.create(AddItemPage);
addModal.onDidDismiss((sensor)=>{
if(sensor){
this.saveSensor(sensor);
}
})
/**
* Start OTA Wizard here but with the pre defined sketch here and not with the blockly sketch
*
**
*/
const sketch = 'void setup(){Serial.begin(9600);} void loop(){Serial.println("Working");}'
this.navCtrl.push(OtaWizardPage, { sketchy })
addModal.present();
}
saveSensor(sensor){
this.sensors.push(sensor);
}
ionViewDidLoad() {
console.log('ionViewDidLoad ConfigPage');
this.sensors =[
{title:"Temperatur",type:"temp"},
{title:"Temperatur",type:"temp"}
]
}
}

Loading…
Cancel
Save