From 6ffa2343ca981f79046b03dee30af34bc554e45f Mon Sep 17 00:00:00 2001
From: Max Lynch <ihasmax@gmail.com>
Date: Mon, 6 Jul 2015 19:52:09 -0500
Subject: [PATCH] Sink UP

---
 ionic/components/app/test/sink/pages/form.ts  |  4 +--
 .../app/test/sink/pages/ionicons.ts           |  1 +
 ionic/components/app/test/sink/pages/modal.ts | 17 +++++-----
 .../app/test/sink/pages/search-bar.ts         | 15 +++++----
 .../components/app/test/sink/pages/slides.ts  | 12 ++++---
 ionic/components/app/test/sink/pages/tabs.ts  | 32 +++++++++++++++----
 6 files changed, 53 insertions(+), 28 deletions(-)

diff --git a/ionic/components/app/test/sink/pages/form.ts b/ionic/components/app/test/sink/pages/form.ts
index b907fa0457..510cfc8f67 100644
--- a/ionic/components/app/test/sink/pages/form.ts
+++ b/ionic/components/app/test/sink/pages/form.ts
@@ -26,7 +26,7 @@ import {SinkPage} from '../sink-page';
     </p>
     <form (^submit)="doSubmit($event)" [ng-form-model]="form">
       <ion-input>
-        <input control="email" type="email" placeholder="Your email">
+        <input ng-control="email" type="email" placeholder="Your email">
       </ion-input>
       <ion-input>
         <input control="password" type="password" placeholder="Your password">
@@ -37,7 +37,7 @@ import {SinkPage} from '../sink-page';
   `,
   directives: [formDirectives, NavbarTemplate, Navbar, Content, List, Item, Input]
 })
-export class FormPage {
+export class FormPage extends SinkPage {
   constructor(app: IonicApp) {
     super(app);
 
diff --git a/ionic/components/app/test/sink/pages/ionicons.ts b/ionic/components/app/test/sink/pages/ionicons.ts
index 52e4939fb9..ed65eef6b9 100644
--- a/ionic/components/app/test/sink/pages/ionicons.ts
+++ b/ionic/components/app/test/sink/pages/ionicons.ts
@@ -23,6 +23,7 @@ import {SinkPage} from '../sink-page';
       with unicode characters.
     </p>
     <div>
+      <img src="http://ionic-io-assets.s3.amazonaws.com/v2/ionicons.png" style="max-width: 100%">
     </div>
   </ion-content>
   `,
diff --git a/ionic/components/app/test/sink/pages/modal.ts b/ionic/components/app/test/sink/pages/modal.ts
index a070fc8172..8a04cf221b 100644
--- a/ionic/components/app/test/sink/pages/modal.ts
+++ b/ionic/components/app/test/sink/pages/modal.ts
@@ -1,14 +1,16 @@
 import {Component, Directive, View} from 'angular2/angular2';
 
