diff --git a/app/app/components/document/document-sidebar-toc.js b/app/app/components/document/document-sidebar-toc.js index 8151cd59..435ea341 100644 --- a/app/app/components/document/document-sidebar-toc.js +++ b/app/app/components/document/document-sidebar-toc.js @@ -45,27 +45,29 @@ export default Ember.Component.extend(NotifierMixin, TooltipMixin, { didInsertElement() { this.eventBus.subscribe('documentPageAdded', this, 'onDocumentPageAdded'); - - // let s = $(".document-structure"); - // let pos = s.position(); - // - // $(window).scroll(_.throttle(function() { - // let windowpos = $(window).scrollTop(); - // if (windowpos - 200 >= pos.top) { - // s.addClass("stuck-toc"); - // s.css('width', s.parent().width()); - // } else { - // s.removeClass("stuck-toc"); - // s.css('width', 'auto'); - // } - // }, 50)); - }, + }, willDestroyElement() { this.eventBus.unsubscribe('documentPageAdded'); this.destroyTooltips(); }, + // positionToc() { + // let s = $(".document-structure"); + // let pos = s.position(); + // + // $(window).scroll(_.throttle(function() { + // let windowpos = $(window).scrollTop(); + // if (windowpos - 200 >= pos.top) { + // s.addClass("stuck-toc"); + // s.css('width', s.parent().width()); + // } else { + // s.removeClass("stuck-toc"); + // s.css('width', 'auto'); + // } + // }, 50)); + // }, + onDocumentPageAdded(pageId) { this.send('onEntryClick', pageId); }, diff --git a/app/app/components/document/document-sidebar.js b/app/app/components/document/document-sidebar.js index f1fdc1f0..a07e00bc 100644 --- a/app/app/components/document/document-sidebar.js +++ b/app/app/components/document/document-sidebar.js @@ -21,6 +21,7 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { showViews: false, showContributions: false, showSections: false, + showScrollTool: false, didRender() { if (this.session.authenticated) { @@ -30,9 +31,20 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { }, didInsertElement() { - let _this = this; this.eventBus.subscribe('resized', this, 'positionTool'); this.eventBus.subscribe('scrolled', this, 'positionTool'); + + // new Waypoint({ + // element: document.getElementById('zone-header'), + // handler: function(direction) { + // console.log(direction); + // if (direction === 'up') { + // $(".scroll-tool").addClass('hide'); + // console.log("hiding"); + // } + // }, + // offset: 50 + // }); }, willDestroyElement() { @@ -40,14 +52,15 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { }, positionTool() { - let s = $(".section-tool"); - let pos = s.position(); + let s = $(".scroll-tool"); let windowpos = $(window).scrollTop(); - if (windowpos - 200 >= pos.top) { + if (windowpos >= 300) { + this.set('showScrollTool', true); s.addClass("stuck-tool"); s.css('left', parseInt($(".zone-sidebar").css('width')) - 18 + 'px'); } else { + this.set('showScrollTool', false); s.removeClass("stuck-tool"); } }, @@ -101,6 +114,13 @@ export default Ember.Component.extend(TooltipMixin, NotifierMixin, { onAddSection(section) { this.attrs.onAddSection(section); + }, + + scrollTop() { + this.set('showScrollTool', false); + $("html,body").animate({ + scrollTop: 0 + }, 500, "linear"); } } }); diff --git a/app/app/services/event-bus.js b/app/app/services/event-bus.js index a62d82ae..2894c81c 100644 --- a/app/app/services/event-bus.js +++ b/app/app/services/event-bus.js @@ -15,7 +15,7 @@ export default Ember.Service.extend(Ember.Evented, { init() { let _this = this; - window.addEventListener("scroll", _.debounce(function() { + window.addEventListener("scroll", _.throttle(function() { _this.publish('scrolled', null); }, 100)); diff --git a/app/app/styles/view/document/sidebar.scss b/app/app/styles/view/document/sidebar.scss index 7c3bf30e..00867fd9 100644 --- a/app/app/styles/view/document/sidebar.scss +++ b/app/app/styles/view/document/sidebar.scss @@ -63,6 +63,18 @@ z-index: 999; } + .scroll-tool { + position: absolute; + top: 150px; + right: -18px; + z-index: 888; + -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */ + -moz-animation: fadein 1s; /* Firefox < 16 */ + -ms-animation: fadein 1s; /* Internet Explorer */ + -o-animation: fadein 1s; /* Opera < 12.1 */ + animation: fadein 1s; + } + .stuck-tool { position: fixed !important; top: 150px !important; diff --git a/app/app/templates/components/document/document-sidebar.hbs b/app/app/templates/components/document/document-sidebar.hbs index 2c66c26b..eec65770 100644 --- a/app/app/templates/components/document/document-sidebar.hbs +++ b/app/app/templates/components/document/document-sidebar.hbs @@ -34,6 +34,12 @@ {{/if}} + {{#if showScrollTool}} +