diff --git a/static/src/js/app.js b/static/src/js/app.js index ccc311b..7661801 100644 --- a/static/src/js/app.js +++ b/static/src/js/app.js @@ -1,12 +1,14 @@ +/* global $ */ var React = require('react'); var ProjectImagesTypes = require('./components/project-images-types'); var ProjectImagesMain = require('./components/project-images-main'); $(function() { // https://css-tricks.com/snippets/jquery/smooth-scrolling/ $('a[href*=#]:not([href=#])').click(function() { - if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { + if (location.pathname.replace(/^\//, '') === this.pathname.replace(/^\//, '') + && location.hostname === this.hostname) { var target = $(this.hash); - target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); + target = target.length ? target : $('[name=' + this.hash.slice(1) + ']'); if (target.length) { $('html,body').animate({ scrollTop: target.offset().top @@ -17,8 +19,8 @@ $(function() { // https://css-tricks.com/snippets/jquery/smooth-scrolling/ }); }); -$(window).load(function(){ - $(window).trigger('scroll').trigger('resize'); +$(window).load(function() { + $(window).trigger('scroll').trigger('resize'); }); React.render(, document.getElementById('project-images-types')); diff --git a/static/src/js/components/project-image.js b/static/src/js/components/project-image.js index 9cb879d..2a18467 100644 --- a/static/src/js/components/project-image.js +++ b/static/src/js/components/project-image.js @@ -1,6 +1,5 @@ var React = require('react'); var ReactBootstrap = require('react-bootstrap'); -var Row = ReactBootstrap.Row; var Col = ReactBootstrap.Col; var projectImage = React.createClass({ @@ -8,17 +7,17 @@ var projectImage = React.createClass({ var animationClass = this.props.isHovered ? 'zoomIn' : 'zoomOut'; return ( -
-
+
-
+

{this.props.data.title}

{this.props.data.text}

Find out more - -
+ +
@@ -26,4 +25,4 @@ var projectImage = React.createClass({ } }); -module.exports = projectImage; \ No newline at end of file +module.exports = projectImage; diff --git a/static/src/js/components/project-images-main.js b/static/src/js/components/project-images-main.js index 2ee3de3..b9403d0 100644 --- a/static/src/js/components/project-images-main.js +++ b/static/src/js/components/project-images-main.js @@ -5,61 +5,61 @@ var ProjectImage = require('./project-image'); const DATA = [ { - className: "college", - title: "College", - text: "My time at college was where I learnt most about programming, and discovered my skill and passion for it.", - link: "", + className: 'college', + title: 'College', + text: 'My time at college was where I learnt most about programming, and discovered my skill and passion for it.', + link: '', }, { - className: "personal", - title: "Personal", - text: "I write code just to write code, but sometimes it serves a purpose.", - link: "", + className: 'personal', + title: 'Personal', + text: 'I write code just to write code, but sometimes it serves a purpose.', + link: '', }, { - className: "work", - title: "Work", - text: "I'm an apprentice software developer at Dabapps, and this is what I've done.", - link: "", + className: 'work', + title: 'Work', + text: 'I\'m an apprentice software developer at Dabapps, and this is what I\'ve done.', + link: '', }, { - className: "college", - title: "College", - text: "My time at college was where I learnt most about programming, and discovered my skill and passion for it.", - link: "", + className: 'college', + title: 'College', + text: 'My time at college was where I learnt most about programming, and discovered my skill and passion for it.', + link: '', }, { - className: "personal", - title: "Personal", - text: "I write code just to write code, but sometimes it serves a purpose.", - link: "", + className: 'personal', + title: 'Personal', + text: 'I write code just to write code, but sometimes it serves a purpose.', + link: '', }, { - className: "work", - title: "Work", - text: "I'm an apprentice software developer at Dabapps, and this is what I've done.", - link: "", + className: 'work', + title: 'Work', + text: 'I\'m an apprentice software developer at Dabapps, and this is what I\'ve done.', + link: '', } ]; var projectImagesMain = React.createClass({ - keys: [[1,2,3],[4,5,6]], + keys: [[1, 2, 3], [4, 5, 6]], getInitialState: function () { return { hover: 0, }; }, - setHovering: function (key, evt) { + setHovering: function (key) { this.setState({hover: key}); }, render: function () { var generate_image = function (key) { return ( - ); }.bind(this); @@ -78,4 +78,4 @@ var projectImagesMain = React.createClass({ } }); -module.exports = projectImagesMain; \ No newline at end of file +module.exports = projectImagesMain; diff --git a/static/src/js/components/project-images-types.js b/static/src/js/components/project-images-types.js index ec9e67d..61180c0 100644 --- a/static/src/js/components/project-images-types.js +++ b/static/src/js/components/project-images-types.js @@ -5,43 +5,43 @@ var ProjectImage = require('./project-image'); const DATA = [ { - className: "college", - title: "College", - text: "My time at college was where I learnt most about programming, and discovered my skill and passion for it.", - link: "", + className: 'college', + title: 'College', + text: 'My time at college was where I learnt most about programming, and discovered my skill and passion for it.', + link: '', }, { - className: "personal", - title: "Personal", - text: "I write code just to write code, but sometimes it serves a purpose.", - link: "", + className: 'personal', + title: 'Personal', + text: 'I write code just to write code, but sometimes it serves a purpose.', + link: '', }, { - className: "work", - title: "Work", - text: "I'm an apprentice software developer at Dabapps, and this is what I've done.", - link: "", + className: 'work', + title: 'Work', + text: 'I\'m an apprentice software developer at Dabapps, and this is what I\'ve done.', + link: '', } ]; var projectImagesTypes = React.createClass({ - keys: [1,2,3], + keys: [1, 2, 3], getInitialState: function () { return { hover: 0, }; }, - setHovering: function (key, evt) { + setHovering: function (key) { this.setState({hover: key}); }, render: function () { var images = this.keys.map(function (key) { return ( - ); }.bind(this)); @@ -56,4 +56,4 @@ var projectImagesTypes = React.createClass({ } }); -module.exports = projectImagesTypes; \ No newline at end of file +module.exports = projectImagesTypes;