diff --git a/mcserver-manager/src/main/resources/components.js b/mcserver-manager/src/main/resources/components.js index 9b7e564..f07bea5 100644 --- a/mcserver-manager/src/main/resources/components.js +++ b/mcserver-manager/src/main/resources/components.js @@ -76,6 +76,7 @@ var ScrollingContent = React.createClass({ ownHeight: 0, scrollRatio: 0, lastPageY: 0, + autoScroll: true, updateScrollParams: function () { this.totalHeight = this.refs.content.scrollHeight; this.ownHeight = this.refs.content.clientHeight; @@ -84,6 +85,10 @@ var ScrollingContent = React.createClass({ var h = this.scrollRatio * 100; if (h < 100) { + if (this.autoScroll) { + this.refs.content.scrollTop = this.totalHeight; + } + this.refs.scroll.style.height = h + "%"; this.refs.scroll.style.top = (this.refs.content.scrollTop / this.totalHeight) * 100 + "%"; } @@ -116,10 +121,17 @@ var ScrollingContent = React.createClass({ document.removeEventListener('mousemove', this.handleMouseMove); document.removeEventListener('mouseup', this.handleMouseUp); }, + handleScroll: function (event) { + var zH = this.refs.gencon.offsetHeight; + var bottomPoint = ((this.refs.content.scrollTop / this.totalHeight) * zH) + + (this.scrollRatio * zH); + + this.autoScroll = (bottomPoint === zH); + }, /*--------------------*/ render: function () { return ( - ce('div', {className: this.props.className}, + ce('div', {className: this.props.className, ref: 'gencon'}, ce('div', {className: 'wrapper'}, ce('div', {className: 'content', ref: 'content'}, this.props.children) ), @@ -130,6 +142,7 @@ var ScrollingContent = React.createClass({ componentDidMount: function () { this.updateScrollParams(); this.refs.scroll.addEventListener('mousedown', this.handleMouseDown); + this.refs.content.addEventListener('scroll', this.handleScroll); var _this = this; this.refs.content.addEventListener('scroll', function(){