Reviving Action Menu

This commit is contained in:
Max Lynch
2015-05-29 18:18:46 -05:00
parent 61cfd347fd
commit 00e906083b
4 changed files with 67 additions and 48 deletions

View File

@ -1,5 +1,5 @@
// DON'T reference this file in the source. Only in demos.
// export * from 'ionic/components/action-menu/action-menu'
export * from 'ionic/components/action-menu/action-menu'
// export * from 'ionic/components/alert/alert'
export * from 'ionic/components/aside/aside'
export * from 'ionic/components/button/button'

View File

@ -1,49 +1,63 @@
// import {NgElement, Component, View, Parent} from 'angular2/angular2'
// import {IonicComponent} from 'ionic/config/component'
// import {Icon} from 'ionic/components/icon/icon'
// import {Item} from 'ionic/components/item/item'
import {DynamicComponentLoader, ElementRef, ComponentRef, onDestroy, DomRenderer} from 'angular2/angular2';
import {bind, Injector} from 'angular2/di';
import {Promise} from 'angular2/src/facade/async';
import {isPresent, Type} from 'angular2/src/facade/lang';
import {Component, Directive, Item, Icon} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view';
import {Parent} from 'angular2/src/core/annotations_impl/visibility';
import {IonicComponent} from 'ionic/config/component'
import {raf, ready} from 'ionic/util/dom'
import {Animation} from 'ionic/animations/animation';
// @Component({
// selector: 'ion-action-menu'
// })
// @View({
// template: `
// <div class="overlay-backdrop"></div>
// <div class="overlay-container">
// <div class="action-menu-container">
@Component({
selector: 'ion-action-menu'
})
@View({
template: `
<div class="overlay-backdrop"></div>
<div class="overlay-container">
<div class="action-menu-container">
// <div class="list-header">Action Menu List Header</div>
// <div class="list">
// <button ion-item class="item">
// Button 1
// </button>
// <button ion-item class="item">
// Button 2
// </button>
// </div>
<div class="list-header">Action Menu List Header</div>
<div class="list">
<button ion-item class="item">
Button 1
</button>
<button ion-item class="item">
Button 2
</button>
</div>
// <div class="list-header">Action Menu Label</div>
// <div class="list">
// <button ion-item class="item">Button 1</button>
// <button ion-item class="item">Button 2</button>
// </div>
<div class="list-header">Action Menu Label</div>
<div class="list">
<button ion-item class="item">Button 1</button>
<button ion-item class="item">Button 2</button>
</div>
// <div class="list">
// <button ion-item class="item">Button 1</button>
// </div>
<div class="list">
<button ion-item class="item">Button 1</button>
</div>
// </div>
// </div>`,
// directives: [Item,Icon]
// })
// export class ActionMenu {
// constructor(
// @NgElement() ngElement:NgElement
// ) {
// this.domElement = ngElement.domElement
// this.config = ActionMenu.config.invoke(this)
// }
// }
</div>
</div>`,
directives: [Item,Icon]
})
export class ActionMenu {
constructor(
elementRef: ElementRef
) {
this.domElement = elementRef.domElement
this.config = ActionMenu.config.invoke(this)
}
// new IonicComponent(ActionMenu, {})
static open(opts) {
console.log('Opening menu', opts);
}
}
new IonicComponent(ActionMenu, {})

View File

@ -8,12 +8,18 @@ import {ActionMenu} from 'ionic/components/action-menu/action-menu';
@Component({ selector: 'ion-app' })
@View({
templateUrl: 'main.html',
directives: [ActionMenu]
})
class IonicApp {
constructor() {
console.log('IonicApp Start')
}
openMenu() {
console.log('Opening ActionMenu')
ActionMenu.open({
title: 'Do you really want to?'
})
}
}
export function main() {

View File

@ -1,4 +1,3 @@
<ion-action-menu>
</ion-action-menu>
<ion-content padding>
<button primary (click)="openMenu()">Open Menu</button>
</ion-content>