diff --git a/ionic/components/checkbox/checkbox.js b/ionic/components/checkbox/checkbox.js index fd55592de9..1beef7d232 100644 --- a/ionic/components/checkbox/checkbox.js +++ b/ionic/components/checkbox/checkbox.js @@ -4,19 +4,11 @@ import {Component, Directive} from 'angular2/src/core/annotations_impl/annotatio import {Ancestor} from 'angular2/src/core/annotations_impl/visibility'; import {View} from 'angular2/src/core/annotations_impl/view'; -import {ControlGroup, ControlDirective} from 'angular2/forms' -import {IonicComponent} from 'ionic/config/component' +//import {ControlGroup, ControlDirective} from 'angular2/forms'; +import {IonicComponentNEW} from '../../config/component'; -@Component({ - selector: 'ion-checkbox', - properties: [ - 'checked' - ], - hostListeners: { - '^click': 'onClick($event)' - } -}) +@IonicComponentNEW(Checkbox) @View({ template: `
@@ -25,48 +17,44 @@ import {IonicComponent} from 'ionic/config/component'
-
-
` }) export class Checkbox { + + static get config() { + return { + selector: 'ion-checkbox', + properties: [ + 'checked' + ], + hostListeners: { + '^click': 'onClick($event)' + }, + hostAttributes: { + 'role': 'checkbox' + }, + defaultProperties: { + 'iconOff': 'ion-ios-circle-outline', + 'iconOn': 'ion-ios-checkmark' + } + } + } + constructor( - elementRef: ElementRef, - cd: ControlDirective - // @PropertySetter('attr.role') setAriaRole: Function, - // @PropertySetter('attr.aria-checked') setAriaChecked: Function, - // @PropertySetter('attr.aria-invalid') setAriaInvalid: Function, - // @PropertySetter('attr.aria-disabled') setAriaDisabled: Function + elementRef: ElementRef//, +// cd: ControlDirective ) { this.domElement = elementRef.domElement this.domElement.classList.add('item') - this.controlDirective = cd; - cd.valueAccessor = this; - - let setAriaRole = (v) => this.domElement.setAttribute('aria-role', v) - let setAriaChecked = (v) => this.domElement.setAttribute('aria-checked', v) - let setAriaInvalid = (v) => this.domElement.setAttribute('aria-invalid', v) - let setAriaDisabled = (v) => this.domElement.setAttribute('aria-disabled', v) - - this.config = Checkbox.config.invoke(this); - - setAriaRole('checkbox') - setAriaInvalid('false') - setAriaDisabled('false') - - this.setAriaRole = setAriaRole - this.setAriaChecked = setAriaChecked - this.setAriaInvalid = setAriaInvalid - this.setAriaDisabled = setAriaDisabled - - this.setCheckedProperty = setAriaChecked + // this.controlDirective = cd; + // cd.valueAccessor = this; // TODO: This is a hack and not a very good one at that - this.domElement.querySelector('.checkbox-off').classList.add(this.config.properties.iconOff.defaults.ios); - this.domElement.querySelector('.checkbox-on').classList.add(this.config.properties.iconOn.defaults.ios); + // this.domElement.querySelector('.checkbox-off').classList.add(this.config.properties.iconOff.defaults.ios); + // this.domElement.querySelector('.checkbox-on').classList.add(this.config.properties.iconOn.defaults.ios); } /** @@ -80,8 +68,7 @@ export class Checkbox { set checked(checked) { this._checked = checked - this.setCheckedProperty(checked) - this.controlDirective._control().updateValue(this._checked); + //this.controlDirective._control().updateValue(this._checked); } get checked() { return this._checked @@ -89,23 +76,5 @@ export class Checkbox { onClick() { this.checked = !this.checked; } -} -new IonicComponent(Checkbox, { - properties: { - iconOff: { - defaults: { - ios: 'ion-ios-circle-outline', - android: 'ion-android-checkbox-outline-blank', - core: 'ion-android-checkbox-outline-blank' - } - }, - iconOn: { - defaults: { - ios: 'ion-ios-checkmark', - android: 'ion-android-checkbox', - core: 'ion-android-checkbox', - } - } - } -}) +} diff --git a/ionic/components/checkbox/test/basic/index.js b/ionic/components/checkbox/test/basic/index.js index dd783f02d7..bb60694f6d 100644 --- a/ionic/components/checkbox/test/basic/index.js +++ b/ionic/components/checkbox/test/basic/index.js @@ -1,22 +1,21 @@ -import {bootstrap} from 'angular2/angular2' import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; import {View} from 'angular2/src/core/annotations_impl/view'; -import {FormBuilder, Validators, FormDirectives, ControlGroup} from 'angular2/forms'; +//import {FormBuilder, Validators, FormDirectives, ControlGroup} from 'angular2/forms'; import {Checkbox, Content, Button, List} from 'ionic/ionic'; //import {IONIC_DIRECTIVES} from 'ionic/ionic' @Component({ selector: 'ion-view' }) @View({ templateUrl: 'main.html', - directives: [FormDirectives].concat([Checkbox, List, Content, Button]) + directives: [Checkbox, List, Content, Button] }) export default class IonicApp { constructor() { - var fb = new FormBuilder(); - this.form = fb.group({ - addCats: ['yes', Validators.required] - }); + // var fb = new FormBuilder(); + // this.form = fb.group({ + // addCats: ['yes', Validators.required] + // }); } doSubmit(event) { diff --git a/ionic/components/tabs/tabs.js b/ionic/components/tabs/tabs.js index e9163cc9c8..54bc7102a8 100644 --- a/ionic/components/tabs/tabs.js +++ b/ionic/components/tabs/tabs.js @@ -33,6 +33,16 @@ import {IonicComponentNEW} from '../../config/component'; }) export class Tabs extends ViewController { + static get config() { + return { + selector: 'ion-tabs', + defaultProperties: { + 'tabBarPlacement': 'bottom', + 'tabBarIcons': 'top' + } + } + } + constructor( @Optional() parentViewCtrl: ViewController, @Optional() viewItem: ViewItem, @@ -120,14 +130,4 @@ export class Tabs extends ViewController { return this.instances(); } - static get config() { - return { - selector: 'ion-tabs', - defaultProperties: { - 'tabBarPlacement': 'bottom', - 'tabBarIcons': 'top' - } - } - } - }