1
Fork 0
This commit is contained in:
Jake Howard 2016-01-03 13:03:07 +00:00
parent 58448190c8
commit cb94144ab1
4 changed files with 37 additions and 41 deletions

View file

@ -1,10 +1,10 @@
/* global $ */
require('./events.js');
import './events.js';
var React = require('react');
var ProjectImagesTypes = require('./components/index/project-images-types');
var ProjectImagesMain = require('./components/index/project-images-main');
import React from 'react';
import ProjectImagesTypes from './components/index/project-images-types';
import ProjectImagesMain from './components/index/project-images-main';
if ($('body').hasClass('index')) { // Render components on index

View file

@ -1,9 +1,9 @@
var React = require('react');
import React from 'react';
var ReactBootstrap = require('react-bootstrap');
var Col = ReactBootstrap.Col;
var projectImage = React.createClass({
render: function () {
export default class ProjectImage extends React.Component {
render() {
var animationClass = this.props.isHovered ? 'zoomIn' : 'zoomOut';
return (
<Col sm={4} className="project-image">
@ -23,6 +23,4 @@ var projectImage = React.createClass({
</Col>
);
}
});
module.exports = projectImage;
}

View file

@ -1,7 +1,7 @@
var React = require('react');
import React from 'react';
var ReactBootstrap = require('react-bootstrap');
import ProjectImage from './project-image';
var Row = ReactBootstrap.Row;
var ProjectImage = require('./project-image');
const DATA = [
{
@ -42,19 +42,19 @@ const DATA = [
}
];
var projectImagesMain = React.createClass({
keys: [[1, 2, 3], [4, 5, 6]],
getInitialState: function () {
return {
hover: 0,
export default class ProjectImagesMain extends React.Component {
constructor() {
super();
this.keys = [[1, 2, 3], [4, 5, 6]];
this.state = {
hover: 0
};
},
setHovering: function (key) {
this.setHovering = this.setHovering.bind(this);
}
setHovering(key) {
this.setState({hover: key});
},
render: function () {
}
render() {
var generate_image = function (key) {
return (
<ProjectImage isHovered={this.state.hover === key}
@ -76,6 +76,4 @@ var projectImagesMain = React.createClass({
</div>
);
}
});
module.exports = projectImagesMain;
}

View file

@ -1,7 +1,7 @@
var React = require('react');
import React from 'react';
var ReactBootstrap = require('react-bootstrap');
import ProjectImage from './project-image';
var Row = ReactBootstrap.Row;
var ProjectImage = require('./project-image');
const DATA = [
{
@ -24,19 +24,21 @@ const DATA = [
}
];
var projectImagesTypes = React.createClass({
keys: [1, 2, 3],
getInitialState: function () {
return {
hover: 0,
export default class ProjectImagesTypes extends React.Component {
constructor() {
super();
this.keys = [1, 2, 3];
this.state = {
hover: 0
};
},
this.setHovering = this.setHovering.bind(this);
}
setHovering: function (key) {
setHovering(key) {
this.setState({hover: key});
},
render: function () {
}
render() {
var images = this.keys.map(function (key) {
return (
<ProjectImage isHovered={this.state.hover === key}
@ -54,6 +56,4 @@ var projectImagesTypes = React.createClass({
</div>
);
}
});
module.exports = projectImagesTypes;
}