mirror of
https://github.com/stolksdorf/homebrewery.git
synced 2025-12-22 18:21:28 +00:00
Made the page contianer update state based on page index rather than scroll valuable, should greatly reduce re-renders.
This commit is contained in:
@@ -14,28 +14,24 @@ var PageContainer = React.createClass({
|
|||||||
},
|
},
|
||||||
getInitialState: function() {
|
getInitialState: function() {
|
||||||
return {
|
return {
|
||||||
scrollPosition: 0
|
viewablePageIndex: 0
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
handleScroll : function(e){
|
handleScroll : function(e){
|
||||||
this.setState({
|
this.setState({
|
||||||
scrollPosition : e.target.scrollTop
|
viewablePageIndex : Math.floor(e.target.scrollTop / PAGE_HEIGHT)
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
getViewablePageIndex : function(){
|
|
||||||
return Math.floor(this.state.scrollPosition / PAGE_HEIGHT);
|
|
||||||
},
|
|
||||||
|
|
||||||
renderDummyPage : function(key){
|
renderDummyPage : function(key){
|
||||||
return <div className='phb' key={key}>
|
return <div className='phb' key={key}>
|
||||||
yo dawg
|
<i className='fa fa-spinner fa-spin' />
|
||||||
</div>
|
</div>
|
||||||
},
|
},
|
||||||
|
|
||||||
renderPages : function(){
|
renderPages : function(){
|
||||||
var currentIndex = this.getViewablePageIndex();
|
var currentIndex = this.state.viewablePageIndex;
|
||||||
return _.map(this.props.text.split('\\page'), (pageText, index) => {
|
return _.map(this.props.text.split('\\page'), (pageText, index) => {
|
||||||
if(currentIndex - 1 == index || currentIndex == index || currentIndex + 1 == index){
|
if(currentIndex - 1 == index || currentIndex == index || currentIndex + 1 == index){
|
||||||
return <div className='phb' dangerouslySetInnerHTML={{__html:Markdown(pageText)}} key={index} />
|
return <div className='phb' dangerouslySetInnerHTML={{__html:Markdown(pageText)}} key={index} />
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "naturalCrit",
|
"name": "naturalCrit",
|
||||||
"description": "A super rad project!",
|
"description": "A super rad project!",
|
||||||
"version": "1.4.0",
|
"version": "1.4.1",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"postinstall": "gulp prod",
|
"postinstall": "gulp prod",
|
||||||
"start": "node server.js"
|
"start": "node server.js"
|
||||||
|
|||||||
Reference in New Issue
Block a user