refactor and fix side-menu

This commit is contained in:
Roman Hotsiy 2015-12-21 21:39:27 +02:00
parent 8c30bf90c9
commit a3d60a3549

View File

@ -4,6 +4,7 @@ import {RedocComponent, BaseComponent} from '../base';
import {NgZone, ChangeDetectionStrategy} from 'angular2/core'; import {NgZone, ChangeDetectionStrategy} from 'angular2/core';
import {redocEvents} from '../../events'; import {redocEvents} from '../../events';
import detectScollParent from 'scrollparent'; import detectScollParent from 'scrollparent';
import {document} from 'angular2/src/facade/browser';
import {BrowserDomAdapter} from 'angular2/platform/browser'; import {BrowserDomAdapter} from 'angular2/platform/browser';
import {global} from 'angular2/src/facade/lang'; import {global} from 'angular2/src/facade/lang';
@ -22,15 +23,16 @@ const INVIEW_POSITION = {
@RedocComponent({ @RedocComponent({
selector: 'side-menu', selector: 'side-menu',
providers: [BrowserDomAdapter],
templateUrl: './lib/components/SideMenu/side-menu.html', templateUrl: './lib/components/SideMenu/side-menu.html',
styleUrls: ['./lib/components/SideMenu/side-menu.css'], styleUrls: ['./lib/components/SideMenu/side-menu.css'],
changeDetection: ChangeDetectionStrategy.Default changeDetection: ChangeDetectionStrategy.Default
}) })
export default class SideMenu extends BaseComponent { export default class SideMenu extends BaseComponent {
constructor(schemaMgr, zone) { constructor(schemaMgr, adapter, zone) {
super(schemaMgr); super(schemaMgr);
this.zone = zone; this.zone = zone;
this.adapter = new BrowserDomAdapter(); this.adapter = adapter;
this.scrollParent = detectScollParent(document.querySelector('methods-list')); this.scrollParent = detectScollParent(document.querySelector('methods-list'));
@ -51,7 +53,7 @@ export default class SideMenu extends BaseComponent {
} }
hashScroll(evt) { hashScroll(evt) {
let hash = global.location.hash; let hash = this.adapter.getLocation().hash;
if (!hash) return; if (!hash) return;
hash = hash.substr(1); hash = hash.substr(1);
@ -64,10 +66,16 @@ export default class SideMenu extends BaseComponent {
bindEvents() { bindEvents() {
this.prevOffsetY = this.scrollY(); this.prevOffsetY = this.scrollY();
let view = document.querySelector('redoc'); this.viewBoxTop = this.scrollParent.offsetTop || 0;
this.viewBoxTop = view.offsetTop; this._cancel = {};
this.adapter.on(this.scrollParent, 'scroll', () => this.scrollHandler()); this._cancel.scroll = this.adapter.onAndCancel(this.scrollParent, 'scroll', () => { this.scrollHandler(); });
this.adapter.on(global, 'hashchange', evt => this.hashScroll(evt)); this._cancel.hash = this.adapter.onAndCancel(global, 'hashchange', evt => this.hashScroll(evt));
}
destroy() {
this._cancel.scroll();
this._cancel.hash();
console.log('destroyed');
} }
activateAndScroll(idx, methodIdx) { activateAndScroll(idx, methodIdx) {
@ -76,6 +84,7 @@ export default class SideMenu extends BaseComponent {
} }
scrollTo(el) { scrollTo(el) {
// TODO: rewrite this to use offsetTop as more reliable solution
let subjRect = el.getBoundingClientRect(); let subjRect = el.getBoundingClientRect();
let offset = this.scrollY() + subjRect.top - this.viewBoxTop + 1; let offset = this.scrollY() + subjRect.top - this.viewBoxTop + 1;
if (this.scrollParent.scrollTo) { if (this.scrollParent.scrollTo) {
@ -196,4 +205,4 @@ export default class SideMenu extends BaseComponent {
this.changeActive(CHANGE.INITIAL); this.changeActive(CHANGE.INITIAL);
} }
} }
SideMenu.parameters = SideMenu.parameters.concat([NgZone]); SideMenu.parameters = SideMenu.parameters.concat([[BrowserDomAdapter], [NgZone]]);