Merge branch 'initial' of https://github.com/Yuvaleros/material-ui-dr…

…opzone into init

.babelrc

@@ -0,0 +1,3 @@
+{
+  "presets": ["react", "es2015", "stage-1"]
+}

.eslintrc.json

@@ -0,0 +1,142 @@
+{
+  "env": {
+    "es6": true,
+    "browser": true,
+    "mocha": true,
+    "node": true
+  },
+  "parser": "babel-eslint",
+  "parserOptions": {
+    "ecmaVersion": 7,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true,
+      "experimentalObjectRestSpread": true
+    }
+  },
+  "globals": {
+    "React": true
+  },
+  "plugins": [
+    "babel",
+    "react"
+  ],
+  "extends": [
+    "eslint:recommended"
+  ],
+  "rules": {
+    "array-bracket-spacing": ["error", "never"],
+    "arrow-spacing": "error",
+    "arrow-parens": "error",
+    "brace-style": "error",
+    "comma-dangle": ["error", "always-multiline"],
+    "comma-spacing": ["error", {"before": false, "after": true}],
+    "comma-style": ["error", "last"],
+    "computed-property-spacing": ["error", "never"],
+    "consistent-this": ["error", "self"],
+    "consistent-return": "off",
+    "dot-notation": "error",
+    "dot-location": ["error", "property"],
+    "eqeqeq": ["error", "smart"],
+    "eol-last": "error",
+    "indent": ["error", 4, {"SwitchCase": 1}],
+    "id-blacklist": ["error", "e"],
+    "jsx-quotes": ["error", "prefer-double"],
+    "keyword-spacing": "error",
+    "key-spacing": "error",
+    "max-len": ["error", 120, 4],
+    "new-cap": ["off", {"capIsNew": true, "newIsCap": true}],
+    "no-unused-expressions": "error",
+    "no-unused-vars": "error",
+    "no-shadow": "off",
+    "no-spaced-func": "error",
+    "no-multiple-empty-lines": "error",
+    "no-multi-spaces": "error",
+    "no-undef": "error",
+    "no-empty-pattern": "error",
+    "no-dupe-keys": "error",
+    "no-dupe-args": "error",
+    "no-duplicate-case": "error",
+    "no-cond-assign": "error",
+    "no-extra-semi": "error",
+    "no-extra-boolean-cast": "error",
+    "no-trailing-spaces": "error",
+    "no-underscore-dangle": "error",
+    "no-unneeded-ternary": "error",
+    "no-unreachable": "error",
+    "no-var": "error",
+    "one-var": ["error", "never"],
+    "operator-linebreak": ["error", "after"],
+    "padded-blocks": ["error", "never"],
+    "prefer-arrow-callback": "off",
+    "prefer-const": "error",
+    "quotes": ["error", "single", "avoid-escape"],
+    "semi": ["error", "always"],
+    "space-before-blocks": ["error", "always"],
+    "space-before-function-paren": ["error", "never"],
+    "space-infix-ops": "error",
+    "space-unary-ops": ["error", {"words": true, "nonwords": false}],
+    "spaced-comment": "error",
+    "yoda": "error",
+    "babel/object-curly-spacing": ["error", "never"],
+    "babel/generator-star-spacing": "error",
+    "babel/array-bracket-spacing": "error",
+    "babel/arrow-parens": "error",
+    "babel/no-await-in-loop": "error",
+    "babel/func-params-comma-dangle": "error",
+    "babel/flow-object-type": "error",
+    "react/display-name": "error",
+    "react/jsx-boolean-value": ["error", "always"],
+    "react/jsx-closing-bracket-location": "error",
+    "react/jsx-curly-spacing": "error",
+    "react/jsx-equals-spacing": "error",
+    "react/jsx-filename-extension": ["error", {"extensions": [".js"]}],
+    "react/jsx-first-prop-new-line": ["error", "multiline"],
+    "react/jsx-handler-names": "error",
+    "react/jsx-indent": ["error", 4],
+    "react/jsx-indent-props": ["error", 4],
+    "react/jsx-max-props-per-line": ["error", {"maximum": 3}],
+    "react/jsx-no-comment-textnodes": "error",
+    "react/jsx-no-duplicate-props": "error",
+    "react/jsx-no-undef": "error",
+    "react/jsx-pascal-case": "error",
+    "react/jsx-uses-react": "error",
+    "react/jsx-uses-vars": "error",
+    "react/jsx-wrap-multilines": "error",
+    "react/no-danger": "error",
+    "react/no-deprecated": "error",
+    "react/no-did-mount-set-state": "error",
+    "react/no-did-update-set-state": "error",
+    "react/no-direct-mutation-state": "error",
+    "react/no-multi-comp": "off",
+    "react/no-render-return-value": "error",
+    "react/no-is-mounted": "error",
+    "react/no-unknown-property": "error",
+    "react/prefer-arrow-callback": "off",
+    "react/prefer-es6-class": "error",
+    "react/react-in-jsx-scope": "error",
+    "react/require-render-return": "error",
+    "react/self-closing-comp": "error",
+    "react/sort-comp": "error",
+    "react/no-string-refs": "warn",
+
+    "react/prop-types": "off",
+    "prefer-template": "off",
+    "react/sort-prop-types": "off",
+    "react/jsx-space-before-closing": "off",
+    "strict": "off",
+    "react/require-extension": "off",
+    "no-case-declarations": "off",
+    "react/jsx-key": "off",
+    "react/jsx-no-bind": "off",
+    "react/jsx-no-literals": "off",
+    "react/jsx-no-target-blank": "off",
+    "react/jsx-sort-props": "off",
+    "react/no-set-state": "off",
+    "react/forbid-prop-types": "off",
+    "react/prefer-stateless-function": "off",
+    "react/require-optimization": "off",
+    "babel/object-shorthand": "off",
+    "babel/new-cap": "off"
+  }
+}

