Update to Ionic 2 beta 10 and angular 2 rc 3

openchargemap · Jul 1, 2016 · 99aa690 · 99aa690
1 parent 864a4b9
commit 99aa690
Show file tree

Hide file tree

Showing 12 changed files with 225 additions and 187 deletions.
diff --git a/App/Ionic2/ocm-app/app/pages/comment/comment.html b/App/Ionic2/ocm-app/app/pages/comment/comment.html
@@ -1,16 +1,20 @@
-<ion-navbar *navbar default>
-  <ion-title>
-    Add Comment
-  </ion-title>
-</ion-navbar>
+<ion-header>
+  <ion-navbar default>
+    <ion-title>
+      Add Comment
+    </ion-title>
+  </ion-navbar>
+</ion-header>
+
 <ion-content class="comment-page" padding>
 
-<div class="banner">
-  <h1>{{poi.AddressInfo.Title}}</h1>
-  <p>{{poi.AddressInfo.AddressLine1}}</p>
+  <div class="banner">
+    <h1>{{poi.AddressInfo.Title}}</h1>
+    <p>{{poi.AddressInfo.AddressLine1}}</p>
   </div>
-  <p padding>Recent Check-ins are a big help to other drivers when planning their journey. Tell everyone what you thought about this charging location. </p>
-
+  <p padding>Recent Check-ins are a big help to other drivers when planning their journey. Tell everyone what you thought about this
+    charging location. </p>
+
   <ion-list>
 
     <ion-item>
@@ -55,18 +59,20 @@ <h1>{{poi.AddressInfo.Title}}</h1>
 
 
 </ion-content>
-<ion-toolbar position="bottom">
-  <ion-buttons start>
-    <button (click)="cancel()">
+<ion-footer>
+  <ion-toolbar>
+    <ion-buttons start>
+      <button (click)="cancel()">
             <ion-icon name="close"></ion-icon>
       Cancel
 
     </button>
-  </ion-buttons>
-  <ion-buttons end>
-    <button (click)="add()">
+    </ion-buttons>
+    <ion-buttons end>
+      <button (click)="add()">
       Submit
       <ion-icon name="send" ></ion-icon>
     </button>
-  </ion-buttons>
-</ion-toolbar>
+    </ion-buttons>
+  </ion-toolbar>
+</ion-footer>
diff --git a/App/Ionic2/ocm-app/app/pages/journeys/favourite-editor.html b/App/Ionic2/ocm-app/app/pages/journeys/favourite-editor.html
@@ -1,8 +1,11 @@
-<ion-navbar *navbar default>
-    <ion-title>
-        Edit Favourite
-    </ion-title>
-</ion-navbar>
+<ion-header>
+    <ion-navbar default>
+        <ion-title>
+            Edit Favourite
+        </ion-title>
+    </ion-navbar>
+</ion-header>
+
 <ion-content class="journeys-page" padding>
 
     <div class="banner">
@@ -17,46 +20,48 @@ <h1>{{poi.AddressInfo.Title}}</h1>
     <ion-item>
         <ion-label stacked>Add to a Journey</ion-label>
         <ion-select [(ngModel)]="selectedJourneyID">
-               <ion-option value="" checked>Create a New Journey</ion-option>
+            <ion-option value="" checked>Create a New Journey</ion-option>
             <ion-option *ngFor="let journey of journeyManager.journeys" [value]="journey.ID">{{journey.Title}}</ion-option>
         </ion-select>
 
     </ion-item>
     <ion-item *ngIf="selectedJourneyID">
         <ion-label stacked>Journey Stage</ion-label>
-         <ion-select [(ngModel)]="selectedStageIndex">
-               <ion-option value="">Create a Journey Stage</ion-option>
+        <ion-select [(ngModel)]="selectedStageIndex">
+            <ion-option value="">Create a Journey Stage</ion-option>
             <ion-option *ngFor="let stage of journeyManager.getJourneyStages(selectedJourneyID); let i=index;" [value]="i" checked>{{stage.Title}}</ion-option>
         </ion-select>
 
     </ion-item>
-      <ion-item *ngIf="!selectedJourneyID">
+    <ion-item *ngIf="!selectedJourneyID">
         <ion-label stacked>New Journey Name</ion-label>
-         <ion-input type="text" [(ngModel)]="newJourneyName"></ion-input>
+        <ion-input type="text" [(ngModel)]="newJourneyName"></ion-input>
 
     </ion-item>
     <ion-item>
         <ion-label stacked>Name for this step of your journey</ion-label>
         <ion-input type="text" [(ngModel)]="waypoint.Title"></ion-input>
     </ion-item>
-     <ion-item>
+    <ion-item>
         <ion-label stacked>Other Notes</ion-label>
-        <ion-textarea  [(ngModel)]="waypoint.Notes"></ion-textarea>
+        <ion-textarea [(ngModel)]="waypoint.Notes"></ion-textarea>
     </ion-item>
 
 </ion-content>
-<ion-toolbar position="bottom">
-  <ion-buttons start>
-    <button (click)="cancel()">
+<ion-footer>
+    <ion-toolbar>
+        <ion-buttons start>
+            <button (click)="cancel()">
             <ion-icon name="close"></ion-icon>
       Cancel
 
     </button>
-  </ion-buttons>
-  <ion-buttons end>
-    <button (click)="add()">
+        </ion-buttons>
+        <ion-buttons end>
+            <button (click)="add()">
       Add
       <ion-icon name="plus"></ion-icon>
     </button>
