vue-packery-plugin
Version:
a vue.js packery plugin
2 lines (1 loc) • 2.83 kB
JavaScript
;Object.defineProperty(exports,'__esModule',{value:!0}),exports.packeryEvents=void 0;var _typeof='function'==typeof Symbol&&'symbol'==typeof Symbol.iterator?function(a){return typeof a}:function(a){return a&&'function'==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?'symbol':typeof a},_vue=require('vue'),_vue2=_interopRequireDefault(_vue),_packery=require('packery'),_packery2=_interopRequireDefault(_packery);function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}var ADD='itemAdded',CHANGE='itemChange',REMOVE='itemRemoved',LAYOUT='layout',DRAGGIE='draggie',packeryPlugin=function(){};exports.default=packeryPlugin;var packeryEvents=exports.packeryEvents=new _vue2.default({});function CustomEvent(a,b){b=b||{bubbles:!1,cancelable:!1,detail:void 0};var c=document.createEvent('CustomEvent');return c.initCustomEvent(a,b.bubbles,b.cancelable,b.detail),c}CustomEvent.prototype=window.Event.prototype,window.CustomEvent=CustomEvent,packeryPlugin.install=function(a){a.directive('packery',{bind:function m(b,c,d){b.packery=new _packery2.default(b,c.value);var e=!_typeof(b.packery.options.initLayout)||b.packery.options.initLayout,f=!1,g=[],h=[],i=null,j=function(){e&&a.nextTick(function(){f?!f||g.length||h.length?f&&h.length?(b.packery.remove(h),b.packery.shiftLayout()):f&&g.length&&(b.packery.appended(g),b.packery.shiftLayout()):b.packery.layout():(b.packery.reloadItems(),b.packery.layout()),g=[],h=[]})},k=function(a,b){return d.componentInstance?void d.componentInstance.$emit(a,b):void d.elm.dispatchEvent(new CustomEvent(a,b))};b.packery.on('layoutComplete',function(a,b){f=!0,k('layoutComplete',{event:a,laidOutItems:b})}),b.packery.on('dragItemPositioned',function(a,b){k('dragItemPositioned',{event:a,draggedItem:b})}),b.packery.on('fitComplete',function(a,b){k('fitComplete',{event:a,item:b})});var l=function(a){b.packery&&b.isSameNode(a.node)&&('layout'==a.type&&(e=!0),'add'===a.type&&g.push(a.item),'remove'===a.type&&h.push(a.item),clearTimeout(i),i=setTimeout(function(){j()},1))};packeryEvents.$on(ADD,function(a){l(a)}),packeryEvents.$on(CHANGE,function(a){l(a)}),packeryEvents.$on(REMOVE,function(a){l(a)}),packeryEvents.$on(LAYOUT,function(a){a={node:a,type:'layout'},l(a)}),packeryEvents.$on(DRAGGIE,function(a){b.isSameNode(a.node)&&b.packery.bindDraggabillyEvents(a.draggie)})},unbind:function c(a){var b=setInterval(function(){document.body.contains(a)||(a.packery.destroy(),a.packery=null,clearTimeout(b))},1e3)}}),a.directive('packeryItem',{inserted:function b(a){a.packeryNode=a.parentNode,packeryEvents.$emit(ADD,{node:a.packeryNode,item:a,type:'add'})},componentUpdated:function b(a){packeryEvents.$emit(CHANGE,{node:a.packeryNode,item:a,type:'change'})},unbind:function b(a){packeryEvents.$emit(REMOVE,{node:a.packeryNode,item:a,type:'remove'})}})};