Merge branch 'dev'

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "dragular",
-  "version": "4.1.0",
+  "version": "4.2.0",
   "description": "Angular drag and drop library based on dragula, but full featured. For light-weight angular wrap of dragula look for angular-dragula",
   "main": [
     "dist/dragular.min.js",

changelog.markdown

@@ -1,8 +1,12 @@
 # X.X.X planned - not implemented
-- **[Braking change!]** rename 'shared' property to 'state'
 - **[Braking change!]** rename 'dragulardrag' event to 'dragulardragstart'
 - new event 'dragulardrag' emited each iteration while dragging
 
+# 4.2.0 Bad Moms
+- UMD compatible #79
+- options.onInit, on init callback function, closes #65
+- Fixed examples #83 (Filtered model in nested ng-repeat)
+
 # 4.1.0 Dora
 - IE bug fixes #68
 - compileItemOnDrop fixes #71

dist/dragular.js

@@ -1,4 +1,14 @@
-/******/ (function(modules) { // webpackBootstrap
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory();
+	else if(typeof define === 'function' && define.amd)
+		define([], factory);
+	else {
+		var a = factory();
+		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
+	}
+})(this, function() {
+return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
 
@@ -50,7 +60,7 @@
 	var dragularService = __webpack_require__(2);
 
 	/**
-	 * Dragular 4.1.0 by Luckylooke https://github.com/luckylooke/dragular
+	 * Dragular 4.2.0 by Luckylooke https://github.com/luckylooke/dragular
 	 * Angular version of dragula https://github.com/bevacqua/dragula
 	 */
 	module.exports = 'dragularModule';
@@ -110,6 +120,10 @@
 	        options.nameSpace = iAttrs.dragularNameSpace.split(' ');
 	      }
 
+	      if(iAttrs.dragularOnInit){
+	        options.onInit = $scope.$eval(iAttrs.dragularOnInit);
+	      }
+
 	      drake = dragularService(iElm[0], options);
 	    }
 	  };
@@ -236,7 +250,8 @@
 	        boundingBox: false, // lock movement inside this element boundaries
 	        mirrorContainer: doc.body, // element for appending mirror
 	        ignoreInputTextSelection: true, // text selection in inputs wont be considered as drag
-	        compileItemOnDrop: false
+	        compileItemOnDrop: false,
+	        onInit: false // function callback called after dragular initialisation and providing drake as first argument
 	      },
 	      drake = {
 	        containers: shared.containers,
@@ -255,6 +270,10 @@
 	    extendOptions();
 	    processOptionsObject();
 	    registerEvents();
+
+	    if(o.onInit){
+	       o.onInit(drake); 
+	    }
 
 	    return drake;
 
@@ -1305,4 +1324,6 @@
 	/* WEBPACK VAR INJECTION */}.call(exports, (function() { return this; }())))
 
 /***/ }
-/******/ ]);
+/******/ ])
+});
+;

docs/src/examples/examplesApp.js

@@ -24,7 +24,7 @@ var NameSpacesCtrl = require('./exampleNameSpaces/exampleNameSpaces');
 var NestedNgRepeatCtrl = require('./exampleNestedNgRepeat/exampleNestedNgRepeat');
 var NestedNgRepeatWithModelCtrl = require('./exampleNestedNgRepeatWithModel/exampleNestedNgRepeatWithModel');
 var NgRepeatCtrl = require('./exampleNgRepeat/exampleNgRepeat');
-var NgRepeatFilteredWithModelCtrl = require('./exampleNgRepeat/exampleNgRepeat');
+var NgRepeatFilteredWithModelCtrl = require('./exampleNgRepeatFilteredWithModel/exampleNgRepeatFilteredWithModel');
 var NgRepeatWithModelCtrl = require('./exampleNgRepeatWithModel/exampleNgRepeatWithModel');
 var RemoveOnSpillCtrl = require('./exampleRemoveOnSpill/exampleRemoveOnSpill');
 var RemoveOnSpillWithModelCtrl = require('./exampleRemoveOnSpillWithModel/exampleRemoveOnSpillWithModel');

docs/src/examples/partials/partial-home.html

@@ -12,7 +12,7 @@ <h1>DRAGULAR</h1>
           <p>Browser support includes every sane browser and **IE7+**. <sub>_(Granted you polyfill the functional `Array` methods in ES5)_</sub></p>
           <h2>Inspiration</h2>
           <p>I am working on huge angular project and I am using several drag&drop libraries in it, one for UI, one for lists, etc.. I want to use one full-featured drag&drop library for whole project. As I could not find any suitable, I decided to create one. I have choosen great library <a href="http://github.com/bevacqua/dragula">dragula</a> by <a href="https://github.com/bevacqua">Nicolas Bevacqua</a> as my starting point, make it more angular and started to put features in it! If you wish light-weight angular version of dragula, there is <a href="http://github.com/bevacqua/angular-dragula">official angular version of dragula</a>.</p>
