rename to typescript files

Author: tsubik

.editorconfig

@@ -17,6 +17,10 @@ indent_size = 2
 indent_style = space
 indent_size = 2
 
+[*.ts]
+indent_style = space
+indent_size = 2
+
 [*.{css,scss}]
 indent_style = space
 indent_size = 2

.eslintrc

@@ -0,0 +1,17 @@
+{
+  "extends": "airbnb/base",
+
+  "env": {
+    "browser": true,
+    "es6": true,
+    "node": true
+  },
+
+  "rules": {
+    "quotes": [2, "double", "avoid-escape"],
+    "indent": [2, 2],
+    "func-names": 0,
+    "no-use-before-define": [2, "nofunc"],
+    "prefer-arrow-callback": 0
+  }
+}

.gitignore

@@ -16,6 +16,8 @@ log.txt
 coverage/
 dist/
 node_modules/
+platforms/
+plugins/
 tmp/
 temp/
 www/build/

app/app.js app/app.ts

@@ -0,0 +1,30 @@
+<ion-navbar *navbar>
+  <ion-title>Edit Geofence</ion-title>
+</ion-navbar>
+
+<ion-content class="geofence-details-page">
+  <ion-list>
+    <ion-item>
+      <ion-label stacked>Notification Text</ion-label>
+      <ion-input [(ngModel)]="geofence.notification.text" type="text" placeholder="Example: Buy a milk"></ion-input>
+    </ion-item>
+    <ion-item>
+      <ion-label stacked>Notify When You?</ion-label>
+      <ion-select [(ngModel)]="transitionType" multiple="true">
+        <ion-option value="1">Enter Region</ion-option>
+        <ion-option value="2">Exit Region</ion-option>
+        <ion-option value="3">Both</ion-option>
+      </ion-select>
+    </ion-item>
+    <ion-item>
+      <div>
+        <ion-label stacked>on</ion-label>
+        <ion-content>
+          on
+          <input type="range" name="volume" min="50" max="5000">
+          1000m
+        </ion-content>
+      </div>
+    </ion-item>
+  </ion-list>
+</ion-content>

app/pages/geofence-details/geofence-details.html

@@ -0,0 +1,3 @@
+.geofence-list-page {
+
+}

app/pages/geofence-details/geofence-details.scss

@@ -0,0 +1,19 @@
+import { Page, NavController, NavParams } from "ionic/ionic";
+
+@Page({
+  templateUrl: "build/pages/geofence-details/geofence-details.html"
+})
+export class GeofenceDetailsPage {
+  constructor(nav: NavController, navParams: NavParams) {
+    this.nav = nav;
+    this.geofence = navParams.get("geofence");
+  }
+
+  get transitionType() {
+    return this.geofence.transitionType.toString();
+  }
+
+  set transitionType(value) {
+    this.geofence.transitionType = parseInt(value, 10);
+  }
+}

app/pages/geofence-details/geofence-details.ts

@@ -2,7 +2,7 @@
   <ion-title>Ionic 2 Geofence Example</ion-title>
 </ion-navbar>
 
-<ion-content padding class="geofence-list-page">
+<ion-content class="geofence-list-page">
   <ion-list>
     <ion-item *ngFor="#geofence of geofences" (click)="itemTapped($event, geofence)">
       <p>{{geofence.notification.text}}</p>

app/pages/geofence-list/geofence-list.html

@@ -1,12 +1,13 @@
 import { Page, NavController } from "ionic/ionic";
+import { GeofenceDetailsPage } from "../geofence-details/geofence-details";
 
 const FIXTURES = [
   { id: 1, latitude: 50.3021079, longitude: 18.6771861, radius: 3000, transitionType: 1, notification: { text: "Gliwice Train Station"} },
   { id: 2, latitude: 50.4728049, longitude: 19.0736874, radius: 3000, transitionType: 1, notification: { text: "Pyrzowice Airport"} },
   { id: 3, latitude: 50.0671974, longitude: 19.945232, radius: 3000, transitionType: 1, notification: { text: "Cracow Main Station"} },
   { id: 4, latitude: 52.2287803, longitude: 21.001124, radius: 3000, transitionType: 1, notification: { text: "Warsaw Main Station"} },
-  { id: 5, latitude: 40.7257093, longitude: -74.0032786, radius: 4000, transitionType: 1, notification: { text: "New York - SOHO"} },
-  { id: 6, latitude: 34.0033907, longitude: -118.5069657, radius: 3000, transitionType: 1, notification: { text: "LA - Santa Monica State Beach"} },
+  { id: 5, latitude: 40.7257093, longitude: -74.0032786, radius: 4000, transitionType: 3, notification: { text: "New York - SOHO"} },
+  { id: 6, latitude: 34.0033907, longitude: -118.5069657, radius: 3000, transitionType: 2, notification: { text: "LA - Santa Monica State Beach"} },
   { id: 7, latitude: 25.8938595, longitude: -80.1330216, radius: 500, transitionType: 1, notification: { text: "Dexter's Apartment - Miami Bay Harbour" }
 ];
 
@@ -21,6 +22,8 @@ export class GeofenceListPage {
   }
 
   itemTapped(event, geofence) {
-
+    this.nav.push(GeofenceDetailsPage, {
+      geofence
+    })
   }
 }

app/pages/geofence-list/geofence-list.js app/pages/geofence-list/geofence-list.ts

@@ -7,4 +7,5 @@
 // By default each design mode includes these shared imports.
 // App Shared Sass variables belong in app.variables.scss.
 
-@import "../pages/main/main";
+@import "../pages/geofence-list/geofence-list";
+@import "../pages/geofence-details/geofence-details";

app/theme/app.core.scss

@@ -11,9 +11,25 @@
   },
   "devDependencies": {
     "awesome-typescript-loader": "0.15.10",
+    "cordova": "^6.0.0",
+    "eslint": "^1.10.3",
+    "eslint-config-airbnb": "^5.0.0",
+    "ionic": "^2.0.0-beta.17",
     "strip-sourcemap-loader": "0.0.1",
-    "typescript": "1.7.5"
+    "typescript": "1.7.5",
+    "typescript-eslint-parser": "0.1.0-alpha-1"
   },
   "name": "ionic2-geofence",
-  "description": "ionic2-geofence: An Ionic project"
+  "description": "ionic2-geofence: An Ionic project",
+  "cordovaPlugins": [
+    "cordova-plugin-device",
+    "cordova-plugin-console",
+    "cordova-plugin-whitelist",
+    "cordova-plugin-splashscreen",
+    "cordova-plugin-statusbar",
+    "ionic-plugin-keyboard"
+  ],
+  "cordovaPlatforms": [
+    "android"
+  ]
 }

package.json

@@ -17,7 +17,7 @@ module.exports = {
   module: {
     loaders: [
       {
-        test: /\.js$/,
+        test: /\.ts$/,
         loader: 'awesome-typescript',
         query: {
           doTypeCheck: false,
@@ -48,6 +48,6 @@ module.exports = {
       'ionic': 'ionic-framework',
       'web-animations.min': path.normalize('ionic-framework/js/web-animations.min')
     },
-    extensions: ['', '.js']
+    extensions: ['', '.js', '.ts']
   }
 };