diff --git a/angular-material/angular-material-tests.ts b/angular-material/angular-material-tests.ts
index cecaf07e67..c707c3e62c 100644
--- a/angular-material/angular-material-tests.ts
+++ b/angular-material/angular-material-tests.ts
@@ -110,3 +110,51 @@ myApp.controller('SidenavController', ($scope: ng.IScope, $mdSidenav: ng.materia
myApp.controller('ToastController', ($scope: ng.IScope, $mdToast: ng.material.IToastService) => {
$scope['openToast'] = () => $mdToast.show($mdToast.simple().textContent('Hello!'));
});
+
+myApp.controller('PanelController', ($scope: ng.IScope, $mdPanel: ng.material.IPanelService) => {
+ $scope['createPanel'] = () => {
+ var config = {
+ template: '
Hello!
',
+ hasBackdrop: true,
+ disableParentScroll: true,
+ zIndex: 150
+ };
+
+ $mdPanel.create(config);
+
+ var panelRef = $mdPanel.create(config);
+ panelRef.open()
+ .then((ref: ng.material.IPanelRef) => {
+ ref.addClass('foo');
+ ref.removeClass('bar');
+ ref.close();
+ })
+ .finally(() => {
+ panelRef = undefined;
+ });
+ };
+
+ $scope['openPanel'] = () => {
+ $mdPanel.open({
+ template: 'Hello!
',
+ hasBackdrop: true,
+ disableParentScroll: true,
+ zIndex: 150
+ })
+ .then((panelRef: ng.material.IPanelRef) => {
+ panelRef.addClass('foo');
+ panelRef.removeClass('bar');
+ panelRef.close();
+ });
+ };
+
+ $scope['newPanelPosition'] = () => {
+ $mdPanel.newPanelPosition().absolute().center();
+ $mdPanel.newPanelPosition().relativeTo('.demo-menu-open-button').addPanelPosition("ALIGN_START", "BELOW");
+ };
+
+ $scope['newPanelAnimation'] = () => {
+ $mdPanel.newPanelAnimation().openFrom('.some-target');
+ $mdPanel.newPanelAnimation().openFrom({top: 0, left: 0});
+ };
+});
diff --git a/angular-material/angular-material.d.ts b/angular-material/angular-material.d.ts
index bb144d15d4..09fcec3539 100644
--- a/angular-material/angular-material.d.ts
+++ b/angular-material/angular-material.d.ts
@@ -92,7 +92,7 @@ declare namespace angular.material {
}
interface IDialogService {
- show(dialog: IDialogOptions|IAlertDialog|IConfirmDialog): angular.IPromise;
+ show(dialog: IDialogOptions|IAlertDialog|IConfirmDialog|IPromptDialog): angular.IPromise;
confirm(): IConfirmDialog;
alert(): IAlertDialog;
prompt(): IPromptDialog;
@@ -277,4 +277,76 @@ declare namespace angular.material {
grey: IPalette;
'blue-grey': IPalette;
}
+
+ interface IPanelConfig {
+ template?: string;
+ templateUrl?: string;
+ controller?: string|Function;
+ controllerAs?: string;
+ bindToController?: boolean; // default: true
+ locals?: {[index: string]: any};
+ resolve?: {[index: string]: angular.IPromise}
+ attachTo?: string|JQuery|Element;
+ panelClass?: string;
+ zIndex?: number; // default: 80
+ position?: IPanelPosition;
+ clickOutsideToClose?: boolean; // default: false
+ escapeToClose?: boolean; // default: false
+ trapFocus?: boolean; // default: false
+ focusOnOpen?: boolean; // default: true
+ fullscreen?: boolean; // default: false
+ animation?: IPanelAnimation;
+ hasBackdrop?: boolean // default: false
+ disableParentScroll?: boolean; // default: false
+ onDomAdded?: Function;
+ onOpenComplete?: Function;
+ onRemoving?: Function;
+ onDomRemoved?: Function;
+ origin?: string|JQuery|Element;
+ }
+
+ interface IPanelRef {
+ id: string;
+ config: IPanelConfig;
+ isAttached: boolean;
+ open(): angular.IPromise;
+ close(): angular.IPromise;
+ attach(): angular.IPromise;
+ detach(): angular.IPromise;
+ show(): angular.IPromise;
+ hide(): angular.IPromise;
+ destroy(): void;
+ addClass(newClass: string): void;
+ removeClass(oldClass: string): void;
+ toggleClass(toggleClass: string): void;
+ focusOnOpen(): void;
+ }
+
+ interface IPanelPosition {
+ absolute(): IPanelPosition;
+ relativeTo(someElement: string|JQuery|Element): IPanelPosition;
+ top(opt_top: string): IPanelPosition; // default: '0'
+ bottom(opt_bottom: string): IPanelPosition; // default: '0'
+ left(opt_left: string): IPanelPosition; // default: '0'
+ right(opt_right: string): IPanelPosition; // default: '0'
+ centerHorizontally(): IPanelPosition;
+ centerVertically(): IPanelPosition;
+ center(): IPanelPosition;
+ addPanelPosition(xPosition: string, yPosition: string): IPanelPosition;
+ withOffsetX(offsetX: string): IPanelPosition;
+ withOffsetY(offsetY: string): IPanelPosition;
+ }
+
+ interface IPanelAnimation {
+ openFrom(from: string|Element|Event|{top: number, left: number}): IPanelAnimation;
+ closeTo(to: string|Element|{top: number, left: number}): IPanelAnimation;
+ withAnimation(cssClass: string|{open: string, close: string}): IPanelAnimation;
+ }
+
+ interface IPanelService {
+ create(opt_config: IPanelConfig): IPanelRef;
+ open(opt_config: IPanelConfig): angular.IPromise;
+ newPanelPosition(): IPanelPosition;
+ newPanelAnimation(): IPanelAnimation;
+ }
}