vue-masonry - npm Package Compare versions

Comparing version 0.9.4 to 0.9.5

bower.json

 {
   "name": "vue-masonry",
   "description": "masonry layout for vue.js",
-  "version": "0.9.3",
+  "version": "0.9.5",
   "main": "index.js",
@@ -6,0 +6,0 @@ "authors": [

package.json

 {
   "name": "vue-masonry",
-  "version": "0.9.4",
+  "version": "0.9.5",
   "description": "masonry layout for vue.js",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -5,4 +5,8 @@ # vue-masonry
 
-Vue-masonry plugin [DEMO](https://shershen08.github.io/vue-plugins-demo-static/index.html#/masonry) available 🎉
+Plugin [DEMO](https://shershen08.github.io/vue-plugins-demo-static/index.html#/masonry) available 🎉
 
+
+![DEPENDENCIES status](https://david-dm.org/shershen08/vue-masonry/status.svg)
+
+
 ## Install & Usage
@@ -13,3 +17,3 @@
     or from bower ```bower install vue-masonry```
- - Make sure that the masonry library is included, via ```<script async defer src="https://cdnjs.cloudflare.com/ajax/libs/masonry/4.0.0/masonry.pkgd.min.js"></script>``` or in other way.
+ - Make sure that the masonry library is included; for example using cdn link: ```<script async defer src="https://cdnjs.cloudflare.com/ajax/libs/masonry/4.0.0/masonry.pkgd.min.js"></script>``` or in other convenient way.
  - Use in component code
@@ -21,3 +25,3 @@ ```
         <div v-masonry-tile class="item" v-for="(item, index) in blocks">
-           //some item markup
+           <!-- block item markup -->
         </div>
@@ -40,3 +44,4 @@ </div>
  - <s>implement Vue.nextTick() instead of setTimeout for initial rendering</s>
- - add support for imageLoad plugin for image-based layouts
+ - <s>add support for imageLoad plugin for image-based layouts</s>
+ - implement other useful original plugin options
 
@@ -43,0 +48,0 @@ ### License

src/masonry.plugin.js

  import Vue from 'vue'
  import Masonry from 'masonry-layout';
+ import ImageLoaded from 'imagesloaded';
 
@@ -13,2 +14,3 @@ const attributesMap = {
  const EVENT_REMOVE = 'vuemasonry.itemRemoved'
+ const EVENT_IMAGE_LOADED = 'vuemasonry.imageLoaded'
 
@@ -52,2 +54,5 @@ const stringToBool = (val) => (val + '').toLowerCase() === 'true'
      })
+     Events.$on(EVENT_IMAGE_LOADED, function (eventData) {
+       masonryDraw()
+     })
    }
@@ -60,2 +65,6 @@ })
      Events.$emit(EVENT_ADD, { 'element': el })
+
+     new ImageLoaded(el, function () {
+       Events.$emit(EVENT_IMAGE_LOADED, { 'element': el })
+     })
    },
@@ -62,0 +71,0 @@ beforeDestroy: function (el) {

No alert changes

Improved metrics

Total package byte prevSize

6201

increased by7.99%

Lines of code

118

increased by7.27%

Number of lines in readme file

47

increased by11.9%

No dependency changes