.gitignore

@@ -0,0 +1,4 @@
+
+.idea/
+build/
+node_modules/

.mochasetup.js

@@ -0,0 +1,2 @@
+require('babel-register')();
+require ('ignore-styles');

examples/app/index.html

@@ -0,0 +1,22 @@
+<!doctype html>
+<html class="no-js" lang="">
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <title>Material-UI Dropzone Example</title>
+    <meta name="description" content="">
+
+    <meta
+            name="viewport"
+            content="width=device-width, initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=1"
+    >
+
+</head>
+
+<body>
+<div id="root"></div>
+</body>
+
+<script src="bundle.js"></script>
+
+</html>

examples/src/app.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import {render} from 'react-dom';
+import injectTapEventPlugin from 'react-tap-event-plugin';
+import Main from './main';
+
+injectTapEventPlugin();
+
+render(<Main />, document.getElementById('root'));

examples/src/main.js

@@ -0,0 +1,62 @@
+import DropZoneDialog from '../../src';
+import React, {Component} from 'react';
+import RaisedButton from 'material-ui/RaisedButton';
+import {MuiThemeProvider} from 'material-ui';
+
+export default class Main extends Component {
+    constructor(props) {
+        super(props);
+
+        this.state = {
+            openUploadModal: false,
+            files: [],
+        };
+    }
+
+    closeDialog() {
+        this.setState({openUploadModal: false});
+    }
+
+    saveFiles(files) {
+        //Saving files to state for further use and closing Modal.
+        this.setState({files: files, openUploadModal: false});
+    }
+
+    handleOpenUpload() {
+        this.setState({
+            openUploadModal: true,
+        });
+    }
+
+    deleteFile(fileName) {
+        this.props.deleteFile(fileName);
+    }
+
+    render() {
+        //If we already saved files they will be shown again in modal preview.
+        let files = this.state.files;
+        let style = {
+            addFileBtn: {
+                'marginTop': '15px',
+            },
+        };
+
+        return (<MuiThemeProvider>
+                <div>
+                    <RaisedButton style={style.addFileBtn} label={'Add Image'}
+                                  onTouchTap={this.handleOpenUpload.bind(this)}/>
+                    <DropZoneDialog
+                        open={this.state.openUploadModal}
+                        saveFiles={this.saveFiles.bind(this)}
+                        deleteFile={this.deleteFile.bind(this)}
+                        acceptedFiles={['image/jpeg', 'image/png', 'image/bmp']}
+                        files={files}
+                        showPreviews={false}
+                        maxSize={5000000}
+                        closeDialog={this.closeDialog.bind(this)}
+                    />
+                </div>
+            </MuiThemeProvider>
+        );
+    }
+}

gulpfile.js

@@ -0,0 +1,92 @@
+const gulp = require('gulp');
+const browserify = require('browserify');
+const watchify = require('watchify');
+const babelify = require('babelify');
+const source = require('vinyl-source-stream');
+const eslint = require('gulp-eslint');
+const browserSync = require('browser-sync').create();
+const babel = require('gulp-babel');
+const del = require('del');
+const copy = require('gulp-copy');
+const mocha = require('gulp-mocha');
+const browserifyCss = require('browserify-css');
+
+function map_error(err) {
+    console.log(err);
+    console.log('Error : ' + err.message);
+    this.emit('end');
+}
+
+function bundle_js(bundler) {
+    return bundler.bundle()
+        .on('error', map_error)
+        .pipe(source('bundle.js'))
+        .pipe(gulp.dest('./examples/app'));
+}
+
+gulp.task('watchify', () => {
+    const bundler = watchify(browserify('./examples/src/app.js', Object.assign(watchify.args, {debug: true}))
+        .transform('babelify', {presets: ['es2015', 'react', 'stage-1']})
+        .transform(browserifyCss), {
+        poll: true,
+    }, {verbose: true});
+    bundle_js(bundler);
+    bundler.on('update', () => {
+        bundle_js(bundler);
+    });
+    bundler.on('log', (msg) => {
+        console.log(msg);
+    });
+});
+
+gulp.task('browserSync', function () {
+    browserSync.init({
+        notify: false,
+        port: 3000,
+        open: true,
+        server: {
+            baseDir: ['examples/app'],
+        },
+    });
+    gulp.watch('examples/app/bundle.js').on('change', browserSync.reload);
+});
+
+gulp.task('eslint', function () {
+    return gulp.src(['src/**/*.js'])
+        .pipe(eslint())
+        .pipe(eslint.format())
+        .pipe(eslint.failAfterError());
+});
+
+gulp.task('build:clean', function () {
+    del.sync(['build']);
+});
+
+gulp.task('build', () => {
+    return gulp.src('src/**/*.js')
+        .pipe(babel({
+            presets: ['es2015', 'stage-1', 'react'],
+            plugins: ['transform-runtime'],
+        }))
+        .pipe(gulp.dest('build/'));
+});
+
+gulp.task('build:copy', function () {
+    return gulp.src(['package.json', 'README.md', 'LICENSE'])
+        .pipe(copy('build/', {prefix: 1}));
+});
+
+gulp.task('test', function () {
+    return gulp.src(['.mochasetup.js', 'test/*.spec.js'])
+        .pipe(babel({
+            presets: ['es2015', 'stage-1', 'react'],
+            plugins: ['transform-runtime'],
+        }))
+        .pipe(mocha({
+            reporter: 'spec',
+        }));
+});
+
+gulp.task('clean:build', ['build:clean', 'build', 'build:copy']);
+
+gulp.task('default', ['watchify', 'browserSync']);