-  </ion-buttons>
-</ion-toolbar>
+        </ion-buttons>
+    </ion-toolbar>
+</ion-footer>
diff --git a/App/Ionic2/ocm-app/app/pages/journeys/journeys.html b/App/Ionic2/ocm-app/app/pages/journeys/journeys.html
@@ -1,16 +1,19 @@
-<ion-navbar *navbar default>
-    <ion-title>
-        Journeys
-    </ion-title>
-</ion-navbar>
+<ion-header>
+    <ion-navbar default>
+        <ion-title>
+            Journeys
+        </ion-title>
+    </ion-navbar>
+</ion-header>
+
 <ion-content class="journeys-page" padding>
     <p>
         You can create and plan journeys to group your favourite charging routes together.
     </p>
 
     <p *ngIf="journeyManager.journeys==null || journeyManager.journeys.length==0">
         You have no journeys yet. Start by browsing to a charging location, then add it as Favourite to start a new Journey.
-       
+
     </p>
 
     <ion-card *ngFor="let journey of journeyManager.journeys">
@@ -35,12 +38,12 @@
 
             <ion-list *ngFor="let s of journey.Stages">
                 <ion-list-header style="font-size:1.5rem;">
-                    {{s.Title}} 
-                    
+                    {{s.Title}}
+
                     <ion-icon name="ios-car"></ion-icon> --
                     <ion-icon name="time"></ion-icon> --
                     <ion-icon name="flash"></ion-icon> --
-                    
+
                 </ion-list-header>
 
                 <ion-item *ngFor="let w of s.WayPoints">

diff --git a/App/Ionic2/ocm-app/app/pages/journeys/journeys.ts b/App/Ionic2/ocm-app/app/pages/journeys/journeys.ts
@@ -89,4 +89,8 @@ export class JourneysPage {
 
     this.nav.present(confirm);
   }
+
+  launchNavigation(){
+    this.appManager.showToastNotification(this.nav, "Feature not yet implemented.");
+  }
 }
diff --git a/App/Ionic2/ocm-app/app/pages/mediaupload/mediaupload.html b/App/Ionic2/ocm-app/app/pages/mediaupload/mediaupload.html
@@ -1,8 +1,11 @@
-<ion-navbar *navbar primary>
-  <ion-title>
-    Share Photo
-  </ion-title>
-</ion-navbar>
+<ion-header>
+  <ion-navbar primary>
+    <ion-title>
+      Share Photo
+    </ion-title>
+  </ion-navbar>
+</ion-header>
+
 <ion-content class="media-upload" padding>
 
   <div class="banner">
@@ -12,7 +15,7 @@ <h1>{{poi.AddressInfo.Title}}</h1>
   <p>You can upload a photo from your device or take a new photo:
   </p>
   <div>
-   
+
     <div *ngIf="isBrowserMode()==false">
       <button (click)="loadCameraOrLibraryImage()">Select Photo</button>
     </div>
@@ -27,58 +30,60 @@ <h1>{{poi.AddressInfo.Title}}</h1>
 
 </label>
 
-</div>
-      <canvas id="img-upload-canvas" style="display:none;width:500;height:500;border:1px solid red;"></canvas>
-      <ion-card *ngIf="imgData!=null">
+    </div>
+    <canvas id="img-upload-canvas" style="display:none;width:500;height:500;border:1px solid red;"></canvas>
+    <ion-card *ngIf="imgData!=null">
 
-        <ion-card-content>
-          <ion-card-title>
-            Preview
-          </ion-card-title>
+      <ion-card-content>
+        <ion-card-title>
+          Preview
+        </ion-card-title>
 
 
 
-          <ion-toolbar>
-            <ion-buttons start>
+        <ion-toolbar>
+          <ion-buttons start>
 
-              <button (click)="rotateImage()">  <ion-icon name="refresh"></ion-icon> Rotate</button>
-
-            </ion-buttons>
+            <button (click)="rotateImage()">  <ion-icon name="refresh"></ion-icon> Rotate</button>
 
-          </ion-toolbar>
-          <ion-list>
+          </ion-buttons>
 
-            <ion-item>
-              <ion-label fixed>Comment</ion-label>
-              <ion-input type="text" [(ngModel)]="comment"></ion-input>
+        </ion-toolbar>
+        <ion-list>
 
-            </ion-item>
+          <ion-item>
+            <ion-label fixed>Comment</ion-label>
+            <ion-input type="text" [(ngModel)]="comment"></ion-input>
 
+          </ion-item>
 
 
-          </ion-list>
 
+        </ion-list>
 
-          <img id="preview" style="max-width:500px" />
-        </ion-card-content>
-      </ion-card>
 
+        <img id="preview" style="max-width:500px" />
+      </ion-card-content>
+    </ion-card>
+
+
+  </div>
 
-    </div>
-
 </ion-content>
-<ion-toolbar position="bottom">
-<ion-buttons start>
-    <button (click)="cancel()">
+<ion-footer>
+  <ion-toolbar>
+    <ion-buttons start>
+      <button (click)="cancel()">
             <ion-icon name="close"></ion-icon>
       Cancel
 
     </button>
-  </ion-buttons>
-  <ion-buttons end>
-    <button (click)="performUpload()">
+    </ion-buttons>
+    <ion-buttons end>
+      <button (click)="performUpload()">
       Upload
       <ion-icon name="send"></ion-icon>
     </button>
-  </ion-buttons>
-</ion-toolbar>
+    </ion-buttons>
+  </ion-toolbar>
+</ion-footer>