-          <p><b>Actual version 4.1.0 is based on dragula 3.6.3 and tested with angular 1.4.9.</b></p>
+          <p><b>Actual version 4.2.0 is based on dragula 3.6.3 and tested with angular 1.5.5.</b></p>
           <h2>Differences of dragular (against dragula)</h2>
           <ul>
             <li>replaced dragula crossvent with angulars event binding</li>

gulpfile.js

@@ -36,8 +36,9 @@ var config = {
     port: '3000',
     server: './docs'
   },
-  // Predefined scripts configs to keep tasks DRY
+  // Predefined scripts & styles configs to keep tasks DRY
   scripts: {
+    libraryTarget: 'umd',
     dragular: {
       type: 'dragular',
       entryPoint: './src/dragularModule.js',
@@ -51,16 +52,34 @@ var config = {
       dest: './docs/dist'
     }
   },
+  styles: {
+    dragular: {
+      entryPoint: './src/*.css',
+      bundleName: 'dragular.css',
+      dest: './dist'
+    },
+    docs: {
+      entryPoint: [
+        './src/*.css',
+        './docs/src/**/*.css'
+      ],
+      bundleName: 'examples.css',
+      dest: './docs/dist'
+    }
+  },
   // A flag attribute to switch modes
   isProd: false
 };
 
 /*
-* scriptDefaults stores current scripts settings (like entry point or
+* Defaults stores temporary scripts & styles settings (like entry point or
 * output directory). This metadata is used to configure the webpack compilation
 * process.
 */
