<file_sep>import React, { Component } from 'react';

class Home extends Component {
  constructor(){
    super();
    this.parallaxArray = [5];
    for(let i = 0; i < 5; i++){
      this.parallaxArray[i] = React.createRef();
    }
    //this.state = {parallaxArray: this.parallaxArray};
    this.handleScroll = this.handleScroll.bind(this);
  }
  componentDidMount(){
    window.addEventListener('scroll', this.handleScroll);
  }
  componentWillUnmount(){
    window.removeEventListener('scroll', this.handleScroll);
  }
  handleScroll(e){
    /*for(let i = 0; i < 5; i++){
      this.parallaxArray[i].style = {transform: `translate3d(0px, ${i * 5}px, 0px)`};
    }*/
    console.log("hello world");
  }
  render() {
    return (
      <div id="homewrapper">
        <div id="home">
          <div className="parallax" ref={this.parallaxArray[0]}></div>
          <div className="parallax" ref={this.parallaxArray[1]}></div>
          <div className="parallax" ref={this.parallaxArray[2]}></div>
          <div className="parallax" ref={this.parallaxArray[3]}></div>
          <div className="parallax" ref={this.parallaxArray[4]}></div>
        </div>
      </div>
    );
  }
}

export default Home;
<file_sep>import React, { Component } from 'react';

class Tools extends Component {
  render() {
    return (
      <div id="toolswrapper">
        <div id="tools"></div>
      </div>
    );
  }
}

export default Tools;
<file_sep>import React, { Component } from 'react';
import { NavLink } from 'react-router-dom';
class Header extends Component {
  constructor(props){
    super(props);
    this.state = {breadcrumbs: []};
  }
  componentDidMount(){
    let patharray = this.props.location.pathname.split('/');
    this.setState({breadcrumbs: patharray});
  }
  componentDidUpdate(prevProps){
    if(this.props.location.pathname !== prevProps.location.pathname){
      let patharray = this.props.location.pathname.split('/');
      this.setState({breadcrumbs: patharray});
    }
  }
  render() {
    for (let i = 0; i < this.state.breadcrumbs.length; i++){
      if(this.state.breadcrumbs[i] !== ""){
        /*let test = "";
        for (let i2 = 0; i2 < i; i--){
          //test += this.state.breadcrumbs[i];
          console.log("aaa");
        }*/
        console.log(this.state.breadcrumbs[i]);
      }
    }
    return (
      <div id="header">
        <div id="shimapanempty"></div>
        <div id="shimapanblue">
        </div>
        <div id="shimapanlightblue"></div>
        <div id="shimapanwhite"></div>
      </div>
    );
  }
}

export default Header;
<file_sep>import React, { Component } from 'react';

class Editbar extends Component {
  render() {
    return (
      <div id="editbarwrapper">
        <div id="editbar"></div>
      </div>
    );
  }
}

export default Editbar;<file_sep>import React, { Component } from 'react';
import {
    UncontrolledDropdown,
    DropdownToggle,
    DropdownMenu,
    DropdownItem
} from 'reactstrap';
import{
    NavLink
} from 'react-router-dom';
class Navbar extends Component {
    render() {
        return (
            <div id="navbar">
                <NavLink to="/" id="logogroup">
                    <div id="logoimage"></div>
                    <div id="logotext">Vastestness</div>
                </NavLink>
                <div id="exploregroup">
                    <UncontrolledDropdown id="uncontrolleddropdown" nav inNavbar>
                        <DropdownToggle id="explorebutton" nav caret>
                            EXPLORE
                </DropdownToggle>
                        <DropdownMenu left="true">
                            <NavLink to="/post/art" className="exploreoptions">
                                Art
                            </NavLink>
                            <NavLink to="/post/music" className="exploreoptions">
                                Music
                            </NavLink>
                            
                            <NavLink to="/post/code" className="exploreoptions">
                                Code
                            </NavLink>
                            
                            <DropdownItem className="exploreoptions" divider />
                            <NavLink to="/tools" className="exploreoptions">
                                Tools
                            </NavLink>
                            
                        </DropdownMenu>
                    </UncontrolledDropdown>
                </div>
                <div id="searchgroup">
                    <form id="searchform">
                        <input type="text" placeholder="Search"></input>
                        <button id="searchbutton"></button>
                    </form>
                </div>
            </div>
        );
    }
}

export default Navbar;
