diff --git a/.jshintrc b/.jshintrc new file mode 100644 index 00000000000000..7f5bc2da857952 --- /dev/null +++ b/.jshintrc @@ -0,0 +1,11 @@ +{ + "asi": true, + "browser": true, + "eqnull": true, + "esnext": true, + "expr": true, + "loopfunc": true, + "node": true, + "sub": true, + "undef": true +} diff --git a/docs/gulp/tasks/browserify.js b/docs/gulp/tasks/browserify.js index 06922736dd03ba..35f4c2e4045a16 100644 --- a/docs/gulp/tasks/browserify.js +++ b/docs/gulp/tasks/browserify.js @@ -14,7 +14,7 @@ var handleErrors = require('../util/handleErrors'); var source = require('vinyl-source-stream'); var config = require('../config').browserify; -gulp.task('browserify', function(callback) { +gulp.task('browserify', ['jshint'], function(callback) { var bundleQueue = config.bundleConfigs.length; @@ -29,7 +29,7 @@ gulp.task('browserify', function(callback) { extensions: config.extensions, // Enable source maps! debug: config.debug - }); + }).transform('babelify', {stage: 1}); var bundle = function() { // Log when bundling starts diff --git a/docs/gulp/tasks/jshint.js b/docs/gulp/tasks/jshint.js new file mode 100644 index 00000000000000..fcb19ac25350a1 --- /dev/null +++ b/docs/gulp/tasks/jshint.js @@ -0,0 +1,7 @@ +var gulp = require('gulp'); +var shell = require('gulp-shell'); +var handleErrors = require('../util/handleErrors'); + +gulp.task('jshint', shell.task([ + '../node_modules/.bin/jsxhint --harmony ../src/* ../src/**/* ../src/**/**/* ./src/app/* ./src/app/**/* ./src/app/**/**/* ./src/app/**/**/**/* --exclude ../src/utils/modernizr.custom.js' +])).on('error', handleErrors); diff --git a/docs/package.json b/docs/package.json index a1820a7d1cbda8..474e1e848d30a6 100644 --- a/docs/package.json +++ b/docs/package.json @@ -12,22 +12,15 @@ "browser": { "mui": "../src/index.js" }, - "browserify": { - "transform": [ - [ - "reactify", - { - "es6": true - } - ] - ] - }, "devDependencies": { + "babelify": "^6.1.1", "browser-sync": "^1.8.1", + "browserify": "^10.2.0", "gulp": "^3.8.10", "gulp-autoprefixer": "^2.0.0", "gulp-less": "^3.0.0", "gulp-notify": "^2.1.0", + "gulp-shell": "^0.4.1", "gulp-sourcemaps": "^1.2.8", "gulp-util": "^3.0.1", "pretty-hrtime": "^0.2.2", @@ -37,6 +30,7 @@ "watchify": "^2.2.1" }, "dependencies": { - "highlight.js": "^8.4.0" + "highlight.js": "^8.4.0", + "react-router": "^0.13.3" } } diff --git a/docs/src/app/app.jsx b/docs/src/app/app.jsx index 672eaeef73b8ac..84b7863fe695e3 100644 --- a/docs/src/app/app.jsx +++ b/docs/src/app/app.jsx @@ -30,4 +30,4 @@ React.render(, document.body); }); -})(); \ No newline at end of file +})(); diff --git a/docs/src/app/components/app-left-nav.jsx b/docs/src/app/components/app-left-nav.jsx index b827b8cf938822..48242dfe03d72d 100644 --- a/docs/src/app/components/app-left-nav.jsx +++ b/docs/src/app/components/app-left-nav.jsx @@ -4,7 +4,7 @@ var mui = require('mui'); var {MenuItem, LeftNav} = mui; var {Colors, Spacing, Typography} = mui.Styles; - menuItems = [ +var menuItems = [ { route: 'get-started', text: 'Get Started' }, { route: 'customization', text: 'Customization' }, { route: 'components', text: 'Components' }, diff --git a/docs/src/app/components/component-doc.jsx b/docs/src/app/components/component-doc.jsx index a38e662bd3857e..87950528490b81 100644 --- a/docs/src/app/components/component-doc.jsx +++ b/docs/src/app/components/component-doc.jsx @@ -71,7 +71,7 @@ var ComponentDoc = React.createClass({ var componentInfo = this.props.componentInfo.map(function(info, i) { var infoStyle = styles.componentInfo; - if (i == 0) infoStyle = this.mergeStyles(infoStyle, styles.componentInfoWhenFirstChild); + if (i === 0) infoStyle = this.mergeStyles(infoStyle, styles.componentInfoWhenFirstChild); return ( 100) { window.clearInterval(id); - }; + } }, 1000); }, diff --git a/docs/src/app/components/pages/components/snackbar.jsx b/docs/src/app/components/pages/components/snackbar.jsx index 1a03c15eb45f49..3fbd1cc56b66a4 100644 --- a/docs/src/app/components/pages/components/snackbar.jsx +++ b/docs/src/app/components/pages/components/snackbar.jsx @@ -106,7 +106,7 @@ class SnackbarPage extends React.Component { _handleAction() { //We can add more code here! In this example, we'll just include an alert. - alert("We removed the event from your calendar."); + window.alert("We removed the event from your calendar."); } } diff --git a/docs/src/app/components/pages/customization/inline-styles.jsx b/docs/src/app/components/pages/customization/inline-styles.jsx index fa89fd25e16f53..fced0a9b805355 100644 --- a/docs/src/app/components/pages/customization/inline-styles.jsx +++ b/docs/src/app/components/pages/customization/inline-styles.jsx @@ -125,6 +125,6 @@ class InlineStyles extends React.Component { ); } -}; +} -module.exports = InlineStyles; \ No newline at end of file +module.exports = InlineStyles; diff --git a/docs/src/app/components/pages/get-started.jsx b/docs/src/app/components/pages/get-started.jsx index 73e09c3579ffd0..6f7ba96304984a 100644 --- a/docs/src/app/components/pages/get-started.jsx +++ b/docs/src/app/components/pages/get-started.jsx @@ -2,7 +2,7 @@ var React = require('react'); var mui = require('mui'); var CodeBlock = require('../code-example/code-block.jsx'); var FullWidthSection = require('../full-width-section.jsx'); -var Spacing = mui.Styles.Spacing; +var {Spacing, Typography} = mui.Styles; class GetStarted extends React.Component { @@ -34,7 +34,7 @@ class GetStarted extends React.Component { color: '#f00'//Typography.textDarkBlack }, codeExample: { - backgroundColor: canvasColor, + backgroundColor: this.context.muiTheme.palette.canvasColor, marginBottom: '32px' } }; @@ -141,4 +141,8 @@ class GetStarted extends React.Component { } +GetStarted.contextTypes = { + muiTheme: React.PropTypes.object +}; + module.exports = GetStarted; diff --git a/docs/src/app/components/svg-icons/action-grade.jsx b/docs/src/app/components/svg-icons/action-grade.jsx index 68856d406d04ac..2afb1f601c8e06 100644 --- a/docs/src/app/components/svg-icons/action-grade.jsx +++ b/docs/src/app/components/svg-icons/action-grade.jsx @@ -14,4 +14,4 @@ var ActionGrade = React.createClass({ }); -module.exports = ActionGrade; \ No newline at end of file +module.exports = ActionGrade; diff --git a/package.json b/package.json index 1a40015d700022..9b8c4995a416a3 100644 --- a/package.json +++ b/package.json @@ -7,9 +7,8 @@ "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "prebuild": "rm -rf lib", - "build:js": "./node_modules/.bin/jsx --harmony ./src ./lib", - "build:jsx": "./node_modules/.bin/jsx --harmony -x jsx ./src ./lib", - "build": "npm run build:js && npm run build:jsx", + "jshint": "./node_modules/.bin/jsxhint --harmony src/* src/**/* src/**/**/* --exclude src/utils/modernizr.custom.js", + "build": "npm run jshint && ./node_modules/.bin/babel --stage 1 ./src --out-dir ./lib", "prepublish": "npm run build" }, "keywords": [ @@ -37,9 +36,9 @@ "react-tap-event-plugin": ">=0.1.3" }, "devDependencies": { - "react-tools": "^0.13", - "browserify": "^7.0.3", - "reactify": "^1.1.0", - "react-router": "^0.13" + "babel": "^5.4.3", + "jsxhint": "^0.15.0", + "react": "^0.13.3", + "react-tap-event-plugin": "^0.1.6" } } diff --git a/src/circular-progress.jsx b/src/circular-progress.jsx index 628caed57f9586..470628c1c46888 100644 --- a/src/circular-progress.jsx +++ b/src/circular-progress.jsx @@ -51,7 +51,7 @@ var CircularProgress = React.createClass({ if (this.props.mode != "indeterminate") return; - if (step == 0) { + if (step === 0) { path.style.strokeDasharray = "1, 200"; path.style.strokeDashoffset = 0; diff --git a/src/dialog-window.jsx b/src/dialog-window.jsx index e018cb2a7bb09f..398a3da9678f06 100644 --- a/src/dialog-window.jsx +++ b/src/dialog-window.jsx @@ -190,7 +190,7 @@ var DialogWindow = React.createClass({ currentAction = this._getAction(currentAction, i); } actionObjects.push(currentAction); - }; + } actionContainer = (
diff --git a/src/enhanced-switch.jsx b/src/enhanced-switch.jsx index 0814911329962e..47d9be70789b57 100644 --- a/src/enhanced-switch.jsx +++ b/src/enhanced-switch.jsx @@ -63,7 +63,6 @@ var EnhancedSwitch = React.createClass({ componentDidMount: function() { var inputNode = React.findDOMNode(this.refs.checkbox); if (!this.props.switched || - this.props.switched == undefined || inputNode.checked != this.props.switched) this.props.onParentShouldUpdate(inputNode.checked); window.addEventListener("resize", this._handleResize); @@ -94,7 +93,7 @@ var EnhancedSwitch = React.createClass({ newState.switched = nextProps.defaultSwitched; } - if (newState.switched != undefined && (newState.switched != this.props.switched)) this.props.onParentShouldUpdate(newState.switched); + if (newState.switched !== undefined && (newState.switched != this.props.switched)) this.props.onParentShouldUpdate(newState.switched); }, getTheme: function() { @@ -297,7 +296,7 @@ var EnhancedSwitch = React.createClass({ // no callback here because there is no event setSwitched: function(newSwitchedValue) { - if (!this.props.hasOwnProperty('checked') || this.props.checked == false) { + if (!this.props.hasOwnProperty('checked') || this.props.checked === false) { this.props.onParentShouldUpdate(newSwitchedValue); React.findDOMNode(this.refs.checkbox).checked = newSwitchedValue; } else if (process.env.NODE_ENV !== 'production') { diff --git a/src/enhanced-textarea.jsx b/src/enhanced-textarea.jsx index 0e97298e2bb041..e02e4f4f7f5528 100644 --- a/src/enhanced-textarea.jsx +++ b/src/enhanced-textarea.jsx @@ -95,7 +95,6 @@ var EnhancedTextarea = React.createClass({