Add files via upload

src-mgra · web-flow · commit 2a1f7f4501fb · 2018-01-03T10:46:32.000+01:00
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -0,0 +1,22 @@
+import { Component } from '@angular/core';
+import { Platform } from 'ionic-angular';
+import { StatusBar } from '@ionic-native/status-bar';
+import { SplashScreen } from '@ionic-native/splash-screen';
+
+import { HomePage } from '../pages/home/home';
+@Component({
+  templateUrl: 'app.html'
+})
+export class MyApp {
+  rootPage:any = HomePage;
+
+  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
+    platform.ready().then(() => {
+      // Okay, so the platform is ready and our plugins are available.
+      // Here you can do any higher level native things you might need.
+      statusBar.styleDefault();
+      splashScreen.hide();
+    });
+  }
+}
+
diff --git a/src/app/app.html b/src/app/app.html
@@ -0,0 +1 @@
+<ion-nav [root]="rootPage"></ion-nav>
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
@@ -0,0 +1,30 @@
+import { BrowserModule } from '@angular/platform-browser';
+import { ErrorHandler, NgModule } from '@angular/core';
+import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
+import { SplashScreen } from '@ionic-native/splash-screen';
+import { StatusBar } from '@ionic-native/status-bar';
+
+import { MyApp } from './app.component';
+import { HomePage } from '../pages/home/home';
+
+@NgModule({
+  declarations: [
+    MyApp,
+    HomePage
+  ],
+  imports: [
+    BrowserModule,
+    IonicModule.forRoot(MyApp)
+  ],
+  bootstrap: [IonicApp],
+  entryComponents: [
+    MyApp,
+    HomePage
+  ],
+  providers: [
+    StatusBar,
+    SplashScreen,
+    {provide: ErrorHandler, useClass: IonicErrorHandler}
+  ]
+})
+export class AppModule {}
diff --git a/src/app/app.scss b/src/app/app.scss
@@ -0,0 +1,16 @@
+// http://ionicframework.com/docs/v2/theming/
+
+
+// App Global Sass
+// --------------------------------------------------
+// Put style rules here that you want to apply globally. These
+// styles are for the entire app and not just one component.
+// Additionally, this file can be also used as an entry point
+// to import other Sass files to be included in the output CSS.
+//
+// Shared Sass variables, which can be used to adjust Ionic's
+// default Sass variables, belong in "theme/variables.scss".
+//
+// To declare rules for a specific mode, create a child rule
+// for the .md, .ios, or .wp mode classes. The mode class is
+// automatically applied to the <body> element in the app.
diff --git a/src/app/main.ts b/src/app/main.ts
@@ -0,0 +1,5 @@
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app.module';
+
+platformBrowserDynamic().bootstrapModule(AppModule);
diff --git a/src/assets/icon/favicon.ico b/src/assets/icon/favicon.ico
diff --git a/src/declarations.d.ts b/src/declarations.d.ts
@@ -0,0 +1,14 @@
+/*
+  Declaration files are how the Typescript compiler knows about the type information(or shape) of an object.
+  They're what make intellisense work and make Typescript know all about your code.
+
+  A wildcard module is declared below to allow third party libraries to be used in an app even if they don't
+  provide their own type declarations.
+
+  To learn more about using third party libraries in an Ionic app, check out the docs here:
+  http://ionicframework.com/docs/v2/resources/third-party-libs/
+
+  For more info on type definition files, check out the Typescript docs here:
+  https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html
+*/
+declare module '*';
diff --git a/src/index.html b/src/index.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+  <meta charset="UTF-8">
+  <title>Ionic App</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+  <meta name="format-detection" content="telephone=no">
+  <meta name="msapplication-tap-highlight" content="no">
+
+  <link rel="icon" type="image/x-icon" href="assets/icon/favicon.ico">
+  <link rel="manifest" href="manifest.json">
+  <meta name="theme-color" content="#4e8ef7">
+ 
+  <!-- cordova.js required for cordova apps -->
+  <script src="cordova.js"></script>
+
+  <!-- un-comment this code to enable service worker
+  <script>
+    if ('serviceWorker' in navigator) {
+      navigator.serviceWorker.register('service-worker.js')
+        .then(() => console.log('service worker installed'))
+        .catch(err => console.error('Error', err));
+    }
+  </script>-->
+
+  <link href="build/main.css" rel="stylesheet">
+
+</head>
+<body>
+
+  <!-- Ionic's root component and where the app will load -->
+  <ion-app></ion-app>
+
+  <!-- The polyfills js is generated during the build process -->
+  <script src="build/polyfills.js"></script>
+
+  <!-- The bundle js is generated during the build process -->
+  <script src="build/main.js"></script>
+
+</body>
+</html>
diff --git a/src/manifest.json b/src/manifest.json
@@ -0,0 +1,13 @@
+{
+  "name": "Ionic",
+  "short_name": "Ionic",
+  "start_url": "index.html",
+  "display": "standalone",
+  "icons": [{
+    "src": "assets/imgs/logo.png",
+    "sizes": "512x512",
+    "type": "image/png"
+  }],
+  "background_color": "#4e8ef7",
+  "theme_color": "#4e8ef7"
+}
diff --git a/src/pages/home/home.html b/src/pages/home/home.html
@@ -0,0 +1,41 @@
+<ion-header>
+  <ion-navbar>
+    <ion-title>
+      Array Aktionen
+    </ion-title>
+  </ion-navbar>
+</ion-header>
+
+<ion-content padding>
+  Sortierte Liste:
+  <ion-row *ngFor="let num of nList; let i = index; ">
+    {{num}}
+  </ion-row>
+  <br><hr>
+  formatierte Liste über map:
+  <ion-row *ngFor="let user of fUsers; let i = index; ">
+    {{user}}
+  </ion-row>
+  <br><hr>
+  Filter-Liste nach M:
+  <ion-row *ngFor="let prod of fproducts; let i = index; ">
+    {{prod}}
+  </ion-row>
+  <br><hr>
+  Filter-Liste nach AMO:
+  <ion-row *ngFor="let prod of fproducts2; let i = index; ">
+    {{prod.schar}} <br>
+    {{prod.plist}}
+  </ion-row>
+  <br><hr>
+  Aufsummieren mit reduce:
+  <ion-row *ngFor="let price of cartItemPrices; let i = index; ">
+    {{price}} <br>
+  </ion-row>
+  <ion-item>
+    {{summe}}
+  </ion-item>
+  <p>
+    If you get lost, the <a href="http://ionicframework.com/docs/v2">docs</a> will be your guide.
+  </p>
+</ion-content>
diff --git a/src/pages/home/home.scss b/src/pages/home/home.scss
@@ -0,0 +1,3 @@
+page-home {
+
+}
diff --git a/src/pages/home/home.ts b/src/pages/home/home.ts
@@ -0,0 +1,103 @@
+import { Component } from '@angular/core';
+import { NavController } from 'ionic-angular';
+
+@Component({
+  selector: 'page-home',
+  templateUrl: 'home.html'
+})
+export class HomePage {
+  nList: [any];
+
+  nUsers: [any];
+  fUsers: [any];
+
+  products: [any];
+  fproducts: [any];
+  fproducts2: [any];
+
+  cartItemPrices: [any];
+  summe: any;
+
+
+  constructor(public navCtrl: NavController) {
+
+    var compareNumerical = function(a, b) {
+      return a - b;
+    }
+
+    /*
+    Sortierung mit compare-Function
+     */
+    this.nList = [10,1,4,6,88,11];
+    this.nList.sort(compareNumerical);
+
+    /*
+  Map-Function
+   */
+    this.nUsers = [
+      {name: 'Reich', firstName: 'Frank'},
+      {name: 'Huana', firstName: 'Marie'},
+      {name: 'Meisenbär', firstName: 'Andreas'}
+    ];
+
+    function formattedUserNames(users) {
+      return  users.map(
+        user => user.firstName[0] + '. ' + user.name
+      );
+    }
+
+    this.fUsers = formattedUserNames(this.nUsers);
+
+    /*
+    Filter
+     */
+    this.products = ["Marvel Comics Lightweight Infinity Scarf", "Ollie - The App Controlled Robot", "Meh Hoodie",
+      "Magnetic Accelerator Cannon","Only one film", "Aquafarm: Aquaponics Fish Garden","Absolut perfect"];
+
+    function  productsStartingWith (letter, products) {
+      let plist = products.filter(
+        product => product.startsWith(letter)
+      );
+      return plist;
+    }
+
+
+    this.fproducts = productsStartingWith('M', this.products);
+
+    function sortbystr(sortchars,products) {
+      let i: number;
+      let schar: string;
+      let res: [any];
+      res = [
+        {schar: ' ', plist: [' ',' ','']},
+        {schar: ' ', plist: [' ',' ','']},
+        {schar: ' ', plist: [' ',' ','']},
+        {schar: ' ', plist: [' ',' ','']},
+        {schar: ' ', plist: [' ',' ','']}
+      ];
+      for(i=0;i<sortchars.length;i++) {
+        schar = sortchars[i];
+        res[i].schar = schar;
+        res[i].plist = productsStartingWith(schar, products);
+      }
+
+      return res;
+    }
+
+    this.fproducts2 = sortbystr('AMO',this.products);
+
+    /*
+    Reduce-Function für aggregation
+     */
+    this.cartItemPrices = [9.99, 19.99, 5.99,22.3];
+
+    function  add (a, b) {
+      return a + b;
+    }
+
+    this.summe = this.cartItemPrices.reduce(add);
+
+  }
+
+  }
+
diff --git a/src/service-worker.js b/src/service-worker.js
@@ -0,0 +1,30 @@
+/**
+ * Check out https://googlechrome.github.io/sw-toolbox/ for
+ * more info on how to use sw-toolbox to custom configure your service worker.
+ */
+
+
+'use strict';
+importScripts('./build/sw-toolbox.js');
+
+self.toolbox.options.cache = {
+  name: 'ionic-cache'
+};
+
+// pre-cache our key assets
+self.toolbox.precache(
+  [
+    './build/main.js',
+    './build/main.css',
+    './build/polyfills.js',
+    'index.html',
+    'manifest.json'
+  ]
+);
+
+// dynamically cache any other local assets
+self.toolbox.router.any('/*', self.toolbox.cacheFirst);
+
+// for any other requests go to the network, cache,
+// and then only use that cached resource if your user goes offline
+self.toolbox.router.default = self.toolbox.networkFirst;
diff --git a/src/theme/variables.scss b/src/theme/variables.scss
