Merge pull request #1044 from DmitryBaranovskiy/webpack

Webpack and v2.2.0

.eslintrc.js

+module.exports = {
+    "extends": "standard",
+    "plugins": [
+        "standard"
+    ]
+};
\ No newline at end of file

CONTRIBUTING.md

 ## Want to contribute?
 
 All changes in code must go to `raphael.core`, `raphael.svg` or `raphael.vml`.
-`raphael.js` and `raphael-min.js` are generated files, generated after running `grunt` in the `dev` directory.
+The rest are generated files, generated after running `npm run build`.
 
-After changing the core/vml/svg files, execute `grunt` in the dev folder to generate the minified version, make a commit and you are ready to make a pull request!
+To run tests you need to open `dev/test/index.html` in your browser, there's no automated way right now.
+
+After changing the core/vml/svg files, execute `npm run build` to generate all versions, make a commit and you are ready to make a pull request!
 Remember that if you want to add a functionality it must be present in the vml and svg versions, **no svg-only features will be accepted.**
 
 ## Found an issue?

README.md

@@ -7,14 +7,24 @@ Visit the library website for more information: ~~[http://raphaeljs.com](http://
 You need to have NPM installed to build the library.
 
 * `git clone https://github.com/DmitryBaranovskiy/raphael.git`
-* `npm install && bower install && ./node_modules/grunt-cli/bin/grunt` or just `npm install && bower install && grunt` if you have grunt already installed
+* `npm run start`
+* `npm run build`
+
+To run tests you need to open `dev/test/index.html` in your browser, there's no automated way right now.
 
 ## Dependencies
 * [eve](https://github.com/adobe-webplatform/eve)
 
-You have the `raphael/raphael-min.js` files that has `eve` bundled inside, and `raphael-nodeps/raphael-nodeps-min.js`
-where `eve` must be loaded by you first (you can try with the one in the `dev/` folder).
-For AMD loading like Browserify, you can use raphael.amd.js.
+
+## Distributable 
+
+All files are UMD compliant.
+
+You can use:
+* `raphael.min.js` (includes `eve` and it's minified)
+* `raphael.js` (includes `eve` and it's not minified)
+* `raphael.no-deps.js` (doesn't include `eve` it's not minified)
+* `raphael.no-deps.min.js`  (doesn't include `eve` it's minified)
 
 ## Where to start
 Check [Raphael-boilerplate](https://github.com/tomasAlabes/raphael-boilerplate) to see examples of loading.
@@ -29,12 +39,12 @@ define([ "path/to/raphael" ], function( Raphael ) {
 
 ## Development
 
-Versions will be released as we gather and test new PRs. Each version should have a correspondent branch.
-As there are not automated tests, we will use the feedback from the users for the fixes.
+Versions will be released as we gather and test new PRs. 
+As there are a lot of browsers being supported it might take a while to accept a PR, we will use the feedback from other users too.
 
 
 You can use the `raphaelTest.html` to try things, you need to start a server in the root dir to start testing things there.
-Something like running `python -m SimpleHTTPServer` in the `raphael` directory and hitting `http://localhost:8000/dev/raphaelTest.html` with the browser. You should run `npm install -g bower && bower install -D ` before this can work.
+Something like running `python -m SimpleHTTPServer` in the `raphael` directory and hitting `http://localhost:8000/dev/raphaelTest.html` with the browser. You should run `npm run start` before this can work.
 
 
 ## Collaborators

bower.json

 {
   "name": "raphael",
-  "main": "raphael.js",
+  "main": "raphael.min.js",
   "description": "JavaScript Vector Library",
   "dependencies": {
     "eve": "https://github.com/adobe-webplatform/eve.git#eef80ed"

cortex.json

-{
-  "name": "raphael",
-  "version": "2.1.4",
-  "description": "JavaScript Vector Library",
-  "main": "raphael",
-  "repository": "git://github.com/DmitryBaranovskiy/raphael.git",
-  "keywords": [
-    "vector",
-    "canvas",
-    "visualization"
-  ],
-  "license": "MIT",
-  "author": {
-    "name": "Dmitry Baranovskiy"
-  },
-  "bugs": {
-    "url": "http://github.com/DmitryBaranovskiy/raphael/issues"
-  },
-  "homepage": "http://raphaeljs.com/",
-  "dependencies" : {
-    "eve":"^0.5.0"
-  }
-}
\ No newline at end of file

dev/.jshintrc

-{
-  "curly": true,
-  "eqnull": true,
-  "eqeqeq": true,
-  "undef": true,
-  "indent": 4,
-  "unused": true,
-  "globals": {
-    "eve": true
-  }
-}
\ No newline at end of file

dev/amdDev.js

-'use strict';
-
-require.config({
-    paths: {
-        raphael: '../raphael'
-        //you will need eve if you use the nodeps version
-        /*eve: '../bower_components/eve/eve'*/
-    }
-});
-
-require(['raphael'], function(Raphael) {
-    var paper = Raphael(0, 0, 640, 720, "container");
-    paper.circle(100, 100, 100).attr({'fill':'270-#FAE56B:0-#E56B6B:100'}); //example
-
-    // Work here
-});

dev/copy.js → dev/banner.txt

-// ┌────────────────────────────────────────────────────────────────────┐ \\
-// │ Raphaël @VERSION - JavaScript Vector Library                          │ \\
-// ├────────────────────────────────────────────────────────────────────┤ \\
-// │ Copyright © 2008-2012 Dmitry Baranovskiy (http://raphaeljs.com)    │ \\
-// │ Copyright © 2008-2012 Sencha Labs (http://sencha.com)              │ \\
-// ├────────────────────────────────────────────────────────────────────┤ \\
-// │ Licensed under the MIT (http://raphaeljs.com/license.html) license.│ \\
-// └────────────────────────────────────────────────────────────────────┘ \\
+// ┌───────────────────────────────────────────────────────────────────────────────────────────────────────┐ \\
+// │ Raphaël 2.2.0 - JavaScript Vector Library                                                             │ \\
+// ├───────────────────────────────────────────────────────────────────────────────────────────────────────┤ \\
+// │ Copyright © 2008-2016 Dmitry Baranovskiy (http://raphaeljs.com)                                       │ \\
+// │ Copyright © 2008-2016 Sencha Labs (http://sencha.com)                                                 │ \\
+// ├───────────────────────────────────────────────────────────────────────────────────────────────────────┤ \\
+// │ Licensed under the MIT (https://github.com/DmitryBaranovskiy/raphael/blob/master/license.txt) license.│ \\
+// └───────────────────────────────────────────────────────────────────────────────────────────────────────┘ \\

dev/raphael.amd.js

@@ -7,21 +7,8 @@
 // │ Licensed under the MIT (http://raphaeljs.com/license.html) license.│ \\
 // └────────────────────────────────────────────────────────────────────┘ \\
 
-(function (glob, factory) {
-    if (typeof define === "function" && define.amd) {
-        define("raphael", ["raphael.core", "raphael.svg", "raphael.vml"], function(Raphael) {
-            return (glob.Raphael = factory(Raphael));
-        });
-    } else if (typeof exports === "object") {
-        var raphael = require("raphael.core");
+define(["./raphael.core", "./raphael.svg", "./raphael.vml"], function(R) {
 
-        require("raphael.svg");
-        require("raphael.vml");
+    return R;
 
-        module.exports = factory(raphael);
-    } else {
+});
\ No newline at end of file
-        glob.Raphael = factory(glob.Raphael);
-    }
-}(this, function (Raphael) {
-    return Raphael.ninja();
-}));
\ No newline at end of file

dev/raphael.core.js

@@ -6,17 +6,8 @@
 // │ Licensed under the MIT (http://raphaeljs.com/license.html) license.│ \\
 // └────────────────────────────────────────────────────────────────────┘ \\
 
-(function (glob, factory) {
-    if (typeof define === "function" && define.amd) {
-        define("raphael.core", ["eve"], function(eve) {
-            return factory(eve);
-        });
-    } else if (typeof exports === "object") {
-        module.exports = factory(require("eve"));
-    } else {
-        glob.Raphael = factory(glob.eve);
-    }
-}(this, function (eve) {
+define(["eve"], function(eve) {
+
     /*\
      * Raphael
      [ method ]
@@ -5419,4 +5410,4 @@
     })(document, "DOMContentLoaded");
 
     return R;
-}));
+});

dev/raphael.svg.js

@@ -8,17 +8,7 @@
 // │ Licensed under the MIT (http://raphaeljs.com/license.html) license. │ \\
 // └─────────────────────────────────────────────────────────────────────┘ \\
 
-(function (glob, factory) {
-    if (typeof define === "function" && define.amd) {
-        define("raphael.svg", ["raphael.core"], function(raphael) {
-            return factory(raphael);
-        });
-    } else if (typeof exports === "object") {
-        factory(require("./raphael.core"));
-    } else {
-        factory(glob.Raphael);
-    }
-}(this, function(R) {
+define(["./raphael.core"], function(R) {
     if (R && !R.svg) {
         return;
     }
@@ -1435,4 +1425,4 @@
             };
         })(method);
     }
-}));
+});

dev/raphael.vml.js

@@ -8,17 +8,7 @@
 // │ Licensed under the MIT (http://raphaeljs.com/license.html) license. │ \\
 // └─────────────────────────────────────────────────────────────────────┘ \\
 
-(function (glob, factory) {
-    if (typeof define === "function" && define.amd) {
-        define("raphael.vml", ["raphael.core"], function(raphael) {
-            return factory(raphael);
-        });
-    } else if (typeof exports === "object") {
-        factory(require("./raphael.core"));
-    } else {
-        factory(glob.Raphael);
-    }
-}(this, function(R) {
+define(["./raphael.core"], function(R) {
     if (R && !R.vml) {
         return;
     }
@@ -1017,4 +1007,4 @@
             };
         })(method);
     }
-}));
+});

dev/raphaelTest.html

@@ -9,24 +9,28 @@
     <!-- Global use -->
 
     <!-- To work with full version -->
-    <!--<script type="text/javascript" src="../raphael.js"></script>-->
+    <script type="text/javascript" src="../bower_components/requirejs/require.js"></script>
+    <script type="text/javascript" src="../bower_components/eve/eve.js"></script>
+    <script type="text/javascript" src="../raphael.js"></script>
 
     <!-- To work with minified version -->
     <!--<script type="text/javascript" src="../raphael-min.js"></script>-->
 
     <!-- Comment this script tag if you are testing with AMD -->
-    <!--<script type="text/javascript">
+    <script type="text/javascript">
         // Initialize container when document is loaded
         window.onload = function () {
-            var paper = Raphael(0, 0, 640, 720, "container");
-            paper.circle(100, 100, 100).attr({'fill':'270-#FAE56B:0-#E56B6B:100'}); //example
+            require(['Raphael'], function(Raphael) {
+                var paper = Raphael(0, 0, 640, 720, "container");
+                paper.circle(100, 100, 100).attr({'fill':'270-#FAE56B:0-#E56B6B:100'}); //example
+            });
         };
         //Work here, in a separate script file or via command line
-    </script>-->
+    </script>
 
     <!-- Use amdDev.js to work with AMD and Raphael -->
     <!-- You need to do a 'bower install -D' first to get requirejs -->
-    <script data-main="amdDev" src="../bower_components/requirejs/require.js"></script>
+    
 
 </head>
 <body>

history.md

-2.2.0 • WIP
+2.2.0
 ------------------
 
+  * Webpack build
   * Added tests! (thanks @TheCloudlessSky)
   * Strict error on method R.ninja
   * Cross-browser gradient fixes

package.json

 {
   "name": "raphael",
-  "version": "2.1.4",
+  "version": "2.2.0",
   "description": "JavaScript Vector Library",
-  "main": "raphael.amd.js",
+  "main": "raphael.min.js",
   "author": {
     "name": "Dmitry Baranovskiy"
   },
@@ -17,15 +17,18 @@
   },
   "devDependencies": {
     "bower": "1.4.1",
-    "grunt": "0.4.5",
-    "grunt-cli": "0.1.13",
-    "grunt-contrib-concat": "0.5.0",
-    "grunt-contrib-uglify": "0.2.0",
-    "grunt-replace": "0.8.0",
-    "qunitjs": "1.21.0"
+    "eslint": "^2.7.0",
+    "eslint-config-standard": "^5.1.0",
+    "eslint-loader": "^1.3.0",
+    "eslint-plugin-promise": "^1.1.0",
+    "eslint-plugin-standard": "^1.3.2",
+    "qunitjs": "1.21.0",
+    "webpack": "^1.12.15"
   },
   "scripts": {
-    "test": "npm install && bower install && echo \"Open dev/test/index.html with your browser\" && exit 1"
+    "start": "npm install && bower install",
+    "build": "webpack && webpack --min && webpack --no-deps && webpack --no-deps --min",
+    "test": "echo \"Open dev/test/index.html with your browser\" && exit 1"
   },
   "repository": {
     "type": "git",
@@ -34,7 +37,11 @@
   "bugs": {
     "url": "https://github.com/DmitryBaranovskiy/raphael/issues"
   },
-  "keywords": ["svg", "vml", "javascript"],
+  "keywords": [
+    "svg",
+    "vml",
+    "javascript"
+  ],
   "homepage": "http://dmitrybaranovskiy.github.io/raphael/",
   "license": "MIT"
 }

raphael.amd.js

-// ┌────────────────────────────────────────────────────────────────────┐ \\
-// │ Raphaël @@VERSION - JavaScript Vector Library                      │ \\
-// ├────────────────────────────────────────────────────────────────────┤ \\
-// │ Copyright © 2008-2012 Dmitry Baranovskiy (http://raphaeljs.com)    │ \\
-// │ Copyright © 2008-2012 Sencha Labs (http://sencha.com)              │ \\
-// ├────────────────────────────────────────────────────────────────────┤ \\
-// │ Licensed under the MIT (http://raphaeljs.com/license.html) license.│ \\
-// └────────────────────────────────────────────────────────────────────┘ \\
-
-(function (glob, factory) {
-    if (typeof define === "function" && define.amd) {
-        define("raphael", ["dev/raphael.core.js", "raphael.svg", "raphael.vml"], function(Raphael) {
-            return factory(Raphael);
-        });
-    } else if (typeof exports === "object") {
-        var raphael = require("./dev/raphael.core");
-
-        require("./dev/raphael.svg");
-        require("./dev/raphael.vml");
-
-        module.exports = factory(raphael);
-    } else {
-        glob.Raphael = factory(glob.Raphael);
-    }
-}(this, function (Raphael) {
-    return Raphael.ninja();
-}));
\ No newline at end of file

webpack.config.js

+"use strict";
+
+const webpack = require("webpack");
+const fs = require("fs");
+
+const args = process.argv;
+
+let plugins = [
+	new webpack.BannerPlugin(fs.readFileSync('./dev/banner.txt', 'utf8'),{ raw: true, entryOnly: true })
+];
+let externals = [];
+let filename = "raphael";
+
+
+if(args.indexOf('--no-deps') !== -1){
+	console.log('Building version without deps');
+	externals.push("eve");
+	filename += ".no-deps"
+}
+
+if(args.indexOf('--min') !== -1){
+	console.log('Building minified version');
+	plugins.push(
+		new webpack.optimize.UglifyJsPlugin({
+			compress:{
+				dead_code: false,
+				unused: false
+			}
+		})
+	);
+	filename += ".min"
+}
+
+module.exports = {
+	entry: './dev/raphael.amd.js',
+	output: {
+		filename: filename + ".js",
+		libraryTarget: "umd",
+		library: "Raphael",
+		umdNamedDefine: true
+	},
+
+	externals: externals,
+
+	plugins: plugins,
+
+	loaders: [
+  		{
+  			test: /\.js$/, 
+  			loader: "eslint-loader", 
+  			include: "./dev/"
+  		}
+	],
+  	
+	eslint: {
+    	configFile: './.eslintrc'
+  	},
+
+	resolve: {
+		modulesDirectories: ["bower_components"]
+	}
+};
\ No newline at end of file