Parallax seems to be working well

This commit is contained in:
James Barnsley
2016-11-28 09:07:18 +13:00
parent 0bd8a0cb25
commit 6101ef264b
2 changed files with 12 additions and 6 deletions

View File

@ -7,6 +7,7 @@ export default class Parallax extends React.Component{
super(props);
this._loading = false
this._loaded = false
this.state = {
scrollTop: 0,
@ -47,6 +48,7 @@ export default class Parallax extends React.Component{
response => {
if( this._mounted ){
this._loading = false
this._loaded = true
this.setState({ url: nextProps.image, image: response, loading: false })
this.updateCanvas( response )
}
@ -56,15 +58,19 @@ export default class Parallax extends React.Component{
}
handleResize(e){
this.updateCanvas( this.state.image );
if( this._loaded ){
this.updateCanvas( this.state.image );
}
}
handleScroll(e){
// this DOES work, but is in no way high-performing and only on Firefox
this.setState(
{ scrollTop: e.pageY },
this.updateCanvas( this.state.image )
)
if( this._loaded ){
this.setState(
{ scrollTop: window.scrollY },
this.updateCanvas( this.state.image )
)
}
}
loadImage( url ){

View File

@ -171,7 +171,7 @@ class Artist extends React.Component{
<li>
{ this.props.artist.followers ? <span>{ this.props.artist.followers.total.toLocaleString() } followers,&nbsp;</span> : null }
{ this.props.artist.popularity ? <span>{ this.props.artist.popularity }% popularity</span> : null }
{ scheme == 'local' ? <span>{ this.props.artist.listeners.toLocaleString() } listeners</span> : null }
{ this.props.artist.listeners && scheme == 'local' ? <span>{ this.props.artist.listeners.toLocaleString() } listeners</span> : null }
</li>
{ scheme == 'spotify' ? <li><FontAwesome name='spotify' /> Spotify artist</li> : null }
{ scheme == 'local' ? <li><FontAwesome name='folder' /> Local artist</li> : null }