-var scriptDefaults = config.scripts.dragular;
+var defaults = {
+  scripts: config.scripts.dragular,
+  styles: config.styles.dragular
+}
 
 function handleErrors(err) {
   gutil.log(err.toString());
@@ -73,15 +92,19 @@ function handleErrors(err) {
 function buildScript() {
 
   function rebundle() {
-    return gulp.src(scriptDefaults.entryPoint)
+    return gulp.src(defaults.scripts.entryPoint)
       .on('error', handleErrors)
       .pipe(webpack({
         watch: config.isProd ? false : true,
         output: {
-          filename: scriptDefaults.bundleName
+          libraryTarget: config.scripts.libraryTarget,
+          filename: defaults.scripts.bundleName
         }
       }))
-      .pipe(gulpif(config.isProd, gulp.dest(scriptDefaults.dest)))
+      .pipe(gulpif(config.isProd, gulp.dest(defaults.scripts.dest)))
+      .pipe(gulpif(config.isProd, size({
+        title: 'Non-minified scripts: '
+      })))
       .pipe(gulpif(config.isProd, sourcemaps.init({loadMaps: true})))
       .pipe(gulpif(config.isProd, uglify({
         compress: { drop_console: true }
@@ -93,12 +116,12 @@ function buildScript() {
         title: 'Scripts: '
       }))
       .pipe(gulpif(config.isProd, sourcemaps.write('./')))
-      .pipe(gulp.dest(scriptDefaults.dest))
+      .pipe(gulp.dest(defaults.scripts.dest))
       .pipe(gulpif(browserSync.active, browserSync.stream()));
   }
 
   function lintAndRebundle() {
-    if (scriptDefaults.type === 'dragular') {
+    if (defaults.scripts.type === 'dragular') {
       return sequence('lint', rebundle);
     }
 
@@ -114,39 +137,27 @@ gulp.task('scripts', function() {
 
 gulp.task('styles', function() {
 
-  return gulp.src(config.dragular.styles)
+  return gulp.src(defaults.styles.entryPoint)
     .pipe(autoprefixer({
       browsers: [ 'last 15 versions', '> 1%', 'ie 8', 'ie 7' ],
       cascade: false
     }))
-    .pipe(concat('dragular.css'))
-    .pipe(gulpif(config.isProd, gulp.dest(config.dragular.dest)))
+    .pipe(concat(defaults.styles.bundleName))
+    .pipe(gulpif(config.isProd, gulp.dest(defaults.styles.dest)))
+    .pipe(gulpif(config.isProd, size({
+      title: 'Non-minified styles:  '
+    })))
     .pipe(gulpif(config.isProd, minifyCss()))
     .pipe(gulpif(config.isProd, rename({
       suffix: '.min'
     })))
     .pipe(size({
       title: 'Styles: '
     }))
-    .pipe(gulp.dest(config.dragular.dest))
+    .pipe(gulp.dest(defaults.styles.dest))
     .pipe(gulpif(browserSync.active, browserSync.stream()));
 });
 
-gulp.task('styles:docs', function() {
-
-  return gulp.src([
-    config.docs.styles,
-    config.dragular.styles
-  ])
-  .pipe(autoprefixer({
-    browsers: [ 'last 15 versions', '> 1%', 'ie 8', 'ie 7' ],
-    cascade: false
-  }))
-  .pipe(concat('examples.css'))
-  .pipe(gulp.dest(config.docs.dest))
-  .pipe(gulpif(browserSync.active, browserSync.stream()));
-});
-
 gulp.task('lint', function() {
 
   return gulp.src([config.dragular.scripts])
@@ -200,7 +211,7 @@ gulp.task('watch', ['serve'], function() {
 });
 
 gulp.task('watch:docs', ['serve'], function() {
-  gulp.watch(config.docs.styles,  ['styles:docs']);
+  gulp.watch(config.docs.styles,  ['styles']);
   gulp.watch(config.docs.templates,  ['templates:docs']);
   gulp.watch(config.docs.index, browserSync.reload);
   gulp.watch('./CONTRIBUTING.md', ['markdown']);
@@ -211,32 +222,44 @@ gulp.task('watch:docs', ['serve'], function() {
 * on changes, generate non-minified but concatenated output.
 */
 gulp.task('dev', function() {
-  config.isProd = false;
-  scriptDefaults = config.scripts.dragular;
+  config.isProd = true;
+  defaults = {
+    scripts: config.scripts.dragular,
+    styles: config.styles.dragular
+  };
 
   sequence(['scripts', 'styles'], 'watch');
 });
 
 gulp.task('dev:docs', function() {
-  config.isProd = false;
-  scriptDefaults = config.scripts.docs;
+  config.isProd = true;
+  defaults = {
+    scripts: config.scripts.docs,
+    styles: config.styles.docs
+  };
 
-  sequence('markdown', 'templates:docs', ['scripts', 'styles:docs'], 'watch:docs');
+  sequence('markdown', 'templates:docs', ['scripts', 'styles'], 'watch:docs');
 });
 
 /*
 * Generate production ready minified and concantenated output.
 */
 gulp.task('build', function() {
   config.isProd = true;
-  scriptDefaults = config.scripts.dragular;
+  defaults = {
+    scripts: config.scripts.dragular,
+    styles: config.styles.dragular
+  };
 
   sequence(['scripts', 'styles'], 'build:docs');
 });
 
 gulp.task('build:docs', function() {
   config.isProd = true;
-  scriptDefaults = config.scripts.docs;
+  defaults = {
+    scripts: config.scripts.docs,
+    styles: config.styles.docs
+  };
 
   sequence('markdown', 'templates:docs', ['scripts', 'styles']);
 });

readme.markdown

@@ -10,7 +10,7 @@ Browser support includes every sane browser and **IE7+**. <sub>_(Granted you pol
 
 I am working on huge angular project and I am using several drag&drop libraries in it, one for UI, one for lists, etc.. I want to use one full-featured drag&drop library for whole project. As I could not find any suitable, I decided to create one. I have choosen great library [dragula](http://github.com/bevacqua/dragula) by [Nicolas Bevacqua](http://github.com/bevacqua) as my starting point, make it more angular and started to put features in it! If you wish light-weight angular version of dragula, there is [official angular version of dragula](http://github.com/bevacqua/angular-dragula).
 
-<b>Actual version 4.1.0 is based on dragula 3.6.3 and tested with angular 1.4.9.</b>
+<b>Actual version 4.2.0 is based on dragula 3.6.3 and tested with angular 1.5.5.</b>
 
 # Differences of dragular (against dragula)
 
@@ -160,6 +160,9 @@ For better readability of views.
 ```html
 <div dragular-name-space="oranges"></div>
 ```
+### dragular-on-init atribute
+
+Same as options.onInit see bellow.
 
 ## Options
 
@@ -365,6 +368,10 @@ myEventNames = {
 
 In case your draggable items are customized by other directives/attributes, you can use this flag to run compilation of droped item after drop. It is not supposed to be used with containers items rendered by ng-repeat. In such case you are supposed to add directives/attributes to item template and use logic in controller to enable/disable them.
 
+### `options.onInit`
+
+You can provide function callback called after dragular initialisation with drake as first argument.
+
 
 ## `Events`
 

src/dragularDirective.js

@@ -43,6 +43,10 @@ var dragular = function (dragularService) {
         options.nameSpace = iAttrs.dragularNameSpace.split(' ');
       }
 
+      if(iAttrs.dragularOnInit){
+        options.onInit = $scope.$eval(iAttrs.dragularOnInit);
+      }
+
       drake = dragularService(iElm[0], options);
     }
   };