Upgrading to latest libraries and bug fixes

 React 15.1.0
Fabric 1.6.2
Bug fixes and performance improvements
exposing disable/enable Scroll for tablets and touch devices

Author: Thomas Bolis

CHANGELOG.md

@@ -1,5 +1,11 @@
 ## Changelog
 
+* **0.2.4** Upgrading to latest libraries and bug fixes
+    - Major
+        - React 15.1.0
+        - Fabric 1.6.2
+    - Bug fixes and performance improvements
+    - exposing disable/enable Scroll for tablets and touch devices 
 
 * **0.2.3** Upgrading to latest libraries
     - Major

examples/base.html

@@ -31,6 +31,10 @@
         s.parentNode.insertBefore(wf, s);
     })();
 </script>
+<!--
+Define your local ip
+<script src="http://192.168.3.119:8080/target/target-script-min.js#anonymous"></script>
+-->
 </body>
 
 </html>

examples/main.jsx

@@ -28,9 +28,7 @@ import DownloadIcon from 'material-ui/svg-icons/file/file-download';
 import dataJson from './data.json'
 import dataUrl from './data.url'
 
-//import Tools from '../src/tools';
-//import SketchField from '../src/SketchField';
-import {SketchField, Tools} from '../lib';
+import {SketchField, Tools} from '../src';
 
 const styles = {
     root: {
@@ -87,7 +85,7 @@ class SketchFieldDemo extends React.Component {
 
         this.state = {
             lineColor: 'black',
-            lineWidth: 2,
+            lineWidth: 10,
             fillColor: '#68CCCA',
             shadowWidth: 0,
             shadowOffset: 0,
@@ -256,7 +254,6 @@ class SketchFieldDemo extends React.Component {
                                     lineWidth={this.state.lineWidth}
                                     fillColor={this.state.fillWithColor ? this.state.fillColor : 'transparent'}
                                     scaleOnResize={true}
-                                    height={660}
                                     defaultData={dataJson}
                                     defaultDataType="json"
                                     onChange={(e) => {
@@ -293,15 +290,15 @@ class SketchFieldDemo extends React.Component {
                                     <label htmlFor='lineColor'>Line</label>
                                     <CompactPicker
                                         id='lineColor' color={this.state.lineColor}
-                                        onChange={(color) => this.setState({lineColor:'#'+color.hex})}/>
+                                        onChange={(color) => this.setState({lineColor:color.hex})}/>
                                     <br/>
                                     <br/>
                                     <Toggle label="Fill"
                                             defaultToggled={this.state.fillWithColor}
                                             onToggle={(e) => this.setState({fillWithColor:!this.state.fillWithColor})}/>
                                     <CompactPicker
                                         color={this.state.fillColor}
-                                        onChange={(color) => this.setState({fillColor:'#'+color.hex})}/>
+                                        onChange={(color) => this.setState({fillColor:color.hex})}/>
                                 </CardText>
                             </Card>
                         </div>

karma.config.js

@@ -38,9 +38,7 @@ module.exports = function (config) {
             resolve: {
                 extensions: ['', '.js', '.jsx'],
                 alias: {
-                    Utils: path.join(srcPath, 'utils'),
-                    History: path.join(srcPath, 'history'),
-                    SketchField: path.join(srcPath, 'SketchField')
+                    'react-sketch': srcPath
                 }
             },
             module: {

package.json

@@ -32,40 +32,37 @@
     "lint": "eslint ./src",
     "lint:fix": "eslint --fix ./src",
     "start": "node webpack.server.js",
+    "start:debug": "weinre --boundHost `my-local-ip` ",
     "test": "karma start karma.config.js",
     "posttest": "npm run lint"
   },
   "engines": {
     "node": ">0.4.0 <1.0.0"
   },
-  "peerDependencies": {
-    "react": "^15.0.2",
-    "react-dom": "^15.0.2"
-  },
   "devDependencies": {
-    "babel-cli": "^6.8.0",
-    "babel-core": "^6.8.0",
+    "babel-cli": "^6.9.0",
+    "babel-core": "^6.9.1",
     "babel-eslint": "^6.0.4",
     "babel-loader": "^6.2.4",
     "babel-plugin-transform-object-assign": "^6.8.0",
     "babel-plugin-transform-react-display-name": "^6.8.0",
-    "babel-plugin-transform-runtime": "^6.8.0",
-    "babel-preset-react-hmre": "^1.1.1",
-    "babel-polyfill": "^6.8.0",
-    "babel-preset-es2015": "^6.6.0",
+    "babel-plugin-transform-runtime": "^6.9.0",
+    "babel-polyfill": "^6.9.1",
+    "babel-preset-es2015": "^6.9.0",
     "babel-preset-es2015-loose": "^7.0.0",
     "babel-preset-react": "^6.5.0",
+    "babel-preset-react-hmre": "^1.1.1",
     "babel-preset-stage-0": "^6.5.0",
-    "canvas": "^1.3.15",
+    "canvas": "^1.3.16",
     "chai": "^3.5.0",
     "core-js": "^2.4.0",
     "css-loader": "^0.23.1",
-    "eslint": "^2.9.0",
+    "eslint": "^2.11.1",
     "eslint-loader": "^1.3.0",
     "eslint-plugin-react": "^5.1.1",
-    "fabric": "^1.6.1",
+    "fabric": "^1.6.2",
     "flexboxgrid": "^6.3.0",
-    "html-webpack-plugin": "^2.16.1",
+    "html-webpack-plugin": "^2.19.0",
     "karma": "^0.13.22",
     "karma-babel-preprocessor": "^6.0.1",
     "karma-chai": "^0.1.0",
@@ -77,20 +74,27 @@
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^1.7.0",
     "material-ui": "^0.15.0",
-    "mocha": "^2.4.5",
+    "mocha": "^2.5.3",
+    "my-local-ip": "^1.0.0",
     "open": "0.0.5",
     "open-browser-webpack-plugin": "0.0.2",
     "phantomjs": "^2.1.7",
     "phantomjs-prebuilt": "^2.1.7",
-    "react": "^15.0.2",
-    "react-addons-test-utils": "^15.0.2",
-    "react-color": "^2.1.0",
-    "react-dom": "^15.0.2",
+    "react": "^15.1.0",
+    "react-addons-test-utils": "^15.1.0",
+    "react-color": "^2.2.0",
+    "react-dom": "^15.1.0",
     "react-hot-loader": "^1.3.0",
     "react-tap-event-plugin": "latest",
     "rimraf": "^2.5.2",
     "style-loader": "^0.13.1",
-    "webpack": "^1.13.0",
-    "webpack-dev-server": "^1.14.1"
+    "webpack": "^1.13.1",
+    "webpack-dev-server": "^1.14.1",
+    "weinre": "^2.0.0-pre-I0Z7U9OV"
+  },
+  "dependencies": {
+    "react": "^15.1.0",
+    "react-dom": "^15.1.0",
+    "react-addons-pure-render-mixin": "^15.1.0"
   }
 }