mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
Dialogs plugin
This commit is contained in:
@ -11,6 +11,7 @@ import {ContactsPage} from 'pages/contacts';
|
|||||||
import {DevicePage} from 'pages/device';
|
import {DevicePage} from 'pages/device';
|
||||||
import {DeviceMotionPage} from 'pages/device-motion';
|
import {DeviceMotionPage} from 'pages/device-motion';
|
||||||
import {DeviceOrientationPage} from 'pages/device-orientation';
|
import {DeviceOrientationPage} from 'pages/device-orientation';
|
||||||
|
import {DialogsPage} from 'pages/dialogs';
|
||||||
import {GeolocationPage} from 'pages/geolocation';
|
import {GeolocationPage} from 'pages/geolocation';
|
||||||
import {VibrationPage} from 'pages/vibration';
|
import {VibrationPage} from 'pages/vibration';
|
||||||
|
|
||||||
@ -22,12 +23,13 @@ class MyApp {
|
|||||||
this.app = app;
|
this.app = app;
|
||||||
|
|
||||||
this.firstPage = CameraPage;
|
this.firstPage = CameraPage;
|
||||||
|
|
||||||
this.plugins = [
|
this.plugins = [
|
||||||
{title: 'Camera', page: CameraPage},
|
{title: 'Camera', page: CameraPage},
|
||||||
{title: 'Device', page: DevicePage},
|
{title: 'Device', page: DevicePage},
|
||||||
{title: 'Device Motion', page: DeviceMotionPage},
|
{title: 'Device Motion', page: DeviceMotionPage},
|
||||||
{title: 'Device Orientation', page: DeviceOrientationPage},
|
{title: 'Device Orientation', page: DeviceOrientationPage},
|
||||||
|
{title: 'Dialogs', page: DialogsPage},
|
||||||
{title: 'Geolocation', page: GeolocationPage},
|
{title: 'Geolocation', page: GeolocationPage},
|
||||||
{title: 'Contacts', page: ContactsPage},
|
{title: 'Contacts', page: ContactsPage},
|
||||||
{title: 'Battery', page: BatteryPage},
|
{title: 'Battery', page: BatteryPage},
|
||||||
|
34
demos/native/pages/dialogs.ts
Normal file
34
demos/native/pages/dialogs.ts
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
import {IonicView, Dialogs} from 'ionic/ionic';
|
||||||
|
|
||||||
|
|
||||||
|
@IonicView({
|
||||||
|
template: `
|
||||||
|
<ion-navbar *navbar>
|
||||||
|
<a menu-toggle>
|
||||||
|
<icon menu></icon>
|
||||||
|
</a>
|
||||||
|
<ion-title>Dialogs</ion-title>
|
||||||
|
</ion-navbar>
|
||||||
|
<ion-content class="padding">
|
||||||
|
<h2>Device</h2>
|
||||||
|
<button primary outline (click)="doAlert()">Do Alert</button>
|
||||||
|
<button primary outline (click)="doConfirm()">Do Confirm</button>
|
||||||
|
<button primary outline (click)="doPrompt()">Do Prompt</button>
|
||||||
|
</ion-content>
|
||||||
|
`
|
||||||
|
})
|
||||||
|
export class DialogsPage {
|
||||||
|
doAlert() {
|
||||||
|
Dialogs.alert('Hello');
|
||||||
|
}
|
||||||
|
doConfirm() {
|
||||||
|
Dialogs.confirm('Do you want to click that?').then((resp) => {
|
||||||
|
console.log(resp);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
doPrompt() {
|
||||||
|
Dialogs.prompt('What is your fav ice cream?').then((resp) => {
|
||||||
|
console.log(resp);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
85
ionic/native/dialogs/dialogs.ts
Normal file
85
ionic/native/dialogs/dialogs.ts
Normal file
@ -0,0 +1,85 @@
|
|||||||
|
import * as Rx from 'rx';
|
||||||
|
|
||||||
|
import * as util from 'ionic/util';
|
||||||
|
import {NativePlugin} from '../plugin';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* A native dialogs system. Native dialogs can give you a bit more
|
||||||
|
* control over the UI than the browser built-ins, though the Dialogs
|
||||||
|
* plugin will fall back to the built-ins when necessary.
|
||||||
|
*/
|
||||||
|
@NativePlugin({
|
||||||
|
name: 'Dialogs',
|
||||||
|
platforms: {
|
||||||
|
cordova: 'cordova-plugin-dialogs'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
export class Dialogs {
|
||||||
|
/**
|
||||||
|
* Trigger an alert prompt.
|
||||||
|
*
|
||||||
|
* @param message the message to show
|
||||||
|
* @param title the title to show
|
||||||
|
* @param buttonName the button label to use (not available on browser fallback)
|
||||||
|
* @return Promise
|
||||||
|
*/
|
||||||
|
static alert(message, title, buttonName) {
|
||||||
|
return new Promise((resolve,reject) => {
|
||||||
|
if(!navigator.notification) {
|
||||||
|
this.pluginWarn();
|
||||||
|
alert(message);
|
||||||
|
resolve();
|
||||||
|
} else {
|
||||||
|
navigator.notification.alert(message, () => {
|
||||||
|
resolve();
|
||||||
|
}, title, buttonName);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Trigger a confirm prompt.
|
||||||
|
*
|
||||||
|
* @param message the message to show
|
||||||
|
* @param title the title to show
|
||||||
|
* @param buttonLabels the button labels to use (not available on browser fallback)
|
||||||
|
* @return Promise that resolves with the index of the button selected (zero indexed). 1 is OK on browser fallback
|
||||||
|
*/
|
||||||
|
static confirm(message, title, buttonLabels) {
|
||||||
|
return new Promise((resolve,reject) => {
|
||||||
|
if(!navigator.notification) {
|
||||||
|
this.pluginWarn();
|
||||||
|
var ok = confirm(message);
|
||||||
|
// Use 2 as OK
|
||||||
|
resolve(ok ? 2 : 0);
|
||||||
|
} else {
|
||||||
|
navigator.notification.confirm(message, (buttonIndex) => {
|
||||||
|
resolve(buttonIndex - 1);
|
||||||
|
}, title, buttonLabels);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
static prompt(message, title, buttonLabels, defaultText) {
|
||||||
|
return new Promise((resolve,reject) => {
|
||||||
|
if(!navigator.notification) {
|
||||||
|
this.pluginWarn();
|
||||||
|
var response = prompt(message);
|
||||||
|
// Use 1 as OK
|
||||||
|
resolve(response);
|
||||||
|
} else {
|
||||||
|
navigator.notification.prompt(message, (results) => {
|
||||||
|
resolve(results.input1, buttonIndex - 1);
|
||||||
|
}, title, buttonLabels, defaultText);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Beep n times. Not available on browser.
|
||||||
|
* @param times the number of times to beep
|
||||||
|
*/
|
||||||
|
static beep(times) {
|
||||||
|
navigator.notification && navigator.notification.beep(times);
|
||||||
|
}
|
||||||
|
}
|
@ -19,6 +19,11 @@ export class NativePluginDecorator {
|
|||||||
};
|
};
|
||||||
|
|
||||||
cls.pluginWarn = () => {
|
cls.pluginWarn = () => {
|
||||||
|
if(cls._pluginWarned) {
|
||||||
|
// Only warn once
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
let platformString = [];
|
let platformString = [];
|
||||||
for(var k in this.config.platforms) {
|
for(var k in this.config.platforms) {
|
||||||
platformString.push('\t' + k + ': '+ this.config.platforms[k]);
|
platformString.push('\t' + k + ': '+ this.config.platforms[k]);
|
||||||
@ -26,6 +31,9 @@ export class NativePluginDecorator {
|
|||||||
console.warn('Plugin for ' + this.config.name +
|
console.warn('Plugin for ' + this.config.name +
|
||||||
' not installed. For native functionality, please install the correct plugin for your platform:\n' +
|
' not installed. For native functionality, please install the correct plugin for your platform:\n' +
|
||||||
platformString.join('\n'));
|
platformString.join('\n'));
|
||||||
|
|
||||||
|
// Set a flag so we don't warn again
|
||||||
|
cls._pluginWarned = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -2,6 +2,7 @@ export * from './plugin'
|
|||||||
export * from './battery/battery'
|
export * from './battery/battery'
|
||||||
export * from './camera/camera'
|
export * from './camera/camera'
|
||||||
export * from './contacts/contacts'
|
export * from './contacts/contacts'
|
||||||
|
export * from './dialogs/dialogs'
|
||||||
export * from './device/device'
|
export * from './device/device'
|
||||||
export * from './device-motion/device-motion'
|
export * from './device-motion/device-motion'
|
||||||
export * from './device-orientation/device-orientation'
|
export * from './device-orientation/device-orientation'
|
||||||
|
Reference in New Issue
Block a user