diff --git a/demo/index.html b/demo/index.html
index dce8c797..1351e01a 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -5,6 +5,8 @@
+
+
Loading...
diff --git a/demo/main.css b/demo/main.css
index bd7110a3..50c3f0a7 100644
--- a/demo/main.css
+++ b/demo/main.css
@@ -1,6 +1,23 @@
body {
font-family: Verdana, Geneva, sans-serif;
font-size: 14px;
- padding: 10px 20px;
color: #333;
+ margin: 0;
+}
+
+side-menu, redoc {
+ display: block;
+ padding: 10px 20px;
+ box-sizing: border-box;
+}
+
+side-menu {
+ position: fixed;
+ width: 260px;
+ height: 100%;
+ overflow-y: auto;
+}
+
+redoc {
+ margin-left: 260px;
}
diff --git a/lib/components/SideMenu/side-menu.js b/lib/components/SideMenu/side-menu.js
index a244231f..99934df5 100644
--- a/lib/components/SideMenu/side-menu.js
+++ b/lib/components/SideMenu/side-menu.js
@@ -7,6 +7,12 @@ import {JsonPointer} from '../../utils/JsonPointer';
import {SideMenuCat} from '../SideMenuCat/side-menu-cat';
import {NgZone} from 'angular2/angular2';
+const CHANGE = {
+ NEXT : 1,
+ BACK : -1,
+ HOLD : 0
+};
+
@RedocComponent({
selector: 'side-menu',
bindings: [SchemaManager],
@@ -26,7 +32,7 @@ export class SideMenu extends BaseComponent {
this.prevOffsetY = null;
}
- changeActiveMethod(offset) {
+ _updateActiveMethod(offset) {
let menu = this.data.menu;
let catCount = menu.length;
let catLength = menu[this.activeCatIdx].methods.length;
@@ -50,12 +56,13 @@ export class SideMenu extends BaseComponent {
this.activeMethodIdx = 0;
}
}
- activateNext(offset = 1) {
+
+ changeActive(offset = 1) {
let menu = this.data.menu;
menu[this.activeCatIdx].methods[this.activeMethodIdx].active = false;
menu[this.activeCatIdx].active = false;
-
- this.changeActiveMethod(offset);
+
+ this._updateActiveMethod(offset);
menu[this.activeCatIdx].active = true;
let currentItem = menu[this.activeCatIdx].methods[this.activeMethodIdx];
@@ -71,11 +78,11 @@ export class SideMenu extends BaseComponent {
if (!activeMethodHost) return;
if(isScrolledDown && activeMethodHost.getBoundingClientRect().bottom <= 0 ) {
- this.activateNext(1);
+ this.changeActive(CHANGE.NEXT);
return;
}
if(!isScrolledDown && activeMethodHost.getBoundingClientRect().top > 0 ) {
- this.activateNext(-1);
+ this.changeActive(CHANGE.BACK);
return;
}
}
@@ -90,7 +97,7 @@ export class SideMenu extends BaseComponent {
this.data.menu = Array.from(this.buildMenuTree().entries()).map(
el => ({name: el[0], methods: el[1]})
);
- this.activateNext(0);
+ this.changeActive(CHANGE.HOLD);
}
buildMenuTree() {
diff --git a/lib/index.js b/lib/index.js
index 2a8a0b02..c6056a8b 100644
--- a/lib/index.js
+++ b/lib/index.js
@@ -2,7 +2,7 @@
import 'reflect-metadata';
import { bootstrap } from 'angular2/angular2';
-import { Redoc } from './components/Redoc/redoc';
+import { Redoc, SideMenu } from './components/index';
import { SchemaManager} from './utils/SchemaManager';
export * from './components/index';
@@ -12,8 +12,11 @@ export function init(schemaUrl) {
() => {
return bootstrap(Redoc);
}
- ).then(
+ ).then(() => bootstrap(SideMenu))
+ .then(
() => console.log('ReDoc bootstrapped!'),
error => console.log(error)
);
}
+
+window.Redoc = Redoc;