diff --git a/ionic/components/tabs/tab.js b/ionic/components/tabs/tab.js index d24e26e813..03a27e5879 100644 --- a/ionic/components/tabs/tab.js +++ b/ionic/components/tabs/tab.js @@ -26,8 +26,8 @@ import {IonicComponent} from 'ionic/config/component'; hostProperties: { 'panelId': 'attr.id', 'labeledBy': 'attr.aria-labelledby', - 'ariaHidden': 'attr.aria-hidden', - 'isSelected': 'class.show-tab' + '!isSelected': 'attr.aria-hidden', + 'isSelected': 'class.tab-selected' }, hostAttributes: { 'role': 'tabpanel' @@ -58,7 +58,6 @@ export class Tab { this.navBase.panes['_n'] = this; this.isSelected = false; - this.ariaHidden = true; tabs.addTab(this); this.panelId = 'tab-panel-' + this.id; @@ -83,7 +82,6 @@ export class Tab { } this.isSelected = shouldSelect; - this.ariaHidden = !shouldSelect; } } diff --git a/ionic/components/tabs/tabs.js b/ionic/components/tabs/tabs.js index caea0de063..14f5ff1615 100644 --- a/ionic/components/tabs/tabs.js +++ b/ionic/components/tabs/tabs.js @@ -47,6 +47,7 @@ export class Tabs { this.id = ++tabsId; this.tabIds = 0; this.tabs = []; + this._selected = null; this.domElement = elementRef.domElement; this.config = Tabs.config.invoke(this); @@ -75,6 +76,8 @@ export class Tabs { } if (!tabToSelect || this._selected === tabToSelect) return; + let tabToDeselect = this._selected; + this.tabs.forEach(tab => { tab.select( (tab === tabToSelect) ); }); diff --git a/ionic/components/tabs/test/advanced/pages/tabs.html b/ionic/components/tabs/test/advanced/pages/tabs.html index b5343ba623..dbb38f0616 100644 --- a/ionic/components/tabs/test/advanced/pages/tabs.html +++ b/ionic/components/tabs/test/advanced/pages/tabs.html @@ -4,7 +4,13 @@ - + + + diff --git a/ionic/tabs.js b/ionic/tabs.js deleted file mode 100644 index dd9b431bca..0000000000 --- a/ionic/tabs.js +++ /dev/null @@ -1,107 +0,0 @@ -import {Ancestor, Parent} from 'angular2/src/core/annotations_impl/visibility'; -import {Optional} from 'angular2/src/di/annotations_impl' -import {Directive, Component, onInit} from 'angular2/src/core/annotations_impl/annotations'; -import {View} from 'angular2/src/core/annotations_impl/view'; -import {ElementRef} from 'angular2/src/core/compiler/element_ref'; -import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_component_loader'; -import {Injector} from 'angular2/di'; -import {NgFor} from 'angular2/angular2'; -import {ViewContainerRef} from 'angular2/src/core/compiler/view_container_ref'; - -import {IonicComponent} from '../../config/component'; -import {Tab} from './tab'; -import {TabButton} from './tab-button'; -import {Icon} from '../icon/icon'; -import {Nav, NavPane} from '../nav/nav'; -import {NavBase} from '../nav/nav-base'; -import {NavItem} from '../nav/nav-item'; - - -let tabsId = -1; - -@Component({ - selector: 'ion-tabs', - properties: [ - 'tabBarPlacement', - 'tabBarIcons' - ], - lifecycle: [onInit] -}) -@View({ - template: ` - -
- -
- `, - directives: [NgFor, TabButton, Icon] -}) -export class Tabs { - constructor( - elementRef: ElementRef, - @Optional() parentNavBase: NavBase - ) { - this.id = ++tabsId; - this.tabIds = 0; - this.tabs = []; - - this.domElement = elementRef.domElement; - this.config = Tabs.config.invoke(this); - - console.log('Tabs constructor', this.id, ' parentNavBase:', parentNavBase); - } - - onInit() { - if (this.tabs.length > 0) { - this.selectTab(this.tabs[0]); - } - } - - addTab(tab) { - tab.id = this.id + '' + (++this.tabIds); - this.tabs.push(tab); - } - - selectTab(tabToSelect) { - if (typeof tabToSelect === 'number') { - let index = tabToSelect; - tabToSelect = null; - if (index < this.tabs.length) { - tabToSelect = this.tabs[index]; - } - } - if (!tabToSelect || this._selected === tabToSelect) return; - - this.tabs.forEach(tab => { - tab.select( (tab === tabToSelect) ); - }); - - this._selected = tabToSelect; - } - -} -new IonicComponent(Tabs, { - properties: { - tabBarPlacement: { - defaults: { - ios: 'bottom', - android: 'top', - core: 'bottom' - } - }, - tabBarIcons: { - defaults: { - ios: 'top', - android: 'top', - core: 'top' - } - } - } -});