javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-24 23:01:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

decouple content from aside 100%

Browse Source
This commit is contained in:
Andrew
2015-03-25 20:07:03 -06:00
parent 8e3d03975c
commit b6579f4be2
4 changed files with 17 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/app/_util.scss
View File

@ -1,5 +1,5 @@
.notransition { .no-transition {
transition: none !important; transition: none !important;
} }

6
src/components/aside/aside.js
View File

@ -36,12 +36,6 @@ export class Aside {
config: AsideConfig config: AsideConfig
) { ) {
this.domElement = element.domElement this.domElement = element.domElement
this.transformSetter = transformSetter
// this.noTransitionSetter = noTransitionSetter
this.noTransitionSetter = is => { this.domElement.classList[is?'add':'remove']('notransition') }
this.openSetter = is => { this.domElement.classList[is?'add':'remove']('open') }
// TODO inject constant instead of using domElement.getAttribute // TODO inject constant instead of using domElement.getAttribute
// TODO let config / platform handle defaults transparently // TODO let config / platform handle defaults transparently

25
src/components/aside/extensions/types/types.js
View File

@ -11,17 +11,17 @@ class AsideBaseType {
//FIXME(ajoslin): have to wait for for bindings to apply in a component //FIXME(ajoslin): have to wait for for bindings to apply in a component
setTimeout(() => { setTimeout(() => {
this.aside.content.setIsAside(true); this.aside.content.domElement.classList.add('aside-content')
}) })
} }
setSliding(isSliding) { setSliding(isSliding) {
this.aside.noTransitionSetter(isSliding); this.aside.domElement.classList[isSliding ? 'add' : 'remove']('no-transition');
} }
setOpen(isOpen) { setOpen(isOpen) {
this.aside.openSetter(isOpen); this.aside.domElement.classList[isOpen ? 'add' : 'remove']('open');
} }
setTransform(transform) { setTransform(transform) {
this.aside.transformSetter(transform); this.aside.domElement.style.transform = transform;
} }
} }
@ -30,27 +30,30 @@ export class AsideOverlayType extends AsideBaseType {}
export class AsidePushType extends AsideBaseType { export class AsidePushType extends AsideBaseType {
setSliding(isSliding) { setSliding(isSliding) {
super.setSliding(isSliding); super.setSliding(isSliding);
this.aside.content.noTransitionSetter(isSliding); this.aside.content.domElement.classList[isSliding ? 'add' : 'remove']('no-transition');
} }
setOpen(isOpen) { setOpen(isOpen) {
super.setOpen(isOpen); super.setOpen(isOpen);
this.aside.content.asideOpenSetter(isOpen, this.aside.side); this.aside.content.domElement.classList[isOpen ? 'add' : 'remove'](
`aside-open-${this.aside.side}`
);
} }
setTransform(transform) { setTransform(transform) {
super.setTransform(transform); super.setTransform(transform);
this.aside.content.transformSetter(transform); this.aside.content.domElement.style.transform = transform;
} }
} }
export class AsideRevealType extends AsideBaseType { export class AsideRevealType extends AsideBaseType {
setSliding(isSliding) { setSliding(isSliding) {
this.aside.content.noTransitionSetter(isSliding); this.aside.content.domElement.classList[isSliding ? 'add' : 'remove']('no-transition');
} }
setOpen(isOpen) { setOpen(isOpen) {
super.setOpen(isOpen); this.aside.content.domElement.classList[isOpen ? 'add' : 'remove'](
this.aside.content.asideOpenSetter(isOpen, this.aside.side); `aside-open-${this.aside.side}`
);
} }
setTransform(transform) { setTransform(transform) {
this.aside.content.transformSetter(transform); this.aside.content.domElement.style.transform = transform;
} }
} }

16
src/components/content/content.js
View File

@ -11,21 +11,9 @@ import {NgElement, Component, Template, PropertySetter} from 'angular2/angular2'
}) })
export class Content { export class Content {
constructor( constructor(
@NgElement() ele:NgElement, @NgElement() element:NgElement
@PropertySetter('style.transform') transformSetter: Function,
@PropertySetter('class.notransition') noTransitionSetter: Function
) { ) {
this.domElement = ele.domElement; this.domElement = element.domElement;
this.domElement.classList.add('content'); this.domElement.classList.add('content');
this.noTransitionSetter = is => { this.domElement.classList[is?'add':'remove']('notransition'); }
// this.noTransitionSetter = noTransitionSetter;
this.transformSetter = transformSetter;
this.setIsAside = is => { this.domElement.classList.add('aside-content'); };
this.asideOpenSetter = (is, side) => {
this.domElement.classList[is?'add':'remove'](`aside-open-${side}`);
}
} }
} }