javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 03:32:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs(demos): add basic popup

Browse Source
This commit is contained in:
Drew Rygh
2015-10-07 12:48:39 -05:00
parent ef36fc2455
commit 8aa3e3e842
2 changed files with 38 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
demos/component-docs/index.ts
View File

@ -1,6 +1,6 @@
import {FORM_DIRECTIVES, FormBuilder, Validators, Control, ControlGroup} from 'angular2/forms';
import {App, IonicApp, ActionSheet, NavController, NavParams} from 'ionic/ionic';
import {Modal, IonicView, IonicConfig, Events, Animation} from 'ionic/ionic';
import {Popup, Modal, IonicView, IonicConfig, Events, Animation} from 'ionic/ionic';
import {NavigationDetailsPage} from 'navigation';
import {TabsPage} from 'tabs';
@ -20,12 +20,14 @@ export class MainPage {
nav: NavController,
actionSheet: ActionSheet,
params: NavParams,
popup: Popup,
modal: Modal,
events: Events)
{
this.params = params;
this.nav = nav;
this.modal = modal;
this.popup = popup;
this.actionSheet = actionSheet;
this.navDetailsPage = NavigationDetailsPage;
this.demoModal = DemoModal;
@ -41,7 +43,8 @@ export class MainPage {
zone.run(() => {
if (e.data) {
var data = JSON.parse(e.data);
this.component.title = helpers.toTitleCase(data.hash.replace('-', ' '));
this.component.title = helpers.toTitleCase(data.hash.replace(/-/g, ' '));
console.log(this.component.title);
if (this.component.title === 'Tabs') {
this.nav.setRoot(TabsPage);
}
@ -102,6 +105,15 @@ export class MainPage {
});
}
// **************************
// Popup
// **************************
showPopup() {
this.popup.alert("Popup Title").then(() => {
});
}
// **************************
// Form
// **************************

31
demos/component-docs/main.html
View File

@ -123,32 +123,43 @@
<button dark outline>Dark</button>
</p>
</section>
</section>
<section id="outline-buttons" [ng-class]="{hidden: component.title !== 'Outline Buttons' }" class="section-padding">
<section id="round-buttons" [ng-class]="{hidden: component.title !== 'Round Buttons' }" class="section-padding">
<p>
<button outline>Default</button>
<button round>Default</button>
</p>
<p>
<button secondary outline>Secondary</button>
<button secondary round>Secondary</button>
</p>
<p>
<button danger outline>Danger</button>
<button danger round>Danger</button>
</p>
<p>
<button light outline>Light</button>
<button light round>Light</button>
</p>
<p>
<button dark outline>Dark</button>
<button dark round>Dark</button>
</p>
</section>
<section id="floating-action-buttons" [ng-class]="{hidden: component.title !== 'Floating Action Buttons' }" class="section-padding">
<p>
<button fab fab-top fab-right>
<icon add></icon>
</button>
</p>
</section>
<section id="button-sizes" [ng-class]="{hidden: component.title !== 'Button Sizes' }" class="section-padding">
<p>
@ -428,6 +439,12 @@
</section>
<section id="popup" [ng-class]="{hidden: component.title !== 'Popups' }" class="section-padding">
<button block (click)="showPopup()">
Show Popup
</button>
</section>
<section id="slides" [ng-class]="{hidden: component.title !== 'Slides' }">
<ion-slides id="slider" style="background-color: black" pager="true" zoom="false" index="1" loop="true">