AND now with a clean little Ionic client to talk to the server with.

.gitignore

@@ -24,4 +24,4 @@ dist/
 nbdist/
 .nb-gradle/
 
-frontend/FE/node_modules
+frontend/SimpleMonday/node_modules

README.md

@@ -1,11 +1,29 @@
 # Throwup Thursday
 
-*Use spring, and HAL Browser (for Spring Data REST) to create a couple of POJOs (Book and Person) and
+*Use Spring, and HAL Browser (for Spring Data REST) to create a couple of POJOs (Book and Person) and
 a framework so that we can mock up some data in spring, and then generate
 JSON and other marvels.*
 
 **Run and then point a browser to [http://localhost:8080/]()**
 
+## New and Improved!! As seen ov TV! 
+## ThrowupThursday can now talk to a MySQL db running on your machine.
+
+Yes, that's right, you can do a very simple CRUDRepository in Spring to suply the data you need!
+
+You're welcome.
+
+## New and Improved! Now with the earth-shattering SimpleMonday Client!!
+
+Then open VSC on the SAME project. Go into frontend/SimpleMonday and find a simple Ionic 3 client, which can talk to the 
+Spring server above, fetch a single GET from the server display the results in the People tab of the 
+SimpleMonday client.
+
+BUT to make this work, you need to go to [http://localhost:8100]() with the Chrome browser, and then
+download and INSTALL this extension: https://chrome.google.com/webstore/detail/cors-toggle/jioikioepegflmdnbocfhgmpmopmjkim
+That will allow the SimpleMonday client to load the JSON from localhost:8080
+Otherwise the SimpleMonday client runs afoul of CORS (look it up).
+
 
 #### Kris and Wilhem wrote this, because we feel sorry for the poor Zipcoder-wanna-bees.
 

frontend/SimpleMonday/src/app/app.module.ts

@@ -2,6 +2,7 @@ import { NgModule, ErrorHandler } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
 import { MyApp } from './app.component';
+import { HttpModule } from '@angular/http';
 
 import { AboutPage } from '../pages/about/about';
 import { ContactPage } from '../pages/contact/contact';
@@ -10,6 +11,7 @@ import { TabsPage } from '../pages/tabs/tabs';
 
 import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
+import { PeopleSupplyProvider } from '../providers/people-supply/people-supply';
 
 @NgModule({
   declarations: [
@@ -21,6 +23,7 @@ import { SplashScreen } from '@ionic-native/splash-screen';
   ],
   imports: [
     BrowserModule,
+    HttpModule,
     IonicModule.forRoot(MyApp)
   ],
   bootstrap: [IonicApp],
@@ -34,7 +37,8 @@ import { SplashScreen } from '@ionic-native/splash-screen';
   providers: [
     StatusBar,
     SplashScreen,
-    {provide: ErrorHandler, useClass: IonicErrorHandler}
+    {provide: ErrorHandler, useClass: IonicErrorHandler},
+    PeopleSupplyProvider
   ]
 })
 export class AppModule {}

frontend/SimpleMonday/src/pages/about/about.html

@@ -1,11 +1,40 @@
 <ion-header>
   <ion-navbar>
     <ion-title>
-      About
+      About Simply Monday
     </ion-title>
   </ion-navbar>
 </ion-header>
 
 <ion-content padding>
-
+  <h2>Monday Monday, -- The Mommas and Papas</h2>
+<p>Bah-da bah-da-da-da
+  Bah-da bah-da-da-da
+  Bah-da bah-da-da-da</p><p>
+  Monday, Monday, so good to me
+  Monday mornin´, it was all I hoped it would be
+  Oh Monday mornin´, Monday mornin´ couldn´t guarantee
+  That Monday evenin´ you would still be here with me</p><p>
+  Monday, Monday, can´t trust that day
+  Monday, Monday, sometimes it just turns out that way
+  Oh Monday mornin´ you gave me no warnin´ of what was to be
+  Oh Monday, Monday, how could you leave and not take me</p><p>
+  Every other day, every other day
+  Every other day of the week is fine, yeah
+  But whenever Monday comes, but whenever Monday comes
+  A-you can find me cryin´ all of the time</p><p>
+  Monday, Monday, so good to me
+  Monday mornin´, it was all I hoped it would be
+  But Monday mornin´, Monday mornin´ couldn´t guarantee
+  That Monday evenin´ you would still be here with me</p><p>
+  Every other day, every other day
+  Every other day of the week is fine, yeah
+  But whenever Monday comes, but whenever Monday comes
+  A-you can find me cryin´ all of the time</p><p>
+  Monday, Monday, can´t trust that day
+  Monday, Monday, it just turns out that way
+  Oh Monday, Monday, won´t go away
+  Monday, Monday, it´s here to stay
+  Oh Monday, Monday
+  Oh Monday, Monday</p>
 </ion-content>

frontend/SimpleMonday/src/pages/contact/contact.html

@@ -8,10 +8,11 @@
 
 <ion-content>
   <ion-list>
-    <ion-list-header>Follow us on Twitter</ion-list-header>
-    <ion-item>
-      <ion-icon name="ionic" item-start></ion-icon>
-      @ionicframework
-    </ion-item>
-  </ion-list>
+      <ion-list-header>Live People!</ion-list-header>
+
+      <ion-item *ngFor="let person of people">
+        <!-- <img [src]="person.data.url" /> -->
+        <ion-icon name="person" item-start></ion-icon> {{person.name}} age: {{person.age}}
+      </ion-item>
+    </ion-list>
 </ion-content>

frontend/SimpleMonday/src/pages/contact/contact.ts

@@ -1,13 +1,23 @@
 import { Component } from '@angular/core';
 import { NavController } from 'ionic-angular';
+import { Http } from '@angular/http';
+
+import 'rxjs/add/operator/map';
+
 
 @Component({
   selector: 'page-contact',
   templateUrl: 'contact.html'
 })
+
 export class ContactPage {
+  people: any;
 
-  constructor(public navCtrl: NavController) {
+  constructor(public navCtrl: NavController, public http: Http) {
+    this.http.get('http://localhost:8080/persons').map(res => res.json()).subscribe(data => {
+        //console.log(data);
+        this.people = data._embedded.persons;
+    });
 
   }
 

frontend/SimpleMonday/src/pages/home/home.html

@@ -5,7 +5,7 @@
 </ion-header>
 
 <ion-content padding>
-  <h2>Welcome to Ionic!</h2>
+  <h2>Welcome to Simple Monday!</h2>
   <p>
     This starter project comes with simple tabs-based layout for apps
     that are going to primarily use a Tabbed UI.
@@ -14,4 +14,5 @@
     Take a look at the <code>src/pages/</code> directory to add or change tabs,
     update any existing page or create new pages.
   </p>
+  <p>and this also loads the persons from the ThrowupThursday Spring.io server. You're welcome.</p>
 </ion-content>

frontend/SimpleMonday/src/pages/tabs/tabs.html

@@ -1,5 +1,5 @@
 <ion-tabs>
   <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
   <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="information-circle"></ion-tab>
-  <ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab>
+  <ion-tab [root]="tab3Root" tabTitle="People" tabIcon="contacts"></ion-tab>
 </ion-tabs>