-import {IonicView, ActionMenu, Modal, NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
+import {IonicApp, IonicView, ActionMenu, Modal,
+  NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
 
+import {SinkPage} from '../sink-page';
 
 @Component({
   selector: 'ion-view'
 })
 @IonicView({
   template: `
-  <ion-navbar *navbar><ion-title>Modal</ion-title></ion-navbar>
+  <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Modal</ion-title></ion-navbar>
 
   <ion-content class="padding">
     <h2>Modal</h2>
@@ -24,19 +26,16 @@ import {IonicView, ActionMenu, Modal, NavbarTemplate, Navbar, NavController, Con
   </ion-content>
   `
 })
-export class ModalPage {
-  constructor(modal: Modal) {
+export class ModalPage extends SinkPage {
+  constructor(app: IonicApp, modal: Modal) {
+    super(app);
     this.modal = modal;
   }
 
   openModal() {
     console.log('Opening modal');
 
-    this.modal.open(MyModal, {
-      enterAnimation: 'my-fade-in',
-      leaveAnimation: 'my-fade-out',
-      handle: 'my-awesome-modal'
-    });
+    this.modal.open(MyModal);
   }
 }
 
diff --git a/ionic/components/app/test/sink/pages/search-bar.ts b/ionic/components/app/test/sink/pages/search-bar.ts
index fde7203635..864351c1ac 100644
--- a/ionic/components/app/test/sink/pages/search-bar.ts
+++ b/ionic/components/app/test/sink/pages/search-bar.ts
@@ -1,9 +1,10 @@
 import {Component, Directive, View} from 'angular2/angular2';
 import {FormBuilder, Validators, formDirectives, ControlGroup} from 'angular2/forms';
 
-import {Segment, SegmentButton, SearchBar, List, Item, ActionMenu, Modal, ModalRef,
+import {IonicApp, Segment, SegmentButton, SearchBar, List, Item, ActionMenu, Modal, ModalRef,
   NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
 
+import {SinkPage} from '../sink-page';
 
 @Component({
   selector: 'ion-view',
@@ -11,7 +12,7 @@ import {Segment, SegmentButton, SearchBar, List, Item, ActionMenu, Modal, ModalR
 })
 @View({
   template: `
-  <ion-navbar *navbar><ion-title>Search Bar</ion-title></ion-navbar>
+  <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Search Bar</ion-title></ion-navbar>
 
   <ion-content class="padding">
     <h2>Search Bar</h2>
@@ -23,8 +24,8 @@ import {Segment, SegmentButton, SearchBar, List, Item, ActionMenu, Modal, ModalR
       or it can also handle and display a list of search results.
     </p>
 
-    <form (^submit)="doSubmit($event)" [control-group]="form">
-      <ion-search-bar placeholder="Search" control="searchQuery"></ion-search-bar>
+    <form (^submit)="doSubmit($event)" [ng-form-model]="form">
+      <ion-search-bar placeholder="Search" ng-control="searchQuery"></ion-search-bar>
       <div>
         Query: <b>{{form.controls.searchQuery.value}}</b>
       </div>
@@ -33,8 +34,10 @@ import {Segment, SegmentButton, SearchBar, List, Item, ActionMenu, Modal, ModalR
   `,
   directives: [formDirectives, NavbarTemplate, Navbar, Content, SearchBar]
 })
-export class SearchBarPage {
-  constructor(formBuilder: FormBuilder) {
+export class SearchBarPage extends SinkPage {
+  constructor(app: IonicApp, formBuilder: FormBuilder) {
+    super(app);
+
     //var fb = new FormBuilder();
     this.form = formBuilder.group({
       searchQuery: ['', Validators.required]
diff --git a/ionic/components/app/test/sink/pages/slides.ts b/ionic/components/app/test/sink/pages/slides.ts
index 2eaece5bb4..43834938ef 100644
--- a/ionic/components/app/test/sink/pages/slides.ts
+++ b/ionic/components/app/test/sink/pages/slides.ts
@@ -1,15 +1,16 @@
 import {Component, Directive, View} from 'angular2/angular2';
 
-import {Slides, Slide, SlidePager, List, Item, ActionMenu, Modal, ModalRef,
+import {IonicApp, Slides, Slide, SlidePager, List, Item, ActionMenu, Modal, ModalRef,
   NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
 
+import {SinkPage} from '../sink-page';
 
 @Component({
   selector: 'ion-view'
 })
 @View({
   template: `
-  <ion-navbar *navbar><ion-title>Sink</ion-title></ion-navbar>
+  <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Slides</ion-title></ion-navbar>
 
   <ion-content class="padding">
     <h2>Slides</h2>
@@ -20,7 +21,7 @@ import {Slides, Slide, SlidePager, List, Item, ActionMenu, Modal, ModalRef,
       Slides are perfect for making image slideshows,
       swipe tutorials, or document viewers.
     </p>
-    <ion-slides>
+    <ion-slides style="left: -15px; right: -15px; height: 100px">
       <ion-slide style="background-color: blue">
         <h2>Page 1</h2>
       </ion-slide>
@@ -43,7 +44,8 @@ import {Slides, Slide, SlidePager, List, Item, ActionMenu, Modal, ModalRef,
   `,
   directives: [NavbarTemplate, Navbar, Content, Slides, Slide, SlidePager]
 })
-export class SlidePage {
-  constructor() {
+export class SlidePage extends SinkPage {
+  constructor(app: IonicApp) {
+    super(app);
   }
 }
diff --git a/ionic/components/app/test/sink/pages/tabs.ts b/ionic/components/app/test/sink/pages/tabs.ts
index fcbc8ea1da..719b379d67 100644
--- a/ionic/components/app/test/sink/pages/tabs.ts
+++ b/ionic/components/app/test/sink/pages/tabs.ts
@@ -1,20 +1,40 @@
 import {Component, Directive, View} from 'angular2/angular2';
 import {FormBuilder, Validators, formDirectives, ControlGroup} from 'angular2/forms';
 
-import {NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
+import {IonicApp, Tabs, Tab, NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
 
+import {SinkPage} from '../sink-page';
 
 @Component({
   selector: 'ion-view'
 })
 @View({
   template: `
-    <ion-navbar *navbar><ion-title>Tabs</ion-title></ion-navbar>
-    <ion-content class="padding"></ion-content>
+    <ion-navbar *navbar><ion-nav-items primary><button icon (^click)="toggleMenu()"><i class="icon ion-navicon"></i></button></ion-nav-items><ion-title>Tabs</ion-title></ion-navbar>
+    <ion-tabs>
+
+      <ion-tab tab-title="Tab 1" tab-icon="ion-home">
+
+        <ion-content class="padding">
+          Tab 1 Content
+        </ion-content>
+
+      </ion-tab>
+
+      <ion-tab tab-title="Tab 2" tab-icon="ion-star">
+
+        <ion-content class="padding">
+          Tab 2 Content
+        </ion-content>
+
+      </ion-tab>
+
+    </ion-tabs>
   `,
-  directives: [NavbarTemplate, Navbar, Content]
+  directives: [NavbarTemplate, Navbar, Content, Tabs, Tab]
 })
-export class TabsPage {
-  constructor() {
+export class TabsPage extends SinkPage {
+  constructor(app: IonicApp) {
+    super(app);
   }
 }